yeet

modules/media_viewer/native/components/MediaModalTiktok.tsx

@@ -0,0 +1,255 @@
+// Metro module 8139 (f8140).
+import { memo, useState, useCallback, useEffect, useMemo, createRef, useLayoutEffect } from "react";
+import MediaModalWebView, { PlayerState } from "./MediaModalWebView";
+import usePrevious from "../../../../hooks/usePrevious";
+import { MediaViewerAnalytics } from "../../MediaViewerAnalyticsManager";
+import { setMuted } from "../useVideoControls";
+import { useMediaPlayerMutedStore } from "../MediaPlayerMuteManager";
+let c5169_6 = {
+  controls: 0,
+  enable_music_info: 0,
+  enable_timestamp: 0,
+  utm_source: "discord.gg"
+};
+let c5169_7 = {
+  "-1": PlayerState.UNSTARTED,
+  0: PlayerState.ENDED,
+  1: PlayerState.PLAYING,
+  2: PlayerState.PAUSED,
+  3: PlayerState.BUFFERING
+};
+const r44 = memo(function({ visible, style, source, controls, ...props }) {
+  let mediaPlayerMutedStore;
+  mediaPlayerMutedStore = void 0;
+  const [state, setState] = useState(PlayerState.UNREADY);
+  const previous = usePrevious(state);
+  let c16282_5 = previous;
+  const previous2 = usePrevious(visible);
+  let c16282_6 = previous2;
+  const ref = controls == null ? void 0 : controls.props?.ref;
+  const callback = useCallback((a0) => {
+    const r9 = JSON.parse(a0);
+    const type = r9.type;
+    if (type === "onPlayerReady") {
+      setState(PlayerState.READY);
+    } else if (type === "onStateChange") {
+      const r60 = c5169_7[r9.value];
+      if (r60 != null) {
+        if (controls != null) {
+          const props3 = controls.props;
+          if (props3 != null) {
+            props3.onPlayerStateChange(r60);
+          }
+        }
+        setState(r60);
+      }
+    } else if (type === "onError") {
+      setState(PlayerState.ERRORED);
+      const value = r9.value;
+      MediaViewerAnalytics.trackMessageEmbedsActionCompleted({
+        platform: "tiktok",
+        action: "errored",
+        error: value === "1" ? "MEDIA_ERR_ABORTED" : value === "2" ? "MEDIA_ERR_NETWORK" : value === "3" ? "MEDIA_ERR_DECODE" : value !== "4" ? "UNKNOWN" : "MEDIA_ERR_SRC_NOT_SUPPORTED"
+      });
+    } else if (type === "onCurrentTime") {
+      if (controls != null) {
+        const props = controls.props;
+        if (props != null) {
+          const onCurrentSecond2 = props.onCurrentSecond;
+          if (onCurrentSecond2 != null) {
+            onCurrentSecond2.call(props, r9.value.currentTime);
+          }
+        }
+      }
+      if (controls != null) {
+        const props2 = controls.props;
+        if (props2 != null) {
+          const onDuration2 = props2.onDuration;
+          if (onDuration2 != null) {
+            onDuration2.call(props2, r9.value.duration);
+          }
+        }
+      }
+    } else if (type === "onMute") {
+      setMuted(r9.value);
+    }
+  }, [controls?.props]);
+  mediaPlayerMutedStore = useMediaPlayerMutedStore((a0) => a0.isMuted);
+  useEffect(() => {
+    if (ref?.current != null && state !== PlayerState.UNREADY) {
+      if ((visible ? c16282_5 === PlayerState.UNREADY : visible) && state === PlayerState.READY) {
+        const r12 = JSON.stringify({
+          "x-tiktok-player": true,
+          ...{
+            type: "play"
+          }
+        });
+        const current = ref.current;
+        if (current != null) {
+          current.injectJavaScript(`
+      window.postMessage(${r12}, '*')
+    `);
+        }
+      }
+      if (visible ? !c16282_6 : visible) {
+        const r59 = JSON.stringify({
+          "x-tiktok-player": true,
+          ...{
+            type: "play"
+          }
+        });
+        const current2 = ref.current;
+        if (current2 != null) {
+          current2.injectJavaScript(`
+      window.postMessage(${r59}, '*')
+    `);
+        }
+      }
+      if (visible ? !visible : c16282_6) {
+        const r76 = JSON.stringify({
+          "x-tiktok-player": true,
+          ...{
+            type: "pause"
+          }
+        });
+        const current3 = ref.current;
+        if (current3 != null) {
+          current3.injectJavaScript(`
+      window.postMessage(${r76}, '*')
+    `);
+        }
+      }
+      if (state === PlayerState.ENDED) {
+        const r100 = JSON.stringify({
+          "x-tiktok-player": true,
+          ...{
+            type: "seekTo",
+            value: 0
+          }
+        });
+        const current4 = ref.current;
+        if (current4 != null) {
+          current4.injectJavaScript(`
+      window.postMessage(${r100}, '*')
+    `);
+        }
+        const r115 = JSON.stringify({
+          "x-tiktok-player": true,
+          ...{
+            type: "play"
+          }
+        });
+        const current5 = ref.current;
+        if (current5 != null) {
+          current5.injectJavaScript(`
+      window.postMessage(${r115}, '*')
+    `);
+        }
+      }
+      const r134 = JSON.stringify({
+        "x-tiktok-player": true,
+        ...{
+          type: mediaPlayerMutedStore ? "mute" : "unMute"
+        }
+      });
+      const current6 = ref.current;
+      if (current6 != null) {
+        current6.injectJavaScript(`
+      window.postMessage(${r134}, '*')
+    `);
+      }
+    }
+  }, [ref, visible, previous2, previous, state, mediaPlayerMutedStore]);
+  useEffect(() => {
+    MediaViewerAnalytics.trackMessageEmbedsActionCompleted({
+      platform: "tiktok",
+      action: "attempted"
+    });
+  }, []);
+  return <MediaModalWebView ref={ref} style={style} source={{
+    ...source,
+    uri: useMemo(() => {
+      const uRL = new URL(source.uri);
+      let c26117_0 = uRL;
+      Object.entries(c5169_6).forEach((item) => {
+        const [r23, r7] = item;
+        c26117_0.searchParams.append(r23, r7.toString());
+      });
+      return uRL.toString();
+    }, [source.uri])
+  }} baseURL="https://www.tiktok.com/player/v1/" injectedJavaScript={"\n  window.addEventListener('message', function(event) {\n    if (!event.data[\"x-tiktok-player\"]) {\n      return;\n    }\n    window.ReactNativeWebView.postMessage(JSON.stringify(event.data));\n  }, true);\n"} onDataReceived={callback} playerState={state} {...props} />;
+});
+export default r44;
+export function createTiktokVideoControls() {
+  let c16283_0, c16283_1;
+  const ref2 = createRef();
+  let c16283_3 = 0;
+  let c16283_4 = 0;
+  let c16283_5 = false;
+  return {
+    seek: (a0) => {
+      const r12 = JSON.stringify({
+        "x-tiktok-player": true,
+        ...{
+          type: "seekTo",
+          value: a0
+        }
+      });
+      const current = ref2.current;
+      if (current != null) {
+        current.injectJavaScript(`
+        window.postMessage(${r12}, '*')
+      `);
+      }
+    },
+    pause: (a0) => {
+      if (c16283_5 !== a0) {
+        c16283_5 = a0;
+        const r14 = JSON.stringify({
+          "x-tiktok-player": true,
+          ...{
+            type: a0 ? "pause" : "play"
+          }
+        });
+        const current = ref2.current;
+        if (current != null) {
+          current.injectJavaScript(`
+        window.postMessage(${r14}, '*')
+      `);
+        }
+      }
+    },
+    useSubscribe: (a0, a1, a2) => {
+      c16283_0 = a0;
+      c16283_1 = a1;
+      useLayoutEffect(() => {
+        if (c16283_0 != null) {
+          c16283_0(c16283_3, c16283_4);
+        }
+        if (c16283_1 != null) {
+          c16283_1(c16283_5);
+        }
+      }, []);
+    },
+    props: {
+      ref: ref2,
+      onPlayerStateChange: (a0) => {
+        if (c16283_1 != null) {
+          c16283_1(a0 === PlayerState.PAUSED || a0 === PlayerState.ENDED);
+        }
+      },
+      onCurrentSecond: (a0) => {
+        c16283_3 = a0;
+        if (c16283_0 != null) {
+          c16283_0(c16283_3, c16283_4);
+        }
+      },
+      onDuration: (a0) => {
+        c16283_4 = a0;
+        if (c16283_0 != null) {
+          c16283_0(c16283_3, c16283_4);
+        }
+      }
+    }
+  };
+}