yeet

modules/quests/native/VideoQuestModal/VideoQuestModal.tsx

@@ -0,0 +1,213 @@
+// Metro module 14149 (f14150).
+import * as Module19 from "react";
+import { useState, useCallback, useContext, useLayoutEffect, useEffect, useMemo } from "react";
+import { View, StyleSheet } from "react-native";
+import { AnalyticEvents } from "../../../../Constants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import VideoQuestModalContext, { useVideoQuestModalContext } from "./VideoQuestModalContext";
+import { lockOrientation, restoreDefaultOrientation } from "../../../device/native/DeviceOrientation";
+import { trackQuestEvent } from "../../lib/analytics/AnalyticsActions";
+import { QuestDockGestureContext, QuestDockGestureContextProvider } from "../QuestDock/QuestDockGestureContext";
+import useStateFromSharedValue from "../../../reanimated/native/useStateFromSharedValue";
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import { useSharedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import * as _spring from "../../../../design/animation/reanimated/spring/spring";
+import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
+import ReanimatedNativeView from "../../../core/native/ReanimatedNativeView";
+import QuestModalContentCloudBackground from "../QuestModalContentCloudBackground";
+import { SafeAreaPaddingView } from "../../../../components_native/common/SafeAreaView";
+import VideoQuestModalContentInProgress from "./VideoQuestModalContentInProgress";
+import VideoQuestModalContentCompleted from "./VideoQuestModalContentCompleted";
+import { showQuestUnavailableAlert } from "../QuestUtils.native";
+import { useNonNullableQuest } from "../../hooks/QuestHooks";
+import { BillableAdPlacementImpressionTrackerNative } from "../QuestContentImpressionTracker.native";
+import { QuestContent } from "../../QuestTypes";
+import { Modal } from "../../../../design/components/Modal/native/Modal.native";
+let initialRouteName;
+const BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG = {
+  mass: 1.9,
+  damping: 18,
+  stiffness: 80,
+  overshootClamping: true
+};
+let c9903_10 = {
+  WATCH_VIDEO: 0,
+  0: "WATCH_VIDEO",
+  POST_WATCH_VIDEO: 1,
+  1: "POST_WATCH_VIDEO"
+};
+const useStyles = createStyles({
+  wrapper: {
+    flexDirection: "column",
+    flexGrow: 1,
+    flexShrink: 1,
+    zIndex: 1
+  },
+  contentWrapper: {
+    flex: 1
+  },
+  contentBackground: {
+    ...StyleSheet.absoluteFillObject,
+    borderRadius: Module712.radii.lg,
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOWEST
+  },
+  modalContentWrapper: {
+    zIndex: 2
+  },
+  backgroundWrapper: {
+    ...StyleSheet.absoluteFillObject,
+    borderRadius: Module712.radii.lg,
+    flex: 1,
+    overflow: "hidden",
+    pointerEvents: "none",
+    zIndex: 1
+  }
+});
+const __initData = {
+  code: "function VideoQuestModalTsx1(){const{withSpring,clamp,postWatchAnimationState,BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG,interpolate,CLOUDS_BACKGROUND_INVISIBLE_OFFSET_Y}=this.__closure;return{opacity:withSpring(clamp(postWatchAnimationState.get(),0,1),BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG),transform:[{translateY:withSpring(interpolate(postWatchAnimationState.get(),[0,1],[CLOUDS_BACKGROUND_INVISIBLE_OFFSET_Y,0]),BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG)}]};}"
+};
+const __initData2 = {
+  code: "function VideoQuestModalTsx2(){const{withSpring,interpolate,postWatchAnimationState,safeAreaInsets,BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG}=this.__closure;return{transform:[{translateY:withSpring(interpolate(postWatchAnimationState.get(),[0,1],[safeAreaInsets.top,0]),BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG)}],opacity:withSpring(postWatchAnimationState.get(),BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG)};}"
+};
+let Component = Module19.memo(function({ onClose: onClose2, initialStep, sourceQuestContent }) {
+  let sharedValue, c20956_10;
+  const videoQuestModalContext = useVideoQuestModalContext();
+  const { quest, videoSessionId } = videoQuestModalContext;
+  const r36 = quest.userStatus?.completedAt != null;
+  let c20956_4 = r36;
+  const [state, setState] = useState(initialStep == null ? r36 ? c9903_10.POST_WATCH_VIDEO : c9903_10.WATCH_VIDEO : initialStep);
+  const [isFullscreen, setState2] = useState(false);
+  const callback = useCallback((a0) => {
+    if (a0) {
+      lockOrientation("LANDSCAPE", true);
+    } else {
+      lockOrientation("PORTRAIT", true);
+    }
+    setState2(a0);
+    trackQuestEvent({
+      questId: quest.id,
+      event: a0 ? AnalyticEvents.QUEST_VIDEO_FULLSCREEN_ENTERED : AnalyticEvents.QUEST_VIDEO_FULLSCREEN_EXITED,
+      properties: {
+        video_session_id: videoSessionId
+      },
+      sourceQuestContent
+    });
+  }, [quest.id, videoSessionId, sourceQuestContent]);
+  const windowDimensions = useContext(QuestDockGestureContext).windowDimensions;
+  const styles = useStyles();
+  const height = useStateFromSharedValue(windowDimensions).height;
+  useLayoutEffect(() => {
+    if (c20956_4 && initialStep == null) {
+      setState(c9903_10.POST_WATCH_VIDEO);
+    }
+  }, [r36, initialStep]);
+  const callback2 = useCallback(() => {
+    setState(c9903_10.WATCH_VIDEO);
+  }, []);
+  const callback3 = useCallback(() => {
+    callback(false);
+    setState(c9903_10.POST_WATCH_VIDEO);
+  }, [callback]);
+  sharedValue = useSharedValue(state === c9903_10.POST_WATCH_VIDEO ? 1 : 0);
+  const y = () => ({
+    opacity: _spring.withSpring(_ReanimatedRexport.clamp(sharedValue.get(), 0, 1), BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG),
+    transform: [{
+      translateY: _spring.withSpring(_ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [-100, 0]), BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG)
+    }]
+  });
+  y.__closure = {
+    withSpring: _spring.withSpring,
+    clamp: _ReanimatedRexport.clamp,
+    postWatchAnimationState: sharedValue,
+    BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG,
+    interpolate: _ReanimatedRexport.interpolate,
+    CLOUDS_BACKGROUND_INVISIBLE_OFFSET_Y: -100
+  };
+  y.__workletHash = 11571705142399;
+  y.__initData = __initData;
+  const animatedStyle2 = useAnimatedStyle(y);
+  const safeAreaInsets_native = useSafeAreaInsets_native();
+  c20956_10 = safeAreaInsets_native;
+  const M = () => ({
+    transform: [{
+      translateY: _spring.withSpring(_ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [c20956_10.top, 0]), BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG)
+    }],
+    opacity: _spring.withSpring(sharedValue.get(), BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG)
+  });
+  M.__closure = {
+    withSpring: _spring.withSpring,
+    interpolate: _ReanimatedRexport.interpolate,
+    postWatchAnimationState: sharedValue,
+    safeAreaInsets: safeAreaInsets_native,
+    BACKGROUND_ENTRANCE_ANIMATION_SPRING_CONFIG
+  };
+  M.__workletHash = 9769051401109;
+  M.__initData = __initData2;
+  const animatedStyle = useAnimatedStyle(M);
+  useEffect(() => {
+    sharedValue.set(state === c9903_10.POST_WATCH_VIDEO ? 1 : 0);
+  }, [sharedValue, state]);
+  return <View>
+    <ReanimatedNativeView style={styles.modalContentWrapper}>
+      <View style={[styles.backgroundWrapper, {
+        height
+      }]}>
+        <ReanimatedNativeView style={[styles.contentBackground, {
+          top: safeAreaInsets_native.top
+        }]} />
+        <ReanimatedNativeView style={[styles.contentBackground, animatedStyle]} />
+        <ReanimatedNativeView style={animatedStyle2}>
+          <QuestModalContentCloudBackground align="top" />
+        </ReanimatedNativeView>
+      </View>
+      <SafeAreaPaddingView top style={[styles.wrapper, {
+        height
+      }]}>
+        <View style={styles.contentWrapper}>
+          {state === c9903_10.WATCH_VIDEO && <VideoQuestModalContentInProgress isFullscreen={isFullscreen} onNavigateToPostWatchVideo={callback3} onClose={onClose2} onEnd={callback3} setIsFullscreen={callback} sourceQuestContent={sourceQuestContent} />}
+          {state === c9903_10.POST_WATCH_VIDEO && <VideoQuestModalContentCompleted onClose={onClose2} onRestartVideo={callback2} sourceQuestContent={sourceQuestContent} />}
+        </View>
+      </SafeAreaPaddingView>
+    </ReanimatedNativeView>
+  </View>;
+});
+initialRouteName = "watch_mobile_video_quest";
+const r73 = Module19.memo(function VideoQuestModal(props) {
+  const { questId, questContentPosition, onClose, videoSessionId: videoSessionId2, initialStep: initialStep2, sourceQuestContent: sourceQuestContent2 } = props;
+  const nonNullableQuest = useNonNullableQuest(questId, useCallback(() => {
+    showQuestUnavailableAlert();
+    onClose();
+  }, [onClose]));
+  const memo = useMemo(() => {
+    let r1 = null;
+    if (nonNullableQuest != null) {
+      const r7 = {};
+      r7[initialRouteName] = {
+        fullscreen: true,
+        headerLeft: () => null,
+        render: () => <VideoQuestModalContext.Provider value={{
+          quest: nonNullableQuest,
+          videoSessionId: videoSessionId2
+        }}>
+          <QuestDockGestureContextProvider>
+            <BillableAdPlacementImpressionTrackerNative overrideVisibility questContent={QuestContent.VIDEO_MODAL_MOBILE} questOrQuests={nonNullableQuest} questContentPosition={questContentPosition} sourceQuestContent={sourceQuestContent2}>
+              {function children() {
+                return <Component initialStep={initialStep2} onClose={onClose} sourceQuestContent={sourceQuestContent2} />;
+              }}
+            </BillableAdPlacementImpressionTrackerNative>
+          </QuestDockGestureContextProvider>
+        </VideoQuestModalContext.Provider>
+      };
+      r1 = r7;
+    }
+    return r1;
+  }, [onClose, nonNullableQuest, videoSessionId2, questContentPosition, initialStep2, sourceQuestContent2]);
+  useLayoutEffect(() => {
+    lockOrientation("PORTRAIT", true);
+    return restoreDefaultOrientation;
+  }, []);
+  return nonNullableQuest == null ? null : memo == null ? null : <Modal hideTitle initialRouteName={initialRouteName} screens={memo} />;
+});
+export default r73;
+export { c9903_10 as VideoQuestModalSteps };