211 lines
9.6 KiB
TypeScript
211 lines
9.6 KiB
TypeScript
// Metro module 14182 (f14183).
|
|
import * as Module19 from "react";
|
|
import { useMemo, useEffect, useCallback, useLayoutEffect, useContext, useState } from "react";
|
|
import { ActivityIndicator, ScrollView, View } from "react-native";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import { useVideoQuestModalContext } from "./VideoQuestModalContext";
|
|
import { getQuestAsset, QuestAssetType } from "../../lib/AssetUtils";
|
|
import { useVideoQuestClickCtaAndMaybeCloseModal } from "./useVideoQuestClickCtaAndMaybeCloseModal";
|
|
import { useQuestRewardClaimHandler } from "../QuestBottomSheet/QuestBottomSheetFooter";
|
|
import ProductPurchaseSuccessActionCreators from "../../../collectibles/native/ProductPurchaseSuccessActionCreators";
|
|
import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
|
|
import { useSharedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
|
|
import * as _spring from "../../../../design/animation/reanimated/spring/spring";
|
|
import * as _QuestUtils from "../../utils/QuestUtils";
|
|
import { showShareActionSheet } from "../../../action_sheet/native/showShareActionSheet";
|
|
import { getQuestUrl, getExternalCtaLabel } from "../../utils/QuestCopyUtils";
|
|
import { lockOrientation } from "../../../device/native/DeviceOrientation";
|
|
import { QuestDockGestureContext } from "../QuestDock/QuestDockGestureContext";
|
|
import { QUEST_PROGRESS_DIAMETER_BY_SIZE } from "../QuestProgressIndicator";
|
|
import { SafeAreaPaddingView } from "../../../../components_native/common/SafeAreaView";
|
|
import { Stack } from "../../../../design/components/Stack/native/Stack.native";
|
|
import { Heading, Text } from "../../../../design/components/Text/native/Text";
|
|
import { intl, t } from "../../../../intl/index.native";
|
|
import VideoQuestModalCloseButton from "./VideoQuestModalCloseButton";
|
|
import ReanimatedNativeView from "../../../core/native/ReanimatedNativeView";
|
|
import VideoQuestModalReward from "./VideoQuestModalReward";
|
|
import { Button } from "../../../../design/components/Button/native/Button.native";
|
|
import { PressableOpacity } from "../../../../design/void/Pressables/native/Pressables";
|
|
import { RetryIcon } from "../../../../design/components/Icon/native/redesign/generated/RetryIcon";
|
|
import FastImage from "../../../../components_native/common/FastImage";
|
|
import { ShareIcon } from "../../../../design/components/Icon/native/redesign/generated/ShareIcon";
|
|
const ANIMATED_CONTENT_SPRING_CONFIG = {
|
|
mass: 1.9,
|
|
damping: 18,
|
|
stiffness: 80,
|
|
overshootClamping: false
|
|
};
|
|
const useStyles = createStyles({
|
|
wrapper: {
|
|
flexGrow: 1,
|
|
flexShrink: 1
|
|
},
|
|
headerContentCopy: {
|
|
flexGrow: 1,
|
|
flexShrink: 1
|
|
},
|
|
closeButton: {
|
|
opacity: 0.5
|
|
},
|
|
scroll: {
|
|
flexGrow: 1,
|
|
flexShrink: 1
|
|
},
|
|
scrollContent: {
|
|
flexGrow: 1
|
|
},
|
|
content: {
|
|
padding: Module712.space.PX_16
|
|
},
|
|
contentRewardsAnimatedWrapper: {
|
|
flexGrow: 1,
|
|
flexShrink: 0
|
|
},
|
|
contentRewardsWrapper: {
|
|
flexGrow: 1,
|
|
flexShrink: 0
|
|
},
|
|
contentRewards: {
|
|
alignItems: "center"
|
|
},
|
|
contentRewardsCopy: {
|
|
textAlign: "center"
|
|
},
|
|
contentEndCardHeader: {
|
|
marginBottom: Module712.space.PX_16
|
|
},
|
|
contentEndCardHeaderCopy: {
|
|
flexGrow: 1,
|
|
flexShrink: 1
|
|
},
|
|
contentEndCard: {
|
|
borderTopWidth: 1,
|
|
borderTopColor: Module712.colors.BORDER_STRONG,
|
|
paddingTop: Module712.space.PX_24,
|
|
flexShrink: 0
|
|
},
|
|
image: {
|
|
height: 210,
|
|
marginBottom: Module712.space.PX_24,
|
|
borderRadius: Module712.radii.xl
|
|
}
|
|
});
|
|
const __initData = {
|
|
code: "function VideoQuestModalContentCompletedTsx1(){const{withDelay,ANIMATION_DELAY,withSpring,isComponentMounted,ANIMATED_CONTENT_SPRING_CONFIG,interpolate,ANIMATED_CONTENT_OFFSET_Y}=this.__closure;return{opacity:withDelay(ANIMATION_DELAY,withSpring(isComponentMounted.get(),ANIMATED_CONTENT_SPRING_CONFIG)),transform:[{translateY:withDelay(ANIMATION_DELAY,withSpring(interpolate(isComponentMounted.get(),[0,1],[ANIMATED_CONTENT_OFFSET_Y,0]),ANIMATED_CONTENT_SPRING_CONFIG))}]};}"
|
|
};
|
|
const r73 = Module19.memo(function VideoQuestModalContentCompleted(props) {
|
|
let sharedValue, isShareableQuest;
|
|
const { onClose, onRestartVideo, sourceQuestContent } = props;
|
|
const styles = useStyles();
|
|
const quest = useVideoQuestModalContext().quest;
|
|
const memo = useMemo(() => getQuestAsset(quest, QuestAssetType.VIDEO_PLAYER_THUMBNAIL, void 0, true), [quest]);
|
|
const videoQuestClickCtaAndMaybeCloseModal = useVideoQuestClickCtaAndMaybeCloseModal({
|
|
quest,
|
|
onClose,
|
|
sourceQuestContent
|
|
});
|
|
const questRewardClaimHandler = useQuestRewardClaimHandler({
|
|
quest,
|
|
onSuccess: ProductPurchaseSuccessActionCreators.close,
|
|
sourceQuestContent
|
|
});
|
|
const { isLoading, isClaiming, claim } = questRewardClaimHandler;
|
|
const r59 = quest.userStatus?.claimedAt != null;
|
|
sharedValue = useSharedValue(0);
|
|
const u = function u() {
|
|
return {
|
|
opacity: _ReanimatedRexport.withDelay(125, _spring.withSpring(sharedValue.get(), ANIMATED_CONTENT_SPRING_CONFIG)),
|
|
transform: [{
|
|
translateY: _ReanimatedRexport.withDelay(125, _spring.withSpring(_ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [75, 0]), ANIMATED_CONTENT_SPRING_CONFIG))
|
|
}]
|
|
};
|
|
};
|
|
u.__closure = {
|
|
withDelay: _ReanimatedRexport.withDelay,
|
|
ANIMATION_DELAY: 125,
|
|
withSpring: _spring.withSpring,
|
|
isComponentMounted: sharedValue,
|
|
ANIMATED_CONTENT_SPRING_CONFIG,
|
|
interpolate: _ReanimatedRexport.interpolate,
|
|
ANIMATED_CONTENT_OFFSET_Y: 75
|
|
};
|
|
u.__workletHash = 2704439293952;
|
|
u.__initData = __initData;
|
|
const animatedStyle = useAnimatedStyle(u);
|
|
useEffect(() => {
|
|
sharedValue.set(1);
|
|
}, [sharedValue]);
|
|
let r19 = _QuestUtils.isShareableQuest(quest.config);
|
|
isShareableQuest = r19;
|
|
const callback = useCallback(() => {
|
|
if (isShareableQuest) {
|
|
showShareActionSheet({
|
|
message: getQuestUrl(quest.id)
|
|
}, "Video Quest Modal");
|
|
}
|
|
}, [isShareableQuest, quest.id]);
|
|
useLayoutEffect(() => {
|
|
lockOrientation("PORTRAIT", true);
|
|
}, []);
|
|
const windowDimensions = useContext(QuestDockGestureContext).windowDimensions;
|
|
const r5 = windowDimensions.get().height < 800;
|
|
const size = windowDimensions.get().height < 760 ? "md" : r5 ? "md-lg" : "lg";
|
|
let [state, setState] = useState(null);
|
|
const callback2 = useCallback((a0) => {
|
|
setState(a0.nativeEvent.layout.height);
|
|
}, []);
|
|
if (state == null) {
|
|
state = QUEST_PROGRESS_DIAMETER_BY_SIZE[size];
|
|
}
|
|
const minHeight = state + 2 * Module712.space.PX_16;
|
|
const r162 = [<Stack align="center" direction="horizontal" justify="space-between" style={styles.content}>
|
|
<Heading variant="heading-sm/semibold" color="text-subtle" style={styles.headerContentCopy}>
|
|
{intl.formatToPlainString(t.EAYZAr, {
|
|
questName: quest.config.messages.questName
|
|
})}
|
|
</Heading>
|
|
<VideoQuestModalCloseButton onClose={onClose} style={styles.closeButton} />
|
|
</Stack>, ,];
|
|
const r226 = [<ReanimatedNativeView style={[styles.contentRewardsAnimatedWrapper, {
|
|
minHeight
|
|
}, animatedStyle]}>
|
|
<Stack align="center" justify="center" spacing={Module712.space.PX_24} style={[styles.content, styles.contentRewardsWrapper]}>
|
|
{isLoading && !isClaiming ? <ActivityIndicator /> : <View style={styles.contentRewards} onLayout={callback2}>
|
|
<VideoQuestModalReward withQuestName={false} withRewardAvailableCopy={false} size={size} withRewardTileAnimation />
|
|
<Heading color="text-strong" style={styles.contentRewardsCopy} variant="heading-lg/semibold">
|
|
{r59 ? intl.string(t["EMp8/M"]) : intl.string(t.qyKLdg)}
|
|
</Heading>
|
|
</View>}
|
|
{r59 ? !r59 : <Button grow variant="secondary" loading={isClaiming} disabled={isClaiming} onPress={claim} text={intl.string(t.cfY4PE)} />}
|
|
</Stack>
|
|
</ReanimatedNativeView>, ,];
|
|
const r289 = [<Stack direction="horizontal" justify="space-between" style={styles.contentEndCardHeader}>
|
|
<Stack spacing={Module712.space.PX_4} style={styles.contentEndCardHeaderCopy}>
|
|
<Heading variant="heading-md/semibold" color="mobile-text-heading-primary">{quest.config.messages.gameTitle}</Heading>
|
|
<Text variant="text-sm/medium" color="text-subtle">{quest.config.messages.gamePublisher}</Text>
|
|
</Stack>
|
|
<PressableOpacity accessibilityRole="button" accessibilityLabel={intl.string(t.YsCuyF)} onPress={onRestartVideo}>
|
|
<RetryIcon color={Module712.colors.INTERACTIVE_TEXT_DEFAULT} />
|
|
</PressableOpacity>
|
|
</Stack>, memo != null && <PressableOpacity accessibilityRole="button" accessibilityLabel={intl.formatToPlainString(t.r8BzFT, {
|
|
gameTitle: quest.config.messages.gameTitle
|
|
})} onPress={videoQuestClickCtaAndMaybeCloseModal}>
|
|
<FastImage style={styles.image} source={{
|
|
uri: memo.url
|
|
}} resizeMode="cover" />
|
|
</PressableOpacity>, ,];
|
|
const r332 = [<Button grow variant="expressive" onPress={videoQuestClickCtaAndMaybeCloseModal} text={getExternalCtaLabel(quest)} />, ,];
|
|
if (isShareableQuest) {
|
|
r19 = <PressableOpacity accessibilityRole="button" accessibilityLabel={intl.string(t.Ej3B3Y)} onPress={callback}>
|
|
<ShareIcon color={Module712.colors.INTERACTIVE_TEXT_DEFAULT} />
|
|
</PressableOpacity>;
|
|
}
|
|
r332[1] = r19;
|
|
r289[2] = <Stack direction="horizontal" spacing={Module712.space.PX_16} align="center">{r332}</Stack>;
|
|
r226[1] = <View style={[styles.content, styles.contentEndCard]}>{r289}</View>;
|
|
r162[1] = <ScrollView style={styles.scroll} contentContainerStyle={styles.scrollContent} showsVerticalScrollIndicator={false} alwaysBounceVertical={false}>{r226}</ScrollView>;
|
|
return <SafeAreaPaddingView bottom style={styles.wrapper}>{r162}</SafeAreaPaddingView>;
|
|
});
|
|
export default r73;
|