204 lines
8.4 KiB
TypeScript
204 lines
8.4 KiB
TypeScript
// Metro module 14183 (f14184).
|
|
import { useMemo } from "react";
|
|
import { StyleSheet, View } from "react-native";
|
|
import UserStore from "../../../../stores/UserStore";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import { useQuestTaskDetails, useIsQuestProgressing, useQuestFormattedDate, useThirdPartyTaskDetails } from "../../hooks/QuestHooks";
|
|
import { supportedTaskPlatforms } from "../../utils/QuestPlatformUtils";
|
|
import { useStateFromStores } from "../../../../_bundle/Module589";
|
|
import { getDefaultRewardName } from "../../utils/QuestRewardUtils";
|
|
import * as _QuestUtils from "../../utils/QuestUtils";
|
|
import { intl, t } from "../../../../intl/index.native";
|
|
import { Text } from "../../../../design/components/Text/native/Text";
|
|
import { FirstPartyQuestTaskTypes, FirstPartyQuestTaskTypesSets } from "../../../../_bundle/Module5040";
|
|
import { Card } from "../../../../design/components/Card/native/Card.native";
|
|
import QuestProgressIndicator from "../QuestProgressIndicator";
|
|
import { getQuestAsset, QuestAssetType } from "../../lib/AssetUtils";
|
|
import { useWatchTaskPressHandler } from "./QuestBottomSheetHooks";
|
|
import { isHeroVideoSupported } from "../QuestUtils.native";
|
|
import { PressableOpacity } from "../../../../design/void/Pressables/native/Pressables";
|
|
import { VideoComponent } from "../../../../components_native/common/Video";
|
|
import Module4611 from "../../../../_bundle/Module4611";
|
|
import FastImage from "../../../../components_native/common/FastImage";
|
|
import QuestDockBlurredContentBackground from "../QuestDock/QuestDockBlurredContentBackground";
|
|
import { PlayIcon } from "../../../../design/components/Icon/native/redesign/generated/PlayIcon";
|
|
const useStyles = createStyles({
|
|
card: {
|
|
padding: 0
|
|
},
|
|
cardWatchTask: {
|
|
justifyContent: "flex-end",
|
|
height: 210
|
|
},
|
|
content: {
|
|
padding: Module712.space.PX_16
|
|
},
|
|
contentWatchTask: {
|
|
alignItems: "flex-end"
|
|
},
|
|
footer: {
|
|
padding: 12,
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
backgroundColor: Module712.colors.BACKGROUND_MOD_MUTED,
|
|
borderBottomLeftRadius: Module712.modules.mobile.CARD_DEFAULT_RADIUS,
|
|
borderBottomRightRadius: Module712.modules.mobile.CARD_DEFAULT_RADIUS,
|
|
borderWidth: 1,
|
|
borderColor: Module712.colors.BORDER_MUTED
|
|
},
|
|
instructionsText: {
|
|
marginTop: Module712.space.PX_12,
|
|
textAlign: "center"
|
|
},
|
|
videoPreviewWrapper: {
|
|
...StyleSheet.absoluteFillObject,
|
|
borderRadius: Module712.modules.mobile.CARD_DEFAULT_RADIUS,
|
|
overflow: "hidden"
|
|
},
|
|
videoPreview: {
|
|
...StyleSheet.absoluteFillObject
|
|
},
|
|
playVideoIconWrapper: {
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
borderRadius: Module712.radii.round,
|
|
position: "absolute",
|
|
left: "50%",
|
|
overflow: "hidden",
|
|
top: "50%",
|
|
width: 60,
|
|
height: 60,
|
|
transform: [{
|
|
translateX: -30
|
|
}, {
|
|
translateY: -30
|
|
}]
|
|
}
|
|
});
|
|
export function QuestBottomSheetProgressCardPlayStreamTask(props) {
|
|
let isSponsoredPlayQuest;
|
|
const quest2 = props.quest;
|
|
isSponsoredPlayQuest = void 0;
|
|
const styles = useStyles();
|
|
const questTaskDetails = useQuestTaskDetails(quest2);
|
|
let r7 = useIsQuestProgressing(quest2);
|
|
const isQuestProgressing = r7;
|
|
let r15 = quest2.userStatus?.completedAt != null;
|
|
let c21012_2 = r15;
|
|
const r31 = quest2.userStatus?.claimedAt != null;
|
|
let c21012_3 = r31;
|
|
const r12 = supportedTaskPlatforms(quest2);
|
|
let c21012_4 = r12;
|
|
const questFormattedDate = useQuestFormattedDate(quest2.config.rewardsConfig.rewardsExpireAt);
|
|
const gameTitle = quest2.config.messages.gameTitle;
|
|
const defaultRewardName = getDefaultRewardName(quest2.config, useStateFromStores([UserStore], () => UserStore.getCurrentUser()));
|
|
isSponsoredPlayQuest = _QuestUtils.isSponsoredPlayQuest(quest2);
|
|
const memo = useMemo(() => {
|
|
if (c21012_2 && !c21012_3) {
|
|
return intl.format(t.e3OlfB, {
|
|
rewardHook: () => <Text variant="text-sm/semibold" color="text-strong">{defaultRewardName}</Text>,
|
|
date: questFormattedDate
|
|
});
|
|
}
|
|
if (isQuestProgressing) {
|
|
return intl.format(t.aFaRso, {
|
|
minutesLeft: Math.ceil((questTaskDetails.targetSeconds - questTaskDetails.progressSeconds) / 60),
|
|
minutesHook: (a0) => <Text variant="text-sm/semibold" color="text-strong">
|
|
{a0}
|
|
</Text>
|
|
});
|
|
}
|
|
return isSponsoredPlayQuest ? intl.string(t["04ateG"]) : c21012_4.length > 1 ? intl.formatToPlainString(t.E2R8VX, {
|
|
gameName: gameTitle
|
|
}) : questTaskDetails.taskType === FirstPartyQuestTaskTypes.STREAM_ON_DESKTOP ? intl.formatToPlainString(t.boMftC, {
|
|
gameName: gameTitle
|
|
}) : questTaskDetails.taskType === FirstPartyQuestTaskTypes.PLAY_ON_DESKTOP ? intl.formatToPlainString(t["9Peldf"], {
|
|
gameName: gameTitle
|
|
}) : FirstPartyQuestTaskTypesSets.CONSOLE.has(questTaskDetails.taskType) ? intl.formatToPlainString(t["+8JB6Y"], {
|
|
gameTitle
|
|
}) : null;
|
|
}, [questTaskDetails, r15, r31, gameTitle, defaultRewardName, isQuestProgressing, r12, questFormattedDate, isSponsoredPlayQuest]);
|
|
if (!r15) {
|
|
r15 = isQuestProgressing;
|
|
}
|
|
const r86 = [<View style={styles.content}>
|
|
<QuestProgressIndicator quest={quest2} size="lg" progress={questTaskDetails.percentComplete} loading={!r15} hasConfetti />
|
|
{memo != null && <Text style={styles.instructionsText} variant="text-sm/semibold" color="text-subtle">{memo}</Text>}
|
|
</View>, ,];
|
|
if (isQuestProgressing) {
|
|
r7 = <View style={styles.footer}>
|
|
<Text color="text-feedback-positive" variant="text-sm/semibold">
|
|
{intl.format(t.lIFg6I, {
|
|
gameName: quest2.config.messages.gameTitle
|
|
})}
|
|
</Text>
|
|
</View>;
|
|
}
|
|
r86[1] = r7;
|
|
return <Card style={styles.card} border="subtle">{r86}</Card>;
|
|
}
|
|
export function QuestBottomSheetProgressCardWatchTask(props) {
|
|
const { quest, sourceQuestContent } = props;
|
|
const styles = useStyles();
|
|
const questTaskDetails2 = useQuestTaskDetails(quest);
|
|
const memo = useMemo(() => getQuestAsset(quest, QuestAssetType.QUEST_BAR_HERO_VIDEO), [quest]);
|
|
const memo3 = useMemo(() => getQuestAsset(quest, QuestAssetType.VIDEO_PLAYER_THUMBNAIL, void 0, true), [quest]);
|
|
const memo2 = useMemo(() => getQuestAsset(quest, QuestAssetType.QUEST_BAR_HERO_IMAGE), [quest]);
|
|
const watchTaskPressHandler = useWatchTaskPressHandler({
|
|
questId: quest.id,
|
|
sourceQuestContent
|
|
});
|
|
const r11 = memo != null && isHeroVideoSupported(memo);
|
|
return <PressableOpacity onPress={watchTaskPressHandler} accessibilityRole="button" accessibilityLabel={intl.string(quest.userStatus?.completedAt != null ? t.YsCuyF : t["74KqrR"])}>
|
|
<Card style={[styles.card, styles.cardWatchTask]} border="subtle">
|
|
{r11 && <View style={styles.videoPreviewWrapper}>
|
|
<VideoComponent style={styles.videoPreview} poster={memo3?.url} posterResizeMode="cover" source={{
|
|
uri: memo.url
|
|
}} resizeMode="cover" muted disableFocus preventsDisplaySleepDuringVideoPlayback={false} />
|
|
<Module4611 start={{
|
|
x: 0.5,
|
|
y: 0.5
|
|
}} end={{
|
|
x: 1,
|
|
y: 1
|
|
}} style={StyleSheet.absoluteFill} colors={["rgba(0, 0, 0, 0)", "rgba(0, 0, 0, 1)"]} />
|
|
</View>}
|
|
{(r11 ? !r11 : memo2 != null) && <View style={styles.videoPreviewWrapper}>
|
|
<FastImage style={styles.videoPreview} source={{
|
|
uri: memo2.url
|
|
}} resizeMode="cover" />
|
|
<Module4611 start={{
|
|
x: 0.5,
|
|
y: 0.5
|
|
}} end={{
|
|
x: 1,
|
|
y: 1
|
|
}} style={StyleSheet.absoluteFill} colors={["rgba(0, 0, 0, 0)", "rgba(0, 0, 0, 1)"]} />
|
|
</View>}
|
|
<View style={styles.playVideoIconWrapper}>
|
|
<QuestDockBlurredContentBackground blurTheme="light" />
|
|
<PlayIcon color={Module712.colors.WHITE} />
|
|
</View>
|
|
<View style={[styles.content, styles.contentWatchTask]}>
|
|
<QuestProgressIndicator quest={quest} size="x-sm" progress={questTaskDetails2.percentComplete} hasConfetti />
|
|
</View>
|
|
</Card>
|
|
</PressableOpacity>;
|
|
}
|
|
export function QuestBottomSheetProgressCardInGameTask(props) {
|
|
const quest2 = props.quest;
|
|
const styles = useStyles();
|
|
let progress = useThirdPartyTaskDetails(quest2)?.percentComplete;
|
|
if (progress == null) {
|
|
progress = 0;
|
|
}
|
|
return <Card style={styles.card} border="subtle">
|
|
<View style={styles.content}>
|
|
<QuestProgressIndicator quest={quest2} size="lg" progress={progress} hasConfetti />
|
|
</View>
|
|
</Card>;
|
|
}
|