Files
discord-decomp/modules/quests/native/QuestDock/QuestDockUnenrolledHeader.tsx
T
2026-11-01 12:12:55 +02:00

314 lines
17 KiB
TypeScript

// Metro module 14209 (f14210).
import { memo, useContext, useState, useEffect, useCallback } from "react";
import { AccessibilityInfo, View } from "react-native";
import { QuestDockMode } from "../../QuestConstants";
import { QUEST_DOCK_CONTENT_BORDER_RADII, QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED, QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED, QUEST_DOCK_COLLAPSED_HEIGHT } from "./QuestDockConstants";
import { ThemeTypes } from "../../../../_bundle/Module505";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import * as _spring from "../../../../design/animation/reanimated/spring/spring";
import QuestDockContext from "./QuestDockContext";
import { QuestDockGestureContext } from "./QuestDockGestureContext";
import { isIOS, isAndroid } from "../../../../_bundle/Module501";
import { useActionSheetPressHandler } from "./QuestDockHooks";
import QuestDisclosureModalActionCreators from "../QuestDisclosureModal/QuestDisclosureModalActionCreators";
import { QuestContent } from "../../QuestTypes";
import { QuestContentCTA } from "../../lib/analytics/AnalyticsTypes";
import useTheme from "../../../../hooks/useTheme";
import { isThemeDark } from "../../../../design/shared";
import { useToken } from "../../../../design/tokens/native/useToken";
import useQuestDockAnimatedBorderRadius from "./useQuestDockAnimatedBorderRadius";
import { useAnimatedStyle, useAnimatedProps } from "../../../reanimated/ReanimatedRexport";
import { useQuestGameLogotypeAssetUrl } from "../QuestHooks.native";
import ReanimatedNativeView from "../../../core/native/ReanimatedNativeView";
import QuestDockBlurredHeaderPlaceholder from "./QuestDockBlurredHeaderPlaceholder";
import QuestDockBlurredContentBackground from "./QuestDockBlurredContentBackground";
import FastImage from "../../../../components_native/common/FastImage";
import Module14212 from "../../../../_bundle/Module14212";
import Module14213 from "../../../../_bundle/Module14213";
import QuestGameLogotype from "../QuestGameLogotype";
import { Text } from "../../../../design/components/Text/native/Text";
import { intl, t } from "../../../../intl/index.native";
import { PressableOpacity } from "../../../../design/void/Pressables/native/Pressables";
import { CircleQuestionIcon } from "../../../../design/components/Icon/native/redesign/generated/CircleQuestionIcon";
import { MoreHorizontalIcon } from "../../../../design/components/Icon/native/redesign/generated/MoreHorizontalIcon";
let questDockHeaderLayoutAnimation, __initData, __initData2, __initData3, __initData4, __initData5, __initData6, __initData7;
const useStyles = createStyles({
questDockHeader: {
alignItems: "center",
justifyContent: "space-between",
flexDirection: "row",
height: QUEST_DOCK_COLLAPSED_HEIGHT,
overflow: "hidden",
paddingRight: 16,
paddingLeft: 8,
position: "absolute",
zIndex: 2
},
wreathImage: {
height: 35,
marginRight: 4,
width: 35
},
questDockHeaderPrimary: {
alignItems: "center",
flexDirection: "row"
},
logo: {
marginTop: 2
},
questDockHeaderSecondary: {
flexGrow: 0,
flexShrink: 0
},
questDockHeaderContentCollapsed: {
justifyContent: "center",
position: "absolute",
bottom: 0,
top: 0,
right: 0
},
questDockHeaderContentExpanded: {
alignItems: "center",
flexDirection: "row",
gap: 8
},
questDockHeaderActionDisclosures: {
alignItems: "center",
display: "flex",
flexDirection: "row",
gap: 4
},
questDockHeaderActionDisclosuresIcon: {
height: 14,
width: 14
},
questDockHeaderActionSeparator: {
backgroundColor: Module712.colors.TEXT_DEFAULT,
opacity: 0.2,
height: 18,
width: 1.5
},
questDockHeaderTertiaryContent: {
opacity: 0.7
}
});
const questDockHeaderLayoutAnimation2 = function questDockHeaderLayoutAnimation(a0) {
return {
initialValues: {
originX: a0.currentOriginX,
originY: a0.currentOriginY,
width: a0.currentWidth,
height: a0.currentHeight
},
animations: {
originX: _spring.withSpring(a0.targetOriginX, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),
originY: _spring.withSpring(a0.targetOriginY, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),
height: _spring.withSpring(a0.targetHeight, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),
width: _spring.withSpring(a0.targetWidth, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)
}
};
};
questDockHeaderLayoutAnimation2.__closure = {
withSpring: _spring.withSpring,
QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED
};
questDockHeaderLayoutAnimation2.__workletHash = 6787168806966;
questDockHeaderLayoutAnimation2.__initData = {
code: "function questDockHeaderLayoutAnimation_QuestDockUnenrolledHeaderTsx1(values){const{withSpring,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED}=this.__closure;return{initialValues:{originX:values.currentOriginX,originY:values.currentOriginY,width:values.currentWidth,height:values.currentHeight},animations:{originX:withSpring(values.targetOriginX,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),originY:withSpring(values.targetOriginY,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),height:withSpring(values.targetHeight,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),width:withSpring(values.targetWidth,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)}};}"
};
questDockHeaderLayoutAnimation = questDockHeaderLayoutAnimation2;
__initData = {
code: "function QuestDockUnenrolledHeaderTsx2(){const{activeQuestDockMode,QuestDockMode,QUEST_DOCK_CONTENT_BORDER_RADII,questDockBorderRadius,withSpring,questDockAnimatedBorderRadius,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED,questDockWrapperSpecs,QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED}=this.__closure;return{borderTopLeftRadius:activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_CONTENT_BORDER_RADII:questDockBorderRadius,borderTopRightRadius:activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_CONTENT_BORDER_RADII:questDockBorderRadius,borderBottomLeftRadius:activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_CONTENT_BORDER_RADII:withSpring(questDockAnimatedBorderRadius.get(),QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),borderBottomRightRadius:activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_CONTENT_BORDER_RADII:withSpring(questDockAnimatedBorderRadius.get(),QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),width:activeQuestDockMode.get()===QuestDockMode.EXPANDED?questDockWrapperSpecs.get().width-QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED*2:questDockWrapperSpecs.get().width,transform:[{translateX:withSpring(activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED:0,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)},{translateY:withSpring(activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED:0,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)}]};}"
};
__initData2 = {
code: "function QuestDockUnenrolledHeaderTsx3(){const{withSpring,activeQuestDockMode,QuestDockMode,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED}=this.__closure;return{opacity:withSpring(activeQuestDockMode.get()===QuestDockMode.EXPANDED?0:1,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)};}"
};
__initData3 = {
code: "function QuestDockUnenrolledHeaderTsx4(){const{activeQuestDockMode,QuestDockMode,QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED}=this.__closure;return{right:activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED*-1:0};}"
};
__initData4 = {
code: "function QuestDockUnenrolledHeaderTsx5(){const{withSpring,activeQuestDockMode,QuestDockMode,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED}=this.__closure;return{opacity:withSpring(activeQuestDockMode.get()===QuestDockMode.EXPANDED?1:0,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)};}"
};
__initData5 = {
code: "function QuestDockUnenrolledHeaderTsx6(){const{activeQuestDockMode,QuestDockMode,QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED}=this.__closure;return{right:activeQuestDockMode.get()===QuestDockMode.EXPANDED?0:QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED};}"
};
__initData6 = {
code: "function QuestDockUnenrolledHeaderTsx7(){const{activeQuestDockMode,QuestDockMode}=this.__closure;return{pointerEvents:activeQuestDockMode.get()===QuestDockMode.EXPANDED?'auto':'none'};}"
};
__initData7 = {
code: "function QuestDockUnenrolledHeaderTsx8(){const{activeQuestDockMode,QuestDockMode,QUEST_DOCK_CONTENT_BORDER_RADII,questDockBorderRadius,withSpring,questDockAnimatedBorderRadius,QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED,questDockWrapperSpecs}=this.__closure;return{borderRadius:activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_CONTENT_BORDER_RADII:questDockBorderRadius,borderBottomLeftRadius:activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_CONTENT_BORDER_RADII:withSpring(questDockAnimatedBorderRadius.get(),QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),borderBottomRightRadius:activeQuestDockMode.get()===QuestDockMode.EXPANDED?QUEST_DOCK_CONTENT_BORDER_RADII:withSpring(questDockAnimatedBorderRadius.get(),QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),width:questDockWrapperSpecs.get().width};}"
};
const r75 = memo(function QuestDockUnenrolledHeader() {
let token, c21039_5;
const quest = useContext(QuestDockContext).quest;
const context = useContext(QuestDockGestureContext);
const { activeQuestDockMode, questDockWrapperSpecs } = context;
const [state, setState] = useState(false);
useEffect(() => {
if (isIOS()) {
AccessibilityInfo.isReduceTransparencyEnabled().then(setState);
let c27700_0 = AccessibilityInfo.addEventListener("reduceTransparencyChanged", setState);
return () => c27700_0.remove();
}
}, []);
const actionSheetPressHandler = useActionSheetPressHandler(quest);
const callback = useCallback(() => {
QuestDisclosureModalActionCreators.showModal({
quest,
isTargetedDisclosure: true,
trackingCtx: {
content: QuestContent.QUEST_BAR_MOBILE,
ctaContent: QuestContentCTA.CONTEXT_MENU_OPEN_DISCLOSURE,
sourceQuestContent: QuestContent.QUEST_BAR_MOBILE
}
});
}, [quest]);
const r11 = isThemeDark(useTheme()) ? ThemeTypes.DARK : ThemeTypes.LIGHT;
token = useToken(Module712.modules.mobile.QUEST_DOCK_BORDER_RADIUS);
const questDockAnimatedBorderRadius = useQuestDockAnimatedBorderRadius(token);
c21039_5 = questDockAnimatedBorderRadius;
const K = () => {
const borderTopLeftRadius = activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_CONTENT_BORDER_RADII : token;
const borderTopRightRadius = activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_CONTENT_BORDER_RADII : token;
const borderBottomLeftRadius = activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_CONTENT_BORDER_RADII : _spring.withSpring(c21039_5.get(), QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED);
return {
borderTopLeftRadius,
borderTopRightRadius,
borderBottomLeftRadius,
borderBottomRightRadius: activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_CONTENT_BORDER_RADII : _spring.withSpring(c21039_5.get(), QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),
width: activeQuestDockMode.get() === QuestDockMode.EXPANDED ? questDockWrapperSpecs.get().width - 2 * QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED : questDockWrapperSpecs.get().width,
transform: [{
translateX: _spring.withSpring(activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED : 0, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)
}, {
translateY: _spring.withSpring(activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED : 0, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)
}]
};
};
K.__closure = {
activeQuestDockMode,
QuestDockMode,
QUEST_DOCK_CONTENT_BORDER_RADII,
questDockBorderRadius: token,
withSpring: _spring.withSpring,
questDockAnimatedBorderRadius,
QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED,
questDockWrapperSpecs,
QUEST_DOCK_UNENROLLED_HEADER_INSET_EXPANDED
};
K.__workletHash = 15527986377887;
K.__initData = __initData;
const animatedStyle3 = useAnimatedStyle(K);
const X = () => ({
opacity: _spring.withSpring(activeQuestDockMode.get() === QuestDockMode.EXPANDED ? 0 : 1, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)
});
X.__closure = {
withSpring: _spring.withSpring,
activeQuestDockMode,
QuestDockMode,
QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED
};
X.__workletHash = 15527972438968;
X.__initData = __initData2;
const animatedStyle2 = useAnimatedStyle(X);
const q = () => ({
right: activeQuestDockMode.get() === QuestDockMode.EXPANDED ? -1 * QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED : 0
});
q.__closure = {
activeQuestDockMode,
QuestDockMode,
QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED
};
q.__workletHash = 7866036039040;
q.__initData = __initData3;
const animatedStyle = useAnimatedStyle(q);
const f = () => ({
opacity: _spring.withSpring(activeQuestDockMode.get() === QuestDockMode.EXPANDED ? 1 : 0, QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED)
});
f.__closure = {
withSpring: _spring.withSpring,
activeQuestDockMode,
QuestDockMode,
QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED
};
f.__workletHash = 11647269239934;
f.__initData = __initData4;
const animatedStyle4 = useAnimatedStyle(f);
const B = () => ({
right: activeQuestDockMode.get() !== QuestDockMode.EXPANDED ? QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED : 0
});
B.__closure = {
activeQuestDockMode,
QuestDockMode,
QUEST_DOCK_HORIZONTAL_EDGE_GUTTER_COLLAPSED
};
B.__workletHash = 14794727045076;
B.__initData = __initData5;
const animatedStyle5 = useAnimatedStyle(B);
const G = () => ({
pointerEvents: activeQuestDockMode.get() === QuestDockMode.EXPANDED ? "auto" : "none"
});
G.__closure = {
activeQuestDockMode,
QuestDockMode
};
G.__workletHash = 6738114933032;
G.__initData = __initData6;
const animatedProps = useAnimatedProps(G);
const x = () => ({
borderRadius: activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_CONTENT_BORDER_RADII : token,
borderBottomLeftRadius: activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_CONTENT_BORDER_RADII : _spring.withSpring(c21039_5.get(), QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),
borderBottomRightRadius: activeQuestDockMode.get() === QuestDockMode.EXPANDED ? QUEST_DOCK_CONTENT_BORDER_RADII : _spring.withSpring(c21039_5.get(), QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED),
width: questDockWrapperSpecs.get().width
});
x.__closure = {
activeQuestDockMode,
QuestDockMode,
QUEST_DOCK_CONTENT_BORDER_RADII,
questDockBorderRadius: token,
withSpring: _spring.withSpring,
questDockAnimatedBorderRadius,
QUEST_DOCK_MODE_CHANGE_PHYSICS_CLAMPED,
questDockWrapperSpecs
};
x.__workletHash = 16321960714067;
x.__initData = __initData7;
const animatedStyle6 = useAnimatedStyle(x);
const styles = useStyles();
const questGameLogotypeAssetUrl = useQuestGameLogotypeAssetUrl(quest);
const questBarHeroBlurhash = quest.config.assets.questBarHeroBlurhash;
return <ReanimatedNativeView style={[styles.questDockHeader, animatedStyle3]} layout={questDockHeaderLayoutAnimation}>
{!(!isAndroid() && !state) && questBarHeroBlurhash != null ? <QuestDockBlurredHeaderPlaceholder placeholder={questBarHeroBlurhash} animatedStyle={animatedStyle6} animatedLayout={questDockHeaderLayoutAnimation} /> : <QuestDockBlurredContentBackground animatedStyle={animatedStyle6} animatedLayout={questDockHeaderLayoutAnimation} />}
<View style={styles.questDockHeaderPrimary}>
<FastImage source={r11 === ThemeTypes.DARK ? Module14212 : Module14213} resizeMode="contain" style={styles.wreathImage} />
<QuestGameLogotype assetUrl={questGameLogotypeAssetUrl} height={36} maxWidth={120} style={styles.logo} />
</View>
<View style={styles.questDockHeaderSecondary}>
<ReanimatedNativeView style={[styles.questDockHeaderContentCollapsed, animatedStyle]} layout={questDockHeaderLayoutAnimation}>
<ReanimatedNativeView style={animatedStyle2}>
<Text style={styles.questDockHeaderTertiaryContent} variant="text-sm/medium" color="interactive-text-active">
{intl.string(t["3mgEQf"])}
</Text>
</ReanimatedNativeView>
</ReanimatedNativeView>
<ReanimatedNativeView animatedProps={animatedProps} style={animatedStyle5} layout={questDockHeaderLayoutAnimation}>
<ReanimatedNativeView style={[styles.questDockHeaderContentExpanded, animatedStyle4]}>
<PressableOpacity onPress={callback} accessibilityRole="button" style={[styles.questDockHeaderActionDisclosures, styles.questDockHeaderTertiaryContent]}>
<>
<Text color="interactive-text-active" variant="text-sm/medium">
{intl.string(t.o6FLcF)}
</Text>
<CircleQuestionIcon color={Module712.colors.INTERACTIVE_TEXT_ACTIVE} style={styles.questDockHeaderActionDisclosuresIcon} />
</>
</PressableOpacity>
<View style={styles.questDockHeaderActionSeparator} />
<PressableOpacity accessibilityRole="button" onPress={actionSheetPressHandler} style={styles.questDockHeaderTertiaryContent}>
<MoreHorizontalIcon color={Module712.colors.INTERACTIVE_TEXT_ACTIVE} />
</PressableOpacity>
</ReanimatedNativeView>
</ReanimatedNativeView>
</View>
</ReanimatedNativeView>;
});
export default r75;