yeet

modules/video_calls/getParticipantTitle.tsx

@@ -0,0 +1,16 @@
+// Metro module 10840 (f10841).
+import { ParticipantTypes } from "../calls/CallConstants";
+import * as _useIsGuestOrLurker from "../guild_member/useIsGuestOrLurker";
+import NicknameUtils from "../../utils/NicknameUtils";
+import { intl, t } from "../../intl/index.native";
+export default function getParticipantTitle(a0, a1, a2) {
+  if (a1.type === ParticipantTypes.ACTIVITY) {
+    let r45 = a2?.name;
+    if (r45 == null) {
+      r45 = null;
+    }
+    return r45;
+  }
+  const isGuestOrLurkerInGuild = _useIsGuestOrLurker.isGuestOrLurkerInGuild(a0.guild_id, a1.user?.id);
+  return NicknameUtils.getName(a0.getGuildId(), a0.id, a1.user) + (isGuestOrLurkerInGuild ? ` ${intl.string(t["pFO/Ph"])}` : "");
+};

modules/video_calls/native/ChannelCallConstants.tsx

@@ -0,0 +1,32 @@
+// Metro module 10236 (f10237).
+import { PictureInPicturePositions } from "../../../Constants";
+const r16 = {
+  MAIN_CALL_SCREEN: "MainCallScreen"
+};
+const r18 = {
+  VOICE_CONTROLS_TOGGLE_BUTTON: 0,
+  0: "VOICE_CONTROLS_TOGGLE_BUTTON",
+  CAMERA_PREVIEW_PICTURE_IN_PICTURE: 1,
+  1: "CAMERA_PREVIEW_PICTURE_IN_PICTURE"
+};
+const r21 = {
+  OPENING: 0,
+  0: "OPENING",
+  OPEN: 1,
+  1: "OPEN",
+  CLOSING: 2,
+  2: "CLOSING",
+  CLOSED: 3,
+  3: "CLOSED"
+};
+const r28 = [PictureInPicturePositions.TOP_LEFT, PictureInPicturePositions.TOP_RIGHT, PictureInPicturePositions.BOTTOM_LEFT, PictureInPicturePositions.BOTTOM_RIGHT];
+export const BOX_MODE_ACTIONSHEET_WIDTH = 360;
+export const BOX_MODE_ACTIONSHEET_HEIGHT = 720;
+export const BOX_MODE_THRESHOLD_WIDTH = 512;
+export { r16 as ChannelCallScreens };
+export { r18 as VoiceCallOverlayType };
+export { r21 as VoiceChatDrawerState };
+export const MIN_MARGIN_BETWEEN_OVERLAYS = 8;
+export { r28 as ALL_PICTURE_IN_PICTURE_POSITIONS };
+export const VOICE_CALL_OVERLAY_HORIZONTAL_MARGIN = 16;
+export const VOICE_CALL_OVERLAY_VERTICAL_MARGIN = 8;

modules/video_calls/native/ChannelCallLifecycleStore.tsx

@@ -0,0 +1,133 @@
+// Metro module 10518 (f10519).
+import SelectedChannelStore from "../../../stores/SelectedChannelStore";
+import { VoiceCallOverlayType } from "./ChannelCallConstants";
+import { OrientationType } from "../../device/native/DeviceOrientation";
+import isUndefinedOrNull from "../../../_bundle/isUndefinedOrNull";
+import Module589 from "../../../_bundle/Module589";
+import Dispatcher from "../../../Dispatcher";
+import { HermesBuiltin } from "../../../_hermes/prelude";
+let voiceChannelId;
+let c7060_4 = false;
+let c7060_5 = false;
+let c7060_6 = false;
+const visible = false;
+const r23 = {};
+r23[VoiceCallOverlayType.VOICE_CONTROLS_TOGGLE_BUTTON] = {
+  x: void 0,
+  y: void 0,
+  width: void 0,
+  height: void 0,
+  screenOrientation: OrientationType.PORTRAIT,
+  hasUserInteractedSinceOrientationChange: false,
+  isInitialized: false,
+  isVisible: false
+};
+r23[VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE] = {
+  x: void 0,
+  y: void 0,
+  width: void 0,
+  height: void 0,
+  screenOrientation: OrientationType.PORTRAIT,
+  hasUserInteractedSinceOrientationChange: false,
+  isInitialized: false,
+  isVisible: false
+};
+let c7060_8 = r23;
+let c7060_9 = c7060_8;
+let pipEnabledWhileFocusedOnActivityOrStream = true;
+class ChannelCallLifecycleStore extends Module589.Store {
+  static displayName = "ChannelCallLifecycleStore";
+  initialize() {
+    this.waitFor(SelectedChannelStore);
+  }
+  shouldReactToSeriousThermalStateWhenActivityFocused() {
+    return c7060_4;
+  }
+  consumedRequestToRespondToSeriousThermalState() {
+    return c7060_5;
+  }
+  disregardSeriousThermalState() {
+    return c7060_6;
+  }
+  isReactingToThermalState() {
+    return c7060_5 && !c7060_6;
+  }
+  getShowActivitiesDebugOverlay() {
+    return visible;
+  }
+  getVoiceCallOverlayLayoutStates() {
+    return c7060_9;
+  }
+  isPipEnabledWhileFocusedOnActivityOrStream() {
+    return pipEnabledWhileFocusedOnActivityOrStream;
+  }
+}
+const channelCallLifecycleStore = new ChannelCallLifecycleStore(Dispatcher, {
+  VOICE_CHANNEL_SELECT: function handleVoiceChannelSelect(a0) {
+    if (a0 == null) {
+      HermesBuiltin.throwTypeError("Cannot destructure 'undefined' or 'null'.");
+      throw new Error("unreachable");
+    }
+    const voiceChannelId2 = SelectedChannelStore.getVoiceChannelId();
+    if (voiceChannelId2 !== voiceChannelId) {
+      c7060_4 = false;
+      c7060_5 = false;
+      visible = false;
+      c7060_6 = false;
+      c7060_9 = c7060_8;
+    }
+    voiceChannelId = voiceChannelId2;
+  },
+  EMBEDDED_ACTIVITY_REQUEST_RESPOND_TO_SERIOUS_THERMAL_STATE: function handleRequestRespondToSeriousThermalState(a0) {
+    if (a0 == null) {
+      HermesBuiltin.throwTypeError("Cannot destructure 'undefined' or 'null'.");
+      throw new Error("unreachable");
+    }
+    c7060_4 = true;
+  },
+  EMBEDDED_ACTIVITY_CONSUME_RESPOND_TO_SERIOUS_THERMAL_STATE_REQUEST: function handleConsumeReactToSeriousThermalStateRequest(a0) {
+    if (a0 == null) {
+      HermesBuiltin.throwTypeError("Cannot destructure 'undefined' or 'null'.");
+      throw new Error("unreachable");
+    }
+    c7060_5 = true;
+  },
+  EMBEDDED_ACTIVITY_DISREGARD_SERIOUS_THERMAL_STATE: function handleDisregardSeriousThermalState(a0) {
+    if (a0 == null) {
+      HermesBuiltin.throwTypeError("Cannot destructure 'undefined' or 'null'.");
+      throw new Error("unreachable");
+    }
+    c7060_6 = true;
+  },
+  EMBEDDED_ACTIVITY_SET_DEBUG_OVERLAY_VISIBILITY: function handleSetDebugOverlayVisibility(a0) {
+    visible = a0.visible;
+  },
+  VOICE_CALL_OVERLAY_LAYOUT_STATE_UPDATE: function handleVoiceCallOverlayLayoutStateUpdate({ voiceCallOverlayType, voiceCallOverlayLayoutState }) {
+    const r4 = c7060_9;
+    const r9 = {
+      ...r4
+    };
+    r9[voiceCallOverlayType] = voiceCallOverlayLayoutState;
+    if (!isUndefinedOrNull(r9, r4)) {
+      c7060_9 = r9;
+    }
+  },
+  VOICE_CALL_SET_PIP_ENABLED_FOR_ACTIVITY_OR_STREAM: function handleSetPipEnabledForActivityOrStream(a0) {
+    pipEnabledWhileFocusedOnActivityOrStream = a0.pipEnabledWhileFocusedOnActivityOrStream;
+  },
+  EMBEDDED_ACTIVITY_OPEN: function handleEmbeddedActivityOpen(a0) {
+    if (a0 == null) {
+      HermesBuiltin.throwTypeError("Cannot destructure 'undefined' or 'null'.");
+      throw new Error("unreachable");
+    }
+    pipEnabledWhileFocusedOnActivityOrStream = true;
+  },
+  STREAM_WATCH: function handleStreamWatch(a0) {
+    if (a0 == null) {
+      HermesBuiltin.throwTypeError("Cannot destructure 'undefined' or 'null'.");
+      throw new Error("unreachable");
+    }
+    pipEnabledWhileFocusedOnActivityOrStream = true;
+  }
+});
+export default channelCallLifecycleStore;

modules/video_calls/native/ChannelCallStore.tsx

@@ -0,0 +1,179 @@
+// Metro module 10235 (f10236).
+import { useEffect } from "react";
+import EmbeddedActivitiesStore from "../../activities/EmbeddedActivitiesStore";
+import { VoiceChatDrawerState, VoiceCallOverlayType } from "./ChannelCallConstants";
+import { OrientationLockState } from "../../activities/Constants";
+import { ParticipantTypes } from "../../calls/CallConstants";
+import { Timeout } from "../../../_bundle/Timeout";
+import { OrientationType, restoreDefaultOrientation, unlockOrientation, lockOrientation, lockOrientationForiOS } from "../../device/native/DeviceOrientation";
+import { create } from "../../../_bundle/Module644";
+import { batchUpdates } from "../../../_bundle/Module705";
+import Dispatcher from "../../../Dispatcher";
+import ChannelRTCActionCreators from "../../../actions/ChannelRTCActionCreators";
+import Module12 from "../../../_bundle/Module12";
+import useIsPrivateAudioOnlyCall from "./useIsPrivateAudioOnlyCall";
+import useSelectedParticipant from "../useSelectedParticipant";
+import { useIsConnectedToVoiceChannel } from "../../voice_chat/VoiceChatHooks";
+import { useStateFromStores } from "../../../_bundle/Module589";
+import { isIpadOS } from "../../../utils/native/DeviceUtils";
+let $mk84213 = function() {
+  return () => {
+    batchUpdates(() => c6825_10.setState({
+      focus: false
+    }));
+  };
+};
+let c6825_8 = new Timeout();
+const r41 = Object;
+const voiceCallOverlayLayoutStates = {};
+voiceCallOverlayLayoutStates[VoiceCallOverlayType.VOICE_CONTROLS_TOGGLE_BUTTON] = {
+  x: void 0,
+  y: void 0,
+  width: void 0,
+  height: void 0,
+  screenOrientation: OrientationType.PORTRAIT,
+  hasUserInteractedSinceOrientationChange: false,
+  isInitialized: false,
+  isVisible: false
+};
+voiceCallOverlayLayoutStates[VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE] = {
+  x: void 0,
+  y: void 0,
+  width: void 0,
+  height: void 0,
+  screenOrientation: OrientationType.PORTRAIT,
+  hasUserInteractedSinceOrientationChange: false,
+  isInitialized: false,
+  isVisible: false
+};
+let c6825_9 = r41.freeze({
+  focus: true,
+  pipFocus: false,
+  isGestureEnabled: true,
+  voiceChatDrawerState: VoiceChatDrawerState.CLOSED,
+  voiceCallOverlayLayoutStates
+});
+let c6825_10 = create(() => c6825_9);
+const r65 = Module12.throttle(() => {
+  const pipFocus = c6825_10.getState().pipFocus;
+  batchUpdates(() => c6825_10.setState({
+    pipFocus: !pipFocus
+  }));
+}, 300);
+export { c6825_8 as focusTimeout };
+export function setFocus(focus) {
+  batchUpdates(() => c6825_10.setState({
+    focus
+  }));
+}
+export function toggleFocus() {
+  const focus2 = c6825_10.getState().focus;
+  batchUpdates(() => c6825_10.setState({
+    focus: !focus2,
+    pipFocus: false
+  }));
+}
+export function resetFocusTimer() {
+  c6825_8.stop();
+  c6825_8.start(5000, $mk84213());
+}
+export function resetFocus() {
+  if (c6825_10.getState().focus) {
+    c6825_8.stop();
+    c6825_8.start(5000, $mk84213());
+  } else {
+    batchUpdates(() => c6825_10.setState({
+      focus: true
+    }));
+  }
+}
+export function clearFocusTimer() {
+  c6825_8.stop();
+}
+export function setVoiceChatDrawerState(c17788_0, a1) {
+  const voiceChatDrawerState = a1;
+  if (!(a1 !== VoiceChatDrawerState.OPEN && a1 !== VoiceChatDrawerState.CLOSED)) {
+    Dispatcher.wait(() => ChannelRTCActionCreators.updateChatOpen(c17788_0, voiceChatDrawerState === VoiceChatDrawerState.OPEN));
+  }
+  batchUpdates(() => c6825_10.setState({
+    voiceChatDrawerState
+  }));
+}
+export { r65 as togglePipFocus };
+export function useIsVoiceChatFocused() {
+  const voiceChatDrawerState2 = c6825_10().voiceChatDrawerState;
+  return voiceChatDrawerState2 === VoiceChatDrawerState.OPEN || voiceChatDrawerState2 === VoiceChatDrawerState.CLOSING;
+}
+export function useChannelCallOrientationHandlers(a0) {
+  const isPrivateAudioOnlyCall = useIsPrivateAudioOnlyCall(a0);
+  let c17789_0 = isPrivateAudioOnlyCall;
+  const selectedParticipant = useSelectedParticipant(a0);
+  let c17789_1 = selectedParticipant;
+  const r18 = a0.isGuildStageVoice() && selectedParticipant == null;
+  let c17789_2 = r18;
+  const voiceChatDrawerState2 = c6825_10().voiceChatDrawerState;
+  let r22 = voiceChatDrawerState2 === VoiceChatDrawerState.OPEN || voiceChatDrawerState2 === VoiceChatDrawerState.CLOSING;
+  const r2 = !useIsConnectedToVoiceChannel(a0);
+  if (!r22) {
+    r22 = r2;
+  }
+  let c17789_3 = r22;
+  const applicationId = EmbeddedActivitiesStore.getCurrentEmbeddedActivity()?.applicationId;
+  const stateFromStores = useStateFromStores([EmbeddedActivitiesStore], () => {
+    let r8;
+    if (applicationId != null) {
+      let r9 = EmbeddedActivitiesStore.getOrientationLockStateForApp(applicationId);
+      if (r9 == null) {
+        r9 = OrientationLockState.UNLOCKED;
+      }
+      r8 = r9;
+    } else {
+      r8 = OrientationLockState.UNLOCKED;
+    }
+    return r8;
+  }, [applicationId]);
+  useEffect(() => restoreDefaultOrientation, []);
+  useEffect(() => {
+    L16: {
+      if (!c17789_2 && !c17789_3) {
+        if (c17789_1 != null && c17789_1.type === ParticipantTypes.ACTIVITY && c17789_1.applicationId === applicationId) {
+          if (isIpadOS()) {
+            break L16;
+          }
+          if (OrientationLockState.UNLOCKED === stateFromStores) {
+            unlockOrientation({
+              unlockAfterRotatingToPreviousLock: true
+            });
+            break L16;
+          }
+          if (OrientationLockState.PORTRAIT === stateFromStores) {
+            lockOrientation("PORTRAIT", true);
+            break L16;
+          }
+          if (OrientationLockState.LANDSCAPE !== stateFromStores) {
+            break L16;
+          }
+          lockOrientation("LANDSCAPE", true);
+          break L16;
+        }
+        if (c17789_0) {
+          lockOrientationForiOS("PORTRAIT");
+          break L16;
+        }
+        unlockOrientation({
+          unlockAfterRotatingToPreviousLock: false
+        });
+      } else {
+        unlockOrientation({
+          unlockAfterRotatingToPreviousLock: false
+        });
+        lockOrientationForiOS("PORTRAIT");
+      }
+    }
+  }, [stateFromStores, selectedParticipant, applicationId, isPrivateAudioOnlyCall, r18, r22]);
+}
+export function resetChannelCallStore() {
+  c6825_8.stop();
+  batchUpdates(() => c6825_10.setState(c6825_9));
+}
+export { c6825_10 as useChannelCallStore };

modules/video_calls/native/ChannelCallUtils.tsx

@@ -0,0 +1,127 @@
+// Metro module 16033 (f16034).
+import StreamRTCConnectionStore from "../../../stores/StreamRTCConnectionStore";
+import { AnalyticsPages, InstantInviteSources, RPC_APPLICATION_LOGGING_CATEGORY, UserSettingsSections } from "../../../Constants";
+import { intl, t } from "../../../intl/index.native";
+import Module16034 from "../../../_bundle/Module16034";
+import { openUserSettings } from "../../user_settings/core/native/openUserSettings";
+import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
+import ChannelRTCActionCreators from "../../../actions/ChannelRTCActionCreators";
+import AlertActionCreators from "../../../actions/native/AlertActionCreators";
+import Module16035 from "../../../_bundle/Module16035";
+import { encodeStreamKey } from "../../go_live/utils/StreamKeyUtils";
+import { showInstantInviteActionSheet } from "../../instant_invite/native/InstantInviteUtils";
+import { navigateToNewGroupDM } from "../../main_tabs_v2/helpers/NavigationRouteUtils.native";
+import Module10795 from "../../../_bundle/Module10795";
+import Module7690 from "../../../_bundle/Module7690";
+import { stringify } from "../../debug/LogAggregator";
+import ToastActionCreators from "../../toast/native/ToastActionCreators";
+import { showShareActionSheet } from "../../action_sheet/native/showShareActionSheet";
+export function voiceSettings() {
+  return {
+    label: intl.string(t.NiTd0e),
+    icon: Module16034,
+    onPress: () => {
+      openUserSettings({
+        screen: UserSettingsSections.VOICE
+      });
+      ActionSheetActionCreators.hideActionSheet();
+    }
+  };
+}
+export function videoParticipantsHidden(c22741_0, a1) {
+  return {
+    label: intl.string(t.hoZYAA),
+    switchValue: !a1,
+    onPress: () => {
+      ChannelRTCActionCreators.toggleVoiceParticipantsHidden(c22741_0.id, !a1);
+    }
+  };
+}
+export function openHideSelfStreamAndVideoConfirmDialog(type, onConfirm) {
+  AlertActionCreators.openLazy({
+    importer: () => import("./components/HideSelfStreamAndVideoConfirmDialog").then(({ default: Component }) => (a0) => <Component {...a0} type={type} onConfirm={onConfirm} />)
+  });
+}
+export function selfVideoHidden(a0, c22743_0) {
+  return {
+    label: intl.string(t.MH8ESU),
+    switchValue: !a0,
+    onPress: () => {
+      c22743_0();
+    }
+  };
+}
+export function reportStreamIssue(stream) {
+  return {
+    label: intl.string(t.KHGhHf),
+    icon: Module16035,
+    onPress: () => {
+      const r10 = encodeStreamKey(stream);
+      let r16 = StreamRTCConnectionStore.getVideoStats(r10);
+      if (r16 == null) {
+        r16 = {};
+      }
+      const analyticsData = {
+        media_session_id: StreamRTCConnectionStore.getMediaSessionId(r10),
+        rtc_connection_id: StreamRTCConnectionStore.getRtcConnectionId(r10),
+        stream_region: StreamRTCConnectionStore.getRegion(r10),
+        max_viewers: StreamRTCConnectionStore.getMaxViewers(r10),
+        ...r16
+      };
+      ActionSheetActionCreators.openLazy(import("../../../components_native/calls/stream/StreamReportProblemActionSheet"), `StreamReportProblem${stream.ownerId}`, {
+        stream,
+        analyticsData
+      });
+    }
+  };
+}
+export function invite(a0, a1, a2) {
+  const stream2 = a1;
+  const targetApplicationId = a2;
+  let onPress2 = a1 != null ? () => showInstantInviteActionSheet(a0, {
+    source: InstantInviteSources.STREAM,
+    stream: stream2
+  }) : a2 != null ? () => showInstantInviteActionSheet(a0, {
+    source: InstantInviteSources.ACTIVITY_INVITE,
+    targetApplicationId
+  }) : () => showInstantInviteActionSheet(a0, {
+    source: InstantInviteSources.VOICE_CHANNEL
+  });
+  if (a0.isPrivate()) {
+    onPress2 = () => navigateToNewGroupDM(a0.id, AnalyticsPages.CHANNEL_CALL);
+  }
+  return {
+    label: intl.string(t.VINpSK),
+    icon: Module10795,
+    onPress: onPress2
+  };
+}
+export function rtcDebugPanel(c22746_0) {
+  return {
+    label: intl.string(t.X8bCMe),
+    icon: Module7690,
+    onPress: () => {
+      c22746_0();
+      ActionSheetActionCreators.hideActionSheet();
+    }
+  };
+}
+export function shareActivityLogs() {
+  return {
+    label: intl.string(t.iQzQs3),
+    icon: Module7690,
+    onPress: () => {
+      const message = stringify([RPC_APPLICATION_LOGGING_CATEGORY]);
+      if (message === "") {
+        ToastActionCreators.open({
+          key: "EMBEDDED_ACTIVITIES_SHARE_EMPTY_LOGS_ERROR_MESSAGE",
+          content: intl.string(t["i+9VWy"])
+        });
+      } else {
+        showShareActionSheet({
+          message
+        }, "Activity Logs");
+      }
+    }
+  };
+}

modules/video_calls/native/SurfaceDirectRendererExperiment.tsx

@@ -0,0 +1,27 @@
+// Metro module 10555 (f10556).
+import AuthenticationStore from "../../../stores/AuthenticationStore";
+import { createApexExperiment } from "../../experiments/apex/index";
+import { useStateFromStores } from "../../../_bundle/Module589";
+const apexExperiment = createApexExperiment({
+  kind: "user",
+  name: "2026-03-surface-direct-renderer",
+  defaultConfig: {
+    enableSurfaceDirectRenderer: false
+  },
+  variations: {
+    1: {
+      enableSurfaceDirectRenderer: true
+    }
+  }
+});
+export const ANDROID_SURFACE_DIRECT_RENDERER_EXPERIMENT = "2026-03-surface-direct-renderer";
+export function isSurfaceDirectRendererExperimentEnabled() {
+  return apexExperiment.getConfig({
+    location: "RTCConnection_media_engine_connect"
+  }).enableSurfaceDirectRenderer;
+}
+export function useSurfaceDirectRendererExperiment(a0, a1) {
+  const enableSurfaceDirectRenderer = apexExperiment.useConfig(a1).enableSurfaceDirectRenderer;
+  const stateFromStores = useStateFromStores([AuthenticationStore], () => a0 === AuthenticationStore.getId(), [a0]);
+  return a0 != null && !stateFromStores && enableSurfaceDirectRenderer;
+}

modules/video_calls/native/VoiceActionUtils.tsx

@@ -0,0 +1,46 @@
+// Metro module 10797 (f10798).
+import * as _CallsUtils from "../../voice_calls/native/CallsUtils";
+import { handleToggleSelfMute, showSuppressedAlert, showServerMuteAlert, showServerDeafenAlert } from "../../voice_calls/native/CallsUtils";
+let c7257_3;
+const NOOP = function NOOP() {};
+c7257_3 = {
+  SERVER_MUTE: 0,
+  0: "SERVER_MUTE",
+  SUPPRESS: 1,
+  1: "SUPPRESS",
+  SELF_MUTE: 2,
+  2: "SELF_MUTE",
+  NONE: 3,
+  3: "NONE"
+};
+export { c7257_3 as DominantMuteState };
+export function createMuteHandler(a0, r4 = false) {
+  let NONE = c7257_3.NONE;
+  if (a0.selfMute) {
+    NONE = c7257_3.SELF_MUTE;
+  }
+  let onPress = r4 ? NOOP : handleToggleSelfMute;
+  if (a0.suppress) {
+    onPress = showSuppressedAlert;
+    NONE = c7257_3.SUPPRESS;
+  }
+  if (a0.mute) {
+    onPress = showServerMuteAlert;
+    NONE = c7257_3.SERVER_MUTE;
+  }
+  return {
+    mute: a0.selfMute || a0.mute || a0.suppress,
+    onPress,
+    dominantMuteState: NONE
+  };
+}
+export function createDeafHandler(a0) {
+  let handleToggleSelfDeaf = _CallsUtils.handleToggleSelfDeaf;
+  if (a0.deaf) {
+    handleToggleSelfDeaf = showServerDeafenAlert;
+  }
+  return {
+    deaf: a0.selfDeaf || a0.deaf,
+    onPress: handleToggleSelfDeaf
+  };
+}

modules/video_calls/native/VoiceCallOverlayUtils.tsx

@@ -0,0 +1,64 @@
+// Metro module 10535 (f10536).
+import { MIN_MARGIN_BETWEEN_OVERLAYS, VoiceCallOverlayType } from "./ChannelCallConstants";
+import Dispatcher from "../../../Dispatcher";
+let doRectanglesIntersectWorklet;
+const doRectanglesIntersectWorklet2 = function doRectanglesIntersectWorklet(a0, a1, a2) {
+  if (a0 != null && a0.x != null && a0.y != null && a0.width != null && a0.height != null && a1 != null && a1.x != null && a1.y != null && a1.width != null && a1.height != null) {
+    const r7 = a0.x - a2;
+    const r9 = a0.x + a0.width + a2;
+    const r22 = a0.y - a2;
+    const r26 = a0.y + a0.height + a2;
+    const r8 = a1.x;
+    const r29 = a1.x + a1.width;
+    const r30 = a1.y;
+    const r32 = a1.y + a1.height;
+    return !(r9 < r8 || r7 > r29 || r26 < r30 || r22 > r32);
+  }
+  return false;
+};
+doRectanglesIntersectWorklet2.__closure = {};
+doRectanglesIntersectWorklet2.__workletHash = 697248006216;
+doRectanglesIntersectWorklet2.__initData = {
+  code: "function doRectanglesIntersectWorklet_VoiceCallOverlayUtilsTsx1(rectA,rectB,minMarginBetweenOverlays){if(rectA==null||rectA.x==null||rectA.y==null||rectA.width==null||rectA.height==null||rectB==null||rectB.x==null||rectB.y==null||rectB.width==null||rectB.height==null){return false;}const minAx=rectA.x-minMarginBetweenOverlays;const maxAx=rectA.x+rectA.width+minMarginBetweenOverlays;const minAy=rectA.y-minMarginBetweenOverlays;const maxAy=rectA.y+rectA.height+minMarginBetweenOverlays;const minBx=rectB.x;const maxBx=rectB.x+rectB.width;const minBy=rectB.y;const maxBy=rectB.y+rectB.height;const aLeftOfB=maxAx<minBx;const aRightOfB=minAx>maxBx;const aBelowB=minAy>maxBy;const aAboveB=maxAy<minBy;return!(aLeftOfB||aRightOfB||aAboveB||aBelowB);}"
+};
+doRectanglesIntersectWorklet = doRectanglesIntersectWorklet2;
+export function doesTargetPositionIntersectOtherOverlaysWorklet(a0, a1, a2) {
+  if (VoiceCallOverlayType.VOICE_CONTROLS_TOGGLE_BUTTON === a1) {
+    if (!a0[VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE].isVisible) {
+      return false;
+    }
+    if (doRectanglesIntersectWorklet(a2, a0[VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE], MIN_MARGIN_BETWEEN_OVERLAYS)) {
+      return true;
+    }
+  } else if (VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE === a1) {
+    if (!a0[VoiceCallOverlayType.VOICE_CONTROLS_TOGGLE_BUTTON].isVisible) {
+      return false;
+    }
+    if (doRectanglesIntersectWorklet(a2, a0[VoiceCallOverlayType.VOICE_CONTROLS_TOGGLE_BUTTON], MIN_MARGIN_BETWEEN_OVERLAYS)) {
+      return true;
+    }
+  }
+  return false;
+}
+doesTargetPositionIntersectOtherOverlaysWorklet.__closure = {
+  VoiceCallOverlayType,
+  doRectanglesIntersectWorklet,
+  MIN_MARGIN_BETWEEN_OVERLAYS
+};
+doesTargetPositionIntersectOtherOverlaysWorklet.__workletHash = 4190950618494;
+doesTargetPositionIntersectOtherOverlaysWorklet.__initData = {
+  code: "function doesTargetPositionIntersectOtherOverlaysWorklet_VoiceCallOverlayUtilsTsx2(voiceCallOverlayLayoutStates,voiceCallOverlayType,targetRectangle){const{VoiceCallOverlayType,doRectanglesIntersectWorklet,MIN_MARGIN_BETWEEN_OVERLAYS}=this.__closure;switch(voiceCallOverlayType){case VoiceCallOverlayType.VOICE_CONTROLS_TOGGLE_BUTTON:{if(!voiceCallOverlayLayoutStates[VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE].isVisible){return false;}const doRectanglesIntersect=doRectanglesIntersectWorklet(targetRectangle,voiceCallOverlayLayoutStates[VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE],MIN_MARGIN_BETWEEN_OVERLAYS);if(doRectanglesIntersect){return true;}break;}case VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE:{if(!voiceCallOverlayLayoutStates[VoiceCallOverlayType.VOICE_CONTROLS_TOGGLE_BUTTON].isVisible){return false;}const doRectanglesIntersect=doRectanglesIntersectWorklet(targetRectangle,voiceCallOverlayLayoutStates[VoiceCallOverlayType.VOICE_CONTROLS_TOGGLE_BUTTON],MIN_MARGIN_BETWEEN_OVERLAYS);if(doRectanglesIntersect){return true;}break;}}return false;}"
+};
+export function updateVoiceCallOverlayLayoutState(a0, a1) {
+  Dispatcher.dispatch({
+    type: "VOICE_CALL_OVERLAY_LAYOUT_STATE_UPDATE",
+    voiceCallOverlayType: a0,
+    voiceCallOverlayLayoutState: a1
+  });
+}
+export function setPipEnabledWhileFocusedOnActivityOrStream(a0) {
+  Dispatcher.dispatch({
+    type: "VOICE_CALL_SET_PIP_ENABLED_FOR_ACTIVITY_OR_STREAM",
+    pipEnabledWhileFocusedOnActivityOrStream: a0
+  });
+}

modules/video_calls/native/components/ActivityTile.tsx

@@ -0,0 +1,189 @@
+// Metro module 10601 (f10602).
+import { View } from "react-native";
+import EmbeddedActivitiesStore from "../../../activities/EmbeddedActivitiesStore";
+import UserStore from "../../../../stores/UserStore";
+import { ThemeTypes, Fonts } from "../../../../Constants";
+import { getThemedRippleConfig } from "../../../../design/void/Form/native/FormConstants";
+import { ActivityLayoutMode } from "../../../activities/Constants";
+import { SummarizedIconRow, OverflowText, CutoutableAvatarImage, AVATAR_SIZE_MAP, CutoutDirection, LegacyText, AvatarSizes } from "../../../../design/void/native";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import { useStateFromStoresArray, useStateFromStores } from "../../../../_bundle/Module589";
+import { isNotNullish } from "../../../../utils/GlobalUtils";
+import useGetOrFetchApplications from "../../../applications/useGetOrFetchApplications";
+import NicknameUtils from "../../../../utils/NicknameUtils";
+import UserUtils from "../../../../utils/UserUtils";
+import useCurrentEmbeddedApplication from "../../../activities/utils/useCurrentEmbeddedApplication";
+import useAnalyticsLocations from "../../../app_analytics/useAnalyticsLocations";
+import AnalyticsLocation from "../../../app_analytics/AnalyticsLocation";
+import { useAnalyticsContext } from "../../../../hooks/analytics";
+import { intl, t } from "../../../../intl/index.native";
+import { useEmbeddedActivityJoinability, EmbeddedActivityJoinability } from "../../../activities/utils/getEmbeddedActivityJoinability";
+import handleJoinEmbeddedActivity from "../../../activities/handleJoinEmbeddedActivity";
+import { setOrientationLockState } from "../../../activities/native/getDefaultOrientationLockState";
+import handlePressJoinActivity from "../../../activities/handlePressJoinActivity";
+import { PressableOpacity } from "../../../../design/void/Pressables/native/Pressables";
+import EmbeddedActivityView from "../../../activities/native/EmbeddedActivityView";
+import EmbeddedActivityBackgroundImageWithOverlay from "../../../activities/native/EmbeddedActivityBackgroundImageWithOverlay";
+import { Text } from "../../../../design/components/Text/native/Text";
+import { BaseTextButton } from "../../../../design/components/Button/native/BaseTextButton.native";
+import { ThemeContextProvider } from "../../../../_bundle/Module3901";
+let XSMALL, themedRippleConfig, useStyles;
+const ActivityTileInner = function ActivityTileInner(props) {
+  let r197;
+  let c18141_3, stateFromStores, analyticsLocations, analyticsContext, embeddedActivityJoinability, _handleCanJoin2;
+  let participant2;
+  const { participant, style, channel, onSingleTap } = props;
+  c18141_3 = void 0;
+  stateFromStores = void 0;
+  analyticsLocations = void 0;
+  analyticsContext = void 0;
+  embeddedActivityJoinability = void 0;
+  const handleCanJoin2 = function handleCanJoin() {
+    return _handleCanJoin2.apply(this, arguments);
+  };
+  _handleCanJoin2 = function _handleCanJoin() {
+    const r9 = async () => {
+      let c30238_0;
+      L15: {
+        c30238_0 = void 0;
+        if (stateFromStores != null && c18141_3 != null) {
+          await handleJoinEmbeddedActivity({
+            applicationId: stateFromStores.applicationId,
+            activityChannelId: channel.id,
+            locationObject: analyticsContext.location,
+            analyticsLocations
+          });
+          setOrientationLockState(c18141_3);
+          break L15;
+        }
+        return void 0;
+      }
+    };
+    _handleCanJoin2 = r9;
+    return r9.apply(this, arguments);
+  };
+  const styles = useStyles();
+  const [application] = useGetOrFetchApplications([participant.applicationId]);
+  c18141_3 = application;
+  participant2 = participant;
+  const stateFromStoresArray = useStateFromStoresArray([UserStore], () => Array.from(participant2.participants).map((item) => UserStore.getUser(item.userId)).filter(isNotNullish));
+  let username = NicknameUtils.getName(channel.getGuildId(), channel.id, stateFromStoresArray == null ? void 0 : stateFromStoresArray[0]);
+  if (username == null) {
+    username = UserUtils.getName(stateFromStoresArray == null ? void 0 : stateFromStoresArray[0]);
+  }
+  const currentEmbeddedApplication = useCurrentEmbeddedApplication();
+  stateFromStores = useStateFromStores([EmbeddedActivitiesStore], () => EmbeddedActivitiesStore.getEmbeddedActivitiesForChannelIncludingHidden(channel.id).find((item) => item.applicationId === c18141_3?.id));
+  analyticsLocations = useAnalyticsLocations(AnalyticsLocation.ACTIVITY_TILE).analyticsLocations;
+  analyticsContext = useAnalyticsContext();
+  let applicationName = application?.name;
+  if (applicationName == null) {
+    applicationName = intl.string(t.WCNe7F);
+  }
+  const id = UserStore.getCurrentUser()?.id;
+  const r86 = currentEmbeddedApplication != null && currentEmbeddedApplication.id === application?.id || id != null && (stateFromStores == null ? void 0 : stateFromStores.userIds.has(id));
+  embeddedActivityJoinability = useEmbeddedActivityJoinability({
+    userId: UserStore.getCurrentUser()?.id,
+    channelId: channel.id,
+    application
+  });
+  const CAN_JOIN = EmbeddedActivityJoinability.CAN_JOIN;
+  const r25 = stateFromStoresArray.length > 1 ? intl.formatToPlainString(t.cpe6CK, {
+    username,
+    count: stateFromStoresArray.length - 1
+  }) : intl.formatToPlainString(t["7Uuia2"], {
+    username
+  });
+  if (r86) {
+    r197 = <PressableOpacity pointerEvents="box-only" style={styles.activityViewContainer} onPress={onSingleTap} activeOpacity={1}>
+      <EmbeddedActivityView channel={channel} layoutMode={ActivityLayoutMode.PIP} />
+    </PressableOpacity>;
+  } else {
+    const handleTileOrButtonPress = function handleTileOrButtonPress() {
+      handlePressJoinActivity({
+        embeddedActivityJoinability,
+        handleCanJoin: handleCanJoin2
+      });
+      if (onSingleTap != null) {
+        onSingleTap();
+      }
+    };
+    r197 = <PressableOpacity accessibilityRole="button" accessibilityLabel={intl.formatToPlainString(t.Yw5Hr2, {
+      applicationName
+    })} androidRippleConfig={themedRippleConfig} onPress={handleTileOrButtonPress} style={styles.pressableOpacity}>
+      <EmbeddedActivityBackgroundImageWithOverlay application={application} resizeMode="cover" />
+      <View style={[styles.activityPreview, style]}>
+        <SummarizedIconRow offsetAmount={-6} overflowStyle={styles.overflow} overflowComponent={OverflowText} items={stateFromStoresArray} max={4} renderItem={(info, a1) => {
+          let guildId = participant.guildId;
+          if (guildId == null) {
+            guildId = void 0;
+          }
+          return <CutoutableAvatarImage user={info} guildId={guildId} size={XSMALL} cutout={a1 ? void 0 : {
+            radius: AVATAR_SIZE_MAP[XSMALL] / 2 + 3,
+            direction: CutoutDirection.RIGHT,
+            inset: -6
+          }} />;
+        }} />
+        <Text style={styles.subtitleText} lineClamp={2} variant="text-sm/normal">{r25}</Text>
+        <LegacyText style={styles.titleText}>{applicationName}</LegacyText>
+        {embeddedActivityJoinability === CAN_JOIN ? <View style={styles.buttonWrapper}>
+          <BaseTextButton onPress={handleTileOrButtonPress} pillStyle={styles.buttonPill} text={intl.string(t["4i2vj+"])} variant="secondary" />
+        </View> : null}
+      </View>
+    </PressableOpacity>;
+  }
+  return r197;
+};
+XSMALL = AvatarSizes.XSMALL;
+themedRippleConfig = getThemedRippleConfig({
+  foreground: true
+});
+useStyles = createStyles({
+  pressableOpacity: {
+    width: "100%",
+    height: "100%",
+    backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGH,
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  activityPreview: {
+    alignItems: "center",
+    display: "flex",
+    width: "100%",
+    padding: 16
+  },
+  activityViewContainer: {
+    flex: 1,
+    backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGH
+  },
+  titleText: {
+    fontSize: 16,
+    lineHeight: 24,
+    color: Module712.colors.TEXT_DEFAULT,
+    fontFamily: Fonts.DISPLAY_EXTRABOLD,
+    textAlign: "center",
+    marginLeft: 16,
+    marginRight: 16
+  },
+  subtitleText: {
+    textAlign: "center",
+    marginLeft: 16,
+    marginRight: 16
+  },
+  overflow: {
+    height: AVATAR_SIZE_MAP[XSMALL],
+    backgroundColor: Module712.colors.BACKGROUND_MOD_NORMAL
+  },
+  buttonWrapper: {
+    marginTop: 8,
+    alignSelf: "center"
+  },
+  buttonPill: {
+    borderRadius: 100
+  }
+});
+export default function ActivityTile(props) {
+  return <ThemeContextProvider theme={ThemeTypes.DARK}>
+    <ActivityTileInner {...props} />
+  </ThemeContextProvider>;
+};

modules/video_calls/native/components/CallBarAction.tsx

@@ -0,0 +1,161 @@
+// Metro module 10528 (f10529).
+import { cloneElement } from "react";
+import { Image as Image2, View } from "react-native";
+import { resetFocusTimer } from "../ChannelCallStore";
+import { hexWithOpacity } from "../../../../utils/ColorUtils";
+import Module712 from "../../../../_bundle/Module712";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import useBottomVoiceControlsSheetWidth from "../useBottomVoiceControlsSheetWidth";
+import { PressableOpacity } from "../../../../design/void/Pressables/native/Pressables";
+import CircleWithCutoutUtils, { getBadgeTop, getBadgeLeft } from "../../../voice_panel/native/shared/CircleWithCutoutUtils";
+import { Text } from "../../../../design/components/Text/native/Text";
+let circleFillColor, c7070_10, c7070_11, c7070_12, useStyles;
+const ActionButton = function ActionButton(props) {
+  let appearsDisabled = props.appearsDisabled;
+  if (appearsDisabled === void 0) {
+    appearsDisabled = false;
+  }
+  let backgroundColor = props.backgroundColor;
+  const { imageStyle, onPress: onPress2, accessibilityLabel, accessibilityState, source, showBadge = false, isSmallSize = false, children, lottieComponent, lottieComponentColor, IconComponent } = props;
+  const styles = useStyles();
+  const bottomVoiceControlsSheetWidth = useBottomVoiceControlsSheetWidth();
+  const marginHorizontal = isSmallSize ? bottomVoiceControlsSheetWidth < c7070_12 ? 6 : 12 : 12;
+  const r18 = isSmallSize ? c7070_11 : c7070_10;
+  const width = 2 * r18.buttonRadius;
+  const width2 = 2 * r18.badgeRadius;
+  const cutoutRadius = r18.badgeRadius + r18.cutoutInset;
+  const props2 = {
+    accessibilityLabel,
+    accessibilityRole: "button",
+    accessibilityState,
+    onPress: () => {
+      resetFocusTimer();
+      onPress2();
+    },
+    disabled: false,
+    style: {
+      width,
+      height: width,
+      borderRadius: r18.buttonRadius,
+      marginHorizontal
+    },
+    children: null
+  };
+  const style = [styles.buttonContainer, {
+    width,
+    height: width,
+    borderRadius: r18.buttonRadius
+  }, {
+    opacity: appearsDisabled ? 0.25 : 1
+  }];
+  if (backgroundColor == null) {
+    backgroundColor = circleFillColor;
+  }
+  props2.children = <View style={style}>
+    <CircleWithCutoutUtils circleRadius={r18.buttonRadius} cutoutRadius={cutoutRadius} enableCutout={showBadge} cutoutPositionInDegrees={45} circleFillColor={backgroundColor} />
+    <View style={[styles.iconContainer, {
+      width,
+      height: width
+    }]}>
+      {lottieComponent != null ? cloneElement(lottieComponent, {
+        color: lottieComponentColor
+      }) : IconComponent != null ? <IconComponent style={imageStyle} /> : <Image2 source={source} style={imageStyle} />}
+    </View>
+    {showBadge ? <View style={[styles.badge, {
+      width: width2,
+      height: width2,
+      borderRadius: r18.badgeRadius,
+      top: getBadgeTop(r18.badgeRadius, r18.buttonRadius, 45),
+      left: getBadgeLeft(r18.badgeRadius, r18.buttonRadius, 45)
+    }]} /> : null}
+    {children}
+  </View>;
+  return <PressableOpacity {...props2} />;
+};
+circleFillColor = hexWithOpacity(Module712.unsafe_rawColors.WHITE, 0.24);
+c7070_10 = Object.freeze({
+  buttonRadius: 28,
+  badgeRadius: 6,
+  cutoutInset: 3
+});
+c7070_11 = Object.freeze({
+  buttonRadius: 24,
+  badgeRadius: 4,
+  cutoutInset: 2
+});
+c7070_12 = 24 + 2 * c7070_11.buttonRadius * 5 + 96;
+useStyles = createStyles({
+  buttonContainer: {
+    position: "absolute"
+  },
+  iconContainer: {
+    position: "absolute",
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  badge: {
+    backgroundColor: "white",
+    position: "absolute"
+  },
+  notificationArea: {
+    position: "absolute",
+    top: -4,
+    right: -4,
+    height: 24,
+    minWidth: 24,
+    paddingHorizontal: 4,
+    borderRadius: 12,
+    borderWidth: 4,
+    borderColor: Module712.unsafe_rawColors.PRIMARY_760,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  notificationText: {
+    lineHeight: 16
+  },
+  notificationAreaMentioned: {
+    backgroundColor: Module712.colors.CONTROL_CRITICAL_PRIMARY_BACKGROUND_DEFAULT
+  },
+  notificationAreaUnread: {
+    backgroundColor: Module712.unsafe_rawColors.PRIMARY_600
+  }
+});
+export { c7070_11 as SMALL_ACTION_BUTTON_DIMENSIONS };
+export { ActionButton };
+export function ToggledActionButton(props) {
+  const { isActive, disableTint = false, showBadge = false, isSmallSize = false, backgroundColor: _backgroundColor, tintColor: _tintColor, ...props2 } = props;
+  let backgroundColor = props.backgroundColor;
+  let tintColor = props.tintColor;
+  const r2 = isActive ? Module712.unsafe_rawColors.WHITE : null;
+  const r25 = isActive ? Module712.unsafe_rawColors.PRIMARY_900 : Module712.unsafe_rawColors.WHITE;
+  const r26 = disableTint ? void 0 : r25;
+  if (backgroundColor == null) {
+    backgroundColor = r2;
+  }
+  const tintColor2 = tintColor == null ? r26 : tintColor;
+  if (tintColor == null) {
+    tintColor = r26;
+  }
+  return <ActionButton backgroundColor={backgroundColor} imageStyle={{
+    tintColor: tintColor2
+  }} accessibilityState={{
+    selected: isActive
+  }} isSmallSize={isSmallSize} {...props2} showBadge={showBadge} lottieComponentColor={tintColor} />;
+}
+export function PrimaryActionButton(props) {
+  const { isSmallSize = false, ...rest } = props;
+  return <ActionButton backgroundColor={Module712.unsafe_rawColors.RED_400} imageStyle={{
+    tintColor: Module712.unsafe_rawColors.WHITE
+  }} isSmallSize={isSmallSize} {...rest} />;
+}
+export function NotifiedActionButton(props) {
+  const { notifications, isMentioned, ...props2 } = props;
+  const styles = useStyles();
+  return <View>
+    <ActionButton {...props2}>
+      <View style={[styles.notificationArea, isMentioned !== true && isMentioned !== void 0 ? styles.notificationAreaUnread : styles.notificationAreaMentioned]}>
+        <Text style={styles.notificationText} variant="text-xs/semibold" color="text-overlay-light">{notifications}</Text>
+      </View>
+    </ActionButton>
+  </View>;
+}

modules/video_calls/native/components/CallTile.tsx

@@ -0,0 +1,188 @@
+// Metro module 10848 (f10849).
+import * as Module19 from "react";
+import { useContext, useCallback, useMemo } from "react";
+import { StyleSheet, View } from "react-native";
+import ApplicationStreamingStore from "../../../../stores/ApplicationStreamingStore";
+import UserStore from "../../../../stores/UserStore";
+import { resetFocus, toggleFocus } from "../ChannelCallStore";
+import { ParticipantTypes, VoicePlatforms, isStreamParticipant } from "../../../calls/CallConstants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import { hexOpacityToRgba } from "../../../../utils/ColorUtils";
+import Module712 from "../../../../_bundle/Module712";
+import useAnalyticsLocations from "../../../app_analytics/useAnalyticsLocations";
+import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
+import { useStateFromStoresObject, useStateFromStores } from "../../../../_bundle/Module589";
+import ChannelRTCActionCreators from "../../../../actions/ChannelRTCActionCreators";
+import showUserProfileActionSheet from "../../../user_profile/native/showUserProfileActionSheet";
+import StreamTile from "./StreamTile";
+import ScreenshareParticipant from "./ScreenshareParticipant";
+import UserTile from "./UserTile";
+import ActivityTile from "./ActivityTile";
+import TouchableStreamPreview from "../../../../components_native/TouchableStreamPreview";
+import Module10854 from "../../../../_bundle/Module10854";
+import Module10855 from "../../../../_bundle/Module10855";
+import Module9033 from "../../../../_bundle/Module9033";
+import Module9054 from "../../../../_bundle/Module9054";
+import Module10856 from "../../../../_bundle/Module10856";
+import * as _native from "../../../../design/void/native";
+import { Icon, LiveTag } from "../../../../design/void/native";
+import { RevealContext } from "./RevealProvider";
+import ReanimatedRexport, { useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import * as _timing from "../../../../design/animation/reanimated/timing/timing";
+import ParticipantTitle from "./ParticipantTitle";
+let useStyles, ParticipantIcon, __initData, TileOverlay;
+const StreamPreviewTile = function StreamPreviewTile(props) {
+  const { participant: participant2, style } = props;
+  return <View style={[useStyles().streamPreview, style]}>
+    <TouchableStreamPreview guildId={participant2.stream.guildId} userId={participant2.user.id} style={{
+      aspectRatio: void 0,
+      borderRadius: 0
+    }} disableTransition onPress={() => resetFocus()} />
+  </View>;
+};
+ParticipantIcon = function ParticipantIcon(props) {
+  let source;
+  const participant2 = props.participant;
+  const styles = useStyles();
+  if (participant2.type === ParticipantTypes.STREAM) {
+    source = Module10854;
+  } else {
+    const type = participant2.type;
+    const USER = ParticipantTypes.USER;
+    source = void 0;
+    if (type === USER) {
+      const voicePlatform = participant2.voicePlatform;
+      source = VoicePlatforms.MOBILE === voicePlatform ? Module10855 : VoicePlatforms.XBOX === voicePlatform ? Module9033 : VoicePlatforms.PLAYSTATION === voicePlatform ? Module9054 : VoicePlatforms.QUEST === voicePlatform ? Module10856 : void 0;
+    }
+  }
+  return source != null ? <Icon source={source} size={Icon.Sizes.REFRESH_SMALL_16} color={Module712.unsafe_rawColors.WHITE} style={styles.titleIcon} /> : null;
+};
+TileOverlay = function TileOverlay(props) {
+  const participant2 = props.participant;
+  let isActiveStream = props.isActiveStream;
+  const { channel: channel2, hasLeftSafeArea, hasRightSafeArea: hasRightSafeArea2, hasBottomSafeArea: hasBottomSafeArea2, hasTopSafeArea } = props;
+  const styles = useStyles();
+  const safeAreaInsets_native = useSafeAreaInsets_native();
+  const { bottom: bottom2, left, top, right: right2 } = safeAreaInsets_native;
+  const reveal = useContext(RevealContext).reveal;
+  const T = function T() {
+    return {
+      opacity: _timing.withTiming(reveal ? 1 : 0, {
+        easing: _native.STANDARD_EASING,
+        duration: 250
+      })
+    };
+  };
+  T.__closure = {
+    withTiming: _timing.withTiming,
+    reveal,
+    STANDARD_EASING: _native.STANDARD_EASING
+  };
+  T.__workletHash = 15640123774063;
+  T.__initData = __initData;
+  const animatedStyle = useAnimatedStyle(T);
+  const r45 = {
+    bottom: hasBottomSafeArea2 ? bottom2 : 0,
+    right: hasRightSafeArea2 ? right2 : 0,
+    left: hasLeftSafeArea ? left : 0,
+    top: hasTopSafeArea ? top : 0
+  };
+  if (isActiveStream) {
+    isActiveStream = <View style={styles.liveContainer}>
+      <LiveTag />
+    </View>;
+  }
+  return <ReanimatedRexport.View pointerEvents="none" style={[StyleSheet.absoluteFill, r45, animatedStyle]}>
+    {isActiveStream}
+    <View style={styles.usernamePosition}>
+      <View style={styles.usernameContainer}>
+        <ParticipantIcon participant={participant2} />
+        <ParticipantTitle channel={channel2} participant={participant2} />
+      </View>
+    </View>
+  </ReanimatedRexport.View>;
+};
+useStyles = createStyles({
+  liveContainer: {
+    position: "absolute",
+    top: 8,
+    right: 8
+  },
+  titleIcon: {
+    marginRight: 6
+  },
+  usernameContainer: {
+    flexDirection: "row",
+    alignItems: "center",
+    alignSelf: "flex-start",
+    backgroundColor: hexOpacityToRgba(Module712.unsafe_rawColors.PRIMARY_700, 0.5),
+    borderRadius: Module712.radii.sm,
+    paddingHorizontal: 8,
+    paddingVertical: 4
+  },
+  usernamePosition: {
+    overflow: "hidden",
+    position: "absolute",
+    bottom: 8,
+    left: 8,
+    right: 40,
+    borderRadius: Module712.radii.sm
+  },
+  streamPreview: {
+    flex: 1,
+    width: "100%",
+    backgroundColor: Module712.unsafe_rawColors.PRIMARY_600
+  },
+  screenshareContainer: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    overflow: "hidden",
+    width: "100%",
+    backgroundColor: Module712.colors.BLACK
+  },
+  stageStreamContainer: {
+    backgroundColor: Module712.colors.BLACK
+  }
+});
+const r83 = Module19.memo(function({ participant, avatarSize, channel, hasTopSafeArea, hasLeftSafeArea, hasRightSafeArea, hasBottomSafeArea, shrinkStreamEmptyState, contentStyle, hasNotch = false, resizeMode }) {
+  const styles = useStyles();
+  const analyticsLocations = useAnalyticsLocations().analyticsLocations;
+  const safeAreaInsets_native = useSafeAreaInsets_native();
+  const { bottom, right } = safeAreaInsets_native;
+  const stateFromStoresObject = useStateFromStoresObject([ApplicationStreamingStore], () => ({
+    stream: isStreamParticipant(participant) ? ApplicationStreamingStore.getStreamForUser(participant.user.id, participant.stream.guildId) : null,
+    activeStream: isStreamParticipant(participant) ? ApplicationStreamingStore.getActiveStreamForUser(participant.user.id, participant.stream.guildId) : null
+  }));
+  const { stream, activeStream } = stateFromStoresObject;
+  const callback = useCallback(() => {
+    resetFocus();
+    ChannelRTCActionCreators.selectParticipant(channel.id, participant.id);
+  }, [channel.id, participant.id]);
+  const callback2 = useCallback((a0) => {
+    showUserProfileActionSheet({
+      userId: a0.user.id,
+      channelId: channel.id,
+      isVoiceContext: true,
+      sourceAnalyticsLocations: analyticsLocations
+    });
+  }, [channel.id, analyticsLocations]);
+  const memo = useMemo(() => ({
+    bottom: hasBottomSafeArea ? 8 + bottom : 8,
+    right: hasRightSafeArea ? 8 + right : 8
+  }), [hasBottomSafeArea, hasRightSafeArea, bottom, right]);
+  const stateFromStores = useStateFromStores([UserStore], () => UserStore.getCurrentUser());
+  const type = participant.type;
+  return <>
+    {ParticipantTypes.HIDDEN_STREAM === type ? <StreamPreviewTile participant={participant} style={contentStyle} /> : ParticipantTypes.STREAM === type ? activeStream != null ? activeStream.ownerId !== stateFromStores?.id ? <StreamTile participant={participant} onSingleTap={toggleFocus} onDoubleTap={callback} removeEmptyStateImage={shrinkStreamEmptyState} onFullScreen={callback} fullscreenIconStyle={memo} style={contentStyle} /> : <View style={styles.screenshareContainer}>
+      <ScreenshareParticipant participant={participant} onSingleTap={toggleFocus} onDoubleTap={callback} containerStyle={channel.isGuildStageVoice() ? styles.stageStreamContainer : void 0} />
+    </View> : stream != null ? <StreamPreviewTile participant={participant} style={contentStyle} /> : null : ParticipantTypes.USER === type ? <UserTile participant={participant} avatarSize={avatarSize} onSingleTap={toggleFocus} onDoubleTap={callback} onLongPress={callback2} statusStyle={memo} hasNotch={hasNotch} resizeMode={resizeMode} style={contentStyle} /> : ParticipantTypes.ACTIVITY === type ? <ActivityTile participant={participant} style={contentStyle} channel={channel} onSingleTap={toggleFocus} /> : null}
+    {participant.type !== ParticipantTypes.ACTIVITY ? <TileOverlay participant={participant} isActiveStream={activeStream != null} channel={channel} hasTopSafeArea={hasTopSafeArea} hasLeftSafeArea={hasLeftSafeArea} hasRightSafeArea={hasRightSafeArea} hasBottomSafeArea={hasBottomSafeArea} /> : null}
+  </>;
+});
+__initData = {
+  code: "function CallTileTsx1(){const{withTiming,reveal,STANDARD_EASING}=this.__closure;return{opacity:withTiming(reveal?1:0,{easing:STANDARD_EASING,duration:250})};}"
+};
+export default r83;
+export { StreamPreviewTile };
+export { TileOverlay };

modules/video_calls/native/components/CameraPreview.tsx

@@ -0,0 +1,333 @@
+// Metro module 10517 (f10518).
+import { useContext, useEffect, useState, useRef, useMemo } from "react";
+import { StyleSheet, View } from "react-native";
+import EmbeddedActivitiesStore from "../../../activities/EmbeddedActivitiesStore";
+import ChannelRTCStore from "../../../calls/ChannelRTCStore";
+import { useBestActiveChatInputContainerHeight } from "../../../chat_input/native/useChatBottomManagerUIStore";
+import ApplicationStreamingStore from "../../../../stores/ApplicationStreamingStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import ChannelCallLifecycleStore from "../ChannelCallLifecycleStore";
+import { useChannelCallStore } from "../ChannelCallStore";
+import { VOICE_CALL_OVERLAY_HORIZONTAL_MARGIN, VOICE_CALL_OVERLAY_VERTICAL_MARGIN, VoiceCallOverlayType, VoiceChatDrawerState } from "../ChannelCallConstants";
+import { ApplicationStreamStates } from "../../../../Constants";
+import { ParticipantTypes, isStreamParticipant } from "../../../calls/CallConstants";
+import { Gesture, GestureDetector } from "../../../../_bundle/Module5273";
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import ReanimatedRexport, { useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import { STANDARD_EASING } from "../../../../design/void/native";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import usePipPosition from "./usePipPosition";
+import { RevealContext } from "./RevealProvider";
+import useActionBarHeight from "../useActionBarHeight";
+import useIsActivityFocused from "../../../activities/useIsActivityFocused";
+import { useIsScreenLandscape } from "../../../screen/useIsScreenLandscape.native";
+import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
+import { useIsViewingActivity } from "../../../activities/native/useIsViewingActivity";
+import { OrientationType } from "../../../device/native/DeviceOrientation";
+import usePrevious from "../../../../hooks/usePrevious";
+import PictureInPicture, { DEFAULT_PIP_POSITION } from "./PictureInPicture";
+import { NAV_BAR_HEIGHT } from "../../../../design/components/Navigator/native/NavigatorConstants.native";
+import * as _timing from "../../../../design/animation/reanimated/timing/timing";
+import { setPipEnabledWhileFocusedOnActivityOrStream } from "../VoiceCallOverlayUtils";
+import { intl, t } from "../../../../intl/index.native";
+import { openIgnoreThermalStateAlert } from "../../../activities/native/openIgnoreThermalStateAlert";
+import PopoutMenu from "./PopoutMenu";
+import PictureInPictureVideo from "./PictureInPictureVideo";
+import usePipVideoOrStream from "../usePipVideoOrStream";
+import useSelectedParticipant from "../../useSelectedParticipant";
+import { getEmbeddedActivityParticipantId } from "../../../calls/ChannelRTCParticipants";
+import { useIsStreamFocused } from "../../useIsStreamFocused";
+import useTrackActivityVideoPip from "../useTrackActivityVideoPip";
+let __initData, TIMING_CONFIG, c7059_26, __initData2;
+const CameraPreview = function CameraPreview(props) {
+  let c18098_2, reveal, c18098_4, bestActiveChatInputContainerHeight, c18098_6, bottom, top, LANDSCAPE, screenOrientation, state, setState, state2, setState2, setState3;
+  const { channel: channel3, nonSelfPipParticipant, selfParticipant, participantScreenIsFocused } = props;
+  c18098_2 = void 0;
+  reveal = void 0;
+  c18098_4 = void 0;
+  bestActiveChatInputContainerHeight = void 0;
+  c18098_6 = void 0;
+  bottom = void 0;
+  top = void 0;
+  LANDSCAPE = void 0;
+  screenOrientation = void 0;
+  state = void 0;
+  setState = void 0;
+  state2 = void 0;
+  setState2 = void 0;
+  setState3 = void 0;
+  const stateFromStores = useStateFromStores([ChannelCallLifecycleStore], () => ChannelCallLifecycleStore.isReactingToThermalState());
+  const [preferredPosition, onMove] = usePipPosition();
+  c18098_2 = onMove;
+  reveal = useContext(RevealContext).reveal;
+  const actionBarHeight = useActionBarHeight();
+  c18098_4 = actionBarHeight;
+  bestActiveChatInputContainerHeight = useBestActiveChatInputContainerHeight();
+  const isActivityFocused = useIsActivityFocused(channel3.id);
+  c18098_6 = isActivityFocused;
+  const isScreenLandscape = useIsScreenLandscape();
+  const safeAreaInsets_native = useSafeAreaInsets_native();
+  bottom = safeAreaInsets_native.bottom;
+  top = safeAreaInsets_native.top;
+  const { left, right } = safeAreaInsets_native;
+  let r61 = useIsViewingActivity({
+    channelId: channel3.id
+  });
+  const r70 = useStateFromStores([ChannelCallLifecycleStore], () => ChannelCallLifecycleStore.getVoiceCallOverlayLayoutStates())[VoiceCallOverlayType.CAMERA_PREVIEW_PICTURE_IN_PICTURE];
+  LANDSCAPE = isScreenLandscape ? OrientationType.LANDSCAPE : OrientationType.PORTRAIT;
+  let r79 = usePrevious(LANDSCAPE);
+  if (r79 == null) {
+    r79 = r70?.screenOrientation;
+  }
+  screenOrientation = r79;
+  useEffect(() => {
+    if (screenOrientation != null && screenOrientation !== LANDSCAPE && c18098_6) {
+      c18098_2(DEFAULT_PIP_POSITION);
+    }
+  }, [LANDSCAPE, screenOrientation, isActivityFocused, onMove]);
+  [state, setState] = useState(top + VOICE_CALL_OVERLAY_VERTICAL_MARGIN);
+  [state2, setState2] = useState(bottom + VOICE_CALL_OVERLAY_VERTICAL_MARGIN);
+  useEffect(() => {
+    let r4, r14;
+    let r3 = top + VOICE_CALL_OVERLAY_VERTICAL_MARGIN;
+    let r5 = bottom + VOICE_CALL_OVERLAY_VERTICAL_MARGIN;
+    if (participantScreenIsFocused) {
+      if (reveal) {
+        r3 = NAV_BAR_HEIGHT + top + VOICE_CALL_OVERLAY_VERTICAL_MARGIN;
+      }
+      if (reveal) {
+        r5 = c18098_4 + bottom + VOICE_CALL_OVERLAY_VERTICAL_MARGIN;
+      }
+      r14 = r5;
+      r4 = r3;
+    } else {
+      r14 = bestActiveChatInputContainerHeight + bottom + VOICE_CALL_OVERLAY_VERTICAL_MARGIN;
+      r4 = r3;
+    }
+    setState(r4);
+    setState2(r14);
+  }, [reveal, bestActiveChatInputContainerHeight, participantScreenIsFocused, actionBarHeight, top, bottom]);
+  const ee = function ee() {
+    return {
+      marginTop: _timing.withTiming(state, TIMING_CONFIG),
+      marginBottom: _timing.withTiming(state2, TIMING_CONFIG)
+    };
+  };
+  ee.__closure = {
+    withTiming: _timing.withTiming,
+    marginTopState: state,
+    TIMING_CONFIG,
+    marginBottomState: state2
+  };
+  ee.__workletHash = 17411027531876;
+  ee.__initData = __initData2;
+  const animatedStyle = useAnimatedStyle(ee);
+  const ref2 = useRef(null);
+  let state3;
+  [state3, setState3] = useState(null);
+  const rows = c7059_26.HIDE_PIP === state3 ? [{
+    text: intl.string(t.L3I0Jr),
+    onClick: function handleHidePip() {
+      setPipEnabledWhileFocusedOnActivityOrStream(false);
+    }
+  }] : c7059_26.HANDLE_THERMAL_EVENT === state3 ? [{
+    text: intl.string(t["1fRDnT"]),
+    onClick: openIgnoreThermalStateAlert
+  }] : [];
+  const ref = ref2;
+  const memo = useMemo(() => {
+    const close2 = ref.current?.close;
+    const close = close2;
+    const r17 = Gesture.Tap();
+    const n = function n() {
+      if (close != null) {
+        _ReanimatedRexport.runOnJS(close)();
+      }
+    };
+    n.__closure = {
+      closeFunc: close,
+      runOnJS: _ReanimatedRexport.runOnJS
+    };
+    n.__workletHash = 9707001557651;
+    n.__initData = __initData;
+    return r17.onTouchesUp(n);
+  }, [ref]);
+  const r169 = [state3 == null ? null : <GestureDetector gesture={memo}>
+    <View style={StyleSheet.absoluteFill} />
+  </GestureDetector>, ,];
+  if (r61) {
+    r61 = stateFromStores;
+  }
+  r169[1] = <View style={StyleSheet.absoluteFill} pointerEvents="box-none">
+    <ReanimatedRexport.View key={isScreenLandscape ? "landscape" : "portrait"} style={[{
+      flex: 1,
+      marginLeft: left + VOICE_CALL_OVERLAY_HORIZONTAL_MARGIN,
+      marginRight: right + VOICE_CALL_OVERLAY_HORIZONTAL_MARGIN
+    }, animatedStyle]} pointerEvents="box-none">
+      <PictureInPicture channel={channel3} preferredPosition={preferredPosition} onMove={onMove} isInCallScreen marginTop={state} marginBottom={state2}>
+        <PopoutMenu ref={ref} disabled={!r61} trigger={<PictureInPictureVideo channel={channel3} selfParticipant={selfParticipant} pipParticipant={nonSelfPipParticipant} />} rows={rows} onOpen={() => {
+          setState3(stateFromStores ? c7059_26.HANDLE_THERMAL_EVENT : c7059_26.HIDE_PIP);
+        }} onClose={() => {
+          setState3(null);
+        }} />
+      </PictureInPicture>
+    </ReanimatedRexport.View>
+  </View>;
+  return <>{r169}</>;
+};
+__initData = {
+  code: "function CameraPreviewTsx1(){const{closeFunc,runOnJS}=this.__closure;if(closeFunc!=null){runOnJS(closeFunc)();}}"
+};
+TIMING_CONFIG = {
+  duration: 250,
+  easing: STANDARD_EASING
+};
+c7059_26 = {
+  HIDE_PIP: "HIDE_PIP",
+  HANDLE_THERMAL_EVENT: "HANDLE_THERMAL_EVENT"
+};
+__initData2 = {
+  code: "function CameraPreviewTsx2(){const{withTiming,marginTopState,TIMING_CONFIG,marginBottomState}=this.__closure;return{marginTop:withTiming(marginTopState,TIMING_CONFIG),marginBottom:withTiming(marginBottomState,TIMING_CONFIG)};}"
+};
+export default function CameraPreviewContainer(props) {
+  let r81, r101, isStreamFocused, isViewingActivity, stateFromStores4, stateFromStores5;
+  let c18100_3, id;
+  const { channel, participantScreenIsFocused: participantScreenIsFocused2 = true } = props;
+  let c18100_1 = participantScreenIsFocused2;
+  let isChannelCallModalOpen = props.isChannelCallModalOpen;
+  if (isChannelCallModalOpen === void 0) {
+    isChannelCallModalOpen = false;
+  }
+  c18100_3 = void 0;
+  id = void 0;
+  const selectedParticipant = useSelectedParticipant(channel);
+  let c18100_2 = selectedParticipant;
+  const stateFromStores2 = useStateFromStores([ChannelRTCStore, AuthenticationStore, ApplicationStreamingStore], () => {
+    const id2 = AuthenticationStore.getId();
+    const currentUserActiveStream = ApplicationStreamingStore.getCurrentUserActiveStream();
+    let c26703_1 = currentUserActiveStream != null && currentUserActiveStream.state === ApplicationStreamStates.ACTIVE;
+    const r22 = ChannelRTCStore.getStreamParticipants(channel.id).find((item) => item.user.id === id2 && c26703_1);
+    return c18100_2 != null && r22 != null && c18100_2.id === r22.id ? c18100_1 ? null : r22 : r22;
+  });
+  const channelCallStore = useChannelCallStore(({ voiceChatDrawerState }) => voiceChatDrawerState === VoiceChatDrawerState.OPEN || voiceChatDrawerState === VoiceChatDrawerState.OPENING);
+  const stateFromStores3 = useStateFromStores([ChannelRTCStore, EmbeddedActivitiesStore], () => {
+    const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
+    return currentEmbeddedActivity != null ? ChannelRTCStore.getParticipants(channel.id).find((item) => item.id === getEmbeddedActivityParticipantId({
+      applicationId: currentEmbeddedActivity.applicationId,
+      instanceId: currentEmbeddedActivity.compositeInstanceId
+    })) : null;
+  });
+  const r1 = stateFromStores3 != null && selectedParticipant?.id === stateFromStores3?.id && !channelCallStore;
+  c18100_3 = r1;
+  let nonSelfPipParticipant = r1 ? null : stateFromStores3;
+  let channel2;
+  L22: {
+    isStreamFocused = useIsStreamFocused(channel.id);
+    isViewingActivity = useIsViewingActivity({
+      channelId: channel.id
+    });
+    stateFromStores4 = useStateFromStores([ChannelRTCStore, AuthenticationStore], () => {
+      let r36;
+      const id4 = AuthenticationStore.getId();
+      const participant = ChannelRTCStore.getParticipant(channel.id, id4);
+      if (participant?.streamId == null && !c18100_3) {
+        return null;
+      }
+      if (c18100_1) {
+        const r20 = c18100_2 != null && c18100_2?.id !== id4;
+        L20: {
+          L19: {
+            if (c18100_2 == null && !channel.isGuildStageVoice()) {
+              const id5 = channel.id;
+              const id3 = id4;
+              const participants = ChannelRTCStore.getParticipants(id5);
+              const r28 = participants.length <= 4 ? participants.filter((participant) => !(isStreamParticipant(participant) && participant.user.id === id3)) : participants;
+              if (r28.length > 1 && r28.length <= 3) {
+                break L19;
+              }
+            }
+            r36 = null;
+            if (!r20) {
+              break L20;
+            }
+          }
+          r36 = participant;
+        }
+        return r36;
+      }
+      return participant;
+    });
+    stateFromStores5 = useStateFromStores([AuthenticationStore, ChannelRTCStore], () => {
+      let r16;
+      const isStreamParticipant2 = isStreamParticipant(c18100_2);
+      const type = c18100_2?.type;
+      L18: {
+        const r13 = type === ParticipantTypes.USER;
+        if (!(!isStreamParticipant2 && !r13) && c18100_2?.streamId != null) {
+          r16 = c18100_2;
+          if (!c18100_1) {
+            break L18;
+          }
+        }
+        if (isStreamParticipant2 && (c18100_2 == null ? void 0 : c18100_2.user.id) !== AuthenticationStore.getId()) {
+          const participant = ChannelRTCStore.getParticipant(channel.id, c18100_2.user.id);
+          const localVideoDisabled = participant?.localVideoDisabled;
+          r16 = participant;
+          if (!localVideoDisabled) {
+            break L18;
+          }
+          r16 = null;
+        } else {
+          r16 = r13 ? ChannelRTCStore.getStreamParticipants(channel.id).find((item) => item.user.id === c18100_2.user.id) : void 0;
+        }
+      }
+      return r16?.streamId != null ? r16 : null;
+    });
+    id = channel.id;
+    const stateFromStores6 = useStateFromStores([ChannelRTCStore], () => id != null && ChannelRTCStore.getSelectedParticipant(id) != null);
+    channel2 = channel;
+    const stateFromStores7 = useStateFromStores([ChannelRTCStore], () => ChannelRTCStore.getSelectedParticipant(channel2.id));
+    const pipVideoOrStream = usePipVideoOrStream(channel.id);
+    const r80 = pipVideoOrStream == null;
+    r81 = null;
+    if (!r80) {
+      const id4 = pipVideoOrStream.user.id;
+      const id5 = AuthenticationStore.getId();
+      r81 = null;
+      if (id4 !== id5) {
+        if (participantScreenIsFocused2) {
+          r81 = null;
+          if (!stateFromStores6) {
+            break L22;
+          }
+        }
+        r81 = pipVideoOrStream.id !== stateFromStores7?.id ? pipVideoOrStream : null;
+      }
+    }
+  }
+  if (nonSelfPipParticipant == null) {
+    nonSelfPipParticipant = stateFromStores2;
+  }
+  if (nonSelfPipParticipant == null) {
+    nonSelfPipParticipant = stateFromStores5;
+  }
+  if (nonSelfPipParticipant == null) {
+    nonSelfPipParticipant = r81;
+  }
+  const selfParticipant = stateFromStores4 !== nonSelfPipParticipant ? stateFromStores4 : null;
+  const stateFromStores8 = useStateFromStores([ChannelCallLifecycleStore], () => ChannelCallLifecycleStore.isPipEnabledWhileFocusedOnActivityOrStream());
+  if (isChannelCallModalOpen) {
+    isChannelCallModalOpen = channel.isGuildStageVoice();
+  }
+  L40: {
+    useTrackActivityVideoPip(channel);
+    if (!(!r1 && !isStreamFocused) && !stateFromStores8) {
+      r101 = null;
+      if (!isViewingActivity) {
+        break L40;
+      }
+    }
+    r101 = selfParticipant == null ? nonSelfPipParticipant == null ? null : isChannelCallModalOpen ? null : <CameraPreview channel={channel} participantScreenIsFocused={participantScreenIsFocused2} nonSelfPipParticipant={nonSelfPipParticipant} selfParticipant={selfParticipant} /> : isChannelCallModalOpen ? null : <CameraPreview channel={channel} participantScreenIsFocused={participantScreenIsFocused2} nonSelfPipParticipant={nonSelfPipParticipant} selfParticipant={selfParticipant} />;
+  }
+  return r101;
+};

modules/video_calls/native/components/ChannelCallActionBar.tsx

@@ -0,0 +1,294 @@
+// Metro module 10740 (f10741).
+import { useRef, useMemo, useCallback } from "react";
+import { View } from "react-native";
+import EmbeddedActivitiesStore from "../../../activities/EmbeddedActivitiesStore";
+import ChannelRTCStore from "../../../calls/ChannelRTCStore";
+import GameConsoleStore from "../../../game_console/GameConsoleStore";
+import ApplicationStreamingStore from "../../../../stores/ApplicationStreamingStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import MediaEngineStore from "../../../../stores/MediaEngineStore";
+import ChannelCallLifecycleStore from "../ChannelCallLifecycleStore";
+import { ParticipantTypes } from "../../../calls/CallConstants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import { CALL_ACTION_BAR_HEIGHT, FIVE_BUTTON_LAYOUT_ACTION_BAR_HEIGHT, FIVE_BUTTON_CONTAINER_PADDING_TOP, FIVE_BUTTON_CONTAINER_PADDING_BOTTOM } from "../useActionBarHeight";
+import useHasVideoPermission from "../../useHasVideoPermission";
+import { useStateFromStores, useStateFromStoresObject } from "../../../../_bundle/Module589";
+import useChannelVideoLimit from "../../useChannelVideoLimit";
+import { useStageHasMedia } from "../../../stage_channels/StageMediaHooks";
+import { CameraLottie } from "../../../../design/components/LottieIcon/native/generated/CameraLottie";
+import { handleToggleVideo, showCameraDisabledAlert, useMaskedSpeakerStates, handleDisconnect } from "../../../voice_calls/native/CallsUtils";
+import { openIgnoreThermalStateAlert } from "../../../activities/native/openIgnoreThermalStateAlert";
+import { ToggledActionButton, PrimaryActionButton } from "./CallBarAction";
+import { intl, t } from "../../../../intl/index.native";
+import Module10744 from "../../../../_bundle/Module10744";
+import useScreenshareUtils from "../useScreenshareUtils";
+import { useIsConnectedToVoiceChannel } from "../../../voice_chat/VoiceChatHooks";
+import Module10761 from "../../../../_bundle/Module10761";
+import Module10762 from "../../../../_bundle/Module10762";
+import ChannelRTCActionCreators from "../../../../actions/ChannelRTCActionCreators";
+import { stopStream } from "../../../../actions/StreamActionCreators";
+import { encodeStreamKey } from "../../../go_live/utils/StreamKeyUtils";
+import EmbeddedActivitiesNativeManager from "../../../activities/native/EmbeddedActivitiesNativeManager";
+import Module10763 from "../../../../_bundle/Module10763";
+import useIsRemote from "../../../game_console/hooks/useIsRemote";
+import useIsVideoMode from "../useIsVideoMode";
+import useAnalyticsLocations, { AnalyticsLocationProvider } from "../../../app_analytics/useAnalyticsLocations";
+import AnalyticsLocation from "../../../app_analytics/AnalyticsLocation";
+import { useIsFiveButtonLayout } from "../useIsFiveButtonLayout";
+import { CallConnectingActionBar } from "./ChannelCallConnectingScreen";
+import { ChannelCallMicButton } from "./ChannelCallMicButton";
+import { DisconnectRemoteButton } from "./DisconnectRemoteButton";
+let useStyles, ScreenshareButton, AudioRouteButton, DisconnectCallButton, DisconnectStreamButton, LeaveActivityButton, c7219_24, useActionBarSecondButton, c7219_26, useActionBarPrimaryButtons;
+const VideoButton = function VideoButton(props) {
+  let stateFromStores2, ref, callback;
+  const { channel, isSmallSize } = props;
+  stateFromStores2 = void 0;
+  ref = void 0;
+  callback = void 0;
+  const hasVideoPermission = useHasVideoPermission(channel);
+  let c18239_1 = hasVideoPermission;
+  const stateFromStores = useStateFromStores([ChannelCallLifecycleStore], () => ChannelCallLifecycleStore.isReactingToThermalState());
+  stateFromStores2 = useStateFromStores([MediaEngineStore], () => MediaEngineStore.isVideoEnabled());
+  const reachedLimit = useChannelVideoLimit(channel).reachedLimit;
+  const stageHasMedia = useStageHasMedia(channel.id);
+  ref = useRef(null);
+  const memo = useMemo(() => <CameraLottie ref={ref} animation={stateFromStores2 ? "mute" : "unmute"} />, [stateFromStores2]);
+  callback = useCallback((a0) => {
+    handleToggleVideo(a0);
+    if (ref != null) {
+      const current = ref.current;
+      if (current != null) {
+        current.play();
+      }
+    }
+  }, []);
+  return <ToggledActionButton appearsDisabled={hasVideoPermission ? stageHasMedia ? !stageHasMedia : reachedLimit : !hasVideoPermission} isActive={stateFromStores2} onPress={useCallback(() => {
+    if (c18239_1) {
+      if (stateFromStores) {
+        openIgnoreThermalStateAlert(() => callback(channel));
+      } else {
+        callback(channel);
+      }
+    } else {
+      showCameraDisabledAlert();
+    }
+  }, [channel, hasVideoPermission, stateFromStores, callback])} accessibilityLabel={intl.string(t.HK4JIu)} source={Module10744} isSmallSize={isSmallSize} lottieComponent={memo} />;
+};
+ScreenshareButton = function ScreenshareButton(props) {
+  const { channel: channel6, isSmallSize } = props;
+  const screenshareUtils = useScreenshareUtils(channel6);
+  const isActive = screenshareUtils.isActive;
+  let onPress2 = screenshareUtils.onPress;
+  const { imgSource, isFeatureEnabled } = screenshareUtils;
+  if (!isFeatureEnabled) {
+    onPress2 = () => {};
+  }
+  return <ToggledActionButton appearsDisabled={!isFeatureEnabled} source={imgSource} isActive={isActive} accessibilityLabel={intl.string(t.XF1nZz)} onPress={onPress2} isSmallSize={isSmallSize} />;
+};
+AudioRouteButton = function AudioRouteButton(props) {
+  const { channel: channel2, isSmallSize } = props;
+  const maskedSpeakerStates = useMaskedSpeakerStates();
+  const { isAudioRouteEnabled, toggleAudio, routeSource } = maskedSpeakerStates;
+  const isConnectedToVoiceChannel = useIsConnectedToVoiceChannel(channel2);
+  return <ToggledActionButton isActive={isAudioRouteEnabled} source={routeSource} onPress={() => {
+    toggleAudio(channel2.id, isConnectedToVoiceChannel);
+  }} accessibilityLabel={intl.string(t["A/Ly/2"])} isSmallSize={isSmallSize} />;
+};
+DisconnectCallButton = function DisconnectCallButton(props) {
+  const { channel: channel3, isSmallSize } = props;
+  return <PrimaryActionButton source={Module10761} accessibilityLabel={intl.string(t["6vrfgt"])} isSmallSize={isSmallSize} onPress={() => {
+    handleDisconnect(channel3);
+  }} />;
+};
+DisconnectStreamButton = function DisconnectStreamButton(props) {
+  let stateFromStores4;
+  const { channel: channel4, isSmallSize } = props;
+  stateFromStores4 = void 0;
+  const stateFromStores3 = useStateFromStores([ChannelRTCStore, AuthenticationStore], () => {
+    const selectedParticipant = ChannelRTCStore.getSelectedParticipant(channel4.id);
+    return selectedParticipant != null && selectedParticipant.type !== ParticipantTypes.ACTIVITY ? selectedParticipant.user.id !== AuthenticationStore.getId() ? selectedParticipant?.id : null : selectedParticipant?.id;
+  });
+  stateFromStores4 = useStateFromStores([ApplicationStreamingStore], () => stateFromStores3 != null ? ApplicationStreamingStore.getActiveStreamForStreamKey(stateFromStores3) : null);
+  return stateFromStores4 != null ? <PrimaryActionButton source={Module10762} accessibilityLabel={intl.string(t.q3O3J8)} isSmallSize={isSmallSize} onPress={() => {
+    ChannelRTCActionCreators.selectParticipant(channel4.id, null);
+    stopStream(encodeStreamKey(stateFromStores4));
+  }} /> : null;
+};
+LeaveActivityButton = function LeaveActivityButton(props) {
+  const isSmallSize = props.isSmallSize;
+  return <PrimaryActionButton accessibilityLabel={intl.string(t.k0Aph0)} onPress={function onPress() {
+    const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
+    EmbeddedActivitiesNativeManager.leaveActivity({
+      location: currentEmbeddedActivity?.location,
+      applicationId: currentEmbeddedActivity?.applicationId
+    });
+  }} source={Module10763} isSmallSize={isSmallSize} />;
+};
+useActionBarSecondButton = function useActionBarSecondButton({ channel: channel6 }) {
+  let SCREEN_SHARE_END;
+  let r7 = useIsConnectedToVoiceChannel(channel6);
+  const isActive = useScreenshareUtils(channel6).isActive;
+  const isRemote = useIsRemote();
+  const AUDIO_ROUTE = c7219_24.AUDIO_ROUTE;
+  const r8 = r7 ? !isRemote : r7;
+  const r22 = {};
+  r22[AUDIO_ROUTE] = r8;
+  r22[c7219_24.NONE] = true;
+  r22[c7219_24.SCREEN_SHARE_END] = (r7 ? !isRemote : r7) && isActive;
+  const SCREEN_SHARE_START = c7219_24.SCREEN_SHARE_START;
+  if (r7) {
+    r7 = !isRemote;
+  }
+  L20: {
+    r22[SCREEN_SHARE_START] = r7;
+    const isVideoMode = useIsVideoMode();
+    if (r22[c7219_24.SCREEN_SHARE_END]) {
+      SCREEN_SHARE_END = c7219_24.SCREEN_SHARE_END;
+    } else {
+      if (!(r22[c7219_24.AUDIO_ROUTE] && channel6.isPrivate()) && !(r22[c7219_24.AUDIO_ROUTE] && !isVideoMode)) {
+        if (r22[c7219_24.SCREEN_SHARE_START]) {
+          SCREEN_SHARE_END = c7219_24.SCREEN_SHARE_START;
+          break L20;
+        }
+        SCREEN_SHARE_END = c7219_24.NONE;
+        break L20;
+      }
+      SCREEN_SHARE_END = c7219_24.AUDIO_ROUTE;
+    }
+  }
+  return SCREEN_SHARE_END;
+};
+useActionBarPrimaryButtons = function useActionBarPrimaryButtons({ channel: channel5 }) {
+  const isConnectedToVoiceChannel2 = useIsConnectedToVoiceChannel(channel5);
+  const stateFromStores5 = useStateFromStores([ChannelRTCStore, AuthenticationStore], () => {
+    const selectedParticipant = ChannelRTCStore.getSelectedParticipant(channel5.id);
+    return selectedParticipant != null && selectedParticipant.type !== ParticipantTypes.ACTIVITY ? selectedParticipant.user.id !== AuthenticationStore.getId() ? selectedParticipant?.id : null : selectedParticipant?.id;
+  });
+  const stateFromStores6 = useStateFromStores([ApplicationStreamingStore], () => stateFromStores5 != null ? ApplicationStreamingStore.getActiveStreamForStreamKey(stateFromStores5) : null);
+  const stateFromStores7 = useStateFromStores([EmbeddedActivitiesStore], () => EmbeddedActivitiesStore.getCurrentEmbeddedActivity() != null);
+  const stateFromStoresObject = useStateFromStoresObject([GameConsoleStore], () => ({
+    awaitingRemote: GameConsoleStore.getAwaitingRemoteSessionInfo() != null,
+    remoteSessionId: GameConsoleStore.getRemoteSessionId()
+  }));
+  let awaitingRemote = stateFromStoresObject.awaitingRemote;
+  const remoteSessionId = stateFromStoresObject.remoteSessionId;
+  const r42 = {};
+  r42[c7219_26.END_ACTIVITY] = stateFromStores7;
+  r42[c7219_26.END_CALL] = isConnectedToVoiceChannel2;
+  const END_REMOTE = c7219_26.END_REMOTE;
+  if (!awaitingRemote) {
+    awaitingRemote = remoteSessionId != null;
+  }
+  r42[END_REMOTE] = awaitingRemote;
+  r42[c7219_26.END_STREAM] = stateFromStores6 != null;
+  return r42;
+};
+useStyles = createStyles({
+  container: {
+    height: CALL_ACTION_BAR_HEIGHT,
+    justifyContent: "center",
+    alignItems: "center",
+    flexDirection: "row"
+  },
+  containerForFiveButtonLayout: {
+    height: FIVE_BUTTON_LAYOUT_ACTION_BAR_HEIGHT,
+    paddingHorizontal: 16,
+    paddingTop: FIVE_BUTTON_CONTAINER_PADDING_TOP,
+    paddingBottom: FIVE_BUTTON_CONTAINER_PADDING_BOTTOM,
+    justifyContent: "center",
+    flexDirection: "row"
+  }
+});
+c7219_24 = {
+  NONE: 0,
+  0: "NONE",
+  SCREEN_SHARE_START: 1,
+  1: "SCREEN_SHARE_START",
+  SCREEN_SHARE_END: 2,
+  2: "SCREEN_SHARE_END",
+  AUDIO_ROUTE: 3,
+  3: "AUDIO_ROUTE"
+};
+c7219_26 = {
+  END_STREAM: 0,
+  0: "END_STREAM",
+  END_ACTIVITY: 1,
+  1: "END_ACTIVITY",
+  END_CALL: 2,
+  2: "END_CALL",
+  END_REMOTE: 3,
+  3: "END_REMOTE"
+};
+export default function ChannelCallActionBar(props) {
+  let r54, r60, r85;
+  const { channel: channel6, shouldShowConnectingScreen = false } = props;
+  const styles = useStyles();
+  const isRemote = useIsRemote();
+  const actionBarSecondButton = useActionBarSecondButton({
+    channel: channel6
+  });
+  const actionBarPrimaryButtons = useActionBarPrimaryButtons({
+    channel: channel6
+  });
+  const r17 = actionBarPrimaryButtons[c7219_26.END_STREAM] ? c7219_26.END_STREAM : actionBarPrimaryButtons[c7219_26.END_REMOTE] ? c7219_26.END_REMOTE : actionBarPrimaryButtons[c7219_26.END_ACTIVITY] ? c7219_26.END_ACTIVITY : c7219_26.END_CALL;
+  const analyticsLocations = useAnalyticsLocations(AnalyticsLocation.CHANNEL_CALL_ACTION_BAR).analyticsLocations;
+  const isFiveButtonLayout = useIsFiveButtonLayout(channel6.id);
+  const style = isFiveButtonLayout ? styles.containerForFiveButtonLayout : styles.container;
+  if (shouldShowConnectingScreen) {
+    r85 = <CallConnectingActionBar channel={channel6} />;
+  } else {
+    const r18 = isRemote ? null : <VideoButton channel={channel6} isSmallSize={isFiveButtonLayout} />;
+    L23: {
+      r54 = [r18, , , ,];
+      if (c7219_24.AUDIO_ROUTE === actionBarSecondButton) {
+        r60 = <AudioRouteButton isSmallSize={isFiveButtonLayout} channel={channel6} />;
+      } else {
+        if (c7219_24.SCREEN_SHARE_START !== actionBarSecondButton && c7219_24.SCREEN_SHARE_END !== actionBarSecondButton) {
+          c7219_24.NONE;
+          r60 = null;
+          break L23;
+        }
+        r60 = <ScreenshareButton channel={channel6} isSmallSize={isFiveButtonLayout} />;
+      }
+    }
+    r54[1] = r60;
+    r54[2] = <ChannelCallMicButton channel={channel6} isSmallSize={isFiveButtonLayout} />;
+    r54[3] = c7219_26.END_REMOTE === r17 ? <DisconnectRemoteButton channel={channel6} isSmallSize={isFiveButtonLayout} /> : c7219_26.END_STREAM === r17 ? <DisconnectStreamButton channel={channel6} isSmallSize={isFiveButtonLayout} /> : c7219_26.END_ACTIVITY === r17 ? <LeaveActivityButton isSmallSize={isFiveButtonLayout} /> : c7219_26.END_CALL === r17 ? <DisconnectCallButton channel={channel6} isSmallSize={isFiveButtonLayout} /> : null;
+    r85 = <>{r54}</>;
+  }
+  return <AnalyticsLocationProvider value={analyticsLocations}>
+    <View pointerEvents="box-none" style={style}>{r85}</View>
+  </AnalyticsLocationProvider>;
+};
+export { VideoButton };
+export { ScreenshareButton };
+export { AudioRouteButton };
+export { DisconnectCallButton };
+export { DisconnectStreamButton };
+export { c7219_24 as ActionBarSecondButton };
+export function useActionBarSecondButtons({ channel: channel6 }) {
+  let r11 = useIsConnectedToVoiceChannel(channel6);
+  const isActive = useScreenshareUtils(channel6).isActive;
+  const isRemote = useIsRemote();
+  const AUDIO_ROUTE = c7219_24.AUDIO_ROUTE;
+  const r20 = r11 ? !isRemote : r11;
+  const r21 = {};
+  r21[AUDIO_ROUTE] = r20;
+  r21[c7219_24.NONE] = true;
+  r21[c7219_24.SCREEN_SHARE_END] = (r11 ? !isRemote : r11) && isActive;
+  const SCREEN_SHARE_START = c7219_24.SCREEN_SHARE_START;
+  if (r11) {
+    r11 = !isRemote;
+  }
+  r21[SCREEN_SHARE_START] = r11;
+  return r21;
+}
+export { useActionBarSecondButton };
+export { c7219_26 as ActionBarPrimaryButton };
+export { useActionBarPrimaryButtons };
+export function useActionBarPrimaryButton(a0) {
+  const actionBarPrimaryButtons = useActionBarPrimaryButtons({
+    channel: a0.channel
+  });
+  return actionBarPrimaryButtons[c7219_26.END_STREAM] ? c7219_26.END_STREAM : actionBarPrimaryButtons[c7219_26.END_REMOTE] ? c7219_26.END_REMOTE : actionBarPrimaryButtons[c7219_26.END_ACTIVITY] ? c7219_26.END_ACTIVITY : c7219_26.END_CALL;
+}

modules/video_calls/native/components/ChannelCallConnectingScreen.tsx

@@ -0,0 +1,146 @@
+// Metro module 10764 (f10765).
+import { useCallback } from "react";
+import * as _Module17 from "react-native";
+import { View } from "react-native";
+import GameConsoleStore from "../../../game_console/GameConsoleStore";
+import MediaEngineStore from "../../../../stores/MediaEngineStore";
+import PermissionStore from "../../../../stores/PermissionStore";
+import SessionsStore from "../../../../stores/SessionsStore";
+import { resetFocus } from "../ChannelCallStore";
+import { InstantInviteSources } from "../../../../Constants";
+import { Permissions } from "../../../../_bundle/Module505";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import { CALL_ACTION_BAR_HEIGHT } from "../useActionBarHeight";
+import ActionSheetActionCreators from "../../../action_sheet/native/ActionSheetActionCreators";
+import { BottomSheet } from "../../../../design/components/Sheet/native/BottomSheet.native";
+import { BottomSheetScrollView } from "../../../../_bundle/Module5245";
+import UserSettingsVoice from "../../../user_settings/voice/native/UserSettingsVoice";
+import useChannelName from "../../../channel/useChannelName";
+import useIsVoiceChannelFull, { useIsVoiceChannelLocked } from "../../../voice_calls/useIsVoiceChannelFull";
+import { showInstantInviteActionSheet } from "../../../instant_invite/native/InstantInviteUtils";
+import VoiceChatHeaderIcon from "../../../voice_chat/native/components/VoiceChatHeaderIcon";
+import Module10795 from "../../../../_bundle/Module10795";
+import { intl, t } from "../../../../intl/index.native";
+import AudioActionCreators from "../../../../actions/AudioActionCreators";
+import SelectedChannelActionCreators from "../../../../actions/SelectedChannelActionCreators";
+import useTheme from "../../../../hooks/useTheme";
+import { ChannelCallMicButton } from "./ChannelCallMicButton";
+import useVoiceStateForRemoteSession from "../../../game_console/hooks/useVoiceStateForRemoteSession";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import useGameConsoleAccounts from "../../../game_console/useGameConsoleAccounts";
+import useMuteStates from "../../useMuteStates";
+import { coerceConsoleTypeToPlatformType } from "../../../game_console/coercePlatformTypeToConsoleType";
+import { beginConsoleTransfer } from "../../../game_console/native/beginConsoleTransfer";
+import { LabeledActionButton, IconPosition } from "../../../stage_channels/native/components/LabeledActionBarButton";
+import Module712 from "../../../../_bundle/Module712";
+import Module10597 from "../../../../_bundle/Module10597";
+import Module10805 from "../../../../_bundle/Module10805";
+let useStyles, JoinMutedButton, JoinVoiceButton;
+const VoiceSettingsActionSheet = function VoiceSettingsActionSheet() {
+  return <BottomSheet scrollable>
+    <BottomSheetScrollView>
+      <UserSettingsVoice />
+    </BottomSheetScrollView>
+  </BottomSheet>;
+};
+JoinMutedButton = function JoinMutedButton(props) {
+  return <ChannelCallMicButton channel={props.channel} disableTint={useTheme() === "light"} isSmallSize={false} />;
+};
+JoinVoiceButton = function JoinVoiceButton(props) {
+  let stateFromStores, c18249_3, suppress;
+  const channel = props.channel;
+  stateFromStores = void 0;
+  c18249_3 = void 0;
+  suppress = void 0;
+  let c18249_1 = useVoiceStateForRemoteSession();
+  const stateFromStores2 = useStateFromStores([GameConsoleStore], () => GameConsoleStore.getAwaitingRemoteSessionInfo() != null);
+  stateFromStores = useStateFromStores([SessionsStore], () => {
+    let r3 = c18249_1?.sessionId;
+    if (r3 == null) {
+      r3 = "";
+    }
+    const sessionById = SessionsStore.getSessionById(r3);
+    return sessionById == null ? void 0 : sessionById.clientInfo.os;
+  });
+  const gameConsoleAccounts = useGameConsoleAccounts();
+  c18249_3 = gameConsoleAccounts;
+  const muteStates = useMuteStates(channel);
+  suppress = muteStates.selfMute || muteStates.mute || muteStates.suppress;
+  const callback = useCallback(() => {
+    if (stateFromStores != null) {
+      const r14 = coerceConsoleTypeToPlatformType(stateFromStores, c18249_3);
+      if (r14 != null) {
+        return beginConsoleTransfer(channel, r14);
+      }
+    }
+    const id = channel.id;
+    resetFocus();
+    if (_Module17 != null) {
+      const NativeModules = _Module17.NativeModules;
+      if (NativeModules != null) {
+        const KeyboardManager = NativeModules.KeyboardManager;
+        if (KeyboardManager != null) {
+          const dismissGlobalKeyboard = KeyboardManager.dismissGlobalKeyboard;
+          if (dismissGlobalKeyboard != null) {
+            dismissGlobalKeyboard.call(KeyboardManager);
+          }
+        }
+      }
+    }
+    if (suppress && !MediaEngineStore.getSettings().mute) {
+      AudioActionCreators.toggleSelfMute();
+    }
+    SelectedChannelActionCreators.selectVoiceChannel(id, false, false);
+  }, [channel, stateFromStores, gameConsoleAccounts, suppress]);
+  const isVoiceChannelFull = useIsVoiceChannelFull(channel);
+  const isVoiceChannelLocked = useIsVoiceChannelLocked(channel);
+  return <LabeledActionButton disabled={isVoiceChannelFull || isVoiceChannelLocked || stateFromStores2} backgroundColor={Module712.unsafe_rawColors.GREEN_360} imageStyle={{
+    tintColor: Module712.unsafe_rawColors.WHITE
+  }} accessibilityLabel={intl.string(t["96ANUN"])} source={suppress ? Module10597 : Module10805} onPress={callback} label={isVoiceChannelLocked ? intl.string(t.TVBCKZ) : isVoiceChannelFull ? intl.string(t.rZfiNq) : suppress ? intl.string(t["Bd/Liz"]) : intl.string(t["96ANUN"])} iconPosition={IconPosition.RIGHT} />;
+};
+useStyles = createStyles({
+  spacer: {
+    width: 8
+  },
+  actionBarContainer: {
+    paddingHorizontal: 12,
+    paddingTop: 16,
+    justifyContent: "center",
+    alignItems: "flex-start",
+    flexDirection: "row",
+    height: CALL_ACTION_BAR_HEIGHT
+  }
+});
+export function showVoiceSettingsActionSheet(a0) {
+  ActionSheetActionCreators.openLazy(() => Promise.resolve(VoiceSettingsActionSheet), "voice settings", {
+    guildId: a0
+  });
+}
+export function ChannelCallConnectingHeader(props) {
+  const channel2 = props.channel;
+  const styles = useStyles();
+  const channelName = useChannelName(channel2);
+  const isVoiceChannelLocked = useIsVoiceChannelLocked(channel2);
+  const onPress = PermissionStore.can(Permissions.CREATE_INSTANT_INVITE, channel2) ? isVoiceChannelLocked ? null : () => showInstantInviteActionSheet(channel2, {
+    source: InstantInviteSources.VOICE_CHANNEL
+  }) : null;
+  return <>
+    <View style={{
+      width: 4
+    }} />
+    {onPress != null ? <VoiceChatHeaderIcon source={Module10795} onPress={onPress} accessibilityLabel={intl.formatToPlainString(t["dHHb/2"], {
+      channelName
+    })} /> : null}
+    <View style={styles.spacer} />
+    <View style={{
+      width: 4
+    }} />
+  </>;
+}
+export function CallConnectingActionBar(props) {
+  const channel3 = props.channel;
+  return <View style={useStyles().actionBarContainer}>
+    <JoinMutedButton channel={channel3} />
+    <JoinVoiceButton channel={channel3} />
+  </View>;
+}

modules/video_calls/native/components/ChannelCallHeaderButtons.tsx

@@ -0,0 +1,33 @@
+// Metro module 10826 (f10827).
+import MediaEngineStore from "../../../../stores/MediaEngineStore";
+import { useStateFromStoresObject } from "../../../../_bundle/Module589";
+import ChannelCallNavigatorIcon from "./ChannelCallNavigatorIcon";
+import { intl, t } from "../../../../intl/index.native";
+import Module10827 from "../../../../_bundle/Module10827";
+import AudioActionCreators from "../../../../actions/AudioActionCreators";
+import useIsPrivateAudioOnlyCall from "../useIsPrivateAudioOnlyCall";
+import useSelectedParticipant from "../../useSelectedParticipant";
+import Module10828 from "../../../../_bundle/Module10828";
+import ChannelRTCActionCreators from "../../../../actions/ChannelRTCActionCreators";
+export function CameraButton() {
+  let videoDeviceId, videoDevices;
+  const stateFromStoresObject = useStateFromStoresObject([MediaEngineStore], () => ({
+    isVideoEnabled: MediaEngineStore.isVideoEnabled(),
+    videoDeviceId: MediaEngineStore.getVideoDeviceId(),
+    videoDevices: MediaEngineStore.getVideoDevices()
+  }));
+  const isVideoEnabled = stateFromStoresObject.isVideoEnabled;
+  videoDeviceId = stateFromStoresObject.videoDeviceId;
+  videoDevices = stateFromStoresObject.videoDevices;
+  return isVideoEnabled ? <ChannelCallNavigatorIcon accessibilityLabel={intl.string(t["t9eQ/g"])} source={Module10827} onPress={function onPress() {
+    const r9 = Object.keys(videoDevices).find((item) => item !== videoDeviceId);
+    if (r9 != null) {
+      AudioActionCreators.setVideoDevice(r9);
+    }
+  }} disableBackground /> : null;
+}
+export function GridButton(props) {
+  const channel = props.channel;
+  const isPrivateAudioOnlyCall = useIsPrivateAudioOnlyCall(channel);
+  return useSelectedParticipant(channel) == null ? null : isPrivateAudioOnlyCall ? null : <ChannelCallNavigatorIcon accessibilityLabel={intl.string(t.HK4JIu)} source={Module10828} onPress={() => ChannelRTCActionCreators.selectParticipant(channel.id, null)} disableBackground />;
+}

modules/video_calls/native/components/ChannelCallMicButton.tsx

@@ -0,0 +1,45 @@
+// Metro module 10796 (f10797).
+import { useMemo } from "react";
+import GameConsoleStore from "../../../game_console/GameConsoleStore";
+import useMuteStates from "../../useMuteStates";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import { createMuteHandler } from "../VoiceActionUtils";
+import { VoicePanelRiveMicButton } from "../../../voice_panel/native/controls/buttons/VoicePanelRiveMicButton";
+import { ToggledActionButton } from "./CallBarAction";
+import { intl, t } from "../../../../intl/index.native";
+import Module10801 from "../../../../_bundle/Module10801";
+import Module10802 from "../../../../_bundle/Module10802";
+import Module712 from "../../../../_bundle/Module712";
+export function ChannelCallMicButton(props) {
+  const { channel, isSmallSize } = props;
+  let disableTint = props.disableTint;
+  if (disableTint === void 0) {
+    disableTint = false;
+  }
+  let mute;
+  mute = void 0;
+  const muteStates = useMuteStates(channel);
+  const stateFromStores = useStateFromStores([GameConsoleStore], () => GameConsoleStore.getAwaitingRemoteSessionInfo() != null);
+  const muteHandler = createMuteHandler(muteStates, stateFromStores);
+  mute = muteHandler.mute;
+  const onPress = muteHandler.onPress;
+  const memo = useMemo(() => <VoicePanelRiveMicButton muted={mute} />, [mute]);
+  const props2 = {
+    appearsDisabled: stateFromStores,
+    accessibilityLabel: intl.string(t.B3zz0G),
+    onPress,
+    source: mute ? Module10801 : Module10802,
+    isActive: null,
+    isSmallSize: null,
+    lottieComponent: null,
+    tintColor: null
+  };
+  if (!disableTint) {
+    disableTint = mute;
+  }
+  props2.isActive = disableTint;
+  props2.isSmallSize = isSmallSize;
+  props2.lottieComponent = memo;
+  props2.tintColor = mute ? Module712.unsafe_rawColors.RED_400 : void 0;
+  return <ToggledActionButton {...props2} />;
+}

modules/video_calls/native/components/ChannelCallModal.tsx

@@ -0,0 +1,348 @@
+// Metro module 10507 (f10508).
+import * as Module19 from "react";
+import { useState, useEffect, useRef, useCallback, useLayoutEffect, useMemo } from "react";
+import ChannelRTCStore from "../../../calls/ChannelRTCStore";
+import ChannelStore from "../../../../stores/ChannelStore";
+import { resetChannelCallStore, setVoiceChatDrawerState, useChannelCallOrientationHandlers, useChannelCallStore, useIsVoiceChatFocused } from "../ChannelCallStore";
+import { VoiceChatDrawerState } from "../ChannelCallConstants";
+import { PAN_GESTURE_FAIL_OFFSET_Y, SWIPE_TO_CHAT_ACTIVE_OFFSET } from "./Constants";
+import { ModalAnimation } from "../../../../Constants";
+import { useIsConnectedToVoiceChannel } from "../../../voice_chat/VoiceChatHooks";
+import { useRevealProviderValue, RevealContext } from "./RevealProvider";
+import * as _NavigationRouteUtils_native from "../../../main_tabs_v2/helpers/NavigationRouteUtils.native";
+import CameraPreview from "./CameraPreview";
+import ChannelCallModalManager from "./ChannelCallModalManager";
+import StatusBar_android from "../../../status_bar/native/components/StatusBar.android";
+import ChannelCallNavigator from "./ChannelCallNavigator";
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import ReanimatedRexport, { useSharedValue, useDerivedValue, runOnUI, useAnimatedReaction, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import * as _ChatInputUtils from "../../../../utils/native/ChatInputUtils";
+import * as _PanGestureAnimations from "../../../action_sheet/native/PanGestureAnimations";
+import PanGestureAnimations from "../../../action_sheet/native/PanGestureAnimations";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import useIsActivityFocused from "../../../activities/useIsActivityFocused";
+import * as _RouteManagerUtils from "../../../routing/native/RouteManagerUtils";
+import useAnalyticsLocations, { AnalyticsLocationProvider } from "../../../app_analytics/useAnalyticsLocations";
+import AnalyticsLocation from "../../../app_analytics/AnalyticsLocation";
+import useModalPanGesture from "./useModalPanGesture";
+import { maybeShowAgeGateModal } from "../../../../utils/native/PrivateChannelCallUtils";
+import { GestureDetector, Gesture } from "../../../../_bundle/Module5273";
+import { VoiceChatNavigationContext } from "../../../voice_chat/native/VoiceChatModalContext";
+let Component2, __initData, __initData2, __initData3, __initData4, __initData5, __initData6, __initData7, __initData8, __initData9, __initData10, __initData11, Component, ChannelCallModal;
+const ChannelCallCameraPreview = function ChannelCallCameraPreview(props) {
+  const channel = props.channel;
+  const isVoiceChatFocused = useIsVoiceChatFocused();
+  const isConnectedToVoiceChannel = useIsConnectedToVoiceChannel(channel);
+  const revealProviderValue = useRevealProviderValue(useChannelCallStore((a0) => a0.focus), channel);
+  const isModalOpen = _NavigationRouteUtils_native.isModalOpen(ChannelCallModal);
+  return isConnectedToVoiceChannel ? <RevealContext.Provider value={revealProviderValue}>
+    <CameraPreview channel={channel} participantScreenIsFocused={!isVoiceChatFocused} isChannelCallModalOpen={isModalOpen} />
+  </RevealContext.Provider> : null;
+};
+ChannelCallModal = function ChannelCallModal(props) {
+  const channel = props.channel;
+  return <Component channelId={channel.id} guildId={channel.guild_id} />;
+};
+Component2 = Module19.memo(function({ channelId: channelId2 }) {
+  const [state] = useState(ChannelStore.getChannel(channelId2));
+  useChannelCallOrientationHandlers(state);
+  useEffect(() => {
+    if (state != null) {
+      ChannelCallModalManager.initialize(state);
+      return () => {
+        ChannelCallModalManager.terminate();
+        StatusBar_android.setHidden(false);
+        if (!_NavigationRouteUtils_native.isModalOpen(ChannelCallModal)) {
+          resetChannelCallStore();
+        }
+      };
+    }
+  }, [state]);
+  return state != null ? <ChannelCallNavigator channel={state} /> : null;
+});
+__initData = {
+  code: "function ChannelCallModalTsx1(){const{width}=this.__closure;return[0,-width];}"
+};
+__initData2 = {
+  code: "function ChannelCallModalTsx2(){const{runOnJS,dismissKeyboard}=this.__closure;runOnJS(dismissKeyboard)();}"
+};
+__initData3 = {
+  code: "function ChannelCallModalTsx3(){const{voiceChatDrawerStoreState}=this.__closure;return voiceChatDrawerStoreState;}"
+};
+__initData4 = {
+  code: "function ChannelCallModalTsx4(){const{translateX,width}=this.__closure;translateX.set(-width);}"
+};
+__initData5 = {
+  code: "function ChannelCallModalTsx5(){const{isSwipeToChatInProgress,translateX,width,voiceChatDrawerState,VoiceChatDrawerState}=this.__closure;const chatGestureFinished=!isSwipeToChatInProgress.get();const drawerIsInSettledPosition=translateX.get()===-width||translateX.get()===0;const chatOpen=voiceChatDrawerState.get()===VoiceChatDrawerState.OPEN;const chatClosed=voiceChatDrawerState.get()===VoiceChatDrawerState.CLOSED;if(chatGestureFinished&&drawerIsInSettledPosition){return translateX.get()===-width?VoiceChatDrawerState.OPEN:VoiceChatDrawerState.CLOSED;}else if(chatOpen&&translateX.get()>-width){return VoiceChatDrawerState.CLOSING;}else if(chatClosed&&translateX.get()<0){return VoiceChatDrawerState.OPENING;}else{return null;}}"
+};
+__initData6 = {
+  code: "function ChannelCallModalTsx6(state,previousState){const{runOnJS,setVoiceChatDrawerState,channelId,VoiceChatDrawerState,transitionToVoiceRoute,guildId}=this.__closure;if(state===previousState)return;if(state!=null&&state!==previousState){runOnJS(setVoiceChatDrawerState)(channelId,state);if(state===VoiceChatDrawerState.OPEN){runOnJS(transitionToVoiceRoute)(guildId,channelId);}}}"
+};
+__initData7 = {
+  code: "function ChannelCallModalTsx7(){const{voiceChatDrawerState}=this.__closure;return voiceChatDrawerState.get();}"
+};
+__initData8 = {
+  code: "function ChannelCallModalTsx8(drawerState,drawerStatePrev){const{VoiceChatDrawerState,translateX,withPanGestureTiming}=this.__closure;if(drawerState===VoiceChatDrawerState.CLOSED&&drawerStatePrev===VoiceChatDrawerState.OPEN){translateX.set(withPanGestureTiming(0));}}"
+};
+__initData9 = {
+  code: "function ChannelCallModalTsx9(){const{interpolate,translateY,maxVerticalTranslate}=this.__closure;return{flex:1,transform:[{translateY:interpolate(translateY.get(),[0,maxVerticalTranslate],[0,maxVerticalTranslate])}]};}"
+};
+__initData10 = {
+  code: "function ChannelCallModalTsx10(){const{immediate,translateX,width,withPanGestureTiming}=this.__closure;if(immediate===true){translateX.set(-width);}else{translateX.set(withPanGestureTiming(-width));}}"
+};
+__initData11 = {
+  code: "function ChannelCallModalTsx11(){const{translateX,withPanGestureTiming}=this.__closure;translateX.set(withPanGestureTiming(0));}"
+};
+Component = Module19.memo(function({ channelId, guildId }) {
+  let ref, ref2, ref3, ref4, sharedValue, sharedValue2, voiceChatDrawerState, derivedValue, width, sharedValue3, c18087_12, setState, current, ref5;
+  ref = void 0;
+  ref2 = void 0;
+  ref3 = void 0;
+  ref4 = void 0;
+  sharedValue = void 0;
+  sharedValue2 = void 0;
+  voiceChatDrawerState = void 0;
+  derivedValue = void 0;
+  width = void 0;
+  sharedValue3 = void 0;
+  c18087_12 = void 0;
+  setState = void 0;
+  current = void 0;
+  ref5 = void 0;
+  const stateFromStores = useStateFromStores([ChannelStore], () => ChannelStore.getChannel(channelId), [channelId]);
+  ref = useRef(void 0);
+  ref2 = useRef(void 0);
+  ref3 = useRef(void 0);
+  ref4 = useRef(void 0);
+  sharedValue = useSharedValue(0);
+  sharedValue2 = useSharedValue(0);
+  voiceChatDrawerState = useChannelCallStore().voiceChatDrawerState;
+  const r54 = () => voiceChatDrawerState;
+  r54.__closure = {
+    voiceChatDrawerStoreState: voiceChatDrawerState
+  };
+  r54.__workletHash = 4903837231689;
+  r54.__initData = __initData3;
+  derivedValue = useDerivedValue(r54);
+  const windowDimensions_native = useWindowDimensions_native();
+  width = windowDimensions_native.width;
+  const height = windowDimensions_native.height;
+  sharedValue3 = useSharedValue(false);
+  const maxTranslate = 0.8 * height;
+  c18087_12 = maxTranslate;
+  const isActivityFocused = useIsActivityFocused(channelId);
+  let state;
+  [state, setState] = useState(false);
+  const gestureEnabled = isActivityFocused ? !isActivityFocused : !(stateFromStores == null ? void 0 : stateFromStores.isGuildStageVoice());
+  current = {
+    channelId,
+    guildId
+  };
+  ref5 = useRef(current);
+  useEffect(() => {
+    ref5.current = current;
+  });
+  useEffect(() => {
+    const current2 = ref5.current;
+    const { channelId: channelId2, guildId: guildId2 } = current2;
+    if (useChannelCallStore.getState().voiceChatDrawerState === VoiceChatDrawerState.OPEN || ChannelRTCStore.getChatOpen(channelId2)) {
+      const r24 = function t() {
+        sharedValue.set(-width);
+      };
+      r24.__closure = {
+        translateX: sharedValue,
+        width
+      };
+      r24.__workletHash = 15726690166344;
+      r24.__initData = __initData4;
+      runOnUI(r24)();
+      _ReanimatedRexport.runOnJS(_RouteManagerUtils.transitionToVoiceRoute)(guildId2, channelId2);
+    }
+  }, [width, sharedValue]);
+  const analyticsLocations = useAnalyticsLocations(AnalyticsLocation.CHANNEL_CALL).analyticsLocations;
+  const ae = function ae() {
+    let OPEN2;
+    const r12 = sharedValue3.get();
+    const r15 = sharedValue.get() === -width || sharedValue.get() === 0;
+    L16: {
+      const r10 = derivedValue.get();
+      const OPEN = VoiceChatDrawerState.OPEN;
+      const r23 = derivedValue.get();
+      const CLOSED = VoiceChatDrawerState.CLOSED;
+      if (!r12 && r15) {
+        if (sharedValue.get() === -width) {
+          OPEN2 = VoiceChatDrawerState.OPEN;
+          break L16;
+        }
+        OPEN2 = VoiceChatDrawerState.CLOSED;
+      } else {
+        OPEN2 = r10 === OPEN && sharedValue.get() > -width ? VoiceChatDrawerState.CLOSING : r23 === CLOSED ? sharedValue.get() < 0 ? VoiceChatDrawerState.OPENING : null : null;
+      }
+    }
+    return OPEN2;
+  };
+  ae.__closure = {
+    isSwipeToChatInProgress: sharedValue3,
+    translateX: sharedValue,
+    width,
+    voiceChatDrawerState: derivedValue,
+    VoiceChatDrawerState
+  };
+  ae.__workletHash = 16786813095205;
+  ae.__initData = __initData5;
+  const te = function te(a0, a1) {
+    const r1 = a0 !== a1;
+    if ((r1 ? a0 != null : r1) && r1) {
+      _ReanimatedRexport.runOnJS(setVoiceChatDrawerState)(channelId, a0);
+      if (a0 === VoiceChatDrawerState.OPEN) {
+        _ReanimatedRexport.runOnJS(_RouteManagerUtils.transitionToVoiceRoute)(guildId, channelId);
+      }
+    }
+  };
+  te.__closure = {
+    runOnJS: _ReanimatedRexport.runOnJS,
+    setVoiceChatDrawerState,
+    channelId,
+    VoiceChatDrawerState,
+    transitionToVoiceRoute: _RouteManagerUtils.transitionToVoiceRoute,
+    guildId
+  };
+  te.__workletHash = 14188334620807;
+  te.__initData = __initData6;
+  useAnimatedReaction(ae, te);
+  const re = function re() {
+    return derivedValue.get();
+  };
+  re.__closure = {
+    voiceChatDrawerState: derivedValue
+  };
+  re.__workletHash = 14044794538420;
+  re.__initData = __initData7;
+  const ne = function ne(a0, a1) {
+    if (a0 === VoiceChatDrawerState.CLOSED && a1 === VoiceChatDrawerState.OPEN) {
+      sharedValue.set(_PanGestureAnimations.withPanGestureTiming(0));
+    }
+  };
+  ne.__closure = {
+    VoiceChatDrawerState,
+    translateX: sharedValue,
+    withPanGestureTiming: _PanGestureAnimations.withPanGestureTiming
+  };
+  ne.__workletHash = 260500087614;
+  ne.__initData = __initData8;
+  useAnimatedReaction(re, ne);
+  const r126 = state ? !state : !isActivityFocused;
+  const width2 = width;
+  const u = () => [0, -width2];
+  u.__closure = {
+    width
+  };
+  u.__workletHash = 15383459308604;
+  u.__initData = __initData;
+  const derivedValue2 = useDerivedValue(u);
+  const r137 = function c() {
+    _ReanimatedRexport.runOnJS(_ChatInputUtils.dismissKeyboard)();
+  };
+  r137.__closure = {
+    runOnJS: _ReanimatedRexport.runOnJS,
+    dismissKeyboard: _ChatInputUtils.dismissKeyboard
+  };
+  r137.__workletHash = 4086900686382;
+  r137.__initData = __initData2;
+  const r167 = PanGestureAnimations({
+    lowerBounds: -width,
+    upperBounds: 0,
+    translate: sharedValue,
+    vertical: false,
+    snapPositions: derivedValue2,
+    onStart: useCallback(r137, []),
+    isGestureInProgress: sharedValue3
+  }).enabled(r126).failOffsetY([-PAN_GESTURE_FAIL_OFFSET_Y, PAN_GESTURE_FAIL_OFFSET_Y]).activeOffsetX([-SWIPE_TO_CHAT_ACTIVE_OFFSET, SWIPE_TO_CHAT_ACTIVE_OFFSET]).withRef(ref);
+  const r177 = useModalPanGesture({
+    gestureEnabled,
+    height,
+    maxTranslate,
+    thresholdTranslate: 0.5 * height,
+    translateY: sharedValue2
+  }).withRef(ref4).requireExternalGestureToFail(ref3, ref2);
+  useLayoutEffect(() => {
+    maybeShowAgeGateModal(channelId);
+  }, [channelId]);
+  const oe = () => {
+    const r12 = sharedValue2.get();
+    return {
+      flex: 1,
+      transform: [{
+        translateY: _ReanimatedRexport.interpolate(r12, [0, c18087_12], [0, c18087_12])
+      }]
+    };
+  };
+  oe.__closure = {
+    interpolate: _ReanimatedRexport.interpolate,
+    translateY: sharedValue2,
+    maxVerticalTranslate: maxTranslate
+  };
+  oe.__workletHash = 8643926178558;
+  oe.__initData = __initData9;
+  const animatedStyle = useAnimatedStyle(oe);
+  const memo = useMemo(() => ({
+    memberListRef: ref3,
+    translateX: sharedValue,
+    swipeDismissRef: ref4,
+    swipeToChatRef: ref,
+    videoGridRef: ref2,
+    openChat: (a0) => {
+      _ChatInputUtils.dismissKeyboard();
+      _ReanimatedRexport.runOnJS(setVoiceChatDrawerState)(channelId, VoiceChatDrawerState.OPENING);
+      const n = function n() {
+        if (a0 === true) {
+          sharedValue.set(-width);
+        } else {
+          sharedValue.set(_PanGestureAnimations.withPanGestureTiming(-width));
+        }
+      };
+      n.__closure = {
+        immediate: a0,
+        translateX: sharedValue,
+        width,
+        withPanGestureTiming: _PanGestureAnimations.withPanGestureTiming
+      };
+      n.__workletHash = 16904415853957;
+      n.__initData = __initData10;
+      runOnUI(n)();
+    },
+    openVoice: () => {
+      _ReanimatedRexport.runOnJS(setVoiceChatDrawerState)(channelId, VoiceChatDrawerState.CLOSING);
+      _ChatInputUtils.dismissKeyboard();
+      const r23 = function t() {
+        sharedValue.set(_PanGestureAnimations.withPanGestureTiming(0));
+      };
+      r23.__closure = {
+        translateX: sharedValue,
+        withPanGestureTiming: _PanGestureAnimations.withPanGestureTiming
+      };
+      r23.__workletHash = 15753790715008;
+      r23.__initData = __initData11;
+      runOnUI(r23)();
+    },
+    setIsSwipeToChatDisabled: setState
+  }), [ref3, ref4, ref, ref2, sharedValue, width, channelId]);
+  return stateFromStores != null ? <AnalyticsLocationProvider value={analyticsLocations}>
+    <GestureDetector gesture={Gesture.Exclusive(r167, r177)}>
+      <ReanimatedRexport.View style={animatedStyle}>
+        <VoiceChatNavigationContext.Provider value={memo}>
+          <Component2 channelId={channelId} />
+          <ChannelCallCameraPreview channel={stateFromStores} />
+        </VoiceChatNavigationContext.Provider>
+      </ReanimatedRexport.View>
+    </GestureDetector>
+  </AnalyticsLocationProvider> : null;
+});
+ChannelCallModal.modalConfig = {
+  animation: ModalAnimation.SLIDE_UP,
+  shouldPersistUnderModals: true
+};
+export default ChannelCallModal;
+export { ChannelCallCameraPreview };
+export { ChannelCallModal };

modules/video_calls/native/components/ChannelCallModalManager.tsx

@@ -0,0 +1,32 @@
+// Metro module 10674 (f10675).
+import UserStore from "../../../../stores/UserStore";
+import VoiceStateStore from "../../../../stores/VoiceStateStore";
+import LifecycleManager from "../../../../lib/LifecycleManager";
+import Dispatcher from "../../../../Dispatcher";
+import { dismissVoiceChannelScreens } from "../../../../utils/native/PrivateChannelCallUtils";
+class ChannelCallModalManager extends LifecycleManager {
+  inVoiceChannel = false;
+  handleCloseModal = () => {
+    const channel = this.channel;
+    const currentUser = UserStore.getCurrentUser();
+    const inVoiceChannel = channel != null && currentUser != null && VoiceStateStore.isInChannel(channel.id, currentUser.id);
+    if (channel != null && this.inVoiceChannel && this.inVoiceChannel !== inVoiceChannel) {
+      Dispatcher.wait(() => {
+        dismissVoiceChannelScreens(channel);
+      });
+      this.terminate();
+    }
+    this.inVoiceChannel = inVoiceChannel;
+  };
+  _initialize(a0) {
+    this.channel = a0;
+    const currentUser = UserStore.getCurrentUser();
+    this.inVoiceChannel = a0 != null && currentUser != null && VoiceStateStore.isInChannel(a0.id, currentUser.id);
+    VoiceStateStore.addChangeListener(this.handleCloseModal);
+  }
+  _terminate() {
+    VoiceStateStore.removeChangeListener(this.handleCloseModal);
+  }
+}
+const channelCallModalManager = new ChannelCallModalManager();
+export default channelCallModalManager;

modules/video_calls/native/components/ChannelCallNavigator.tsx

@@ -0,0 +1,238 @@
+// Metro module 10675 (f10676).
+import { useState, useId, useEffect } from "react";
+import { StyleSheet, View } from "react-native";
+import SafeAreaDisabledStore from "../../../panels/morphable/native/SafeAreaDisabledStore";
+import { ChannelCallScreens } from "../ChannelCallConstants";
+import { ComponentActions } from "../../../../Constants";
+import { OAUTH2_AUTHORIZE_MODAL_KEY } from "../../../oauth2/native/Constants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import { useVoiceChatNavigationContext } from "../../../voice_chat/native/VoiceChatModalContext";
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import ReanimatedRexport, { useAnimatedStyle, useAnimatedReaction } from "../../../reanimated/ReanimatedRexport";
+import StageChannelCallNavigator from "../../../stage_channels/native/components/StageChannelCallNavigator";
+import ChannelVoiceChat from "./ChannelVoiceChat";
+import { useIsConnectedToVoiceChannel } from "../../../voice_chat/VoiceChatHooks";
+import { useIsChannelContentGated } from "../../../age_gate/AgeGateUtils";
+import ModalActionCreators from "../../../../actions/ModalActionCreators";
+import { ComponentDispatch } from "../../../../utils/ComponentDispatchUtils";
+import { useIsVoiceChannelLocked } from "../../../voice_calls/useIsVoiceChannelFull";
+import GuildNSFW from "../../../../components_native/warnings/GuildNSFW";
+import useColorThemeBackground from "../../../client_themes/native/useColorThemeBackground";
+import GlobalStatusIndicator from "../../../connectivity/native/components/GlobalStatusIndicator";
+import { isAndroid } from "../../../../utils/PlatformUtils";
+import { ThemeContextProvider } from "../../../../_bundle/Module3901";
+import GuildThemeGuildIdOverrideContext from "../../../guild_themes/native/GuildThemeGuildIdOverrideContext";
+import { Navigator } from "../../../../design/components/Navigator/native/Navigator.native";
+let useStyles, __initData, __initData2, __initData3, __initData4, MainCallScreen;
+const CallWithVoiceChat = function CallWithVoiceChat(props) {
+  let setState;
+  const channel2 = props.channel;
+  setState = void 0;
+  const styles = useStyles();
+  const width = 2 * useWindowDimensions_native().width;
+  const translateX = useVoiceChatNavigationContext()?.translateX;
+  const r33 = function() {
+    let translateX2 = translateX == null ? void 0 : translateX.get();
+    if (translateX2 == null) {
+      translateX2 = 0;
+    }
+    return {
+      width,
+      transform: [{
+        translateX: translateX2
+      }]
+    };
+  };
+  r33.__closure = {
+    width,
+    translateX
+  };
+  r33.__workletHash = 4309613236072;
+  r33.__initData = __initData;
+  const animatedStyle2 = useAnimatedStyle(r33);
+  const c = function c() {
+    let r7 = translateX == null ? void 0 : translateX.get();
+    if (r7 == null) {
+      r7 = 0;
+    }
+    return {
+      backgroundColor: "black",
+      opacity: _ReanimatedRexport.interpolate(r7, [-width, 0], [0.9, 0])
+    };
+  };
+  c.__closure = {
+    interpolate: _ReanimatedRexport.interpolate,
+    translateX,
+    width
+  };
+  c.__workletHash = 1339801810447;
+  c.__initData = __initData2;
+  const animatedStyle = useAnimatedStyle(c);
+  let r47 = translateX == null ? void 0 : translateX.get();
+  if (r47 == null) {
+    r47 = 0;
+  }
+  let state;
+  [state, setState] = useState(r47 > 0);
+  const _ = function _() {
+    const r5 = Math;
+    let r9 = translateX == null ? void 0 : translateX.get();
+    if (r9 == null) {
+      r9 = 0;
+    }
+    return r5.abs(r9) > 0;
+  };
+  _.__closure = {
+    translateX
+  };
+  _.__workletHash = 3076815293699;
+  _.__initData = __initData3;
+  const h = function h(a0, a1) {
+    if (a0 ? a0 !== a1 : a0) {
+      _ReanimatedRexport.runOnJS(setState)(true);
+    }
+  };
+  h.__closure = {
+    runOnJS: _ReanimatedRexport.runOnJS,
+    setShouldRenderChat: setState
+  };
+  h.__workletHash = 661145094859;
+  h.__initData = __initData4;
+  useAnimatedReaction(_, h);
+  return <ReanimatedRexport.View style={[styles.textInVoiceContainer, animatedStyle2]}>
+    <View style={styles.voiceContainer}>
+      {channel2.isGuildStageVoice() ? <StageChannelCallNavigator channel={channel2} /> : null}
+      <ReanimatedRexport.View pointerEvents="box-none" style={[animatedStyle, StyleSheet.absoluteFill]} />
+    </View>
+    <View style={styles.textContainer}>
+      {state ? <ChannelVoiceChat channel={channel2} /> : null}
+    </View>
+  </ReanimatedRexport.View>;
+};
+MainCallScreen = function MainCallScreen(props) {
+  let r40;
+  let isConnectedToVoiceChannel, id;
+  L9: {
+    const channel2 = props.channel;
+    isConnectedToVoiceChannel = void 0;
+    id = void 0;
+    const styles = useStyles();
+    isConnectedToVoiceChannel = useIsConnectedToVoiceChannel(channel2);
+    id = useId();
+    useEffect(() => {
+      SafeAreaDisabledStore.getState().requestSafeAreaDisableLock({
+        key: id,
+        lockEnabled: isConnectedToVoiceChannel
+      });
+      return () => {
+        SafeAreaDisabledStore.getState().requestSafeAreaDisableLock({
+          key: id,
+          lockEnabled: false
+        });
+      };
+    }, [isConnectedToVoiceChannel, id]);
+    const isChannelContentGated = useIsChannelContentGated(channel2);
+    useEffect(() => {
+      let c26790_0, showOAuth2Modal2, _showOAuth2Modal2;
+      const dismissOAuthModal2 = function dismissOAuthModal() {
+        if (c26790_0) {
+          ModalActionCreators.popWithKey(OAUTH2_AUTHORIZE_MODAL_KEY);
+          c26790_0 = false;
+        }
+      };
+      showOAuth2Modal2 = function showOAuth2Modal() {
+        return _showOAuth2Modal2.apply(this, arguments);
+      };
+      _showOAuth2Modal2 = function _showOAuth2Modal() {
+        const r9 = async (c31588_0) => {
+          let c31588_1;
+          c31588_1 = void 0;
+          ModalActionCreators.popWithKey(OAUTH2_AUTHORIZE_MODAL_KEY);
+          await ModalActionCreators.pushLazy(import("../../../oauth2/native/OAuth2AuthorizeModal"), {
+            ...c31588_0,
+            dismissOAuthModal: dismissOAuthModal2
+          }, OAUTH2_AUTHORIZE_MODAL_KEY);
+          c26790_0 = true;
+        };
+        _showOAuth2Modal2 = r9;
+        return r9.apply(this, arguments);
+      };
+      c26790_0 = false;
+      ComponentDispatch.subscribe(ComponentActions.SHOW_OAUTH2_MODAL, showOAuth2Modal2);
+      return () => {
+        ComponentDispatch.unsubscribe(ComponentActions.SHOW_OAUTH2_MODAL, showOAuth2Modal2);
+        if (c26790_0) {
+          ModalActionCreators.popWithKey(OAUTH2_AUTHORIZE_MODAL_KEY);
+          c26790_0 = false;
+        }
+      };
+    }, []);
+    const isVoiceChannelLocked = useIsVoiceChannelLocked(channel2);
+    if (isChannelContentGated) {
+      r40 = <GuildNSFW onReturnToSafety={ModalActionCreators.pop} guildId={channel2.guild_id} channelId={channel2.id} />;
+    } else {
+      if (!isVoiceChannelLocked && !channel2.isVocalThread()) {
+        r40 = <CallWithVoiceChat channel={channel2} />;
+        break L9;
+      }
+      r40 = <View style={styles.flex}>
+        {channel2.isGuildStageVoice() ? <StageChannelCallNavigator channel={channel2} /> : null}
+      </View>;
+    }
+  }
+  const colorThemeBackground = useColorThemeBackground();
+  return <GlobalStatusIndicator forceHide={isAndroid() || !isConnectedToVoiceChannel} showWhenParticipantOnScreen={!isConnectedToVoiceChannel}>
+    <ThemeContextProvider gradient={colorThemeBackground}>{r40}</ThemeContextProvider>
+  </GlobalStatusIndicator>;
+};
+useStyles = createStyles({
+  flex: {
+    flex: 1,
+    alignSelf: "stretch"
+  },
+  textInVoiceContainer: {
+    ...StyleSheet.absoluteFillObject,
+    right: void 0
+  },
+  voiceContainer: {
+    ...StyleSheet.absoluteFillObject,
+    right: "50%"
+  },
+  textContainer: {
+    ...StyleSheet.absoluteFillObject,
+    left: "50%"
+  }
+});
+__initData = {
+  code: "function ChannelCallNavigatorTsx1(){const{width,translateX}=this.__closure;var _translateX$get,_translateX;return{width:width,transform:[{translateX:(_translateX$get=(_translateX=translateX)===null||_translateX===void 0?void 0:_translateX.get())!==null&&_translateX$get!==void 0?_translateX$get:0}]};}"
+};
+__initData2 = {
+  code: "function ChannelCallNavigatorTsx2(){const{interpolate,translateX,width}=this.__closure;var _translateX$get,_translateX;return{backgroundColor:'black',opacity:interpolate((_translateX$get=(_translateX=translateX)===null||_translateX===void 0?void 0:_translateX.get())!==null&&_translateX$get!==void 0?_translateX$get:0,[-width,0],[0.9,0])};}"
+};
+__initData3 = {
+  code: "function ChannelCallNavigatorTsx3(){const{translateX}=this.__closure;var _translateX$get,_translateX;return Math.abs((_translateX$get=(_translateX=translateX)===null||_translateX===void 0?void 0:_translateX.get())!==null&&_translateX$get!==void 0?_translateX$get:0)>0;}"
+};
+__initData4 = {
+  code: "function ChannelCallNavigatorTsx4(isMoving,previous){const{runOnJS,setShouldRenderChat}=this.__closure;if(!isMoving||isMoving===previous)return;runOnJS(setShouldRenderChat)(true);}"
+};
+export default function ChannelCallNavigator(props) {
+  const channel2 = props.channel;
+  const MAIN_CALL_SCREEN = ChannelCallScreens.MAIN_CALL_SCREEN;
+  let guild_id = channel2.guild_id;
+  if (guild_id == null) {
+    guild_id = null;
+  }
+  const channel = channel2;
+  const screens = {};
+  screens[ChannelCallScreens.MAIN_CALL_SCREEN] = {
+    headerShown: false,
+    ignoreKeyboard: true,
+    gestureEnabled: false,
+    title: "",
+    render: () => <MainCallScreen channel={channel} />
+  };
+  return <GuildThemeGuildIdOverrideContext.Provider value={guild_id}>
+    <Navigator screens={screens} initialRouteName={MAIN_CALL_SCREEN} />
+  </GuildThemeGuildIdOverrideContext.Provider>;
+};

modules/video_calls/native/components/ChannelCallNavigatorIcon.tsx

@@ -0,0 +1,72 @@
+// Metro module 10722 (f10723).
+import { StyleSheet, View } from "react-native";
+import { resetFocusTimer } from "../ChannelCallStore";
+import { Fonts } from "../../../../Constants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import { PressableOpacity } from "../../../../design/void/Pressables/native/Pressables";
+import { isThemeDark } from "../../../../design/shared";
+import VisualEffectView from "../../../visual_effect_view/native/VisualEffectView";
+import { Icon, LegacyText } from "../../../../design/void/native";
+const useStyles = createStyles({
+  pressableContainer: {
+    marginHorizontal: 4
+  },
+  pressable: {
+    borderRadius: Module712.radii.lg
+  },
+  container: {
+    flexDirection: "row",
+    height: 32,
+    width: 32,
+    borderRadius: Module712.radii.lg,
+    alignItems: "center",
+    justifyContent: "center",
+    overflow: "hidden",
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOW
+  },
+  text: {
+    marginLeft: 4,
+    fontSize: 14,
+    fontFamily: Fonts.PRIMARY_SEMIBOLD,
+    color: Module712.colors.WHITE
+  },
+  disabled: {
+    opacity: 0.5
+  },
+  iconColor: {
+    color: Module712.colors.ICON_SUBTLE
+  }
+});
+export default function ChannelCallNavigatorIcon(props) {
+  const { onPress: onPress2, source, accessibilityLabel, children, membersCount } = props;
+  let disabled = props.disabled;
+  const { theme = "dark", disableBackground = true, containerStyle, IconComponent } = props;
+  const styles = useStyles();
+  const props2 = {
+    accessibilityRole: "button",
+    accessibilityLabel,
+    disabled,
+    style: styles.pressable,
+    onPress: () => {
+      if (resetFocusTimer != null) {
+        resetFocusTimer();
+      }
+      onPress2();
+    },
+    children: null
+  };
+  const style = [styles.container, containerStyle, ,];
+  if (disabled) {
+    disabled = styles.disabled;
+  }
+  style[2] = disabled;
+  props2.children = [<View style={style}>
+    {isThemeDark(theme) ? disableBackground ? null : <VisualEffectView blurTheme="dark" style={StyleSheet.absoluteFill} /> : null}
+    {IconComponent != null ? <IconComponent color={styles.iconColor.color} size="sm" /> : <Icon source={source} color={styles.iconColor.color} size={Icon.Sizes.SMALL_20} />}
+    {membersCount != null && membersCount > 0 && <LegacyText style={styles.text}>{membersCount}</LegacyText>}
+  </View>, children];
+  return <View style={styles.pressableContainer}>
+    <PressableOpacity {...props2} />
+  </View>;
+};

modules/video_calls/native/components/ChannelCallSingleController.tsx

@@ -0,0 +1,37 @@
+// Metro module 10816 (f10817).
+import { useEffect } from "react";
+import ApplicationStreamingStore from "../../../../stores/ApplicationStreamingStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import { AnalyticEvents } from "../../../../Constants";
+import { ParticipantTypes } from "../../../calls/CallConstants";
+import AnalyticsUtils from "../../../../utils/AnalyticsUtils";
+import { collectVoiceAnalyticsMetadata } from "../../../app_analytics/AppAnalyticsUtils";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import SingleScreenshare from "./SingleScreenshare";
+import SingleStream from "./SingleStream";
+import SingleVideoCall from "./SingleVideoCall";
+export function ChannelCallSingleController(props) {
+  const { selectedParticipant, channel } = props;
+  useEffect(() => {
+    AnalyticsUtils.track(AnalyticEvents.VIDEO_LAYOUT_TOGGLED, {
+      video_layout: "focus",
+      ...collectVoiceAnalyticsMetadata(channel.id)
+    });
+  }, [channel.id]);
+  const stateFromStores = useStateFromStores([ApplicationStreamingStore], () => ApplicationStreamingStore.getActiveStreamForStreamKey(selectedParticipant.id));
+  const type = selectedParticipant.type;
+  if (ParticipantTypes.STREAM === type) {
+    const id = selectedParticipant.user.id;
+    const id2 = AuthenticationStore.getId();
+    return stateFromStores != null ? id === id2 ? <SingleScreenshare participant={selectedParticipant} channel={channel} /> : <SingleStream participant={selectedParticipant} channel={channel} /> : null;
+  }
+  if (ParticipantTypes.USER === type) {
+    return <SingleVideoCall participant={selectedParticipant} channel={channel} />;
+  }
+  if (ParticipantTypes.HIDDEN_STREAM === type) {
+    return null;
+  }
+  if (ParticipantTypes.ACTIVITY === type) {
+    throw new Error("Activities are not supported on old voice UI");
+  }
+}

modules/video_calls/native/components/ChannelVoiceChat.tsx

@@ -0,0 +1,113 @@
+// Metro module 10234 (f10235).
+import { memo, useEffect, useRef } from "react";
+import { View } from "react-native";
+import { useIsVoiceChatFocused } from "../ChannelCallStore";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import MessageManager from "../../../messages/MessageManager";
+import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
+import { useVoiceChatNavigationContext } from "../../../voice_chat/native/VoiceChatModalContext";
+import Module12 from "../../../../_bundle/Module12";
+import { useIsConnectedToVoiceChannel } from "../../../voice_chat/VoiceChatHooks";
+import useTheme from "../../../../hooks/useTheme";
+import ThemedGradient from "../../../client_themes/native/ThemedGradient";
+import { ChannelContainer } from "../../../../components_native/ChannelContainer";
+import StatusBar_android from "../../../status_bar/native/components/StatusBar.android";
+import ChatView from "../../../chat/native/ChatView";
+import { PressableOpacity } from "../../../../design/void/Pressables/native/Pressables";
+import { intl, t } from "../../../../intl/index.native";
+import { Icon } from "../../../../design/void/native";
+import Module10028 from "../../../../_bundle/Module10028";
+import { ChannelTitle } from "../../../navbars/native/components/ChannelNavbar";
+const useStyles = createStyles({
+  chat: {
+    flex: 1,
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOW,
+    alignSelf: "stretch"
+  },
+  chatHeaderSpacer: {
+    height: 44,
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOW
+  },
+  chatHeader: {
+    flexDirection: "row",
+    alignSelf: "stretch",
+    height: 44,
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOW,
+    alignItems: "center",
+    justifyContent: "flex-start",
+    position: "absolute",
+    left: 0,
+    right: 0,
+    paddingHorizontal: 16
+  },
+  chatHeaderBackIconContainer: {
+    width: 32,
+    height: 32,
+    alignItems: "flex-start",
+    justifyContent: "center"
+  },
+  chatHeaderTitleContainer: {
+    alignSelf: "stretch",
+    flex: 1,
+    justifyContent: "center",
+    marginStart: 16
+  },
+  safeAreaTop: {
+    alignSelf: "stretch",
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOW
+  }
+});
+const r54 = memo(function(a0) {
+  const channel = a0.channel;
+  const { id, guild_id } = channel;
+  const { channel: channel2, inModal = false } = a0;
+  const styles = useStyles();
+  const isVoiceChatFocused = useIsVoiceChatFocused();
+  useEffect(() => {
+    MessageManager.fetchMessages({
+      guildId: guild_id,
+      channelId: id
+    });
+  }, [id, guild_id]);
+  const safeAreaInsets_native = useSafeAreaInsets_native();
+  const { top, left, right } = safeAreaInsets_native;
+  let onPress = useVoiceChatNavigationContext()?.openVoice;
+  if (onPress == null) {
+    onPress = Module12.noop;
+  }
+  const isConnectedToVoiceChannel = useIsConnectedToVoiceChannel(channel2);
+  const ref = useRef(null);
+  const theme = useTheme();
+  const importantForAccessibility = isVoiceChatFocused ? "yes" : "no-hide-descendants";
+  const style = [styles.chat, inModal ? void 0 : {
+    paddingLeft: left,
+    paddingRight: right
+  }];
+  return <View importantForAccessibility={importantForAccessibility} accessibilityElementsHidden={!isVoiceChatFocused} style={style}>
+    <ThemedGradient absolute tall />
+    <ChannelContainer guildId={guild_id} channelId={id}>
+      {inModal ? null : <StatusBar_android hidden={isVoiceChatFocused ? !isVoiceChatFocused : void 0} animated barStyle={isConnectedToVoiceChannel ? "light-content" : theme === "dark" ? "light-content" : "dark-content"} />}
+      <View style={[styles.safeAreaTop, {
+        height: top,
+        display: inModal ? "none" : void 0
+      }]} />
+      <View style={[styles.chatHeaderSpacer, {
+        display: inModal ? "none" : void 0
+      }]} />
+      <ChatView guildId={guild_id} channelId={id} chatInputRef={ref} screenIndex="voice-panel" />
+      <View style={[styles.chatHeader, {
+        top,
+        display: inModal ? "none" : void 0
+      }]}>
+        <PressableOpacity accessibilityRole="button" onPress={onPress} accessibilityLabel={intl.string(t["13/7kX"])} style={styles.chatHeaderBackIconContainer}>
+          <Icon source={Module10028} size={Icon.Sizes.MEDIUM} />
+        </PressableOpacity>
+        <View style={styles.chatHeaderTitleContainer}>
+          <ChannelTitle guildId={guild_id} channelId={id} />
+        </View>
+      </View>
+    </ChannelContainer>
+  </View>;
+});
+export default r54;

modules/video_calls/native/components/ChannelVoiceChatModal.tsx

@@ -0,0 +1,31 @@
+// Metro module 10233 (f10234).
+import { useEffect } from "react";
+import useChannelName from "../../../channel/useChannelName";
+import ChannelRTCActionCreators from "../../../../actions/ChannelRTCActionCreators";
+import ModalStackNavigator from "../../../main_tabs_v2/native/utils/ModalStackNavigator";
+import { StageIcon } from "../../../../design/components/Icon/native/redesign/generated/StageIcon";
+import GuildThemeGuildIdOverrideContext from "../../../guild_themes/native/GuildThemeGuildIdOverrideContext";
+import ChannelVoiceChat from "./ChannelVoiceChat";
+export default function ChannelVoiceChatModal(props) {
+  const channel = props.channel;
+  const channelName = useChannelName(channel);
+  useEffect(() => {
+    ChannelRTCActionCreators.updateChatOpen(channel.id, true);
+    return () => {
+      ChannelRTCActionCreators.updateChatOpen(channel.id, false);
+    };
+  }, [channel.id]);
+  let title = channelName;
+  if (title == null) {
+    title = "";
+  }
+  return <ModalStackNavigator screenKey="StageVoiceChat" title={title} titleIcon={<StageIcon size="sm" />} render={() => {
+    let guild_id = channel.guild_id;
+    if (guild_id == null) {
+      guild_id = null;
+    }
+    return <GuildThemeGuildIdOverrideContext.Provider value={guild_id}>
+      <ChannelVoiceChat channel={channel} inModal />
+    </GuildThemeGuildIdOverrideContext.Provider>;
+  }} />;
+};

modules/video_calls/native/components/Constants.tsx

@@ -0,0 +1,6 @@
+// Metro module 10508 (f10509).
+export const PIP_GESTURE_ACTIVE_OFFSET = 2;
+export const SWIPE_TO_CHAT_ACTIVE_OFFSET = 16;
+export const PAN_GESTURE_FAIL_OFFSET_Y = 5;
+export const PIP_FOCUS_SCALE = 1.5;
+export const OLD_VOICE_UI_ERROR_STRING = "\nOld Voice UI slated for deletion, if you are seeing\nthis error some old voice code can still run in the mobile redesign,\nand may have been deleted accidentally.\n";

modules/video_calls/native/components/DCDVideoRenderer.tsx

@@ -0,0 +1,8 @@
+// Metro module 10565 (f10566).
+import requireNativeComponentOrDefault_native from "../../../../utils/native/requireNativeComponentOrDefault.native";
+import Module10566 from "../../../../_bundle/Module10566";
+const r15 = requireNativeComponentOrDefault_native({
+  componentName: "DCDVideoRenderer",
+  componentFoundInstance: Module10566
+});
+export default r15;

modules/video_calls/native/components/DisconnectRemoteButton.tsx

@@ -0,0 +1,27 @@
+// Metro module 10806 (f10807).
+import GameConsoleStore from "../../../game_console/GameConsoleStore";
+import { useStateFromStoresObject } from "../../../../_bundle/Module589";
+import { PrimaryActionButton } from "./CallBarAction";
+import Module7699 from "../../../../_bundle/Module7699";
+import Module10761 from "../../../../_bundle/Module10761";
+import { intl, t } from "../../../../intl/index.native";
+import { remoteDisconnect, disconnectRemote } from "../../../game_console/GameConsoleActionCreators";
+import { handleDisconnect } from "../../../voice_calls/native/CallsUtils";
+export function DisconnectRemoteButton(props) {
+  let remoteSessionId;
+  const { channel, isSmallSize } = props;
+  remoteSessionId = void 0;
+  const stateFromStoresObject = useStateFromStoresObject([GameConsoleStore], () => ({
+    awaitingRemote: GameConsoleStore.getAwaitingRemoteSessionInfo() != null,
+    remoteSessionId: GameConsoleStore.getRemoteSessionId()
+  }));
+  remoteSessionId = stateFromStoresObject.remoteSessionId;
+  return <PrimaryActionButton source={stateFromStoresObject.awaitingRemote ? Module7699 : Module10761} accessibilityLabel={intl.string(t["6vrfgt"])} isSmallSize={isSmallSize} onPress={() => {
+    if (remoteSessionId != null) {
+      remoteDisconnect(remoteSessionId);
+      handleDisconnect(channel);
+    } else {
+      disconnectRemote();
+    }
+  }} />;
+}

modules/video_calls/native/components/FocusedControls.tsx

@@ -0,0 +1,185 @@
+// Metro module 10685 (f10686).
+import { memo, useContext } from "react";
+import { StyleSheet, View } from "react-native";
+import { AnalyticEvents } from "../../../../Constants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import { STANDARD_EASING } from "../../../../design/void/native";
+import ReanimatedRexport, { useDerivedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import useIsInvitedToSpeak from "../../../stage_channels/useIsInvitedToSpeak";
+import * as _timing from "../../../../design/animation/reanimated/timing/timing";
+import { SafeAreaPaddingView } from "../../../../components_native/common/SafeAreaView";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import { Svg, Defs, LinearGradient, Stop, Rect } from "../../../../_bundle/Module8531";
+import { useGlobalStatusIndicatorState } from "../../../connectivity/native/useGlobalStatusIndicatorState";
+import { useGlobalStatusIndicatorHeightSharedValue } from "../../../connectivity/native/components/GlobalStatusIndicator";
+import { RevealContext } from "./RevealProvider";
+import { useIsScreenReaderEnabled } from "../../../a11y/native/useIsScreenReaderEnabled.native";
+import useAnalyticsLocations from "../../../app_analytics/useAnalyticsLocations";
+import AnalyticsLocation from "../../../app_analytics/AnalyticsLocation";
+import useCurrentEmbeddedActivity from "../../../activities/utils/useCurrentEmbeddedActivity";
+import FocusedControlsBottomControls from "./FocusedControlsBottomControls";
+import AnalyticsUtils from "../../../../utils/AnalyticsUtils";
+let useStyles, TIMING_CONFIG, __initData, __initData2, FocusedControlsHeaderGradient, __initData3, __initData4, __initData5;
+const FocusedControlsHeader = function FocusedControlsHeader(props) {
+  let derivedValue;
+  const { header, reveal, isTouchingLeftScreenEdge } = props;
+  derivedValue = void 0;
+  const styles = useStyles();
+  const l = function l() {
+    return reveal ? 0 : -54;
+  };
+  l.__closure = {
+    reveal,
+    FOCUSED_CONTROLS_HEADER_HEIGHT: 54
+  };
+  l.__workletHash = 15509217225804;
+  l.__initData = __initData;
+  derivedValue = useDerivedValue(l);
+  const isInvitedToSpeak = useIsInvitedToSpeak();
+  const c = function c() {
+    return {
+      transform: [{
+        translateY: _timing.withTiming(derivedValue.get(), TIMING_CONFIG)
+      }]
+    };
+  };
+  c.__closure = {
+    withTiming: _timing.withTiming,
+    offsetY: derivedValue,
+    TIMING_CONFIG
+  };
+  c.__workletHash = 12710345257882;
+  c.__initData = __initData2;
+  return <ReanimatedRexport.View style={useAnimatedStyle(c)}>
+    <SafeAreaPaddingView top={!isInvitedToSpeak} left={isTouchingLeftScreenEdge} right>
+      <View style={styles.headerContainer}>{header}</View>
+    </SafeAreaPaddingView>
+  </ReanimatedRexport.View>;
+};
+FocusedControlsHeaderGradient = function FocusedControlsHeaderGradient() {
+  const styles = useStyles();
+  const width = useWindowDimensions_native().width;
+  return <View style={[styles.backgroundGradient, {
+    width
+  }]}>
+    <Svg height="100%" width={width}>
+      <Defs>
+        <LinearGradient id="grad" y1="0%" x1="0" x2="0" y2="100%">
+          <Stop offset="0%" stopColor="black" stopOpacity=".8" />
+          <Stop offset="66%" stopColor="black" stopOpacity=".51" />
+          <Stop offset="100%" stopColor="black" stopOpacity="0" />
+        </LinearGradient>
+      </Defs>
+      <Rect height="100%" width={width} fill="url(#grad)" />
+    </Svg>
+  </View>;
+};
+useStyles = createStyles({
+  backgroundGradient: {
+    position: "absolute",
+    left: 0,
+    right: 0,
+    top: 0,
+    height: 130
+  },
+  headerContainer: {
+    position: "relative",
+    height: 54
+  }
+});
+TIMING_CONFIG = {
+  easing: STANDARD_EASING,
+  duration: 250
+};
+__initData = {
+  code: "function FocusedControlsTsx1(){const{reveal,FOCUSED_CONTROLS_HEADER_HEIGHT}=this.__closure;return reveal?0:-FOCUSED_CONTROLS_HEADER_HEIGHT;}"
+};
+__initData2 = {
+  code: "function FocusedControlsTsx2(){const{withTiming,offsetY,TIMING_CONFIG}=this.__closure;return{transform:[{translateY:withTiming(offsetY.get(),TIMING_CONFIG)}]};}"
+};
+__initData3 = {
+  code: "function FocusedControlsTsx3(){const{isInvitedToSpeak,statusIndicatorHeight}=this.__closure;return isInvitedToSpeak?statusIndicatorHeight.get():0;}"
+};
+__initData4 = {
+  code: "function FocusedControlsTsx4(){const{reveal}=this.__closure;return reveal?1:0;}"
+};
+__initData5 = {
+  code: "function FocusedControlsTsx5(){const{withTiming,top,TIMING_CONFIG,revealOpacity}=this.__closure;return{top:withTiming(top.get(),TIMING_CONFIG),opacity:withTiming(revealOpacity.get(),TIMING_CONFIG)};}"
+};
+const r47 = memo(function(a0) {
+  const { header, expandedControls, actionBar, children, forceReveal = false, disableGradient = false } = a0;
+  let derivedValue2, derivedValue3, analyticsLocations, c18192_7;
+  let containerStyle = a0.containerStyle;
+  const { omitPTT, bottomHeader, onDrawerClose, channel, isTouchingLeftScreenEdge } = a0;
+  derivedValue2 = void 0;
+  derivedValue3 = void 0;
+  analyticsLocations = void 0;
+  c18192_7 = void 0;
+  const globalStatusIndicatorHeightSharedValue = useGlobalStatusIndicatorHeightSharedValue(useGlobalStatusIndicatorState());
+  const isInvitedToSpeak = useIsInvitedToSpeak();
+  let c18192_2 = isInvitedToSpeak;
+  let reveal2 = useContext(RevealContext).reveal;
+  const isScreenReaderEnabled2 = useIsScreenReaderEnabled();
+  if (!reveal2) {
+    reveal2 = forceReveal;
+  }
+  if (!reveal2) {
+    reveal2 = isScreenReaderEnabled2;
+  }
+  const isScreenReaderEnabled = reveal2;
+  const D = function D() {
+    return c18192_2 ? globalStatusIndicatorHeightSharedValue.get() : 0;
+  };
+  D.__closure = {
+    isInvitedToSpeak,
+    statusIndicatorHeight: globalStatusIndicatorHeightSharedValue
+  };
+  D.__workletHash = 14833624951450;
+  D.__initData = __initData3;
+  derivedValue2 = useDerivedValue(D);
+  const F = function F() {
+    return isScreenReaderEnabled ? 1 : 0;
+  };
+  F.__closure = {
+    reveal: isScreenReaderEnabled
+  };
+  F.__workletHash = 15022275245977;
+  F.__initData = __initData4;
+  derivedValue3 = useDerivedValue(F);
+  const y = function y() {
+    return {
+      top: _timing.withTiming(derivedValue2.get(), TIMING_CONFIG),
+      opacity: _timing.withTiming(derivedValue3.get(), TIMING_CONFIG)
+    };
+  };
+  y.__closure = {
+    withTiming: _timing.withTiming,
+    top: derivedValue2,
+    TIMING_CONFIG,
+    revealOpacity: derivedValue3
+  };
+  y.__workletHash = 8532538341439;
+  y.__initData = __initData5;
+  const animatedStyle = useAnimatedStyle(y);
+  analyticsLocations = useAnalyticsLocations(AnalyticsLocation.FOCUSED_VOICE_CONTROLS).analyticsLocations;
+  c18192_7 = useCurrentEmbeddedActivity();
+  if (containerStyle == null) {
+    containerStyle = StyleSheet.absoluteFill;
+  }
+  return <ReanimatedRexport.View style={[containerStyle, animatedStyle]} pointerEvents={isScreenReaderEnabled ? "box-none" : "none"}>
+    {disableGradient ? null : <FocusedControlsHeaderGradient />}
+    <FocusedControlsHeader header={header} reveal={isScreenReaderEnabled} isTouchingLeftScreenEdge={isTouchingLeftScreenEdge} />
+    {actionBar != null ? expandedControls != null ? <FocusedControlsBottomControls onDrawerOpen={function onDrawerOpen() {
+      const VOICE_BOTTOM_SHEET_EXPANDED = AnalyticEvents.VOICE_BOTTOM_SHEET_EXPANDED;
+      AnalyticsUtils.track(VOICE_BOTTOM_SHEET_EXPANDED, {
+        channel_id: channel.id,
+        guild_id: channel.guild_id,
+        application_id: c18192_7?.applicationId,
+        activity_session_id: c18192_7?.compositeInstanceId,
+        location_stack: analyticsLocations
+      });
+    }} omitPTT={omitPTT} actionBar={actionBar} expandedControls={expandedControls} header={bottomHeader} onDrawerClose={onDrawerClose} reveal={isScreenReaderEnabled}>{children}</FocusedControlsBottomControls> : null : null}
+  </ReanimatedRexport.View>;
+});
+export default r47;
+export const FOCUSED_CONTROLS_HEADER_HEIGHT = 54;

modules/video_calls/native/components/FocusedControlsBottomControls.tsx

@@ -0,0 +1,528 @@
+// Metro module 10697 (f10698).
+import _slicedToArray from "../../../../_bundle/_slicedToArray";
+import { useState, useCallback, useEffect } from "react";
+import { StyleSheet, View, ScrollView, TouchableWithoutFeedback } from "react-native";
+import * as _ChannelCallStore from "../ChannelCallStore";
+import { BOX_MODE_THRESHOLD_WIDTH, BOX_MODE_ACTIONSHEET_HEIGHT } from "../ChannelCallConstants";
+import { Fonts, ComponentActions } from "../../../../Constants";
+import { isIOS } from "../../../../utils/PlatformUtils";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import TextStyles from "../../../rebrand/native/TextStyles";
+import { Tooltip, TooltipArrowPositions, TooltipArrowDirections, STANDARD_EASING } from "../../../../design/void/native";
+import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import ReanimatedRexport, { useAnimatedStyle, useSharedValue, useDerivedValue } from "../../../reanimated/ReanimatedRexport";
+import { useCanShowTooltip } from "../../../tooltip/useCanShowTooltip";
+import * as _ConstantsIOS from "../../../../ConstantsIOS";
+import { intl, t } from "../../../../intl/index.native";
+import { ActionSheetHeaderBar } from "../../../../design/components/Sheet/native/ActionSheetHeaderBar.native";
+import { UNSAFE_markDismissibleContentAsDismissed } from "../../../dismissible_content/DismissibleContentUnsafeUtils";
+import { DismissibleContent } from "../../../../_bundle/Module1358";
+import * as _timing from "../../../../design/animation/reanimated/timing/timing";
+import { Gesture, GestureDetector } from "../../../../_bundle/Module5273";
+import TooltipActionCreators from "../../../tooltip/TooltipActionCreators";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import useBottomVoiceControlsSheetWidth from "../useBottomVoiceControlsSheetWidth";
+import { ComponentDispatch } from "../../../../utils/ComponentDispatchUtils";
+import { useThemeContext } from "../../../../_bundle/Module3901";
+import VisualEffectView from "../../../visual_effect_view/native/VisualEffectView";
+import { isThemeLight } from "../../../../design/shared";
+import CallPTTButton, { CallPTTButtonLooks } from "../../../../components_native/calls/CallPTTButton";
+let FocusedControlsBottomDrawerTooltip, FocusedControlsAboveActionBarView, FocusedControlsBottomDrawer, c7192_15, EXTENDED_CONTROLS_OFFSET_Y, EXTENDED_CONTROLS_LANDSCAPE_OFFSET_Y, useStyles, c7192_19, c7192_20, c7192_21, c7192_23, c7192_25, c7192_27, c7192_28, c7192_29, c7192_30, c7192_31, c7192_32;
+let env7192 = {};
+const FocusedControlsExpanded = function FocusedControlsExpanded(props) {
+  const { expandedControls, availableHeight, positionY } = props;
+  const styles = useStyles();
+  const bottom = useSafeAreaInsets_native().bottom;
+  const [state, setState] = useState(false);
+  const callback2 = useCallback((a0) => {
+    const r1 = a0.nativeEvent.layout.height > availableHeight - bottom;
+    if (r1 !== state) {
+      setState(r1);
+    }
+  }, [availableHeight, bottom, state]);
+  const r32 = function _() {
+    const opacity = Math.min(-1 * positionY.get() / c7192_15, 1);
+    return {
+      opacity,
+      pointerEvents: opacity === 0 ? "none" : "auto"
+    };
+  };
+  r32.__closure = {
+    positionY,
+    EXPANDED_DRAWER_SHOW_POSITION: c7192_15
+  };
+  r32.__workletHash = 10567472250823;
+  r32.__initData = c7192_21;
+  return <View style={{
+    height: availableHeight
+  }}>
+    <ScrollView scrollEnabled={state}>
+      <ReanimatedRexport.View style={[styles.expandedControlsContainer, useAnimatedStyle(r32)]} onLayout={callback2}>{expandedControls}</ReanimatedRexport.View>
+    </ScrollView>
+  </View>;
+};
+FocusedControlsBottomDrawerTooltip = function FocusedControlsBottomDrawerTooltip(props) {
+  const positionY2 = props.positionY;
+  const styles = useStyles();
+  const canShowTooltip = useCanShowTooltip(_ConstantsIOS.TooltipNames.SCREENSHARE_SWIPE_UP_CONTROLS, true);
+  const r23 = function() {
+    return {
+      opacity: 1 - Math.min(-1 * positionY2.get() / c7192_15, 1)
+    };
+  };
+  r23.__closure = {
+    positionY: positionY2,
+    EXPANDED_DRAWER_SHOW_POSITION: c7192_15
+  };
+  r23.__workletHash = 4429631762525;
+  r23.__initData = c7192_23;
+  const animatedStyle = useAnimatedStyle(r23);
+  return canShowTooltip ? <ReanimatedRexport.View style={animatedStyle}>
+    <Tooltip style={styles.tooltipStyle} arrowPosition={TooltipArrowPositions.CENTER} arrowDirection={TooltipArrowDirections.DOWN} arrowWidth={8} arrowHeight={4} containerStyle={styles.containerStyle} labelStyle={styles.labelStyle} label={intl.string(t.zYzy2i)} />
+  </ReanimatedRexport.View> : null;
+};
+FocusedControlsAboveActionBarView = function FocusedControlsAboveActionBarView(props) {
+  const { positionY: positionY3, offsetY, aboveActionBar, onPressHeader, isExpanded } = props;
+  const styles = useStyles();
+  const r21 = function _() {
+    return {
+      opacity: 2 - Math.max(Math.abs(positionY3.get()) / (offsetY / 3 - c7192_15), 0)
+    };
+  };
+  r21.__closure = {
+    offsetY,
+    EXPANDED_DRAWER_SHOW_POSITION: c7192_15,
+    positionY: positionY3
+  };
+  r21.__workletHash = 5042367101380;
+  r21.__initData = c7192_25;
+  const animatedStyle = useAnimatedStyle(r21);
+  return <TouchableWithoutFeedback accessible onPress={onPressHeader} accessibilityRole="button" accessibilityLabel="Group DM" accessibilityHint="Press to start a new conversation" accessibilityState={{
+    expanded: isExpanded
+  }}>
+    <View style={styles.aboveActionBarContainer}>
+      <FocusedControlsBottomDrawerTooltip positionY={positionY3} />
+      <ActionSheetHeaderBar />
+      {aboveActionBar != null && <ReanimatedRexport.View style={[styles.aboveActionBarChildrenContainer, animatedStyle]}>{aboveActionBar}</ReanimatedRexport.View>}
+    </View>
+  </TouchableWithoutFeedback>;
+};
+FocusedControlsBottomDrawer = function FocusedControlsBottomDrawer(props) {
+  let env18207 = {
+    $parent: env7192
+  };
+  const { children, expandedControls, actionBarControlsHeight, reveal } = props;
+  env18207[0] = reveal;
+  const aboveActionBar = props.aboveActionBar;
+  env18207[1] = props.onDrawerClose;
+  const onDrawerOpen2 = props.onDrawerOpen;
+  env18207[2] = void 0;
+  env18207[3] = void 0;
+  env18207[4] = void 0;
+  env18207[5] = void 0;
+  env18207[6] = void 0;
+  env18207[7] = void 0;
+  env18207[8] = void 0;
+  env18207[9] = void 0;
+  const styles = useStyles();
+  const safeAreaInsets_native = useSafeAreaInsets_native();
+  const { bottom: bottom2, right } = safeAreaInsets_native;
+  env18207[2] = right;
+  const top = safeAreaInsets_native.top;
+  const windowDimensions_native = useWindowDimensions_native();
+  const height = windowDimensions_native.height;
+  const isLandscapeMode = windowDimensions_native.width > BOX_MODE_THRESHOLD_WIDTH;
+  env18207[3] = isLandscapeMode;
+  const bottomVoiceControlsSheetWidth = useBottomVoiceControlsSheetWidth();
+  env18207[4] = bottomVoiceControlsSheetWidth;
+  const sheetHeight = isLandscapeMode ? Math.min(BOX_MODE_ACTIONSHEET_HEIGHT, height) : height;
+  env18207[5] = sheetHeight;
+  const controlHeightWithOffset = isLandscapeMode ? actionBarControlsHeight : actionBarControlsHeight + bottom2;
+  env18207[6] = controlHeightWithOffset;
+  const controlMaxHeight = sheetHeight - controlHeightWithOffset;
+  env18207[7] = controlMaxHeight;
+  const r55 = sheetHeight - controlHeightWithOffset;
+  const availableHeight2 = isLandscapeMode ? r55 - (top + 54 + 12) : r55 - (top + 54 + (isIOS() ? 48 : 16));
+  const portraitOffsetY = top + 54 + (isIOS() ? 48 : 16) + bottom2;
+  let onDrawerOpen, state2, setState2, sharedValue, derivedValue, sharedValue2, sharedValue3, sharedValue4, callback, handleOpen2, handleClose2;
+  const landscapeOffsetY = top + 54 + 12;
+  let c18208_0 = controlMaxHeight;
+  let c18208_1 = isLandscapeMode;
+  let c18208_2 = portraitOffsetY;
+  let c18208_3 = landscapeOffsetY;
+  const onClose2 = () => {
+    const r3 = env18207[1];
+    return r3 == null ? void 0 : r3();
+  };
+  onDrawerOpen = onDrawerOpen2;
+  state2 = void 0;
+  setState2 = void 0;
+  sharedValue = void 0;
+  derivedValue = void 0;
+  sharedValue2 = void 0;
+  sharedValue3 = void 0;
+  sharedValue4 = void 0;
+  callback = void 0;
+  handleOpen2 = function handleOpen() {
+    if (!state2) {
+      if (onDrawerOpen != null) {
+        onDrawerOpen();
+      }
+      setState2(true);
+    }
+  };
+  handleClose2 = function handleClose() {
+    if (state2) {
+      const r5 = env18207[1];
+      if (r5 != null) {
+        r5();
+      }
+      setState2(false);
+      callback();
+    }
+  };
+  [state2, setState2] = useState(false);
+  sharedValue = useSharedValue(0);
+  const O = function O() {
+    return c18208_1 ? c18208_0 - c18208_3 : c18208_0 - c18208_2;
+  };
+  O.__closure = {
+    isLandscapeMode,
+    controlMaxHeight,
+    landscapeOffsetY,
+    portraitOffsetY
+  };
+  O.__workletHash = 13346503100323;
+  O.__initData = c7192_27;
+  derivedValue = useDerivedValue(O);
+  sharedValue2 = useSharedValue(0);
+  sharedValue3 = useSharedValue(false);
+  sharedValue4 = useSharedValue(0);
+  callback = useCallback(() => {
+    UNSAFE_markDismissibleContentAsDismissed(DismissibleContent.SOUNDBOARD_MOBILE_NEW_BADGE);
+  }, []);
+  const callback2 = useCallback(() => {
+    const r10 = sharedValue.get();
+    let r9 = 0;
+    const r1 = r10 !== 0;
+    if (!r1) {
+      r9 = -derivedValue.get();
+    }
+    sharedValue.set(_timing.withTiming(r9, c7192_19));
+    if (r1) {
+      (0, _ChannelCallStore.resetFocusTimer)();
+      callback();
+    } else {
+      (0, _ChannelCallStore.clearFocusTimer)();
+    }
+    setState2(!r1);
+  }, [sharedValue, derivedValue, callback]);
+  const r132 = Gesture.Pan();
+  const M = function M() {
+    _ReanimatedRexport.runOnJS(_ChannelCallStore.clearFocusTimer)();
+    sharedValue3.set(sharedValue.get() !== 0);
+    sharedValue4.set(0);
+    if (!(sharedValue.get() != null && sharedValue3.get())) {
+      sharedValue2.set(0);
+    }
+  };
+  M.__closure = {
+    runOnJS: _ReanimatedRexport.runOnJS,
+    clearFocusTimer: _ChannelCallStore.clearFocusTimer,
+    drawerOpen: sharedValue3,
+    positionY: sharedValue,
+    CLOSE_DRAWER_POSITION: 0,
+    velocity: sharedValue4,
+    startY: sharedValue2
+  };
+  M.__workletHash = 9674965708496;
+  M.__initData = c7192_30;
+  const r140 = r132.onStart(M);
+  const N = function N(a0) {
+    sharedValue4.set(a0.velocityY);
+    if (!(-1 * sharedValue.get() > derivedValue.get() + 16)) {
+      let r20 = sharedValue2.get();
+      if (r20 == null) {
+        r20 = 0;
+      }
+      sharedValue.set(r20 + a0.translationY);
+    }
+  };
+  N.__closure = {
+    velocity: sharedValue4,
+    positionY: sharedValue,
+    maxHeight: derivedValue,
+    startY: sharedValue2
+  };
+  N.__workletHash = 16755118181071;
+  N.__initData = c7192_29;
+  const r146 = r140.onUpdate(N);
+  const H = function H() {
+    const r10 = sharedValue3.get();
+    const r4 = -1 * sharedValue.get();
+    const r21 = derivedValue.get() / 2;
+    let r24 = sharedValue4.get();
+    if (r24 == null) {
+      r24 = 0;
+    }
+    const r3 = -1 * r24;
+    let r26 = sharedValue4.get();
+    if (r26 == null) {
+      r26 = 0;
+    }
+    L16: {
+      const openDrawer = function openDrawer() {
+        _ReanimatedRexport.runOnJS(handleOpen2)();
+        sharedValue2.set(-derivedValue.get());
+        sharedValue.set(_timing.withTiming(sharedValue2.get(), c7192_19));
+        sharedValue3.set(true);
+        _ReanimatedRexport.runOnJS(TooltipActionCreators.acknowledgeTooltip)(_ConstantsIOS.TooltipNames.SCREENSHARE_SWIPE_UP_CONTROLS);
+      };
+      const r28 = r26 >= 500;
+      const r6 = sharedValue.get() > 0;
+      if (!(500 <= r3 && !r10) && !(r21 <= r4 && !r10)) {
+        L15: {
+          if (!r6) {
+            if (r28 && r10) {
+              break L15;
+            }
+            if (r21 <= r4) {
+              openDrawer();
+              break L16;
+            }
+            sharedValue2.set(0);
+            sharedValue.set(_timing.withTiming(0, c7192_20));
+            sharedValue3.set(false);
+            _ReanimatedRexport.runOnJS(_ChannelCallStore.resetFocusTimer)();
+            _ReanimatedRexport.runOnJS(handleClose2)();
+            break L16;
+          }
+        }
+        sharedValue2.set(0);
+        sharedValue.set(_timing.withTiming(0, c7192_20));
+        sharedValue3.set(false);
+        _ReanimatedRexport.runOnJS(_ChannelCallStore.resetFocusTimer)();
+        _ReanimatedRexport.runOnJS(handleClose2)();
+      } else {
+        openDrawer();
+      }
+    }
+  };
+  const TIMING_CONFIG = c7192_19;
+  H.__closure = {
+    drawerOpen: sharedValue3,
+    positionY: sharedValue,
+    maxHeight: derivedValue,
+    velocity: sharedValue4,
+    MIN_GESTURE_TRIGGER_VELOCITY: 500,
+    CLOSE_DRAWER_POSITION: 0,
+    runOnJS: _ReanimatedRexport.runOnJS,
+    handleOpen: handleOpen2,
+    startY: sharedValue2,
+    withTiming: _timing.withTiming,
+    TIMING_CONFIG,
+    TooltipActionCreators,
+    TooltipNames: _ConstantsIOS.TooltipNames,
+    TIMING_CONFIG_EXIT: c7192_20,
+    resetFocusTimer: _ChannelCallStore.resetFocusTimer,
+    handleClose: handleClose2
+  };
+  H.__workletHash = 6790759206787;
+  H.__initData = c7192_28;
+  const r169 = _slicedToArray([sharedValue, r146.onEnd(H), callback2, state2], 4);
+  const positionY4 = r169[0];
+  env18207[8] = positionY4;
+  const gesture = r169[1];
+  const onPressHeader = r169[2];
+  env18207[9] = onPressHeader;
+  const isExpanded = r169[3];
+  const f = function f() {
+    const r9 = env18207[0] ? 0 : env18207[6];
+    const r3 = env18207[3];
+    return {
+      position: "absolute",
+      height: env18207[5],
+      overflow: "hidden",
+      bottom: r3 ? 16 : 0,
+      right: r3 ? 16 + env18207[2] : 0,
+      borderRadius: r3 ? 8 : 0,
+      width: env18207[4],
+      transform: [{
+        translateY: _timing.withTiming(r9, c7192_19)
+      }]
+    };
+  };
+  f.__closure = {
+    reveal,
+    controlHeightWithOffset,
+    sheetHeight,
+    isLandscapeMode,
+    safeAreaRight: right,
+    sheetWidth: bottomVoiceControlsSheetWidth,
+    withTiming: _timing.withTiming,
+    TIMING_CONFIG
+  };
+  f.__workletHash = 608185354082;
+  f.__initData = c7192_31;
+  const animatedStyle = useAnimatedStyle(f);
+  useEffect(() => {
+    env18207[8].set(_timing.withTiming(0, c7192_20));
+  }, [isLandscapeMode, positionY4]);
+  useEffect(() => {
+    if (env18207[0]) {
+      env18207[8].set(0);
+    }
+  }, [reveal, positionY4]);
+  useEffect(() => {
+    const handleSelectActivity2 = function handleSelectActivity() {
+      env18207[8].set(_timing.withTiming(0, c7192_20));
+    };
+    ComponentDispatch.subscribe(ComponentActions.SELECT_ACTIVITY, handleSelectActivity2);
+    return () => {
+      ComponentDispatch.unsubscribe(ComponentActions.SELECT_ACTIVITY, handleSelectActivity2);
+    };
+  }, [positionY4]);
+  const Z = function Z() {
+    return {
+      height: env18207[5],
+      transform: [{
+        translateY: env18207[7] + env18207[8].get()
+      }]
+    };
+  };
+  Z.__closure = {
+    sheetHeight,
+    offsetY: controlMaxHeight,
+    positionY: positionY4
+  };
+  Z.__workletHash = 4471821639301;
+  Z.__initData = c7192_32;
+  const animatedStyle2 = useAnimatedStyle(Z);
+  useEffect(() => {
+    ComponentDispatch.subscribe(ComponentActions.TOGGLE_CALL_CONTROL_DRAWER, env18207[9]);
+    return () => {
+      ComponentDispatch.unsubscribe(ComponentActions.TOGGLE_CALL_CONTROL_DRAWER, env18207[9]);
+    };
+  }, [onPressHeader]);
+  const theme = useThemeContext().theme;
+  return <ReanimatedRexport.View style={animatedStyle} pointerEvents="box-none">
+    <GestureDetector gesture={gesture}>
+      <ReanimatedRexport.View style={[styles.bottomDrawerContainer, animatedStyle2]}>
+        <VisualEffectView blurTheme={theme} style={[styles.visualEffectView, isThemeLight(theme) ? styles.visualEffectViewBackground : null]} />
+        <FocusedControlsAboveActionBarView onPressHeader={onPressHeader} aboveActionBar={aboveActionBar} positionY={positionY4} offsetY={controlMaxHeight} isExpanded={isExpanded} />
+        {children}
+        <FocusedControlsExpanded expandedControls={expandedControls} availableHeight={availableHeight2} positionY={positionY4} />
+      </ReanimatedRexport.View>
+    </GestureDetector>
+  </ReanimatedRexport.View>;
+};
+c7192_15 = 20;
+EXTENDED_CONTROLS_OFFSET_Y = (a0) => {};
+EXTENDED_CONTROLS_LANDSCAPE_OFFSET_Y = (a0) => {};
+useStyles = createStyles({
+  bottomDrawerContainer: {
+    position: "absolute",
+    left: 0,
+    right: 0,
+    bottom: 0,
+    borderRadius: Module712.radii.sm
+  },
+  visualEffectView: {
+    ...StyleSheet.absoluteFillObject,
+    borderRadius: Module712.radii.sm,
+    overflow: "hidden"
+  },
+  visualEffectViewBackground: {
+    backgroundColor: "rgba(0, 0, 0, .15)"
+  },
+  expandedControlsContainer: {
+    marginHorizontal: 16
+  },
+  aboveActionBarContainer: {
+    position: "absolute",
+    left: 0,
+    right: 0,
+    top: -32,
+    paddingTop: 4,
+    paddingBottom: 8
+  },
+  aboveActionBarChildrenContainer: {
+    position: "absolute",
+    left: 16,
+    right: 16,
+    top: -64
+  },
+  ptbButton: {
+    margin: 0,
+    marginHorizontal: 16,
+    marginBottom: 8
+  },
+  tooltipStyle: {
+    alignSelf: "center",
+    position: "absolute",
+    top: -28
+  },
+  containerStyle: {
+    paddingHorizontal: 8,
+    paddingVertical: 4
+  },
+  labelStyle: {
+    ...TextStyles(Fonts.DISPLAY_EXTRABOLD, Module712.unsafe_rawColors.WHITE, 12, {
+      uppercase: true
+    })
+  }
+});
+c7192_19 = {
+  easing: STANDARD_EASING,
+  duration: 250
+};
+c7192_20 = {
+  easing: STANDARD_EASING,
+  duration: 400
+};
+c7192_21 = {
+  code: "function FocusedControlsBottomControlsTsx1(){const{positionY,EXPANDED_DRAWER_SHOW_POSITION}=this.__closure;const opacity=Math.min(positionY.get()*-1/EXPANDED_DRAWER_SHOW_POSITION,1);return{opacity:opacity,pointerEvents:opacity===0?'none':'auto'};}"
+};
+c7192_23 = {
+  code: "function FocusedControlsBottomControlsTsx2(){const{positionY,EXPANDED_DRAWER_SHOW_POSITION}=this.__closure;return{opacity:1-Math.min(positionY.get()*-1/EXPANDED_DRAWER_SHOW_POSITION,1)};}"
+};
+c7192_25 = {
+  code: "function FocusedControlsBottomControlsTsx3(){const{offsetY,EXPANDED_DRAWER_SHOW_POSITION,positionY}=this.__closure;const maxHeightRange=offsetY/3-EXPANDED_DRAWER_SHOW_POSITION;const opacity=2-Math.max(Math.abs(positionY.get())/maxHeightRange,0);return{opacity:opacity};}"
+};
+c7192_27 = {
+  code: "function FocusedControlsBottomControlsTsx4(){const{isLandscapeMode,controlMaxHeight,landscapeOffsetY,portraitOffsetY}=this.__closure;return isLandscapeMode?controlMaxHeight-landscapeOffsetY:controlMaxHeight-portraitOffsetY;}"
+};
+c7192_28 = {
+  code: "function FocusedControlsBottomControlsTsx5(){const{drawerOpen,positionY,maxHeight,velocity,MIN_GESTURE_TRIGGER_VELOCITY,CLOSE_DRAWER_POSITION,runOnJS,handleOpen,startY,withTiming,TIMING_CONFIG,TooltipActionCreators,TooltipNames,TIMING_CONFIG_EXIT,resetFocusTimer,handleClose}=this.__closure;var _velocity$get,_velocity$get2;const isDrawerAlreadyOpen=drawerOpen.get();const isPassedTriggerThreshold=positionY.get()*-1>=maxHeight.get()/2;const isHighOpenVelocity=((_velocity$get=velocity.get())!==null&&_velocity$get!==void 0?_velocity$get:0)*-1>=MIN_GESTURE_TRIGGER_VELOCITY;const isHighCloseVelocity=((_velocity$get2=velocity.get())!==null&&_velocity$get2!==void 0?_velocity$get2:0)>=MIN_GESTURE_TRIGGER_VELOCITY;const isLowerThanMinHeight=positionY.get()>CLOSE_DRAWER_POSITION;function openDrawer(){runOnJS(handleOpen)();startY.set(-maxHeight.get());positionY.set(withTiming(startY.get(),TIMING_CONFIG));drawerOpen.set(true);runOnJS(TooltipActionCreators.acknowledgeTooltip)(TooltipNames.SCREENSHARE_SWIPE_UP_CONTROLS);}function closeDrawer(){startY.set(0);positionY.set(withTiming(CLOSE_DRAWER_POSITION,TIMING_CONFIG_EXIT));drawerOpen.set(false);runOnJS(resetFocusTimer)();runOnJS(handleClose)();}if(isHighOpenVelocity&&!isDrawerAlreadyOpen||isPassedTriggerThreshold&&!isDrawerAlreadyOpen){openDrawer();}else if(isLowerThanMinHeight||isHighCloseVelocity&&isDrawerAlreadyOpen){closeDrawer();}else if(isPassedTriggerThreshold){openDrawer();}else{closeDrawer();}}"
+};
+c7192_29 = {
+  code: "function FocusedControlsBottomControlsTsx6(event){const{velocity,positionY,maxHeight,startY}=this.__closure;var _startY$get;velocity.set(event.velocityY);if(positionY.get()*-1>maxHeight.get()+16){return;}positionY.set(((_startY$get=startY.get())!==null&&_startY$get!==void 0?_startY$get:0)+event.translationY);}"
+};
+c7192_30 = {
+  code: "function FocusedControlsBottomControlsTsx7(){const{runOnJS,clearFocusTimer,drawerOpen,positionY,CLOSE_DRAWER_POSITION,velocity,startY}=this.__closure;runOnJS(clearFocusTimer)();drawerOpen.set(positionY.get()!==CLOSE_DRAWER_POSITION);velocity.set(0);if(positionY.get()==null||!drawerOpen.get()){startY.set(0);}}"
+};
+c7192_31 = {
+  code: "function FocusedControlsBottomControlsTsx8(){const{reveal,controlHeightWithOffset,sheetHeight,isLandscapeMode,safeAreaRight,sheetWidth,withTiming,TIMING_CONFIG}=this.__closure;const revealOffset=reveal?0:controlHeightWithOffset;return{position:'absolute',height:sheetHeight,overflow:'hidden',bottom:isLandscapeMode?16:0,right:isLandscapeMode?16+safeAreaRight:0,borderRadius:isLandscapeMode?8:0,width:sheetWidth,transform:[{translateY:withTiming(revealOffset,TIMING_CONFIG)}]};}"
+};
+c7192_32 = {
+  code: "function FocusedControlsBottomControlsTsx9(){const{sheetHeight,offsetY,positionY}=this.__closure;return{height:sheetHeight,transform:[{translateY:offsetY+positionY.get()}]};}"
+};
+export default function FocusedControlsBottomControls(props) {
+  const { children, actionBar, expandedControls, reveal, header, onDrawerClose, omitPTT = false, onDrawerOpen: onDrawerOpen2 } = props;
+  const styles = useStyles();
+  const [actionBarControlsHeight, setState3] = useState(0);
+  const callback2 = useCallback((a0) => {
+    setState3(a0.nativeEvent.layout.height);
+  }, []);
+  return <FocusedControlsBottomDrawer aboveActionBar={children} actionBarControlsHeight={actionBarControlsHeight} expandedControls={expandedControls} reveal={reveal} onDrawerClose={onDrawerClose} onDrawerOpen={onDrawerOpen2}>
+    <View onLayout={callback2}>
+      {header}
+      {actionBar}
+      {omitPTT ? null : <CallPTTButton look={CallPTTButtonLooks.BLUR} style={styles.ptbButton} sendCallback={_ChannelCallStore.clearFocusTimer} stopCallback={_ChannelCallStore.resetFocusTimer} />}
+    </View>
+  </FocusedControlsBottomDrawer>;
+};
+export const FOCUSED_CONTROLS_HEADER_HEIGHT = 54;
+export { FocusedControlsBottomDrawer };

modules/video_calls/native/components/FocusedExpandedControls.tsx

@@ -0,0 +1,97 @@
+// Metro module 10808 (f10809).
+import { Image as Image2, View } from "react-native";
+import ApplicationStreamingStore from "../../../../stores/ApplicationStreamingStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import { MediaEngineContextTypes } from "../../../../_bundle/Module4250";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import { Icon } from "../../../../design/void/native";
+import Module10809 from "../../../../_bundle/Module10809";
+import Module10810 from "../../../../_bundle/Module10810";
+import { FormSwitch, FormRow, FormLabel } from "../../../../design/void/Form/native/index";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import useMuteAwareLocalVolume from "../../../media_engine/useMuteAwareLocalVolume";
+import { intl, t } from "../../../../intl/index.native";
+import VolumeSlider from "../../../../components_native/common/VolumeSlider";
+import { isAndroid } from "../../../../utils/PlatformUtils";
+import { useMaskedSpeakerStates } from "../../../voice_calls/native/CallsUtils";
+import { showAudioOutputSelector } from "../../../voice_calls/native/audio_output_selector/showAudioOutputSelector";
+import useScreenshareUtils from "../useScreenshareUtils";
+import useDeafStates from "../../useDeafStates";
+import { createDeafHandler } from "../VoiceActionUtils";
+import Module10813 from "../../../../_bundle/Module10813";
+import Module10814 from "../../../../_bundle/Module10814";
+let useStyles, ExpandedControlItem;
+const ExpandedControlItemIcon = function ExpandedControlItemIcon(props) {
+  const { iconSource, showIconSparkle } = props;
+  const styles = useStyles();
+  if (iconSource == null) {
+    return null;
+  }
+  const r23 = <Icon size={Icon.Sizes.MEDIUM} source={iconSource} style={styles.formTintColor} disableColor />;
+  return showIconSparkle ? <View>
+    {r23}
+    <Image2 style={styles.sparkle2} source={Module10809} />
+    <Image2 style={styles.sparkle} source={Module10810} />
+  </View> : r23;
+};
+ExpandedControlItem = function ExpandedControlItem(props) {
+  const { disabled, iconSource, showIconSparkle = false, label, onPress: onPress2, onSwitchValueChange, switchValue } = props;
+  let trailing = props.trailing;
+  const styles = useStyles();
+  if (trailing == null && switchValue != null) {
+    trailing = <FormSwitch tintColor={Module712.unsafe_rawColors.BRAND_500} renderIosBackground value={switchValue} disabled={disabled} onValueChange={onSwitchValueChange} />;
+  }
+  return <FormRow disabled={disabled} leading={<ExpandedControlItemIcon iconSource={iconSource} showIconSparkle={showIconSparkle} />} label={<FormLabel text={label} style={styles.formColor} />} onPress={onPress2} trailing={trailing} />;
+};
+useStyles = createStyles({
+  formTintColor: {
+    tintColor: Module712.colors.ICON_STRONG
+  },
+  formColor: {
+    color: Module712.colors.MOBILE_TEXT_HEADING_PRIMARY
+  },
+  sparkle: {
+    position: "absolute",
+    bottom: -4,
+    right: "70%"
+  },
+  sparkle2: {
+    position: "absolute",
+    right: -5,
+    height: 10,
+    width: 10
+  }
+});
+export function StreamVolumeItem() {
+  const styles = useStyles();
+  const stateFromStores = useStateFromStores([ApplicationStreamingStore, AuthenticationStore], () => {
+    const lastActiveStream = ApplicationStreamingStore.getLastActiveStream();
+    return lastActiveStream != null ? lastActiveStream.ownerId !== AuthenticationStore.getId() ? lastActiveStream : null : null;
+  });
+  const muteAwareLocalVolume = useMuteAwareLocalVolume(stateFromStores?.ownerId, MediaEngineContextTypes.STREAM);
+  const { effectiveVolume, handleVolumeChange } = muteAwareLocalVolume;
+  const label = <>
+    {[<FormLabel text={intl.string(t.pEAl4b)} style={[styles.formColor, {
+      marginBottom: 16
+    }]} />, <VolumeSlider onResponderGrant={isAndroid() ? () => true : void 0} value={effectiveVolume} onValueChange={handleVolumeChange} color={Module712.unsafe_rawColors.WHITE} maxTrackTintColor={Module712.unsafe_rawColors.PRIMARY_300} />]}
+  </>;
+  return stateFromStores != null ? <FormRow label={label} /> : null;
+}
+export function AudioRouteButton(props) {
+  const { channelId, isConnectedToVoiceChannel } = props;
+  return <ExpandedControlItem onPress={() => {
+    showAudioOutputSelector(channelId, isConnectedToVoiceChannel);
+  }} iconSource={useMaskedSpeakerStates().routeSource} label={intl.string(t["A/Ly/2"])} />;
+}
+export function ScreenshareButton(props) {
+  const { channel, disabled } = props;
+  const screenshareUtils = useScreenshareUtils(channel);
+  const { onPress: onPress2, imgSource, text, isFeatureEnabled } = screenshareUtils;
+  return <ExpandedControlItem disabled={isFeatureEnabled ? disabled : !isFeatureEnabled} onPress={onPress2} iconSource={imgSource} label={text} />;
+}
+export function DeafenButton(props) {
+  const { channel, disabled = false } = props;
+  const deafHandler = createDeafHandler(useDeafStates(channel));
+  return <ExpandedControlItem disabled={disabled} onPress={deafHandler.onPress} iconSource={deafHandler.deaf ? Module10813 : Module10814} label={intl.string(t.wjcRFX)} />;
+}

modules/video_calls/native/components/GestureContainer.tsx

@@ -0,0 +1,90 @@
+// Metro module 10815 (f10816).
+import { View } from "react-native";
+import { useChannelCallStore } from "../ChannelCallStore";
+import { PAN_GESTURE_FAIL_OFFSET_Y, SWIPE_TO_CHAT_ACTIVE_OFFSET } from "./Constants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import ReanimatedRexport, { useSharedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import { Gesture, GestureDetector } from "../../../../_bundle/Module5273";
+import ModalActionCreators from "../../../../actions/ModalActionCreators";
+import * as _timing from "../../../../design/animation/reanimated/timing/timing";
+import * as _native from "../../../../design/void/native";
+const useStyles = createStyles({
+  background: {
+    flex: 1,
+    backgroundColor: Module712.colors.BLACK
+  }
+});
+const __initData = {
+  code: "function GestureContainerTsx1({velocityY:velocityY}){const{position,THRESHOLD_VELOCITY,runOnJS,ModalActionCreators,withTiming,DECELERATED_EASING}=this.__closure;if(position.get()===1||velocityY>THRESHOLD_VELOCITY){runOnJS(ModalActionCreators.pop)();}else{position.set(withTiming(0,{duration:300,easing:DECELERATED_EASING}));}}"
+};
+const __initData2 = {
+  code: "function GestureContainerTsx2({translationY:translationY}){const{THRESHOLD_TRANSLATE,position}=this.__closure;const boundedGestureY=Math.max(Math.min(translationY,THRESHOLD_TRANSLATE),0)/THRESHOLD_TRANSLATE;const easeOutCubic=1-Math.pow(1-boundedGestureY,3);position.set(easeOutCubic);}"
+};
+const __initData3 = {
+  code: "function GestureContainerTsx3(){const{interpolate,position,height}=this.__closure;return{flex:1,transform:[{translateY:interpolate(position.get(),[0,1],[0,height*0.06])},{scale:interpolate(position.get(),[0,1],[1,0.9])}]};}"
+};
+export default function GestureContainer(props) {
+  let height, sharedValue;
+  const children = props.children;
+  height = void 0;
+  sharedValue = void 0;
+  const styles = useStyles();
+  const channelCallStore = useChannelCallStore((a0) => a0.isGestureEnabled);
+  height = useWindowDimensions_native().height;
+  sharedValue = useSharedValue(0);
+  const r30 = Gesture.Pan().enabled(channelCallStore);
+  const S = function S(a0) {
+    sharedValue.set(1 - Math.pow(1 - Math.max(Math.min(a0.translationY, 200), 0) / 200, 3));
+  };
+  S.__closure = {
+    THRESHOLD_TRANSLATE: 200,
+    position: sharedValue
+  };
+  S.__workletHash = 9476726087456;
+  S.__initData = __initData2;
+  const r35 = r30.onUpdate(S);
+  const h = function h({ velocityY }) {
+    if (sharedValue.get() !== 1 && !(velocityY > 500)) {
+      sharedValue.set(_timing.withTiming(0, {
+        duration: 300,
+        easing: _native.DECELERATED_EASING
+      }));
+    } else {
+      _ReanimatedRexport.runOnJS(ModalActionCreators.pop)();
+    }
+  };
+  h.__closure = {
+    position: sharedValue,
+    THRESHOLD_VELOCITY: 500,
+    runOnJS: _ReanimatedRexport.runOnJS,
+    ModalActionCreators,
+    withTiming: _timing.withTiming,
+    DECELERATED_EASING: _native.DECELERATED_EASING
+  };
+  h.__workletHash = 10736744030668;
+  h.__initData = __initData;
+  const gesture = r35.onEnd(h).activeOffsetY([-PAN_GESTURE_FAIL_OFFSET_Y, PAN_GESTURE_FAIL_OFFSET_Y]).failOffsetX([-SWIPE_TO_CHAT_ACTIVE_OFFSET, SWIPE_TO_CHAT_ACTIVE_OFFSET]);
+  const r65 = () => ({
+    flex: 1,
+    transform: [{
+      translateY: _ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [0, 0.06 * height])
+    }, {
+      scale: _ReanimatedRexport.interpolate(sharedValue.get(), [0, 1], [1, 0.9])
+    }]
+  });
+  r65.__closure = {
+    interpolate: _ReanimatedRexport.interpolate,
+    position: sharedValue,
+    height
+  };
+  r65.__workletHash = 16049033434372;
+  r65.__initData = __initData3;
+  return <View style={styles.background}>
+    <GestureDetector gesture={gesture}>
+      <ReanimatedRexport.View style={useAnimatedStyle(r65)}>{children}</ReanimatedRexport.View>
+    </GestureDetector>
+  </View>;
+};

modules/video_calls/native/components/HideSelfStreamAndVideoConfirmDialog.tsx

@@ -0,0 +1,43 @@
+// Metro module 16031 (f16032).
+import { View } from "react-native";
+import { SelfStreamAndVideoAlertType } from "../../../calls/HideSelfStreamAndVideoConstants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import { intl, t } from "../../../../intl/index.native";
+import Alert from "../../../../components_native/common/Alert";
+import { Text } from "../../../../design/components/Text/native/Text";
+import UserSettingsActionCreators from "../../../../actions/UserSettingsActionCreators";
+const useStyles = createStyles({
+  wrapper: {
+    padding: 16
+  },
+  body: {
+    paddingTop: 16
+  },
+  description: {
+    lineHeight: 18
+  },
+  ctaLink: {
+    paddingTop: 8,
+    textAlign: "center",
+    textDecorationLine: "underline"
+  }
+});
+export default function HideSelfStreamAndVideoConfirmDialog(props) {
+  const { type, onConfirm, ...props2 } = props;
+  const styles = useStyles();
+  const title = type === SelfStreamAndVideoAlertType.STREAM ? intl.string(t["/lFMWr"]) : intl.string(t.xzxhZS);
+  const r49 = type === SelfStreamAndVideoAlertType.STREAM ? intl.string(t.xaOX7d) : intl.string(t.oU1p9O);
+  return <Alert {...props2} title={title} style={styles.wrapper} cancelText={intl.string(t["ETE/oC"])} onCancel={props2?.onClose} confirmText={intl.string(t["cY+Oob"])} onConfirm={onConfirm}>
+    <View style={styles.body}>
+      <Text style={styles.description} variant="text-sm/medium">{r49}</Text>
+      <Text accessibilityRole="link" style={[styles.ctaLink, styles.description]} onPress={function onPress() {
+        UserSettingsActionCreators.updatedUnsyncedSettings({
+          disableHideSelfStreamAndVideoConfirmationAlert: true
+        });
+        onConfirm();
+      }} variant="text-sm/medium">
+        {intl.string(t["JdIQ/Y"])}
+      </Text>
+    </View>
+  </Alert>;
+};

modules/video_calls/native/components/ParticipantTitle.tsx

@@ -0,0 +1,17 @@
+// Metro module 10857 (f10858).
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import { LegacyText } from "../../../../design/void/native";
+import getParticipantTitle from "../../getParticipantTitle";
+const useStyles = createStyles({
+  usernameText: {
+    fontSize: 14,
+    color: Module712.colors.WHITE
+  }
+});
+export default function ParticipantTitle(props) {
+  const { channel, participant, style } = props;
+  return <LegacyText style={[useStyles().usernameText, style]} numberOfLines={1}>
+    {getParticipantTitle(channel, participant)}
+  </LegacyText>;
+};

modules/video_calls/native/components/PictureInPicture.tsx

@@ -0,0 +1,139 @@
+// Metro module 10520 (f10521).
+import { memo, useState, useRef } from "react";
+import { View, StyleSheet } from "react-native";
+import { toggleFocus } from "../ChannelCallStore";
+import { PictureInPicturePositions } from "../../../../Constants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import { generateBoxShadowStyle, EIGHT_DP_ELEVATION_SHADOW_PARAMS } from "../../../../design/void/native";
+import { useShouldForcePipOrientation } from "./useShouldForcePipOrientation";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import useSafeAreaInsetsKeyboardAware_native from "../../../safe_area/useSafeAreaInsetsKeyboardAware.native";
+import usePipDimensions from "./usePipDimensions";
+import ReanimatedRexport, { useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import * as _spring from "../../../../design/animation/reanimated/spring/spring";
+import { useIsViewingActivity } from "../../../activities/native/useIsViewingActivity";
+import { useDraggablePip } from "../useDraggablePip";
+import { GestureDetector } from "../../../../_bundle/Module5273";
+import { isIOS } from "../../../../utils/PlatformUtils";
+let getSpringAnimationConfig, __initData;
+const useStyles = createStyles({
+  pipOuterContainer: {
+    ...StyleSheet.absoluteFillObject,
+    alignItems: "baseline"
+  },
+  pipInnerContainer: {
+    ...StyleSheet.absoluteFillObject,
+    alignItems: "baseline"
+  },
+  elevationShadow: generateBoxShadowStyle(EIGHT_DP_ELEVATION_SHADOW_PARAMS)
+});
+const getSpringAnimationConfig2 = function getSpringAnimationConfig(a0) {
+  return {
+    mass: 0.2,
+    damping: 7.5,
+    stiffness: 100,
+    restDisplacementThreshold: 0.1,
+    restSpeedThreshold: 0.1,
+    overshootClamping: true,
+    velocity: a0
+  };
+};
+getSpringAnimationConfig2.__closure = {};
+getSpringAnimationConfig2.__workletHash = 6627401186753;
+getSpringAnimationConfig2.__initData = {
+  code: "function getSpringAnimationConfig_PictureInPictureTsx1(velocity){return{mass:0.2,damping:7.5,stiffness:100,restDisplacementThreshold:0.1,restSpeedThreshold:0.1,overshootClamping:true,velocity:velocity};}"
+};
+getSpringAnimationConfig = getSpringAnimationConfig2;
+const TOP_LEFT = PictureInPicturePositions.TOP_LEFT;
+__initData = {
+  code: "function PictureInPictureTsx2(){const{insets,withSpring,getSpringAnimationConfig}=this.__closure;return{marginTop:insets.top,marginBottom:withSpring(insets.bottom,getSpringAnimationConfig())};}"
+};
+const r60 = memo(function(a0) {
+  const { children, style } = a0;
+  if (a0.preferredPosition === void 0) {
+    PictureInPicturePositions.TOP_LEFT;
+  }
+  let ref;
+  const channel = a0.channel;
+  ref = void 0;
+  const styles = useStyles();
+  const shouldForcePipOrientation = useShouldForcePipOrientation({
+    channel
+  });
+  const windowDimensions_native = useWindowDimensions_native();
+  const { width, height } = windowDimensions_native;
+  const insets = useSafeAreaInsetsKeyboardAware_native({
+    includeKeyboardHeight: true
+  }).insets;
+  const pipDimensions = usePipDimensions({
+    channelId: channel.id,
+    forcedOrientation: shouldForcePipOrientation
+  });
+  const [state, setState] = useState({
+    x: 0,
+    y: 0,
+    width,
+    height,
+    pageX: 0,
+    pageY: 0
+  });
+  const w = function w() {
+    return {
+      marginTop: insets.top,
+      marginBottom: _spring.withSpring(insets.bottom, {
+        mass: 0.2,
+        damping: 7.5,
+        stiffness: 100,
+        restDisplacementThreshold: 0.1,
+        restSpeedThreshold: 0.1,
+        overshootClamping: true,
+        velocity: void 0
+      })
+    };
+  };
+  w.__closure = {
+    insets,
+    withSpring: _spring.withSpring,
+    getSpringAnimationConfig
+  };
+  w.__workletHash = 16677290574613;
+  w.__initData = __initData;
+  const animatedStyle = useAnimatedStyle(w);
+  const isViewingActivity = useIsViewingActivity({
+    channelId: channel.id
+  });
+  const draggablePip = useDraggablePip({
+    width: pipDimensions.width,
+    height: pipDimensions.height,
+    containerWidth: state.width,
+    containerHeight: state.height,
+    snapToCorners: !isViewingActivity,
+    onPress: isViewingActivity ? toggleFocus : void 0
+  });
+  const { gesture, draggableGridItemStyles } = draggablePip;
+  ref = useRef(null);
+  return <ReanimatedRexport.View style={[styles.pipOuterContainer, animatedStyle, style]} pointerEvents="box-none">
+    <View ref={ref} style={styles.pipInnerContainer} pointerEvents="box-none" onLayout={() => {
+      if (ref.current != null) {
+        ref.current.measure((a0, a1, a2, a3, a4, a5) => {
+          setState({
+            x: a0,
+            y: a1,
+            width: a2,
+            height: a3,
+            pageX: a4,
+            pageY: a5
+          });
+        });
+      }
+    }}>
+      <GestureDetector gesture={gesture}>
+        <ReanimatedRexport.View style={[draggableGridItemStyles, isIOS() ? styles.elevationShadow : void 0]}>
+          <View>{children}</View>
+        </ReanimatedRexport.View>
+      </GestureDetector>
+    </View>
+  </ReanimatedRexport.View>;
+});
+export default r60;
+export { TOP_LEFT as DEFAULT_PIP_POSITION };

modules/video_calls/native/components/PictureInPictureGlobal.tsx

@@ -0,0 +1,202 @@
+// Metro module 15736 (f15737).
+import _slicedToArray from "../../../../_bundle/_slicedToArray";
+import * as Module19 from "react";
+import { useCallback, useMemo, useState } from "react";
+import { StyleSheet, TouchableOpacity, View } from "react-native";
+import EmbeddedActivitiesStore from "../../../activities/EmbeddedActivitiesStore";
+import ChannelRTCStore from "../../../calls/ChannelRTCStore";
+import { useBestActiveChatInputContainerHeight } from "../../../chat_input/native/useChatBottomManagerUIStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import MediaEngineStore from "../../../../stores/MediaEngineStore";
+import { PictureInPicturePositions } from "../../../../Constants";
+import { ParticipantTypes } from "../../../calls/CallConstants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import * as _native from "../../../../design/void/native";
+import { generateBoxShadowStyle, EIGHT_DP_ELEVATION_SHADOW_PARAMS, AvatarSizes } from "../../../../design/void/native";
+import Module712 from "../../../../_bundle/Module712";
+import usePipVideoOrStream from "../usePipVideoOrStream";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import { getEmbeddedActivityParticipantId } from "../../../calls/ChannelRTCParticipants";
+import useIsActivityFocused from "../../../activities/useIsActivityFocused";
+import { openGuildVoiceModal } from "../../../../utils/native/PrivateChannelCallUtils";
+import { useShouldForcePipOrientation } from "./useShouldForcePipOrientation";
+import { useIsScreenLandscape } from "../../../screen/useIsScreenLandscape.native";
+import usePipDimensions from "./usePipDimensions";
+import { OrientationType } from "../../../device/native/DeviceOrientation";
+import isWatchTogetherApplication from "../../../activities/utils/isWatchTogetherApplication";
+import StreamTile from "./StreamTile";
+import { ResizeMode } from "./VideoRenderer";
+import UserTile from "./UserTile";
+import ActivityTile from "./ActivityTile";
+import transitionToActivity_native from "../../../activities/utils/transitionToActivity.native";
+import ScreenshareTile from "./ScreenshareTile";
+import PictureInPicture from "./PictureInPicture";
+import { useIsChannelFocused } from "../../../panels/isChannelFocused.native";
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import ReanimatedRexport, { useDerivedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import * as _timing from "../../../../design/animation/reanimated/timing/timing";
+import * as _NavigatorConstants_native from "../../../../design/components/Navigator/native/NavigatorConstants.native";
+import * as _getPIPBottomOffsetForPIPMode from "../../../panels/morphable/native/getPIPBottomOffsetForPIPMode";
+import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
+let Component2, __initData, __initData2;
+const PADDING = 12;
+const useStyles = createStyles({
+  container: {
+    flex: 1,
+    marginLeft: 12,
+    marginRight: 12
+  },
+  elevationShadow: generateBoxShadowStyle(EIGHT_DP_ELEVATION_SHADOW_PARAMS),
+  pip: {
+    borderRadius: Module712.radii.sm,
+    overflow: "hidden"
+  },
+  background: {
+    backgroundColor: Module712.colors.BLACK,
+    borderRadius: Module712.radii.sm,
+    overflow: "hidden"
+  }
+});
+let Component = Module19.memo(function({ channel }) {
+  let r92;
+  let stateFromStores, callback, shouldForcePipOrientation, isScreenLandscape, width, height;
+  stateFromStores = void 0;
+  callback = void 0;
+  shouldForcePipOrientation = void 0;
+  isScreenLandscape = void 0;
+  width = void 0;
+  height = void 0;
+  const styles = useStyles();
+  const pipVideoOrStream = usePipVideoOrStream(channel.id);
+  const stateFromStores3 = useStateFromStores([ChannelRTCStore, AuthenticationStore], () => ChannelRTCStore.getStreamParticipants(channel.id).find((item) => item.user.id === AuthenticationStore.getId()));
+  const stateFromStores2 = useStateFromStores([ChannelRTCStore, EmbeddedActivitiesStore], () => {
+    const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
+    return currentEmbeddedActivity != null ? ChannelRTCStore.getParticipant(channel.id, getEmbeddedActivityParticipantId({
+      applicationId: currentEmbeddedActivity.applicationId,
+      instanceId: currentEmbeddedActivity.compositeInstanceId
+    })) : null;
+  });
+  const isActivityFocused = useIsActivityFocused(channel.id);
+  let r39 = pipVideoOrStream != null ? pipVideoOrStream.user.id !== AuthenticationStore.getId() ? pipVideoOrStream : stateFromStores2 : stateFromStores2;
+  if (isActivityFocused) {
+    r39 = stateFromStores2;
+  }
+  stateFromStores = r39;
+  const stateFromStores4 = useStateFromStores([MediaEngineStore], () => stateFromStores != null && MediaEngineStore.isLocalVideoDisabled(stateFromStores.id), [stateFromStores]);
+  const stateFromStores5 = useStateFromStores([ChannelRTCStore, AuthenticationStore], () => {
+    const participant = ChannelRTCStore.getParticipant(channel.id, AuthenticationStore.getId());
+    return participant != null ? participant.type === ParticipantTypes.USER ? participant.streamId != null ? participant : null : null : null;
+  });
+  callback = useCallback(() => {
+    openGuildVoiceModal(channel, "PIP");
+  }, [channel]);
+  shouldForcePipOrientation = useShouldForcePipOrientation({
+    channel
+  });
+  isScreenLandscape = useIsScreenLandscape();
+  const pipDimensions = usePipDimensions({
+    channelId: channel.id,
+    forcedOrientation: shouldForcePipOrientation
+  });
+  width = pipDimensions.width;
+  height = pipDimensions.height;
+  const memo = useMemo(() => ({
+    height,
+    width,
+    flexDirection: isScreenLandscape ? "row" : shouldForcePipOrientation === OrientationType.LANDSCAPE ? "row" : "column"
+  }), [shouldForcePipOrientation, isScreenLandscape, height, width]);
+  const r82 = stateFromStores?.type === ParticipantTypes.ACTIVITY && isWatchTogetherApplication(stateFromStores.applicationId) && stateFromStores3 == null;
+  const type = stateFromStores?.type;
+  L22: {
+    if (ParticipantTypes.HIDDEN_STREAM !== type && ParticipantTypes.STREAM !== type) {
+      if (ParticipantTypes.USER === type) {
+        r92 = stateFromStores4 ? null : <UserTile participant={stateFromStores} avatarSize={AvatarSizes.PROFILE} resizeMode={ResizeMode.COVER} onSingleTap={callback} onDoubleTap={callback} />;
+        break L22;
+      }
+      const ACTIVITY = ParticipantTypes.ACTIVITY;
+      r92 = null;
+      if (ACTIVITY !== type) {
+        break L22;
+      }
+      r92 = <ActivityTile participant={stateFromStores} channel={channel} onSingleTap={() => {
+        const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
+        if (currentEmbeddedActivity != null) {
+          transitionToActivity_native(channel.guild_id, currentEmbeddedActivity?.location);
+        }
+        callback();
+      }} />;
+    } else {
+      r92 = <StreamTile resizeMode={ResizeMode.CONTAIN} participant={stateFromStores} onSingleTap={callback} onDoubleTap={callback} />;
+    }
+  }
+  return <View style={styles.background}>
+    <TouchableOpacity activeOpacity={0.7}>
+      <View style={[styles.pip, styles.elevationShadow, memo]}>
+        {stateFromStores5 != null && !r82 && <UserTile participant={stateFromStores5} avatarSize={AvatarSizes.PROFILE} resizeMode={ResizeMode.COVER} onSingleTap={callback} />}
+        {stateFromStores3 != null && !r82 && <ScreenshareTile onSingleTap={callback} />}
+        {(stateFromStores5 == null || stateFromStores3 == null || stateFromStores2 == null) && r92}
+      </View>
+    </TouchableOpacity>
+  </View>;
+});
+Component2 = Module19.memo(function({ channel: channel2 }) {
+  const r12 = _slicedToArray(useState(() => PictureInPicturePositions.TOP_RIGHT), 2);
+  return <PictureInPicture channel={channel2} preferredPosition={r12[0]} onMove={r12[1]}>
+    <Component channel={channel2} />
+  </PictureInPicture>;
+});
+__initData = {
+  code: "function PictureInPictureGlobalTsx1(){const{withTiming,drawerState,STANDARD_EASING}=this.__closure;return withTiming(drawerState,{easing:STANDARD_EASING,duration:250});}"
+};
+__initData2 = {
+  code: "function PictureInPictureGlobalTsx2(){const{interpolate,animatedDrawerState,NAV_BAR_HEIGHT,PADDING,chatInputContainerHeight,PIP_AVOIDANCE_TAB_BAR_HEIGHT}=this.__closure;return{marginTop:interpolate(animatedDrawerState.get(),[0,1],[NAV_BAR_HEIGHT+PADDING,PADDING]),marginBottom:interpolate(animatedDrawerState.get(),[0,1],[chatInputContainerHeight+PADDING,PIP_AVOIDANCE_TAB_BAR_HEIGHT+PADDING])};}"
+};
+export default function PictureInPictureGlobal(props) {
+  let derivedValue;
+  const channel2 = props.channel;
+  derivedValue = void 0;
+  const styles = useStyles();
+  const drawerState = useIsChannelFocused() ? 0 : 1;
+  let c22401_0 = drawerState;
+  const bestActiveChatInputContainerHeight = useBestActiveChatInputContainerHeight();
+  const n = function n() {
+    return _timing.withTiming(c22401_0, {
+      easing: _native.STANDARD_EASING,
+      duration: 250
+    });
+  };
+  n.__closure = {
+    withTiming: _timing.withTiming,
+    drawerState,
+    STANDARD_EASING: _native.STANDARD_EASING
+  };
+  n.__workletHash = 5168896066356;
+  n.__initData = __initData;
+  derivedValue = useDerivedValue(n);
+  const r36 = function() {
+    return {
+      marginTop: _ReanimatedRexport.interpolate(derivedValue.get(), [0, 1], [_NavigatorConstants_native.NAV_BAR_HEIGHT + PADDING, PADDING]),
+      marginBottom: _ReanimatedRexport.interpolate(derivedValue.get(), [0, 1], [bestActiveChatInputContainerHeight + PADDING, _getPIPBottomOffsetForPIPMode.PIP_AVOIDANCE_TAB_BAR_HEIGHT + PADDING])
+    };
+  };
+  r36.__closure = {
+    interpolate: _ReanimatedRexport.interpolate,
+    animatedDrawerState: derivedValue,
+    NAV_BAR_HEIGHT: _NavigatorConstants_native.NAV_BAR_HEIGHT,
+    PADDING,
+    chatInputContainerHeight: bestActiveChatInputContainerHeight,
+    PIP_AVOIDANCE_TAB_BAR_HEIGHT: _getPIPBottomOffsetForPIPMode.PIP_AVOIDANCE_TAB_BAR_HEIGHT
+  };
+  r36.__workletHash = 8833756900366;
+  r36.__initData = __initData2;
+  const animatedStyle = useAnimatedStyle(r36);
+  const safeAreaInsets_native = useSafeAreaInsets_native();
+  return <View style={[StyleSheet.absoluteFill, {
+    paddingLeft: safeAreaInsets_native.left,
+    paddingRight: safeAreaInsets_native.right
+  }]} pointerEvents="box-none">
+    <ReanimatedRexport.View style={[styles.container, animatedStyle]} pointerEvents="box-none">
+      <Component2 channel={channel2} />
+    </ReanimatedRexport.View>
+  </View>;
+};

modules/video_calls/native/components/PictureInPictureVideo.tsx

@@ -0,0 +1,242 @@
+// Metro module 10539 (f10540).
+import { memo } from "react";
+import { TouchableOpacity, View } from "react-native";
+import EmbeddedActivitiesStore from "../../../activities/EmbeddedActivitiesStore";
+import ChannelRTCStore from "../../../calls/ChannelRTCStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import MediaEngineStore from "../../../../stores/MediaEngineStore";
+import SelectedChannelStore from "../../../../stores/SelectedChannelStore";
+import SpeakingStore from "../../../../stores/SpeakingStore";
+import ChannelCallLifecycleStore from "../ChannelCallLifecycleStore";
+import { togglePipFocus, useIsVoiceChatFocused } from "../ChannelCallStore";
+import { ParticipantTypes } from "../../../calls/CallConstants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import { generateBoxShadowStyle, EIGHT_DP_ELEVATION_SHADOW_PARAMS, AvatarSizes, Avatar, Icon } from "../../../../design/void/native";
+import Module712 from "../../../../_bundle/Module712";
+import { useVoiceChatNavigationContext } from "../../../voice_chat/native/VoiceChatModalContext";
+import Module12 from "../../../../_bundle/Module12";
+import useIsActivityFocused from "../../../activities/useIsActivityFocused";
+import isWatchTogetherApplication from "../../../activities/utils/isWatchTogetherApplication";
+import { useStateFromStores, useStateFromStoresArray } from "../../../../_bundle/Module589";
+import ChannelRTCActionCreators from "../../../../actions/ChannelRTCActionCreators";
+import ScreenshareTile from "./ScreenshareTile";
+import StreamTile from "./StreamTile";
+import { ResizeMode } from "./VideoRenderer";
+import participantHasVideo from "../../participantHasVideo";
+import UserTile from "./UserTile";
+import ActivityTile from "./ActivityTile";
+import transitionToActivity_native from "../../../activities/utils/transitionToActivity.native";
+import { useLeadingEdgeDebounce } from "../../../../hooks/useLeadingEdgeDebounce";
+import { useToken } from "../../../../design/tokens/native/useToken";
+import useAvatarColor from "../../../avatar/useAvatarColor";
+import Module8346 from "../../../../_bundle/Module8346";
+import { useIsViewingActivity } from "../../../activities/native/useIsViewingActivity";
+import { useShouldForcePipOrientation } from "./useShouldForcePipOrientation";
+import usePipDimensions from "./usePipDimensions";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import { isAndroid } from "../../../../utils/PlatformUtils";
+import { OrientationType } from "../../../device/native/DeviceOrientation";
+let useStyles, Component2, Component;
+const areParticipantsEqual = function areParticipantsEqual(a0, a1) {
+  const [, , r6] = a0;
+  const [, , r36] = a1;
+  return r6 === r36;
+};
+useStyles = createStyles({
+  elevationShadow: generateBoxShadowStyle(EIGHT_DP_ELEVATION_SHADOW_PARAMS),
+  background: {
+    backgroundColor: Module712.colors.BLACK,
+    borderRadius: Module712.radii.sm,
+    overflow: "hidden"
+  },
+  backgroundPipFab: {
+    backgroundColor: Module712.colors.BLACK,
+    borderRadius: Module712.radii.lg
+  },
+  pip: {
+    borderRadius: Module712.radii.sm,
+    overflow: "hidden"
+  },
+  pipFab: {
+    borderRadius: Module712.radii.lg,
+    overflow: "hidden"
+  },
+  avatarContainer: {
+    width: "100%",
+    height: "100%",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  activityPipContainer: {
+    flex: 1,
+    width: "100%"
+  },
+  thermalAlertIconContainer: {
+    width: 22,
+    height: 22,
+    backgroundColor: "rgba(78, 80, 88, 0.48)",
+    borderRadius: 11,
+    justifyContent: "center",
+    alignItems: "center",
+    position: "absolute",
+    top: 6,
+    left: 6
+  },
+  thermalAlertIcon: {
+    width: 14,
+    height: 14,
+    color: Module712.colors.WHITE
+  }
+});
+Component2 = memo(function({ channel, pipParticipant, selfParticipant: selfParticipant2 }) {
+  let r50, r85;
+  let r21 = useVoiceChatNavigationContext()?.openVoice;
+  if (r21 == null) {
+    r21 = Module12.noop;
+  }
+  const noop = r21;
+  const isVoiceChatFocused = useIsVoiceChatFocused();
+  let c18119_4 = useIsActivityFocused(channel.id);
+  const r9 = pipParticipant?.type === ParticipantTypes.ACTIVITY && isWatchTogetherApplication(pipParticipant?.applicationId);
+  const stateFromStores = useStateFromStores([MediaEngineStore], () => pipParticipant != null && MediaEngineStore.isLocalVideoDisabled(pipParticipant.id), [pipParticipant]);
+  const type = pipParticipant?.type;
+  L25: {
+    const onPipTap = function onPipTap() {
+      if (isVoiceChatFocused) {
+        noop();
+      }
+      if (c18119_4) {
+        ChannelRTCActionCreators.selectParticipant(channel.id, null);
+      } else {
+        togglePipFocus();
+      }
+    };
+    if (ParticipantTypes.HIDDEN_STREAM !== type && ParticipantTypes.STREAM !== type) {
+      if (ParticipantTypes.USER === type) {
+        r50 = participantHasVideo(pipParticipant) ? stateFromStores ? null : <UserTile participant={pipParticipant} avatarSize={AvatarSizes.PROFILE} resizeMode={ResizeMode.COVER} onSingleTap={onPipTap} onDoubleTap={onPipTap} /> : null;
+        break L25;
+      }
+      const ACTIVITY = ParticipantTypes.ACTIVITY;
+      r50 = null;
+      if (ACTIVITY !== type) {
+        break L25;
+      }
+      r50 = <ActivityTile participant={pipParticipant} channel={channel} onSingleTap={() => {
+        const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
+        if (currentEmbeddedActivity != null) {
+          transitionToActivity_native(channel.guild_id, currentEmbeddedActivity.location);
+        }
+        if (isVoiceChatFocused) {
+          noop();
+        }
+      }} />;
+    } else {
+      if (pipParticipant.user.id === AuthenticationStore.getId()) {
+        const onScreenshareTap = function onScreenshareTap() {
+          const voiceChannelId = SelectedChannelStore.getVoiceChannelId();
+          if (voiceChannelId != null) {
+            let r14 = pipParticipant?.id;
+            if (r14 == null) {
+              r14 = null;
+            }
+            ChannelRTCActionCreators.selectParticipant(voiceChannelId, r14);
+            if (isVoiceChatFocused) {
+              noop();
+            }
+          }
+        };
+        r85 = <ScreenshareTile onSingleTap={onScreenshareTap} onDoubleTap={onScreenshareTap} />;
+      } else {
+        r85 = <StreamTile removeEmptyStateButton removeEmptyStateImage resizeMode={ResizeMode.CONTAIN} participant={pipParticipant} onSingleTap={onPipTap} onDoubleTap={onPipTap} />;
+      }
+      r50 = r85;
+    }
+  }
+  return <>
+    {selfParticipant2 == null ? null : r9 ? null : <UserTile participant={selfParticipant2} avatarSize={AvatarSizes.PROFILE} resizeMode={ResizeMode.COVER} onSingleTap={() => {
+      if (isVoiceChatFocused) {
+        noop();
+      } else {
+        togglePipFocus();
+      }
+    }} />}
+    {r50}
+  </>;
+});
+Component = memo(function(a0) {
+  let r31, r32, channel2, participant, styles;
+  let id, selfParticipant, leadingEdgeDebounce;
+  L9: {
+    channel2 = a0.channel;
+    const selfParticipant2 = a0.selfParticipant;
+    styles = useStyles();
+    [r31, r32] = useStateFromStoresArray([ChannelCallLifecycleStore], () => [ChannelCallLifecycleStore.consumedRequestToRespondToSeriousThermalState(), ChannelCallLifecycleStore.isReactingToThermalState()]);
+    id = channel2.id;
+    selfParticipant = selfParticipant2;
+    leadingEdgeDebounce = void 0;
+    const stateFromStores = useStateFromStores([ChannelCallLifecycleStore], () => ChannelCallLifecycleStore.isReactingToThermalState());
+    const [r44, r45] = useStateFromStores([ChannelRTCStore], () => [ChannelRTCStore.getParticipants(id), ChannelRTCStore.getVideoParticipants(id), ChannelRTCStore.getParticipantsVersion(id)], [id], areParticipantsEqual);
+    leadingEdgeDebounce = useLeadingEdgeDebounce(useStateFromStores([SpeakingStore], () => selfParticipant != null ? SpeakingStore.getSpeakers().find((item) => item !== selfParticipant.user.id && SpeakingStore.isSpeaking(item)) : null, [selfParticipant]), 1000);
+    if (leadingEdgeDebounce != null) {
+      const r61 = r44.find((item) => item.id === leadingEdgeDebounce);
+      if (r61 != null) {
+        const type = r61.type;
+        const USER = ParticipantTypes.USER;
+        participant = r61;
+        if (type === USER) {
+          break L9;
+        }
+      }
+    }
+    const streamId = selfParticipant?.streamId;
+    participant = selfParticipant;
+    if (streamId == null) {
+      participant = selfParticipant;
+      if (!stateFromStores) {
+        const r75 = [...r45].sort((a, b) => a.lastSpoke < b.lastSpoke ? 1 : -1)[0];
+        participant = r75 ?? selfParticipant;
+      }
+    }
+  }
+  const token = useToken(Module712.unsafe_rawColors.PRIMARY_800);
+  const avatarColor = useAvatarColor(participant == null ? void 0 : participant.user.getAvatarURL(channel2.guild_id, 80), token);
+  if (participant == null) {
+    return null;
+  }
+  return <View style={[styles.avatarContainer, {
+    backgroundColor: avatarColor
+  }]}>
+    {participant.streamId != null && participant.voiceState?.selfVideo && !r32 ? <UserTile participant={participant} avatarSize={AvatarSizes.PROFILE} resizeMode={ResizeMode.COVER} /> : <Avatar size={AvatarSizes.LARGE_48} channel={channel2} guildId={channel2.guild_id} user={participant.user} speaking={participant.speaking} />}
+    {r31 ? <View style={styles.thermalAlertIconContainer}>
+      <Icon style={styles.thermalAlertIcon} source={Module8346} color={styles.thermalAlertIcon.color} />
+    </View> : null}
+  </View>;
+});
+const r104 = memo(function({ channel: channel2, pipParticipant: pipParticipant2, selfParticipant: selfParticipant2 }) {
+  const styles = useStyles();
+  const isViewingActivity = useIsViewingActivity({
+    channelId: channel2.id
+  });
+  const shouldForcePipOrientation = useShouldForcePipOrientation({
+    channel: channel2
+  });
+  const pipDimensions = usePipDimensions({
+    channelId: channel2.id,
+    forcedOrientation: shouldForcePipOrientation
+  });
+  const windowDimensions_native = useWindowDimensions_native();
+  const { width, height } = windowDimensions_native;
+  return <View style={isViewingActivity ? styles.backgroundPipFab : styles.background}>
+    <TouchableOpacity activeOpacity={0.7}>
+      <View style={[isViewingActivity ? styles.pipFab : styles.pip, isAndroid() ? styles.elevationShadow : void 0, {
+        flexDirection: width > height ? "row" : shouldForcePipOrientation === OrientationType.LANDSCAPE ? "row" : "column"
+      }, pipDimensions]}>
+        {isViewingActivity ? <View pointerEvents="none" style={styles.activityPipContainer}>
+          <Component channel={channel2} pipParticipant={pipParticipant2} selfParticipant={selfParticipant2} />
+        </View> : <Component2 channel={channel2} pipParticipant={pipParticipant2} selfParticipant={selfParticipant2} />}
+      </View>
+    </TouchableOpacity>
+  </View>;
+});
+export default r104;
+export { areParticipantsEqual };

modules/video_calls/native/components/PopoutMenu.tsx

@@ -0,0 +1,231 @@
+// Metro module 10538 (f10539).
+import { useCallback, forwardRef, useState, useRef, useEffect, useMemo, useImperativeHandle } from "react";
+import { View } from "react-native";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import FormRow from "../../../../design/void/Form/native/FormRow";
+import * as _native from "../../../../design/void/native";
+import { Icon } from "../../../../design/void/native";
+import { FormLabel, FormDivider } from "../../../../design/void/Form/native/index";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
+import Module12 from "../../../../_bundle/Module12";
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import ReanimatedRexport, { useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
+import * as _timing from "../../../../design/animation/reanimated/timing/timing";
+import * as _Module4160 from "../../../../_bundle/Module4160";
+import { Gesture, GestureDetector } from "../../../../_bundle/Module5273";
+let useStyles, __initData, __initData2, __initData3, __initData4;
+const PopoutMenuRow = function PopoutMenuRow(props) {
+  const { icon, text, onClick, onClose } = props;
+  const styles = useStyles();
+  return <FormRow leading={icon != null ? <Icon source={icon} /> : null} label={<FormLabel style={styles.popoutMenuRowLabel} text={text} />} style={styles.popoutMenuRow} onPress={useCallback(() => {
+    if (onClick != null) {
+      onClick();
+    }
+    if (onClose != null) {
+      onClose();
+    }
+  }, [onClick, onClose])} />;
+};
+useStyles = createStyles({
+  container: {
+    position: "absolute",
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOWEST,
+    borderRadius: Module712.radii.sm
+  },
+  popoutMenuRow: {
+    flex: 1
+  },
+  popoutMenuRowLabel: {
+    width: "100%"
+  }
+});
+__initData = {
+  code: "function PopoutMenuTsx1(){const{withTiming,animateIn,STANDARD_EASING,ANIMATION_DURATION,runOnJS,handleClose,EXTRA_PADDING}=this.__closure;return{opacity:withTiming(animateIn?1:0,{easing:STANDARD_EASING,duration:ANIMATION_DURATION},'respect-motion-settings',function(finished){if(finished){runOnJS(handleClose)();}}),transform:[{translateY:withTiming(animateIn?-EXTRA_PADDING:0,{easing:STANDARD_EASING,duration:ANIMATION_DURATION})}]};}"
+};
+__initData2 = {
+  code: "function PopoutMenuTsx2(finished){const{runOnJS,handleClose}=this.__closure;if(finished){runOnJS(handleClose)();}}"
+};
+__initData3 = {
+  code: "function PopoutMenuTsx3(){const{runOnJS,handleLongPress}=this.__closure;runOnJS(handleLongPress)();}"
+};
+__initData4 = {
+  code: "function PopoutMenuTsx4(){const{runOnJS,_setClose}=this.__closure;runOnJS(_setClose)(true);}"
+};
+const r48 = forwardRef(function PopoutMenu(props, a1) {
+  let memo, c18118_17, callback, callback2, callback3;
+  const { disabled, title, trigger, rows, style, onOpen, onClose: onClose2 } = props;
+  memo = void 0;
+  c18118_17 = void 0;
+  callback = void 0;
+  callback2 = void 0;
+  callback3 = void 0;
+  const styles = useStyles();
+  const windowDimensions_native = useWindowDimensions_native();
+  const { width, height } = windowDimensions_native;
+  const bottom = useSafeAreaInsets_native().bottom;
+  const [state5, setState] = useState(0);
+  const [state, setState2] = useState(false);
+  const [state2, setState3] = useState(false);
+  const ref = useRef(null);
+  const ref2 = useRef(null);
+  const [state3, setState4] = useState({
+    top: 0,
+    left: 0,
+    width: 0,
+    height: 0
+  });
+  const [state4, setState5] = useState({
+    width: 0,
+    height: 0
+  });
+  useEffect(() => {
+    let r3 = state2;
+    if (state2) {
+      r3 = ref?.current != null;
+    }
+    if (r3) {
+      if (ref != null) {
+        const current = ref.current;
+        if (current != null) {
+          current.measureInWindow((a0, a1, a2, a3) => {
+            setState4({
+              top: Math.max(a1, 0),
+              left: a0,
+              width: a2,
+              height: a3
+            });
+          });
+        }
+      }
+      setTimeout(() => {
+        if (ref2 != null) {
+          const current = ref2.current;
+          if (current != null) {
+            current.measureInWindow((a0, a1, a2, a3) => {
+              setState5({
+                width: a2,
+                height: a3
+              });
+            });
+          }
+        }
+      });
+    }
+  }, [state2]);
+  const memo2 = useMemo(() => {
+    let top = -state4.height;
+    if (state3.top + state3.height + state4.height + 8 + bottom < height) {
+      top = state3.height + 16;
+    }
+    return {
+      top,
+      left: state3.left + state4.width + 8 > width ? state3.width - state4.width : 0
+    };
+  }, [state4, bottom, height, width, state3]);
+  const { top, left } = memo2;
+  useImperativeHandle(a1, () => ({
+    close: () => {
+      setState2(true);
+    }
+  }), [setState2]);
+  memo = useMemo(() => Module12.debounce((a0) => {
+    setState(a0);
+  }, 16), [setState]);
+  const animateIn = state5 > 0 && !state;
+  c18118_17 = animateIn;
+  callback = useCallback(() => {
+    if (state) {
+      onClose2();
+      setState3(false);
+    }
+  }, [state, onClose2]);
+  const te = function te() {
+    const r1 = c18118_17 ? 1 : 0;
+    const r8 = {
+      easing: _native.STANDARD_EASING,
+      duration: 250
+    };
+    const r23 = function n(a0) {
+      if (a0) {
+        _ReanimatedRexport.runOnJS(callback)();
+      }
+    };
+    r23.__closure = {
+      runOnJS: _ReanimatedRexport.runOnJS,
+      handleClose: callback
+    };
+    r23.__workletHash = 7805688342878;
+    r23.__initData = __initData2;
+    return {
+      opacity: _timing.withTiming(r1, r8, "respect-motion-settings", r23),
+      transform: [{
+        translateY: _timing.withTiming(c18118_17 ? -8 : 0, {
+          easing: _native.STANDARD_EASING,
+          duration: 250
+        })
+      }]
+    };
+  };
+  te.__closure = {
+    withTiming: _timing.withTiming,
+    animateIn,
+    STANDARD_EASING: _native.STANDARD_EASING,
+    ANIMATION_DURATION: 250,
+    runOnJS: _ReanimatedRexport.runOnJS,
+    handleClose: callback,
+    EXTRA_PADDING: 8
+  };
+  te.__workletHash = 2727321893876;
+  te.__initData = __initData;
+  const animatedStyle = useAnimatedStyle(te);
+  callback2 = useCallback(() => setState2(true), []);
+  callback3 = useCallback(() => {
+    setState2(false);
+    _Module4160.trigger("impactHeavy");
+    setState3(true);
+    onOpen();
+  }, [onOpen]);
+  const memo3 = useMemo(() => {
+    const r4 = Gesture.LongPress();
+    const t = function t() {
+      _ReanimatedRexport.runOnJS(setState2)(true);
+    };
+    t.__closure = {
+      runOnJS: _ReanimatedRexport.runOnJS,
+      _setClose: setState2
+    };
+    t.__workletHash = 15929711498886;
+    t.__initData = __initData4;
+    const r19 = r4.onBegin(t);
+    const r21 = function n() {
+      _ReanimatedRexport.runOnJS(callback3)();
+    };
+    r21.__closure = {
+      runOnJS: _ReanimatedRexport.runOnJS,
+      handleLongPress: callback3
+    };
+    r21.__workletHash = 1649917173815;
+    r21.__initData = __initData3;
+    return r19.onStart(r21);
+  }, [callback3]);
+  let r116 = trigger;
+  if (!disabled) {
+    const r128 = [<GestureDetector gesture={memo3}>
+      <View ref={ref}>{trigger}</View>
+    </GestureDetector>, state2 ? <ReanimatedRexport.View ref={ref2} style={[styles.container, style, {
+      left,
+      top
+    }, animatedStyle]} onLayout={(event) => {
+      memo(event.nativeEvent.layout.height);
+    }}>
+      {title != null ? <PopoutMenuRow text={title} /> : null}
+      {title != null ? <FormDivider /> : null}
+      {rows.map((row, index) => <PopoutMenuRow key={index} {...row} onClose={callback2} />)}
+    </ReanimatedRexport.View> : null];
+    r116 = <>{r128}</>;
+  }
+  return r116;
+});
+export default r48;

modules/video_calls/native/components/RevealProvider.tsx

@@ -0,0 +1,66 @@
+// Metro module 10509 (f10510).
+import { useMemo, createContext, useEffect } from "react";
+import ActionSheetStore from "../../../action_sheet/native/ActionSheetStore";
+import GameConsoleStore from "../../../game_console/GameConsoleStore";
+import { focusTimeout, resetFocusTimer, useChannelCallStore, useIsVoiceChatFocused } from "../ChannelCallStore";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import useIsPrivateAudioOnlyCall from "../useIsPrivateAudioOnlyCall";
+import useIsActivityFocused from "../../../activities/useIsActivityFocused";
+import { isIOS } from "../../../../utils/PlatformUtils";
+import useTheme from "../../../../hooks/useTheme";
+import StatusBar_android from "../../../status_bar/native/components/StatusBar.android";
+import HomeIndicator from "../../../voice_panel/native/HomeIndicator";
+let context;
+const useRevealProviderValue = function useRevealProviderValue(channelCallStore, channel) {
+  let r7 = channelCallStore;
+  const stateFromStores2 = useStateFromStores([ActionSheetStore], () => ActionSheetStore.getKey() != null);
+  const isPrivateAudioOnlyCall = useIsPrivateAudioOnlyCall(channel);
+  const isVoiceChatFocused = useIsVoiceChatFocused();
+  const stateFromStores3 = useStateFromStores([GameConsoleStore], () => GameConsoleStore.getAwaitingRemoteSessionInfo() != null);
+  const isActivityFocused = useIsActivityFocused(channel.id);
+  if (!channelCallStore) {
+    r7 = stateFromStores2;
+  }
+  if (!r7) {
+    r7 = isPrivateAudioOnlyCall;
+  }
+  if (!r7) {
+    r7 = channel === null;
+  }
+  if (!r7) {
+    r7 = isVoiceChatFocused;
+  }
+  if (!r7) {
+    r7 = stateFromStores3;
+  }
+  const stateFromStores = r7;
+  const prefersDeferringSystemGestures = !!isIOS() && isActivityFocused;
+  return useMemo(() => ({
+    reveal: stateFromStores,
+    prefersDeferringSystemGestures
+  }), [stateFromStores, prefersDeferringSystemGestures]);
+};
+context = createContext({
+  reveal: true
+});
+export default function RevealProvider(props) {
+  const { channel, children, showStatus = false, useThemedBarStyle = false } = props;
+  const channelCallStore = useChannelCallStore((a0) => a0.focus);
+  const revealProviderValue = useRevealProviderValue(channelCallStore, channel);
+  const { reveal, prefersDeferringSystemGestures: prefersDeferringSystemGestures2 } = revealProviderValue;
+  useEffect(() => {
+    if (channelCallStore) {
+      resetFocusTimer();
+    } else {
+      focusTimeout.stop();
+    }
+  }, [channelCallStore]);
+  const theme = useTheme();
+  return <context.Provider value={revealProviderValue}>
+    <StatusBar_android hidden={reveal ? !reveal : !showStatus} animated barStyle={useThemedBarStyle ? theme !== "dark" ? "dark-content" : "light-content" : "light-content"} />
+    {children}
+    <HomeIndicator prefersHidden={reveal ? !reveal : !prefersDeferringSystemGestures2} prefersDeferringSystemGestures={prefersDeferringSystemGestures2} />
+  </context.Provider>;
+};
+export { context as RevealContext };
+export { useRevealProviderValue };

modules/video_calls/native/components/ScreenshareParticipant.tsx

@@ -0,0 +1,52 @@
+// Metro module 10818 (f10819).
+import { useCallback } from "react";
+import { Image as Image2, View } from "react-native";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import useParticipantTileTapGesture from "../useParticipantTileTapGesture";
+import { GestureDetector } from "../../../../_bundle/Module5273";
+import Module10543 from "../../../../_bundle/Module10543";
+import { Text } from "../../../../design/components/Text/native/Text";
+import { intl, t } from "../../../../intl/index.native";
+import { Button } from "../../../../design/components/Button/native/Button.native";
+import { stopScreenshare } from "../useScreenshareUtils";
+const useStyles = createStyles({
+  container: {
+    alignItems: "center",
+    justifyContent: "center",
+    flex: 1,
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOW
+  },
+  image: {
+    marginBottom: 12
+  },
+  title: {
+    textAlign: "center",
+    marginBottom: 8
+  },
+  description: {
+    lineHeight: 18,
+    textAlign: "center",
+    marginBottom: 16
+  }
+});
+export default function ScreenshareParticipant(props) {
+  const { participant, onSingleTap, onDoubleTap, containerStyle } = props;
+  const participantTileTapGesture = useParticipantTileTapGesture({
+    onSingleTapStart: useCallback(() => onSingleTap == null ? void 0 : onSingleTap(participant), [onSingleTap, participant]),
+    onDoubleTapStart: useCallback(() => onDoubleTap == null ? void 0 : onDoubleTap(participant), [onDoubleTap, participant])
+  });
+  const styles = useStyles();
+  return <GestureDetector gesture={participantTileTapGesture}>
+    <View style={[styles.container, containerStyle]}>
+      <Image2 source={Module10543} style={styles.image} />
+      <Text style={styles.title} accessibilityRole="header" variant="heading-lg/extrabold" color="mobile-text-heading-primary">
+        {intl.string(t.gMOwov)}
+      </Text>
+      <Text style={styles.description} variant="text-sm/medium" color="interactive-text-default">
+        {intl.string(t.dKeLGt)}
+      </Text>
+      <Button variant="primary-overlay" text={intl.string(t.CpkXwZ)} onPress={stopScreenshare} />
+    </View>
+  </GestureDetector>;
+};

modules/video_calls/native/components/ScreenshareTile.tsx

@@ -0,0 +1,53 @@
+// Metro module 10541 (f10542).
+import { Image as Image2, View } from "react-native";
+import { NOOP } from "../../../../Constants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import useParticipantTileTapGesture from "../useParticipantTileTapGesture";
+import { GestureDetector } from "../../../../_bundle/Module5273";
+import { LiveTag } from "../../../../design/void/native";
+import Module10543 from "../../../../_bundle/Module10543";
+import { Text } from "../../../../design/components/Text/native/Text";
+import { intl, t } from "../../../../intl/index.native";
+const useStyles = createStyles({
+  container: {
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: Module712.colors.BLACK,
+    overflow: "hidden",
+    flex: 1
+  },
+  image: {
+    marginBottom: 8,
+    width: 60,
+    height: 40
+  },
+  label: {
+    lineHeight: 18,
+    textAlign: "center"
+  },
+  liveContainer: {
+    position: "absolute",
+    top: 8,
+    right: 8,
+    zIndex: 2
+  }
+});
+export default function ScreenShareTile(props) {
+  const { onSingleTap = NOOP, onDoubleTap = NOOP } = props;
+  const styles = useStyles();
+  return <GestureDetector gesture={useParticipantTileTapGesture({
+    onSingleTapStart: onSingleTap,
+    onDoubleTapStart: onDoubleTap
+  })}>
+    <View style={styles.container}>
+      <View style={styles.liveContainer}>
+        <LiveTag />
+      </View>
+      <Image2 source={Module10543} style={styles.image} resizeMode="contain" />
+      <Text style={styles.label} variant="text-xs/bold" color="text-overlay-light">
+        {intl.string(t.G84gtR)}
+      </Text>
+    </View>
+  </GestureDetector>;
+};

modules/video_calls/native/components/SingleScreenshare.tsx

@@ -0,0 +1,25 @@
+// Metro module 10817 (f10818).
+import { resetFocus, toggleFocus } from "../ChannelCallStore";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import useMountEffect from "../../../../hooks/useMountEffect";
+import ScreenshareParticipant from "./ScreenshareParticipant";
+import ChannelRTCActionCreators from "../../../../actions/ChannelRTCActionCreators";
+const useStyles = createStyles({
+  stageStreamContainer: {
+    backgroundColor: Module712.colors.BLACK
+  }
+});
+export default function SingleScreenshare(props) {
+  const { participant, channel } = props;
+  const styles = useStyles();
+  useMountEffect(() => {
+    resetFocus();
+  });
+  return <ScreenshareParticipant participant={participant} onSingleTap={function onSingleTap() {
+    toggleFocus();
+  }} onDoubleTap={function onDoubleTap() {
+    resetFocus();
+    ChannelRTCActionCreators.selectParticipant(channel.id, null);
+  }} containerStyle={channel.isGuildStageVoice() ? styles.stageStreamContainer : void 0} />;
+};

modules/video_calls/native/components/SingleStream.tsx

@@ -0,0 +1,16 @@
+// Metro module 10819 (f10820).
+import { resetFocus, toggleFocus } from "../ChannelCallStore";
+import StreamTile from "./StreamTile";
+import { ResizeMode } from "./VideoRenderer";
+import ChannelRTCActionCreators from "../../../../actions/ChannelRTCActionCreators";
+export default function SingleStream(props) {
+  const { participant, channel } = props;
+  return <StreamTile gestureEnabled resizeMode={ResizeMode.CONTAIN} onSingleTap={function onSingleTap() {
+    toggleFocus();
+  }} onDoubleTap={function onDoubleTap() {
+    resetFocus();
+    ChannelRTCActionCreators.selectParticipant(channel.id, null);
+  }} participant={participant} style={{
+    flex: 1
+  }} />;
+};

modules/video_calls/native/components/SingleVideoCall.tsx

@@ -0,0 +1,30 @@
+// Metro module 10820 (f10821).
+import { useMemo } from "react";
+import { resetFocus, toggleFocus } from "../ChannelCallStore";
+import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
+import useAnalyticsLocations from "../../../app_analytics/useAnalyticsLocations";
+import UserTile from "./UserTile";
+import { AvatarSizes } from "../../../../design/void/native";
+import { ResizeMode } from "./VideoRenderer";
+import ChannelRTCActionCreators from "../../../../actions/ChannelRTCActionCreators";
+import showUserProfileActionSheet from "../../../user_profile/native/showUserProfileActionSheet";
+export default function SingleVideoCall(props) {
+  const { participant, channel } = props;
+  const safeAreaInsets_native = useSafeAreaInsets_native();
+  const { bottom, right } = safeAreaInsets_native;
+  const analyticsLocations = useAnalyticsLocations().analyticsLocations;
+  return <UserTile gestureEnabled participant={participant} avatarSize={AvatarSizes.PROFILE} resizeMode={ResizeMode.AUTO} statusStyle={useMemo(() => ({
+    marginRight: right,
+    marginBottom: bottom
+  }), [right, bottom])} onSingleTap={toggleFocus} onDoubleTap={function onDoubleTap() {
+    resetFocus();
+    ChannelRTCActionCreators.selectParticipant(channel.id, null);
+  }} onLongPress={function onLongPress(event) {
+    showUserProfileActionSheet({
+      userId: event.user.id,
+      channelId: channel.id,
+      isVoiceContext: true,
+      sourceAnalyticsLocations: analyticsLocations
+    });
+  }} />;
+};

modules/video_calls/native/components/StreamTile.tsx

@@ -0,0 +1,125 @@
+// Metro module 10544 (f10545).
+import { memo, useCallback } from "react";
+import { StyleSheet, View } from "react-native";
+import ApplicationStreamingStore from "../../../../stores/ApplicationStreamingStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import { ApplicationStreamStates } from "../../../../Constants";
+import { MediaEngineContextTypes } from "../../../../_bundle/Module4250";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import { hexWithOpacity } from "../../../../utils/ColorUtils";
+import { Text } from "../../../../design/components/Text/native/Text";
+import { LegacyText, Icon } from "../../../../design/void/native";
+import { useStateFromStores } from "../../../../_bundle/Module589";
+import useVideoStreamError from "../../../errors/hooks/useVideoStreamError";
+import VideoEmptyState, { VideoEmptyTypes } from "../../../../components_native/calls/stream/VideoEmptyState";
+import { intl, t } from "../../../../intl/index.native";
+import NicknameUtils from "../../../../utils/NicknameUtils";
+import VideoRenderer, { ResizeMode } from "./VideoRenderer";
+import StreamQualityLiveIndicator from "../../../go_live/native/StreamQualityLiveIndicator";
+import { VideoSpinnerContext } from "../../../../lib/VideoSpinnerTimer";
+import useParticipantTileTapGesture from "../useParticipantTileTapGesture";
+import { GestureDetector } from "../../../../_bundle/Module5273";
+import { PressableOpacity } from "../../../../design/void/Pressables/native/Pressables";
+import Module10569 from "../../../../_bundle/Module10569";
+let useStyles, Component, Component2;
+const StreamTextOverlay = function StreamTextOverlay(props) {
+  const { title, subtext } = props;
+  const styles2 = useStyles();
+  return <View style={styles2.screenMessageContainer}>
+    <Text style={styles2.screenMessageText} variant="text-md/semibold" color="text-overlay-light">{title}</Text>
+    {subtext != null ? <LegacyText style={styles2.screenMessageSubtext}>{subtext}</LegacyText> : null}
+  </View>;
+};
+useStyles = createStyles({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    overflow: "hidden",
+    width: "100%",
+    backgroundColor: Module712.colors.BLACK
+  },
+  screenMessageContainer: {
+    ...StyleSheet.absoluteFillObject,
+    flex: 1,
+    padding: 8,
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: hexWithOpacity(Module712.unsafe_rawColors.BLACK, 0.7)
+  },
+  screenMessageText: {
+    lineHeight: 18
+  },
+  screenMessageSubtext: {
+    color: Module712.unsafe_rawColors.PRIMARY_300,
+    fontSize: 14,
+    lineHeight: 18,
+    textAlign: "center"
+  },
+  statusWrapper: {
+    position: "absolute",
+    bottom: 8,
+    right: 8,
+    backgroundColor: hexWithOpacity(Module712.unsafe_rawColors.PRIMARY_700, 0.5),
+    borderRadius: Module712.radii.md,
+    width: 24,
+    height: 24,
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  liveTag: {
+    position: "absolute",
+    right: 8,
+    top: 8
+  }
+});
+Component = memo(function({ participant, streamId, user, resizeMode, gestureEnabled, removeEmptyStateButton, removeEmptyStateImage }) {
+  const styles = useStyles();
+  const stateFromStores = useStateFromStores([ApplicationStreamingStore], () => ApplicationStreamingStore.getActiveStreamForStreamKey(participant.id));
+  const videoStreamError = useVideoStreamError(MediaEngineContextTypes.STREAM, participant.user.id);
+  if (stateFromStores != null) {
+    const state = stateFromStores.state;
+    if (ApplicationStreamStates.FAILED === state) {
+      return <VideoEmptyState stream={stateFromStores} removeCloseButton={removeEmptyStateButton} removeSplashImage={removeEmptyStateImage} type={VideoEmptyTypes.STREAM_FAILED} style={StyleSheet.absoluteFill} />;
+    }
+    if (ApplicationStreamStates.ENDED === state) {
+      return <VideoEmptyState stream={stateFromStores} removeCloseButton={removeEmptyStateButton} removeSplashImage={removeEmptyStateImage} type={VideoEmptyTypes.STREAM_ENDED} style={StyleSheet.absoluteFill} />;
+    }
+    const r14 = ApplicationStreamStates.RECONNECTING === state ? <StreamTextOverlay title={intl.string(t["pdFFK+"])} /> : ApplicationStreamStates.PAUSED === state ? <StreamTextOverlay title={intl.string(t["5q17w5"])} subtext={intl.formatToPlainString(t.meVVlb, {
+      username: NicknameUtils.getName(stateFromStores.guildId, stateFromStores.channelId, user)
+    })} /> : null;
+    if (videoStreamError != null) {
+      return <VideoEmptyState stream={stateFromStores} removeCloseButton={removeEmptyStateButton} removeSplashImage={removeEmptyStateImage} type={VideoEmptyTypes.STREAM_FAILED} style={StyleSheet.absoluteFill} avError={videoStreamError} />;
+    }
+    return <>
+      <VideoRenderer resizeMode={resizeMode} streamId={streamId} gestureEnabled={gestureEnabled} renderTag={() => <StreamQualityLiveIndicator style={styles.liveTag} participant={participant} />} videoSpinnerContext={stateFromStores.ownerId === AuthenticationStore.getId() ? VideoSpinnerContext.SELF_STREAM : VideoSpinnerContext.REMOTE_STREAM} userId={user.id} paused={stateFromStores.state === ApplicationStreamStates.PAUSED} />
+      {r14}
+    </>;
+  }
+  return null;
+});
+Component2 = memo(function({ onFullScreen, style }) {
+  return <PressableOpacity accessibilityRole="button" onPress={onFullScreen} style={[useStyles().statusWrapper, style]} hitSlop={{
+    top: 4,
+    left: 4,
+    right: 4,
+    bottom: 4
+  }}>
+    <Icon source={Module10569} size={Icon.Sizes.SMALL} color={Module712.unsafe_rawColors.WHITE} />
+  </PressableOpacity>;
+});
+export default function StreamTile(props) {
+  const { participant: participant2, onSingleTap, onDoubleTap, resizeMode = ResizeMode.CONTAIN, gestureEnabled, removeEmptyStateButton, removeEmptyStateImage, onFullScreen, fullscreenIconStyle, style } = props;
+  const styles2 = useStyles();
+  return <GestureDetector gesture={useParticipantTileTapGesture({
+    onSingleTapStart: useCallback(() => onSingleTap == null ? void 0 : onSingleTap(participant2), [onSingleTap, participant2]),
+    onDoubleTapStart: useCallback(() => onDoubleTap == null ? void 0 : onDoubleTap(participant2), [onDoubleTap, participant2])
+  })}>
+    <View style={[styles2.container, style]}>
+      <Component streamId={participant2.streamId} participant={participant2} user={participant2.user} resizeMode={resizeMode} gestureEnabled={gestureEnabled} removeEmptyStateButton={removeEmptyStateButton} removeEmptyStateImage={removeEmptyStateImage} />
+      {onFullScreen != null && <Component2 onFullScreen={onFullScreen} style={fullscreenIconStyle} />}
+    </View>
+  </GestureDetector>;
+};
+export { StreamTextOverlay };

modules/video_calls/native/components/UserTile.tsx

@@ -0,0 +1,199 @@
+// Metro module 10570 (f10571).
+import _slicedToArray from "../../../../_bundle/_slicedToArray";
+import { memo, useCallback } from "react";
+import { View } from "react-native";
+import VoiceChannelEffectsStore, { clearVoiceChannelEffectForUser } from "../../../voice_channel_effects/VoiceChannelEffectsStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import ChannelStore from "../../../../stores/ChannelStore";
+import MediaEngineStore from "../../../../stores/MediaEngineStore";
+import { VideoToggleState } from "../../../../Constants";
+import { ParticipantTypes } from "../../../calls/CallConstants";
+import { MediaEngineContextTypes } from "../../../../_bundle/Module4250";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import { hexWithOpacity } from "../../../../utils/ColorUtils";
+import { useStateFromStores, useStateFromStoresArray } from "../../../../_bundle/Module589";
+import VideoBackground from "../../../calls/native/VideoBackground";
+import { Icon } from "../../../../design/void/native";
+import Module8346 from "../../../../_bundle/Module8346";
+import { Text } from "../../../../design/components/Text/native/Text";
+import { intl, t } from "../../../../intl/index.native";
+import VideoRenderer, { ResizeMode } from "./VideoRenderer";
+import { VideoSpinnerContext } from "../../../../lib/VideoSpinnerTimer";
+import Module7671 from "../../../../_bundle/Module7671";
+import Module10596 from "../../../../_bundle/Module10596";
+import Module10597 from "../../../../_bundle/Module10597";
+import Module10598 from "../../../../_bundle/Module10598";
+import useIsSpeaking from "../../../../hooks/useIsSpeaking";
+import participantHasVideo from "../../participantHasVideo";
+import mediaEngineContextFromParticipantType from "../../../calls/mediaEngineContextFromParticipantType";
+import { useVoiceChatNavigationContext } from "../../../voice_chat/native/VoiceChatModalContext";
+import useParticipantTileTapGesture from "../useParticipantTileTapGesture";
+import { Gesture, GestureDetector } from "../../../../_bundle/Module5273";
+import AnimatedEffectEmoji from "../../../voice_channel_effects/native/AnimatedEffectEmoji";
+let Component2;
+const useStyles = createStyles({
+  container: {
+    flex: 1,
+    width: "100%",
+    alignItems: "center",
+    justifyContent: "center",
+    overflow: "hidden",
+    backgroundColor: Module712.colors.BLACK
+  },
+  imageBackground: {
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "center",
+    alignSelf: "stretch"
+  },
+  autoDisabledVideoWrapper: {
+    width: "100%",
+    flexDirection: "row",
+    justifyContent: "center"
+  },
+  autoDisabledVideo: {
+    backgroundColor: hexWithOpacity(Module712.unsafe_rawColors.PRIMARY_700, 0.5),
+    alignItems: "center",
+    height: 24
+  },
+  autoDisabledVideoTextWrapper: {
+    borderRadius: Module712.radii.sm,
+    flexDirection: "row",
+    justifyContent: "space-evenly",
+    paddingHorizontal: 8,
+    paddingVertical: 4,
+    alignItems: "center"
+  },
+  statusWrapper: {
+    position: "absolute",
+    bottom: 8,
+    right: 8,
+    backgroundColor: hexWithOpacity(Module712.unsafe_rawColors.PRIMARY_700, 0.5),
+    borderRadius: Module712.radii.md,
+    width: 24,
+    height: 24,
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  labelText: {
+    marginLeft: 8,
+    height: 20,
+    alignItems: "center"
+  }
+});
+let Component = memo(function({ streamId, user: user2, resizeMode, ringing, avatarSize, speaking, gestureEnabled, hasVideo, guildId }) {
+  let c18134_3, c18134_4;
+  c18134_3 = void 0;
+  c18134_4 = void 0;
+  const styles = useStyles();
+  const id = user2.id;
+  const stateFromStores = useStateFromStores([AuthenticationStore], () => {
+    let r1 = hasVideo;
+    if (hasVideo) {
+      r1 = id === AuthenticationStore.getId();
+    }
+    return r1;
+  }, [hasVideo, id]);
+  c18134_3 = _slicedToArray(useStateFromStoresArray([MediaEngineStore], () => [MediaEngineStore.isLocalVideoAutoDisabled(id)], [id]), 1)[0];
+  const r2 = useStateFromStores([MediaEngineStore], () => id != null ? MediaEngineStore.getVideoToggleState(id, MediaEngineContextTypes.DEFAULT) : VideoToggleState.NONE, [id]) === VideoToggleState.AUTO_PROBING;
+  c18134_4 = r2;
+  return !ringing && (hasVideo && !r2) ? <VideoRenderer resizeMode={resizeMode} streamId={streamId} gestureEnabled={gestureEnabled} videoSpinnerContext={stateFromStores ? VideoSpinnerContext.SELF_VIDEO : VideoSpinnerContext.REMOTE_VIDEO} userId={user2.id} /> : <VideoBackground style={styles.imageBackground} url={user2.getAvatarURL(guildId, 128)} user={user2} guildId={guildId} speaking={speaking} size={avatarSize} renderVideoDetails={function renderVideoDetails() {
+    return c18134_3 ? <View style={styles.autoDisabledVideoWrapper}>
+      <View style={[styles.autoDisabledVideo, styles.autoDisabledVideoTextWrapper]}>
+        <Icon source={Module8346} size={Icon.Sizes.SMALL} disableColor />
+        <Text variant="text-sm/normal" color="text-default" style={styles.labelText}>
+          {intl.string(t.m2Hyj0)}
+        </Text>
+      </View>
+    </View> : c18134_4 ? <View style={styles.autoDisabledVideoWrapper}>
+      <View style={[styles.autoDisabledVideo, styles.autoDisabledVideoTextWrapper]}>
+        <Icon source={Module8346} size={Icon.Sizes.SMALL} disableColor />
+        <Text variant="text-sm/normal" color="text-default" style={styles.labelText}>
+          {intl.string(t.m2Hyj0)}
+        </Text>
+      </View>
+    </View> : null;
+  }} />;
+});
+Component2 = memo(function({ muted, deafened, userId, style }) {
+  let r39;
+  const styles2 = useStyles();
+  let [r30, r31, r32] = useStateFromStoresArray([MediaEngineStore], () => [MediaEngineStore.isLocalMute(userId), MediaEngineStore.isLocalVideoDisabled(userId), MediaEngineStore.isLocalVideoAutoDisabled(userId)], [userId]);
+  const source = r30 ? Module7671 : deafened ? Module10596 : muted ? Module10597 : void 0;
+  if (r31) {
+    r31 = !r32;
+  }
+  L17: {
+    if (!r31) {
+      r39 = null;
+      if (source == null) {
+        break L17;
+      }
+    }
+    r39 = <>
+      {[r31 ? <View style={[styles2.statusWrapper, style]}>
+        <Icon source={Module10598} size={Icon.Sizes.SMALL} disableColor />
+      </View> : null, source != null ? <View style={[styles2.statusWrapper, style, r31 ? {
+        right: 38
+      } : null]}>
+        <Icon source={source} size={Icon.Sizes.SMALL} color={Module712.unsafe_rawColors.WHITE} disableColor={source === Module7671} />
+      </View> : null]}
+    </>;
+  }
+  return r39;
+});
+export default function UserTile(props) {
+  let user, id2;
+  const { participant, onSingleTap, onDoubleTap, onLongPress, avatarSize, resizeMode = ResizeMode.COVER, statusStyle, gestureEnabled, hasNotch, style } = props;
+  user = void 0;
+  id2 = void 0;
+  const styles2 = useStyles();
+  const callback2 = useCallback(() => onSingleTap == null ? void 0 : onSingleTap(participant), [onSingleTap, participant]);
+  const callback = useCallback(() => onDoubleTap == null ? void 0 : onDoubleTap(participant), [onDoubleTap, participant]);
+  const callback3 = useCallback(() => onLongPress == null ? void 0 : onLongPress(participant), [participant, onLongPress]);
+  const { streamId, ringing } = participant;
+  user = participant.user;
+  const voiceState = participant.voiceState;
+  const isSpeaking = useIsSpeaking({
+    userId: participant.id
+  });
+  let guildId = ChannelStore.getChannel(voiceState?.channelId)?.guild_id;
+  if (guildId == null) {
+    guildId = void 0;
+  }
+  let hasVideo2 = participantHasVideo(participant);
+  let muted = voiceState == null ? void 0 : voiceState.isVoiceMuted();
+  if (muted == null) {
+    muted = false;
+  }
+  let deafened = voiceState == null ? void 0 : voiceState.isVoiceDeafened();
+  if (deafened == null) {
+    deafened = false;
+  }
+  const stateFromStores = useStateFromStores([MediaEngineStore], () => user.id != null && MediaEngineStore.isLocalVideoDisabled(user.id, mediaEngineContextFromParticipantType(participant.type)), [user.id, participant.type]);
+  const swipeDismissRef = useVoiceChatNavigationContext()?.swipeDismissRef;
+  id2 = participant.user?.id;
+  const stateFromStores2 = useStateFromStores([VoiceChannelEffectsStore], () => id2 != null ? VoiceChannelEffectsStore.getEffectForUserId(id2) : null);
+  if (participant.type !== ParticipantTypes.USER) {
+    participant.type;
+  }
+  const participantTileTapGesture = useParticipantTileTapGesture({
+    onDoubleTapStart: callback,
+    onSingleTapStart: callback2
+  });
+  const r106 = Gesture.LongPress().onStart(callback3).minDuration(800);
+  const props2 = {
+    gesture: Gesture.Simultaneous(swipeDismissRef != null ? r106.requireExternalGestureToFail(swipeDismissRef) : r106, participantTileTapGesture),
+    children: null
+  };
+  if (hasVideo2) {
+    hasVideo2 = !stateFromStores;
+  }
+  props2.children = <View style={[styles2.container, style]}>
+    <Component guildId={guildId} hasVideo={hasVideo2} streamId={streamId} user={user} resizeMode={resizeMode} ringing={ringing} speaking={isSpeaking} avatarSize={avatarSize} gestureEnabled={gestureEnabled} />
+    {id2 != null ? stateFromStores2 != null ? <AnimatedEffectEmoji voiceChannelEffect={stateFromStores2} onComplete={() => clearVoiceChannelEffectForUser(id2)} userId={id2} hasNotch={hasNotch} /> : null : null}
+    <Component2 muted={muted} deafened={deafened} userId={user.id} style={statusStyle} />
+  </View>;
+  return <GestureDetector {...props2} />;
+};

modules/video_calls/native/components/UserVideoFailed.tsx

@@ -0,0 +1,57 @@
+// Metro module 15967 (f15968).
+import { View } from "react-native";
+import { VideoToggleState } from "../../../../Constants";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import { getErrorInfo } from "../../../errors/av_errors/AVError";
+import { StreamFailed } from "../../../../design/components/Illustration/native/redesign/generated/StreamFailed";
+import { Text } from "../../../../design/components/Text/native/Text";
+import { intl, t } from "../../../../intl/index.native";
+import { Button } from "../../../../design/components/Button/native/Button.native";
+import { clearVideoStreamTimeout } from "../../../errors/VideoStreamReadyActionCreators";
+import { MediaEngineContextTypes } from "../../../../_bundle/Module4286";
+import AudioActionCreators from "../../../../actions/AudioActionCreators";
+const useStyles = createStyles({
+  container: {
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: Module712.unsafe_rawColors.PRIMARY_700,
+    padding: 8
+  },
+  placeholderImage: {
+    marginBottom: 8,
+    width: "100%",
+    resizeMode: "contain"
+  },
+  button: {
+    marginTop: 16,
+    alignSelf: "center"
+  }
+});
+export default function UserVideoFailed(props) {
+  const { userId, style, avError, removeRetryButton, removeSplashImage, ...props2 } = props;
+  const styles = useStyles();
+  const errorCode = getErrorInfo(avError).errorCode;
+  return <View {...props2} style={[styles.container, style]}>
+    <>
+      {removeSplashImage ? !removeSplashImage : <StreamFailed style={styles.placeholderImage} />}
+      <Text variant="text-md/semibold" color="text-strong">
+        {intl.string(t["z+mxvo"])}
+      </Text>
+    </>
+    <Text variant="text-sm/semibold" color="text-muted" selectable>
+      {intl.formatToPlainString(t.ejOT95, {
+        errorCode
+      })}
+    </Text>
+    <View style={styles.button}>
+      {removeRetryButton ? !removeRetryButton : <Button variant="secondary" text={intl.string(t["hxmQ/e"])} onPress={function onPress() {
+        clearVideoStreamTimeout(MediaEngineContextTypes.DEFAULT, userId);
+        AudioActionCreators.setDisableLocalVideo(userId, VideoToggleState.DISABLED, MediaEngineContextTypes.DEFAULT, false);
+        setTimeout(() => {
+          AudioActionCreators.setDisableLocalVideo(userId, VideoToggleState.MANUAL_ENABLED, MediaEngineContextTypes.DEFAULT, false);
+        }, 1000);
+      }} />}
+    </View>
+  </View>;
+};

modules/video_calls/native/components/VideoRenderer.tsx

@@ -0,0 +1,243 @@
+// Metro module 10554 (f10555).
+import * as Module19 from "react";
+import { useState, useRef, useCallback, useMemo, useLayoutEffect } from "react";
+import { ScrollView, StyleSheet, View } from "react-native";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import { useSurfaceDirectRendererExperiment } from "../SurfaceDirectRendererExperiment";
+import useVideoSpinnerTimer from "../../useVideoSpinnerTimer";
+import useVideoReadyTimeout from "../../../errors/hooks/useVideoReadyTimeout";
+import { getWindowDimensions } from "../../../screen/useWindowDimensions.native";
+import { isAndroid } from "../../../../utils/PlatformUtils";
+import { useStore, OrientationType } from "../../../device/native/DeviceOrientation";
+import MessageLoadingSpinner from "../../../../components_native/common/MessageLoadingSpinner";
+import ZoomLayout_android from "../../../zoom_layout/ZoomLayout.android";
+import DCDVideoRenderer from "./DCDVideoRenderer";
+import ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+const useStyles = createStyles({
+  spinner: {
+    height: 32,
+    width: 32
+  },
+  center: {
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  zoomLayoutAndroid: {
+    flex: 1
+  }
+});
+let c7091_11 = {
+  COVER: 0,
+  0: "COVER",
+  CONTAIN: 1,
+  1: "CONTAIN",
+  AUTO: 2,
+  2: "AUTO"
+};
+const r43 = Module19.memo(function(a0) {
+  const { streamId, resizeMode = c7091_11.CONTAIN } = a0;
+  let memo;
+  const CONTAIN = resizeMode;
+  const { gestureEnabled = false, renderTag, videoSpinnerContext, userId, streamKey, paused = false } = a0;
+  memo = void 0;
+  const styles = useStyles();
+  const surfaceDirectRendererExperiment = useSurfaceDirectRendererExperiment(userId, {
+    location: "VideoRenderer"
+  });
+  const [state, setState] = useState(0);
+  const [state2, setState2] = useState(0);
+  const [state3, setState3] = useState(0);
+  const [state4, setState4] = useState(0);
+  const [loading, setState5] = useState(true);
+  useVideoSpinnerTimer({
+    location: "VideoRenderer",
+    videoSpinnerContext,
+    userId,
+    streamId,
+    paused,
+    loading
+  });
+  const onReady = useVideoReadyTimeout({
+    streamId,
+    userId,
+    videoSpinnerContext,
+    paused,
+    loading,
+    streamKey
+  }).onReady;
+  const ref = useRef(null);
+  const ref2 = useRef(null);
+  const ref3 = useRef({
+    width: 0,
+    height: 0
+  });
+  const callback2 = useCallback(({ nativeEvent }) => {
+    const { width: width2, height: height2 } = nativeEvent;
+    const windowDimensions = getWindowDimensions();
+    const r27 = Math.min(Math.sqrt(windowDimensions.width * windowDimensions.height * 4 / (width2 * height2)), 1);
+    setState3(width2 * r27);
+    setState4(height2 * r27);
+  }, [setState3, setState4]);
+  const callback3 = useCallback(() => {
+    setState5(false);
+    onReady();
+  }, [onReady]);
+  const callback4 = useCallback((a0) => {
+    const layout = a0.nativeEvent.layout;
+    const { width: width2, height: height2 } = layout;
+    setState(width2);
+    setState2(height2);
+    ref3.current = {
+      width: width2,
+      height: height2
+    };
+  }, []);
+  const callback = useCallback((a0) => {
+    const layout = a0.nativeEvent.layout;
+    const { width, height } = layout;
+    if (!(isAndroid() || ref.current == null)) {
+      const current = ref.current;
+      if (!(width <= 0 || height <= 0)) {
+        current.scrollResponderZoomTo({
+          x: 0,
+          y: 0,
+          width,
+          height,
+          animated: false
+        });
+        current.scrollTo({
+          x: 0,
+          y: 0,
+          animated: false
+        });
+      }
+      requestAnimationFrame(() => {
+        if (ref.current != null) {
+          const current = ref.current;
+          if (!(width <= 0 || height <= 0)) {
+            current.scrollResponderZoomTo({
+              x: 0,
+              y: 0,
+              width,
+              height,
+              animated: false
+            });
+            current.scrollTo({
+              x: 0,
+              y: 0,
+              animated: false
+            });
+          }
+        }
+      });
+    }
+  }, []);
+  memo = useMemo(() => {
+    if (state !== 0 && state2 !== 0 && state3 !== 0 && state4 !== 0) {
+      let r10 = CONTAIN;
+      const r8 = state / state2;
+      const r7 = state3 / state4;
+      if (CONTAIN === c7091_11.AUTO) {
+        r10 = !(r8 > 1 && r7 > 1) && !(r8 < 1 && r7 < 1) ? c7091_11.CONTAIN : c7091_11.COVER;
+      }
+      return r10 === c7091_11.CONTAIN ? r8 > r7 ? state2 / state4 : state / state3 : r10 === c7091_11.COVER ? r7 > r8 ? state2 / state4 : state / state3 : 0;
+    }
+    return 0;
+  }, [state, state2, state3, state4, CONTAIN]);
+  const store = useStore((a0) => a0.orientation);
+  useLayoutEffect(() => {
+    if (isAndroid() && ref2.current != null) {
+      const current = ref2.current;
+      if (current != null) {
+        current.unzoom({
+          animated: false
+        });
+      }
+    }
+  }, [state, state2, state3, state4, memo]);
+  useLayoutEffect(() => {
+    if (!isAndroid() && ref.current != null && state3 > 0 && state4 > 0) {
+      const current = ref3.current;
+      const { width: width2, height: height2 } = current;
+      const current2 = ref.current;
+      if (!(width2 <= 0 || height2 <= 0)) {
+        current2.scrollResponderZoomTo({
+          x: 0,
+          y: 0,
+          width: width2,
+          height: height2,
+          animated: false
+        });
+        current2.scrollTo({
+          x: 0,
+          y: 0,
+          animated: false
+        });
+      }
+    }
+  }, [state3, state4]);
+  const memo2 = useMemo(() => ({
+    width: state3 * memo,
+    height: state4 * memo
+  }), [memo, state3, state4]);
+  const memo3 = useMemo(() => ({
+    width: state3 * memo,
+    height: state4 * memo
+  }), [memo, state3, state4]);
+  const memo4 = useMemo(() => {
+    const width2 = Math.min(state3 * memo, state);
+    const height2 = Math.min(state4 * memo, state2);
+    return {
+      position: "absolute",
+      left: (state - width2) / 2,
+      top: (state2 - height2) / 2,
+      width: width2,
+      height: height2,
+      alignItems: "center",
+      justifyContent: "center",
+      overflow: "hidden"
+    };
+  }, [state3, memo, state, state4, state2]);
+  const memo5 = useMemo(() => ({
+    width: state,
+    height: state2
+  }), [state, state2]);
+  const memo6 = useMemo(() => ({
+    position: "absolute",
+    top: state2 / 2 - Math.min(state4 * memo, state2) / 2,
+    right: state / 2 - Math.min(state3 * memo, state) / 2
+  }), [state3, memo, state, state4, state2]);
+  const r127 = loading ? <MessageLoadingSpinner animate style={styles.spinner} /> : null;
+  const r5 = store === OrientationType.PORTRAIT;
+  return isAndroid() ? <View onLayout={callback4} style={[styles.center, StyleSheet.absoluteFillObject]}>
+    <ZoomLayout_android ref={ref2} style={styles.zoomLayoutAndroid} minimumZoomScale={1} gestureEnabled={gestureEnabled}>
+      <View collapsable={false} style={{
+        width: state,
+        height: state2,
+        alignItems: "center",
+        justifyContent: "center"
+      }}>
+        <DCDVideoRenderer useSurfaceDirectRenderer={surfaceDirectRendererExperiment} streamId={streamId} onSize={callback2} onReady={callback3} style={memo3} />
+        {r127}
+      </View>
+    </ZoomLayout_android>
+    <View style={memo6}>
+      {loading ? null : gestureEnabled ? r5 ? renderTag == null ? void 0 : renderTag() : null : null}
+    </View>
+  </View> : gestureEnabled ? <ScrollView ref={ref} onLayout={callback4} style={StyleSheet.absoluteFillObject} contentContainerStyle={memo5} bounces={false} pinchGestureEnabled={!loading} maximumZoomScale={8} minimumZoomScale={1} showsVerticalScrollIndicator={false} showsHorizontalScrollIndicator={false} scrollEventThrottle={16}>
+    <View collapsable={false} style={memo5} onLayout={callback}>
+      <View style={memo4}>
+        <ReanimatedRexport.View>
+          <DCDVideoRenderer useSurfaceDirectRenderer={surfaceDirectRendererExperiment} streamId={streamId} onSize={callback2} onReady={callback3} style={memo2} />
+        </ReanimatedRexport.View>
+        {r5 ? renderTag == null ? void 0 : renderTag() : null}
+      </View>
+      {r127 != null ? <View style={[StyleSheet.absoluteFillObject, styles.center]}>{r127}</View> : null}
+    </View>
+  </ScrollView> : <View onLayout={callback4} style={[styles.center, StyleSheet.absoluteFillObject]}>
+    <DCDVideoRenderer useSurfaceDirectRenderer={surfaceDirectRendererExperiment} streamId={streamId} onSize={callback2} onReady={callback3} style={memo2} />
+    {r127}
+  </View>;
+});
+export default r43;
+export { c7091_11 as ResizeMode };

modules/video_calls/native/components/useModalPanGesture.tsx

@@ -0,0 +1,105 @@
+// Metro module 10878 (f10879).
+import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import { useSharedValue } from "../../../reanimated/ReanimatedRexport";
+import { Gesture } from "../../../../_bundle/Module5273";
+import * as _spring from "../../../../design/animation/reanimated/spring/spring";
+import ModalActionCreators from "../../../../actions/ModalActionCreators";
+const __initData = {
+  code: "function useModalPanGestureTsx1({velocityY:velocityY}){const{translateY,thresholdTranslate,thresholdVelocity,withSpring,height,runOnJS,ModalActionCreators,onClose,onEnd}=this.__closure;const config={damping:15,mass:1,stiffness:250,overshootClamping:true,restSpeedThreshold:0.001,restDisplacementThreshold:0.001,velocity:velocityY};if(translateY.get()>=thresholdTranslate||velocityY>=thresholdVelocity){translateY.set(withSpring(height,config,'respect-motion-settings',function(){runOnJS(ModalActionCreators.pop)();}));if(onClose!=null){runOnJS(onClose)();}}else{translateY.set(withSpring(0,config));}if(onEnd!=null){runOnJS(onEnd)();}}"
+};
+const __initData2 = {
+  code: "function useModalPanGestureTsx2({translationY:translationY}){const{translateY,interpolate,start,maxTranslate,Extrapolate}=this.__closure;translateY.set(interpolate(start.get().y+translationY,[0,maxTranslate],[0,maxTranslate],Extrapolate.CLAMP));}"
+};
+const __initData3 = {
+  code: "function useModalPanGestureTsx3(){const{onStart,runOnJS,start,translateY}=this.__closure;if(onStart!=null){runOnJS(onStart)();}start.set({y:translateY.get()});}"
+};
+const __initData4 = {
+  code: "function useModalPanGestureTsx4(){const{runOnJS,ModalActionCreators}=this.__closure;runOnJS(ModalActionCreators.pop)();}"
+};
+export default function useModalPanGesture(a0) {
+  let thresholdVelocity = a0.thresholdVelocity;
+  if (thresholdVelocity === void 0) {
+    thresholdVelocity = 500;
+  }
+  let c18335_0 = thresholdVelocity;
+  const { gestureEnabled, maxTranslate, thresholdTranslate, height, translateY, onStart, onEnd, onClose } = a0;
+  const sharedValue = useSharedValue({
+    y: 0
+  });
+  const r27 = Gesture.Pan().enabled(gestureEnabled);
+  const J = function J() {
+    if (onStart != null) {
+      _ReanimatedRexport.runOnJS(onStart)();
+    }
+    sharedValue.set({
+      y: translateY.get()
+    });
+  };
+  J.__closure = {
+    onStart,
+    runOnJS: _ReanimatedRexport.runOnJS,
+    start: sharedValue,
+    translateY
+  };
+  J.__workletHash = 15847989720945;
+  J.__initData = __initData3;
+  const r35 = r27.onStart(J);
+  const x = function x({ translationY }) {
+    translateY.set(_ReanimatedRexport.interpolate(sharedValue.get().y + translationY, [0, maxTranslate], [0, maxTranslate], _ReanimatedRexport.Extrapolate.CLAMP));
+  };
+  x.__closure = {
+    translateY,
+    interpolate: _ReanimatedRexport.interpolate,
+    start: sharedValue,
+    maxTranslate,
+    Extrapolate: _ReanimatedRexport.Extrapolate
+  };
+  x.__workletHash = 6809176231356;
+  x.__initData = __initData2;
+  const r47 = r35.onUpdate(x);
+  const O = function O({ velocityY }) {
+    const r12 = {
+      damping: 15,
+      mass: 1,
+      stiffness: 250,
+      overshootClamping: true,
+      restSpeedThreshold: 0.001,
+      restDisplacementThreshold: 0.001,
+      velocity: velocityY
+    };
+    if (!(translateY.get() >= thresholdTranslate) && !(velocityY >= c18335_0)) {
+      translateY.set(_spring.withSpring(0, r12));
+    } else {
+      const n = function n() {
+        _ReanimatedRexport.runOnJS(ModalActionCreators.pop)();
+      };
+      n.__closure = {
+        runOnJS: _ReanimatedRexport.runOnJS,
+        ModalActionCreators
+      };
+      n.__workletHash = 14223008059411;
+      n.__initData = __initData4;
+      translateY.set(_spring.withSpring(height, r12, "respect-motion-settings", n));
+      if (onClose != null) {
+        _ReanimatedRexport.runOnJS(onClose)();
+      }
+    }
+    if (onEnd != null) {
+      _ReanimatedRexport.runOnJS(onEnd)();
+    }
+  };
+  O.__closure = {
+    translateY,
+    thresholdTranslate,
+    thresholdVelocity,
+    withSpring: _spring.withSpring,
+    height,
+    runOnJS: _ReanimatedRexport.runOnJS,
+    ModalActionCreators,
+    onClose,
+    onEnd
+  };
+  O.__workletHash = 16881029664873;
+  O.__initData = __initData;
+  return r47.onEnd(O).failOffsetY(-0.01).activeOffsetY([-5, 15]);
+};

modules/video_calls/native/components/usePipDimensions.tsx

@@ -0,0 +1,57 @@
+// Metro module 10524 (f10525).
+import { useMemo } from "react";
+import { useIsViewingActivity } from "../../../activities/native/useIsViewingActivity";
+import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
+import { OrientationType } from "../../../device/native/DeviceOrientation";
+let c7066_4 = 0.5625;
+export default function usePipDimensions({ channelId, forcedOrientation = null }) {
+  let c18108_0 = forcedOrientation;
+  const isViewingActivity = useIsViewingActivity({
+    channelId
+  });
+  const windowDimensions_native = useWindowDimensions_native();
+  const { width, height } = windowDimensions_native;
+  return useMemo(() => {
+    let height2, width2;
+    let r2 = width > height;
+    const r4 = c18108_0 === OrientationType.LANDSCAPE || (r2 ? c18108_0 !== OrientationType.PORTRAIT : r2);
+    L18: {
+      height2 = 96;
+      width2 = 96;
+      if (!isViewingActivity) {
+        if (!r2 && !r4) {
+          const r28 = Math.min(0.25 * height, 300);
+          width2 = r28 * c7066_4;
+          height2 = r28;
+          break L18;
+        }
+        if (!r2 && r4) {
+          const r36 = Math.min(0.5 * width, 400);
+          height2 = r36 * c7066_4;
+          width2 = r36;
+          break L18;
+        }
+        if (r2 && r4) {
+          const r52 = Math.min(0.25 * width, 400);
+          height2 = r52 * c7066_4;
+          width2 = r52;
+          break L18;
+        }
+        if (r2) {
+          r2 = !r4;
+        }
+        height2 = 1;
+        width2 = 1;
+        if (r2) {
+          const r44 = Math.min(0.5 * height, 300);
+          width2 = r44 * c7066_4;
+          height2 = r44;
+        }
+      }
+    }
+    return {
+      height: height2,
+      width: width2
+    };
+  }, [height, width, forcedOrientation, isViewingActivity]);
+};

modules/video_calls/native/components/usePipPosition.tsx

@@ -0,0 +1,12 @@
+// Metro module 10519 (f10520).
+import { useState, useCallback } from "react";
+import { Storage } from "../../../../_bundle/Module595";
+import { DEFAULT_PIP_POSITION } from "./PictureInPicture";
+let c7061_4 = "CameraPreviewPosition";
+export default function usePipPosition() {
+  const [state, setState] = useState(() => Storage.get(c7061_4, DEFAULT_PIP_POSITION));
+  return [state, useCallback((a0) => {
+    Storage.set(c7061_4, a0);
+    setState(a0);
+  }, [])];
+};

modules/video_calls/native/components/useShouldForcePipOrientation.tsx

@@ -0,0 +1,53 @@
+// Metro module 10521 (f10522).
+import EmbeddedActivitiesStore from "../../../activities/EmbeddedActivitiesStore";
+import ChannelRTCStore from "../../../calls/ChannelRTCStore";
+import AuthenticationStore from "../../../../stores/AuthenticationStore";
+import { OrientationLockState } from "../../../activities/Constants";
+import { ParticipantTypes, isStreamParticipant } from "../../../calls/CallConstants";
+import usePipVideoOrStream from "../usePipVideoOrStream";
+import { useStateFromStores, useStateFromStoresObject } from "../../../../_bundle/Module589";
+import { getEmbeddedActivityParticipantId } from "../../../calls/ChannelRTCParticipants";
+import { OrientationType } from "../../../device/native/DeviceOrientation";
+export function useShouldForcePipOrientation({ channel }) {
+  let LANDSCAPE;
+  const pipVideoOrStream = usePipVideoOrStream(channel.id);
+  const stateFromStores = useStateFromStores([ChannelRTCStore, AuthenticationStore], () => {
+    const participant = ChannelRTCStore.getParticipant(channel.id, AuthenticationStore.getId());
+    return participant != null ? participant.type === ParticipantTypes.USER ? participant.streamId != null ? participant : null : null : null;
+  });
+  const stateFromStoresObject = useStateFromStoresObject([EmbeddedActivitiesStore, ChannelRTCStore], () => {
+    const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
+    const selectedParticipant = ChannelRTCStore.getSelectedParticipant(channel.id);
+    return {
+      focusedEmbeddedActivityParticipant: currentEmbeddedActivity?.applicationId != null ? selectedParticipant?.id === getEmbeddedActivityParticipantId({
+        applicationId: currentEmbeddedActivity.applicationId,
+        instanceId: currentEmbeddedActivity.compositeInstanceId
+      }) ? selectedParticipant : null : null,
+      activityLockOrientation: currentEmbeddedActivity == null ? null : EmbeddedActivitiesStore.getPipOrientationLockStateForApp(currentEmbeddedActivity.applicationId)
+    };
+  });
+  let focusedEmbeddedActivityParticipant = stateFromStoresObject.focusedEmbeddedActivityParticipant;
+  const activityLockOrientation = stateFromStoresObject.activityLockOrientation;
+  const r31 = pipVideoOrStream != null ? pipVideoOrStream.user.id !== AuthenticationStore.getId() ? pipVideoOrStream : null : null;
+  if (focusedEmbeddedActivityParticipant == null) {
+    focusedEmbeddedActivityParticipant = r31;
+  }
+  L18: {
+    L12: {
+      if (focusedEmbeddedActivityParticipant != null) {
+        if (!isStreamParticipant(focusedEmbeddedActivityParticipant) && activityLockOrientation !== OrientationLockState.LANDSCAPE) {
+          break L12;
+        }
+        if (stateFromStores == null) {
+          if (r31 != null && r31.id !== focusedEmbeddedActivityParticipant.id) {
+            break L12;
+          }
+          LANDSCAPE = OrientationType.LANDSCAPE;
+          break L18;
+        }
+      }
+    }
+    LANDSCAPE = activityLockOrientation === OrientationLockState.LANDSCAPE ? OrientationType.LANDSCAPE : activityLockOrientation === OrientationLockState.PORTRAIT ? OrientationType.PORTRAIT : null;
+  }
+  return LANDSCAPE;
+}

modules/video_calls/native/useActionBarHeight.tsx

@@ -0,0 +1,18 @@
+// Metro module 10527 (f10528).
+import MediaEngineStore from "../../../stores/MediaEngineStore";
+import { InputModes } from "../../../Constants";
+import { ACTION_SHEET_HANDLE_SPACING } from "../../action_sheet/native/ActionSheetConstants";
+import { SMALL_ACTION_BUTTON_DIMENSIONS } from "./components/CallBarAction";
+import { useIsFiveButtonLayout } from "./useIsFiveButtonLayout";
+import useCanSpeakInChannel from "../../stage_channels/useCanSpeakInChannel";
+import { useStateFromStores } from "../../../_bundle/Module589";
+let c7069_6 = 2 * SMALL_ACTION_BUTTON_DIMENSIONS.buttonRadius + 16 + 16;
+export default function useActionBarHeight(a0) {
+  const isFiveButtonLayout = useIsFiveButtonLayout(a0);
+  const canSpeakInChannel = useCanSpeakInChannel(a0);
+  return (isFiveButtonLayout ? c7069_6 : 88) + ACTION_SHEET_HANDLE_SPACING + (useStateFromStores([MediaEngineStore], () => MediaEngineStore.getMode() === InputModes.PUSH_TO_TALK) ? canSpeakInChannel ? 56 : 0 : 0);
+};
+export const CALL_ACTION_BAR_HEIGHT = 88;
+export const FIVE_BUTTON_CONTAINER_PADDING_TOP = 16;
+export const FIVE_BUTTON_CONTAINER_PADDING_BOTTOM = 16;
+export { c7069_6 as FIVE_BUTTON_LAYOUT_ACTION_BAR_HEIGHT };

modules/video_calls/native/useBottomVoiceControlsSheetWidth.tsx

@@ -0,0 +1,10 @@
+// Metro module 10529 (f10530).
+import { BOX_MODE_ACTIONSHEET_WIDTH, BOX_MODE_THRESHOLD_WIDTH } from "./ChannelCallConstants";
+import useWindowDimensions_native from "../../screen/useWindowDimensions.native";
+export default function useBottomVoiceControlsSheetWidth() {
+  let width = useWindowDimensions_native().width;
+  if (width > BOX_MODE_THRESHOLD_WIDTH) {
+    width = BOX_MODE_ACTIONSHEET_WIDTH;
+  }
+  return width;
+};

modules/video_calls/native/useChannelFloatingCTAContent.tsx

@@ -0,0 +1,28 @@
+// Metro module 15887 (f15888).
+import { useMemo } from "react";
+import MediaEngineStore from "../../../stores/MediaEngineStore";
+import RTCConnectionStore from "../../../stores/RTCConnectionStore";
+import { useStateFromStores } from "../../../_bundle/defaultAreStatesEqual";
+import useGameConsoleAccounts from "../../game_console/useGameConsoleAccounts";
+import { DismissibleContent } from "../../../_bundle/Module1358";
+export default function useChannelFloatingCTAContent(c22563_0) {
+  let c22563_1, stateFromStores, stateFromStores2;
+  const stateFromStores3 = useStateFromStores([RTCConnectionStore], () => c22563_0 != null && RTCConnectionStore.getChannelId() === c22563_0);
+  const gameConsoleAccounts = useGameConsoleAccounts();
+  c22563_1 = gameConsoleAccounts;
+  stateFromStores = stateFromStores3;
+  stateFromStores2 = useStateFromStores([MediaEngineStore], () => MediaEngineStore.isAnyLocalVideoAutoDisabled());
+  return useMemo(() => {
+    const r1 = [];
+    if (stateFromStores2) {
+      r1.push(DismissibleContent.VOICE_PANEL_BAD_CONNECTION_CTA);
+    }
+    if (stateFromStores) {
+      r1.push(DismissibleContent.SOUNDBOARD_MOBILE_FLOATING_CTA);
+    }
+    if (c22563_1.some((item) => item.twoWayLink)) {
+      r1.push(DismissibleContent.DONUT_MOBILE_NUX);
+    }
+    return r1;
+  }, [stateFromStores2, gameConsoleAccounts, stateFromStores]);
+};

modules/video_calls/native/useDraggablePip.tsx

@@ -0,0 +1,348 @@
+// Metro module 10526 (f10527).
+import { useChannelCallStore } from "./ChannelCallStore";
+import { PIP_FOCUS_SCALE, PIP_GESTURE_ACTIVE_OFFSET } from "./components/Constants";
+import * as _ReanimatedRexport from "../../reanimated/ReanimatedRexport";
+import { useDerivedValue, useSharedValue, useAnimatedReaction, useAnimatedStyle } from "../../reanimated/ReanimatedRexport";
+import * as _timing from "../../../design/animation/reanimated/timing/timing";
+import * as _native from "../../../design/void/native";
+import * as _cheapWorkletShallowEqual from "../../reanimated/native/cheapWorkletShallowEqual";
+import { Gesture } from "../../../_bundle/Module5273";
+import * as _spring from "../../../design/animation/reanimated/spring/spring";
+let clamp;
+const spring = {
+  mass: 1,
+  stiffness: 250,
+  overshootClamping: true,
+  restSpeedThreshold: 0.001,
+  restDisplacementThreshold: 0.001,
+  damping: 20
+};
+const __initData = {
+  code: "function useDraggablePipTsx1(){const{withTiming,pipFocus,PIP_FOCUS_SCALE,STANDARD_EASING}=this.__closure;return withTiming(pipFocus?PIP_FOCUS_SCALE:1,{easing:STANDARD_EASING,duration:250});}"
+};
+const __initData2 = {
+  code: "function useDraggablePipTsx2(){const{width}=this.__closure;return width;}"
+};
+const __initData3 = {
+  code: "function useDraggablePipTsx3(){const{height}=this.__closure;return height;}"
+};
+const __initData4 = {
+  code: "function useDraggablePipTsx4(){const{pipScale,width}=this.__closure;return pipScale.get()*width;}"
+};
+const __initData5 = {
+  code: "function useDraggablePipTsx5(){const{pipScale,height}=this.__closure;return pipScale.get()*height;}"
+};
+const __initData6 = {
+  code: "function useDraggablePipTsx6(){const{containerWidth}=this.__closure;return containerWidth;}"
+};
+const __initData7 = {
+  code: "function useDraggablePipTsx7(){const{containerHeight}=this.__closure;return containerHeight;}"
+};
+const __initData8 = {
+  code: "function useDraggablePipTsx8(){const{containerWidth,scaledWidthDv,xPosition}=this.__closure;return[containerWidth-scaledWidthDv.get(),xPosition.get()];}"
+};
+const __initData9 = {
+  code: "function useDraggablePipTsx9(result,previous){const{cheapWorkletArrayShallowEqual,clamp,xPosition,xDestination}=this.__closure;if(cheapWorkletArrayShallowEqual(result,previous!==null&&previous!==void 0?previous:undefined))return;const[containerWidthNew,xPositionNew]=result;const[containerWidthOld]=previous!==null&&previous!==void 0?previous:[0,0];if(previous!=null&&containerWidthNew!==containerWidthOld){const newX=clamp(xPositionNew*(containerWidthNew/containerWidthOld),0,containerWidthNew);xPosition.set(newX);xDestination.set(newX);}}"
+};
+const __initData10 = {
+  code: "function useDraggablePipTsx10(){const{containerHeight,scaledHeightDv,yPosition}=this.__closure;return[containerHeight-scaledHeightDv.get(),yPosition.get()];}"
+};
+const __initData11 = {
+  code: "function useDraggablePipTsx11(result,previous){const{cheapWorkletArrayShallowEqual,clamp,yPosition,yDestination}=this.__closure;if(cheapWorkletArrayShallowEqual(result,previous!==null&&previous!==void 0?previous:undefined))return;const[containerHeightNew,yPositionNew]=result;const[containerHeightOld]=previous!==null&&previous!==void 0?previous:[0,0];if(previous!=null&&containerHeightNew!==containerHeightOld){const newY=clamp(yPositionNew*(containerHeightNew/containerHeightOld),0,containerHeightNew);yPosition.set(newY);yDestination.set(newY);}}"
+};
+const __initData12 = {
+  code: "function useDraggablePipTsx12(event){const{xPosition,containerWidthDv,scaledWidthDv,clamp,yPosition,containerHeightDv,scaledHeightDv,snapToCorners,withSpring,spring,xDestination,yDestination}=this.__closure;const toss=0.0875;const xToss=xPosition.get()+toss*event.velocityX;const xMin=0;const xMax=containerWidthDv.get()-scaledWidthDv.get();const targetX=clamp(xToss,xMin,xMax);const yToss=yPosition.get()+toss*event.velocityY;const yMin=0;const yMax=containerHeightDv.get()-scaledHeightDv.get();const targetY=clamp(yToss,yMin,yMax);const top=targetY;const bottom=containerHeightDv.get()-scaledHeightDv.get()-targetY;const left=targetX;const right=containerWidthDv.get()-scaledWidthDv.get()-targetX;const minDistance=Math.min(top,bottom,left,right);let snapX=targetX;let snapY=targetY;switch(minDistance){case top:snapY=yMin;if(snapToCorners){snapX=left<right?xMin:xMax;}break;case bottom:snapY=yMax;if(snapToCorners){snapX=left<right?xMin:xMax;}break;case left:snapX=xMin;if(snapToCorners){snapY=top<bottom?yMin:yMax;}break;case right:snapX=xMax;if(snapToCorners){snapY=top<bottom?yMin:yMax;}break;}xPosition.set(withSpring(snapX,{...spring,velocity:event.velocityX}));xDestination.set(snapX);yPosition.set(withSpring(snapY,{...spring,velocity:event.velocityY}));yDestination.set(snapY);}"
+};
+const __initData13 = {
+  code: "function useDraggablePipTsx13(event){const{xPosition,xDestination,yPosition,yDestination,trackedVoiceControlsToggleMovedForGestureSv,onMoved,runOnJS}=this.__closure;xPosition.set(xDestination.get()+event.translationX);yPosition.set(yDestination.get()+event.translationY);if(!trackedVoiceControlsToggleMovedForGestureSv.get()){if(onMoved!=null){runOnJS(onMoved)();}trackedVoiceControlsToggleMovedForGestureSv.set(true);}}"
+};
+const __initData14 = {
+  code: "function useDraggablePipTsx14(){const{onPress,runOnJS}=this.__closure;if(onPress!=null){runOnJS(onPress)();}}"
+};
+const __initData15 = {
+  code: "function useDraggablePipTsx15(){const{xPosition,scaledWidthDv,widthDv,yPosition,scaledHeightDv,heightDv,pipScale}=this.__closure;return{transform:[{translateX:xPosition.get()+(scaledWidthDv.get()-widthDv.get())/2},{translateY:yPosition.get()+(scaledHeightDv.get()-heightDv.get())/2},{scale:pipScale.get()}]};}"
+};
+const clamp2 = function clamp(a0, a1, a2) {
+  return Math.min(Math.max(a0, a1), a2);
+};
+clamp2.__closure = {};
+clamp2.__workletHash = 1988116204206;
+clamp2.__initData = {
+  code: "function clamp_useDraggablePipTsx16(value,min,max){return Math.min(Math.max(value,min),max);}"
+};
+clamp = clamp2;
+export function useDraggablePip({ width, height, containerWidth, containerHeight, onPress, onMoved, snapToCorners }) {
+  let derivedValue, derivedValue2, derivedValue3, derivedValue4, derivedValue5, derivedValue6, derivedValue7, sharedValue, sharedValue2, sharedValue3, sharedValue4, sharedValue5;
+  derivedValue = void 0;
+  derivedValue2 = void 0;
+  derivedValue3 = void 0;
+  derivedValue4 = void 0;
+  derivedValue5 = void 0;
+  derivedValue6 = void 0;
+  derivedValue7 = void 0;
+  sharedValue = void 0;
+  sharedValue2 = void 0;
+  sharedValue3 = void 0;
+  sharedValue4 = void 0;
+  sharedValue5 = void 0;
+  const channelCallStore = useChannelCallStore((a0) => a0.pipFocus);
+  const X = function X() {
+    return _timing.withTiming(channelCallStore ? PIP_FOCUS_SCALE : 1, {
+      easing: _native.STANDARD_EASING,
+      duration: 250
+    });
+  };
+  X.__closure = {
+    withTiming: _timing.withTiming,
+    pipFocus: channelCallStore,
+    PIP_FOCUS_SCALE,
+    STANDARD_EASING: _native.STANDARD_EASING
+  };
+  X.__workletHash = 7848271415351;
+  X.__initData = __initData;
+  derivedValue = useDerivedValue(X);
+  const Y = () => width;
+  Y.__closure = {
+    width
+  };
+  Y.__workletHash = 14810909441301;
+  Y.__initData = __initData2;
+  derivedValue2 = useDerivedValue(Y);
+  const N = () => height;
+  N.__closure = {
+    height
+  };
+  N.__workletHash = 15343935194036;
+  N.__initData = __initData3;
+  derivedValue3 = useDerivedValue(N);
+  const V = () => derivedValue.get() * width;
+  V.__closure = {
+    pipScale: derivedValue,
+    width
+  };
+  V.__workletHash = 3468337829868;
+  V.__initData = __initData4;
+  derivedValue4 = useDerivedValue(V);
+  const F = () => derivedValue.get() * height;
+  F.__closure = {
+    pipScale: derivedValue,
+    height
+  };
+  F.__workletHash = 7163944260205;
+  F.__initData = __initData5;
+  derivedValue5 = useDerivedValue(F);
+  const G = () => containerWidth;
+  G.__closure = {
+    containerWidth
+  };
+  G.__workletHash = 13449836478609;
+  G.__initData = __initData6;
+  derivedValue6 = useDerivedValue(G);
+  const I = () => containerHeight;
+  I.__closure = {
+    containerHeight
+  };
+  I.__workletHash = 4105281399152;
+  I.__initData = __initData7;
+  derivedValue7 = useDerivedValue(I);
+  sharedValue = useSharedValue(0);
+  sharedValue2 = useSharedValue(sharedValue.get());
+  sharedValue3 = useSharedValue(0);
+  sharedValue4 = useSharedValue(sharedValue3.get());
+  sharedValue5 = useSharedValue(false);
+  const J = function J() {
+    return [containerWidth - derivedValue4.get(), sharedValue2.get()];
+  };
+  J.__closure = {
+    containerWidth,
+    scaledWidthDv: derivedValue4,
+    xPosition: sharedValue2
+  };
+  J.__workletHash = 2741340788440;
+  J.__initData = __initData8;
+  const q = function q(a0, a1) {
+    if (!_cheapWorkletShallowEqual.cheapWorkletArrayShallowEqual(a0, a1 == null ? void 0 : a1)) {
+      const [r18, r19] = a0;
+      const [r23] = a1 == null ? [0, 0] : a1;
+      if (a1 != null && r18 !== r23) {
+        const r35 = Math.min(Math.max(r19 * (r18 / r23), 0), r18);
+        sharedValue2.set(r35);
+        sharedValue.set(r35);
+      }
+    }
+  };
+  q.__closure = {
+    cheapWorkletArrayShallowEqual: _cheapWorkletShallowEqual.cheapWorkletArrayShallowEqual,
+    clamp,
+    xPosition: sharedValue2,
+    xDestination: sharedValue
+  };
+  q.__workletHash = 15748808822770;
+  q.__initData = __initData9;
+  useAnimatedReaction(J, q);
+  const U = function U() {
+    return [containerHeight - derivedValue5.get(), sharedValue4.get()];
+  };
+  U.__closure = {
+    containerHeight,
+    scaledHeightDv: derivedValue5,
+    yPosition: sharedValue4
+  };
+  U.__workletHash = 11475249153313;
+  U.__initData = __initData10;
+  const R = function R(a0, a1) {
+    if (!_cheapWorkletShallowEqual.cheapWorkletArrayShallowEqual(a0, a1 == null ? void 0 : a1)) {
+      const [r18, r19] = a0;
+      const [r23] = a1 == null ? [0, 0] : a1;
+      if (a1 != null && r18 !== r23) {
+        const r35 = Math.min(Math.max(r19 * (r18 / r23), 0), r18);
+        sharedValue4.set(r35);
+        sharedValue3.set(r35);
+      }
+    }
+  };
+  R.__closure = {
+    cheapWorkletArrayShallowEqual: _cheapWorkletShallowEqual.cheapWorkletArrayShallowEqual,
+    clamp,
+    yPosition: sharedValue4,
+    yDestination: sharedValue3
+  };
+  R.__workletHash = 7685377389843;
+  R.__initData = __initData11;
+  useAnimatedReaction(U, R);
+  const r149 = Gesture.Pan().activeOffsetX([-PIP_GESTURE_ACTIVE_OFFSET, PIP_GESTURE_ACTIVE_OFFSET]).activeOffsetY([-PIP_GESTURE_ACTIVE_OFFSET, PIP_GESTURE_ACTIVE_OFFSET]);
+  const ae = function ae(a0) {
+    sharedValue2.set(sharedValue.get() + a0.translationX);
+    sharedValue4.set(sharedValue3.get() + a0.translationY);
+    if (!sharedValue5.get()) {
+      if (onMoved != null) {
+        _ReanimatedRexport.runOnJS(onMoved)();
+      }
+      sharedValue5.set(true);
+    }
+  };
+  ae.__closure = {
+    xPosition: sharedValue2,
+    xDestination: sharedValue,
+    yPosition: sharedValue4,
+    yDestination: sharedValue3,
+    trackedVoiceControlsToggleMovedForGestureSv: sharedValue5,
+    onMoved,
+    runOnJS: _ReanimatedRexport.runOnJS
+  };
+  ae.__workletHash = 14964390506971;
+  ae.__initData = __initData13;
+  const r158 = r149.onUpdate(ae);
+  const se = function se(a0) {
+    let r70, r71;
+    const r15 = sharedValue2.get() + 0.0875 * a0.velocityX;
+    const r6 = derivedValue6.get() - derivedValue4.get();
+    const r36 = Math.min(Math.max(r15, 0), r6);
+    const r20 = sharedValue4.get() + 0.0875 * a0.velocityY;
+    const r47 = derivedValue7.get() - derivedValue5.get();
+    const r53 = Math.min(Math.max(r20, 0), r47);
+    const r59 = derivedValue7.get() - derivedValue5.get() - r53;
+    const r65 = derivedValue6.get() - derivedValue4.get() - r36;
+    const r69 = Math.min(r53, r59, r36, r65);
+    if (r53 === r69) {
+      r70 = 0;
+      r71 = r36;
+      if (snapToCorners) {
+        r71 = r36 < r65 ? 0 : r6;
+        r70 = 0;
+      }
+    } else if (r59 === r69) {
+      r70 = r47;
+      r71 = r36;
+      if (snapToCorners) {
+        r71 = r36 < r65 ? 0 : r6;
+        r70 = r47;
+      }
+    } else if (r36 === r69) {
+      r70 = r53;
+      r71 = 0;
+      if (snapToCorners) {
+        r70 = r53 < r59 ? 0 : r47;
+        r71 = 0;
+      }
+    } else {
+      r70 = r53;
+      r71 = r36;
+      if (r65 === r69) {
+        r70 = r53;
+        r71 = r6;
+        if (snapToCorners) {
+          r70 = r53 < r59 ? 0 : r47;
+          r71 = r6;
+        }
+      }
+    }
+    sharedValue2.set(_spring.withSpring(r71, {
+      ...spring,
+      velocity: a0.velocityX
+    }));
+    sharedValue.set(r71);
+    sharedValue4.set(_spring.withSpring(r70, {
+      ...spring,
+      velocity: a0.velocityY
+    }));
+    sharedValue3.set(r70);
+  };
+  se.__closure = {
+    xPosition: sharedValue2,
+    containerWidthDv: derivedValue6,
+    scaledWidthDv: derivedValue4,
+    clamp,
+    yPosition: sharedValue4,
+    containerHeightDv: derivedValue7,
+    scaledHeightDv: derivedValue5,
+    snapToCorners,
+    withSpring: _spring.withSpring,
+    spring,
+    xDestination: sharedValue,
+    yDestination: sharedValue3
+  };
+  se.__workletHash = 690760681755;
+  se.__initData = __initData12;
+  const r168 = r158.onEnd(se);
+  const r173 = Gesture.Tap();
+  const re = function re() {
+    if (onPress != null) {
+      _ReanimatedRexport.runOnJS(onPress)();
+    }
+  };
+  re.__closure = {
+    onPress,
+    runOnJS: _ReanimatedRexport.runOnJS
+  };
+  re.__workletHash = 4692146362189;
+  re.__initData = __initData14;
+  const r188 = {
+    gesture: Gesture.Race(r168, r173.onStart(re)),
+    draggableGridItemStyles: null
+  };
+  const ce = function ce() {
+    return {
+      transform: [{
+        translateX: sharedValue2.get() + (derivedValue4.get() - derivedValue2.get()) / 2
+      }, {
+        translateY: sharedValue4.get() + (derivedValue5.get() - derivedValue3.get()) / 2
+      }, {
+        scale: derivedValue.get()
+      }]
+    };
+  };
+  ce.__closure = {
+    xPosition: sharedValue2,
+    scaledWidthDv: derivedValue4,
+    widthDv: derivedValue2,
+    yPosition: sharedValue4,
+    scaledHeightDv: derivedValue5,
+    heightDv: derivedValue3,
+    pipScale: derivedValue
+  };
+  ce.__workletHash = 12534173786665;
+  ce.__initData = __initData15;
+  r188.draggableGridItemStyles = useAnimatedStyle(ce);
+  return r188;
+}

modules/video_calls/native/useIsFiveButtonLayout.tsx

@@ -0,0 +1,46 @@
+// Metro module 10531 (f10532).
+import ChannelStore from "../../../stores/ChannelStore";
+import GuildStore from "../../../stores/GuildStore";
+import { useStateFromStores } from "../../../_bundle/Module589";
+import { useIsConnectedToVoiceChannel } from "../../voice_chat/VoiceChatHooks";
+import useIsActivitiesAvailableInShelf from "../../activities/useIsActivitiesAvailableInShelf";
+import useIsPrivateChannelWithEnabledActivities from "../../activities/utils/useIsPrivateChannelWithEnabledActivities";
+import useIsRemote from "../../game_console/hooks/useIsRemote";
+export function useIsFiveButtonLayout(a0) {
+  let c18112_1;
+  const stateFromStores = useStateFromStores([ChannelStore], () => ChannelStore.getChannel(a0));
+  let r20 = useIsConnectedToVoiceChannel(stateFromStores);
+  let r14 = stateFromStores?.guild_id;
+  if (r14 == null) {
+    r14 = null;
+  }
+  c18112_1 = r14;
+  let r24 = stateFromStores?.guild_id;
+  if (r24 == null) {
+    r24 = null;
+  }
+  const isActivitiesAvailableInShelf = useIsActivitiesAvailableInShelf(r24, stateFromStores?.id);
+  const afkChannelId = useStateFromStores([GuildStore], () => GuildStore.getGuild(c18112_1), [r14])?.afkChannelId;
+  let r39 = stateFromStores == null ? void 0 : stateFromStores.isGuildVoice();
+  if (r39 == null) {
+    r39 = false;
+  }
+  const isPrivateChannelWithEnabledActivities = useIsPrivateChannelWithEnabledActivities(stateFromStores?.id);
+  const isRemote = useIsRemote();
+  if (r20) {
+    r20 = isActivitiesAvailableInShelf;
+  }
+  if (r20) {
+    if (!r39) {
+      r39 = isPrivateChannelWithEnabledActivities;
+    }
+    r20 = r39;
+  }
+  if (r20) {
+    r20 = !isRemote;
+  }
+  if (r20) {
+    r20 = !(afkChannelId === a0);
+  }
+  return r20;
+}

modules/video_calls/native/useIsPrivateAudioOnlyCall.tsx

@@ -0,0 +1,19 @@
+// Metro module 10237 (f10238).
+import EmbeddedActivitiesStore from "../../activities/EmbeddedActivitiesStore";
+import ChannelRTCStore from "../../calls/ChannelRTCStore";
+import ApplicationStreamingStore from "../../../stores/ApplicationStreamingStore";
+import MediaEngineStore from "../../../stores/MediaEngineStore";
+import VoiceStateStore from "../../../stores/VoiceStateStore";
+import { isActivityParticipant } from "../../calls/CallConstants";
+import { useStateFromStores } from "../../../_bundle/Module589";
+const areParticipantStatesEqual = function areParticipantStatesEqual(a0, a1) {
+  const [, r3] = a0;
+  const [, r26] = a1;
+  return r3 === r26;
+};
+export default function useIsPrivateAudioOnlyCall(a0) {
+  let isActivityParticipant2;
+  const [r21] = useStateFromStores([ChannelRTCStore], () => [ChannelRTCStore.getSelectedParticipant(a0.id), ChannelRTCStore.getParticipantsVersion(a0.id)], [a0], areParticipantStatesEqual);
+  isActivityParticipant2 = EmbeddedActivitiesStore.getEmbeddedActivitiesForChannel(a0.id).length > 0 || isActivityParticipant(r21);
+  return useStateFromStores([VoiceStateStore, MediaEngineStore, ApplicationStreamingStore], () => a0.isPrivate() && !VoiceStateStore.hasVideo(a0.id) && !isActivityParticipant2 && ApplicationStreamingStore.getAllApplicationStreamsForChannel(a0.id).length === 0 && ApplicationStreamingStore.getAllActiveStreamsForChannel(a0.id).length === 0 && !MediaEngineStore.isVideoEnabled(), [a0, isActivityParticipant2]);
+};

modules/video_calls/native/useIsVideoMode.tsx

@@ -0,0 +1,17 @@
+// Metro module 9055 (f9056).
+import ApplicationStreamingStore from "../../../stores/ApplicationStreamingStore";
+import ChannelStore from "../../../stores/ChannelStore";
+import MediaEngineStore from "../../../stores/MediaEngineStore";
+import SelectedChannelStore from "../../../stores/SelectedChannelStore";
+import VoiceStateStore from "../../../stores/VoiceStateStore";
+import { useStateFromStores } from "../../../_bundle/Module589";
+export default function useIsVideoMode() {
+  return useStateFromStores([ChannelStore, SelectedChannelStore, MediaEngineStore, VoiceStateStore, ApplicationStreamingStore], () => {
+    const channel = ChannelStore.getChannel(SelectedChannelStore.getVoiceChannelId());
+    return channel != null && (ApplicationStreamingStore.getAllActiveStreams().length > 0 || VoiceStateStore.hasVideo(channel.id) || MediaEngineStore.isVideoEnabled());
+  });
+};
+export function isVideoMode(r4 = ChannelStore, r8 = SelectedChannelStore, r6 = ApplicationStreamingStore, r7 = VoiceStateStore, r5 = MediaEngineStore) {
+  const channel = r4.getChannel(r8.getVoiceChannelId());
+  return channel != null && (r6.getAllActiveStreams().length > 0 || r7.hasVideo(channel.id) || r5.isVideoEnabled());
+}

modules/video_calls/native/useOnConnectToConsole.tsx

@@ -0,0 +1,43 @@
+// Metro module 8930 (f8931).
+import { useCallback } from "react";
+import { AnalyticsLocations, PlatformTypes } from "../../../Constants";
+import { UNSAFE_markDismissibleContentAsDismissed } from "../../dismissible_content/DismissibleContentUnsafeUtils";
+import { DismissibleContent } from "../../../_bundle/Module1358";
+import XboxLinkModalActionCreators from "../../user_settings/connections/native/two_way_link/xbox/XboxLinkModalActionCreators";
+import PlayStationLinkModalActionCreators from "../../user_settings/connections/native/two_way_link/playstation/PlayStationLinkModalActionCreators";
+import { beginConsoleTransfer } from "../../game_console/native/beginConsoleTransfer";
+export function onConnectToConsole(a0, a1) {
+  UNSAFE_markDismissibleContentAsDismissed(DismissibleContent.DONUT_MOBILE_NUX);
+  if (a1.twoWayLink && !a1.revoked) {
+    beginConsoleTransfer(a0, a1.type);
+    return void 0;
+  }
+  const type = a1.type;
+  if (PlatformTypes.XBOX === type) {
+    return XboxLinkModalActionCreators.showModal([AnalyticsLocations.CHANNEL_CALL]);
+  }
+  if (PlatformTypes.PLAYSTATION !== type && PlatformTypes.PLAYSTATION_STAGING !== type) {
+    return void 0;
+  }
+  return PlayStationLinkModalActionCreators.showModal([AnalyticsLocations.CHANNEL_CALL], a1.type);
+}
+export function useOnConnectToConsole(a0, a1) {
+  return useCallback(() => {
+    L8: {
+      UNSAFE_markDismissibleContentAsDismissed(DismissibleContent.DONUT_MOBILE_NUX);
+      if (a1.twoWayLink && !a1.revoked) {
+        beginConsoleTransfer(a0, a1.type);
+      } else {
+        const type = a1.type;
+        if (PlatformTypes.XBOX === type) {
+          XboxLinkModalActionCreators.showModal([AnalyticsLocations.CHANNEL_CALL]);
+        } else {
+          if (PlatformTypes.PLAYSTATION !== type && PlatformTypes.PLAYSTATION_STAGING !== type) {
+            break L8;
+          }
+          PlayStationLinkModalActionCreators.showModal([AnalyticsLocations.CHANNEL_CALL], a1.type);
+        }
+      }
+    }
+  }, [a0, a1]);
+}

modules/video_calls/native/useParticipantTileTapGesture.tsx

@@ -0,0 +1,6 @@
+// Metro module 10542 (f10543).
+import { Gesture } from "../../../_bundle/Module5273";
+export default function useParticipantTileTapGesture({ onSingleTapStart, onDoubleTapStart }) {
+  const r14 = Gesture.Tap().onStart(onSingleTapStart);
+  return Gesture.Exclusive(Gesture.Tap().onStart(onDoubleTapStart).numberOfTaps(2), r14);
+};

modules/video_calls/native/usePipVideoOrStream.tsx

@@ -0,0 +1,109 @@
+// Metro module 10522 (f10523).
+import EmbeddedActivitiesStore from "../../activities/EmbeddedActivitiesStore";
+import ChannelRTCStore from "../../calls/ChannelRTCStore";
+import VideoSpeakerStore from "../../calls/VideoSpeakerStore";
+import ApplicationStreamingStore from "../../../stores/ApplicationStreamingStore";
+import "../../../stores/AuthenticationStore";
+import ChannelStore from "../../../stores/ChannelStore";
+import MediaEngineStore from "../../../stores/MediaEngineStore";
+import RTCConnectionStore from "../../../stores/RTCConnectionStore";
+import "../../calls/CallConstants";
+import { useStateFromStores } from "../../../_bundle/Module589";
+function $mk85016($env) {
+  return () => {
+    const r6 = $env.$parent;
+    const r10 = $env[0];
+    const r7 = r10 != null ? r6[4].getVideoParticipants(r10) : [];
+    const r8 = r10 != null ? r6[4].getSelectedParticipant(r10) : null;
+    const r19 = r7.find($mk107255(r6));
+    const r13 = r6[5];
+    const r12 = r6[4];
+    const r23 = (r10 != null ? r12.getVideoParticipants(r10) : []).find($mk115704(r6));
+    let r25 = r10 != null ? r12.getParticipant(r10, r13.getSpeaker(r10)) : null;
+    if (r25 == null) {
+      r25 = r23;
+    }
+    const r30 = (0, r6[12])(r25);
+    const r31 = r25;
+    let r32 = r30 ? r31.localVideoDisabled ? null : r31 : r31;
+    const r35 = r10 != null ? r6[6].getAllActiveStreamsForChannel(r10) : [];
+    let env26706 = {
+      $parent: r6
+    };
+    env26706[0] = r32;
+    const r40 = (0, r6[11])(r32);
+    let r41 = r32;
+    if (r40) {
+      if (!(r35.filter((item) => {
+        const r2 = env26706.$parent;
+        return (0, r2[0])(r2[2][10]).encodeStreamKey({
+          streamType: item.streamType,
+          guildId: item.guildId,
+          channelId: item.channelId,
+          ownerId: item.ownerId
+        }) === env26706[0]?.id;
+      }).length > 0)) {
+        env26706[0] = void 0;
+        r32 = void 0;
+      }
+      r41 = r32;
+    }
+    let r46 = r41;
+    if (r46 == null) {
+      r46 = r19;
+    }
+    let r47 = r8 != null && r8.id === r41?.id && r46 != null && r46.id === r41?.id;
+    if (r47) {
+      const r53 = r6[0];
+      const r54 = r6[2];
+      r47 = r53(r54[11]).isModalOpen((0, r6[1])(r54[12]));
+    }
+    if (r47) {
+      r46 = r19;
+    }
+    return r46 != null ? r46.type !== r6[13].ACTIVITY ? r46.streamId != null ? r46 : null : null : null;
+  };
+}
+function $mk107255($env) {
+  return (a0) => a0.type === $env[13].USER && !a0.localVideoDisabled;
+}
+function $mk115704($env) {
+  return (a0) => {
+    const r2 = $env;
+    let r7 = a0.id !== r2[7].getId();
+    if (r7) {
+      const r9 = (0, r2[12])(a0);
+      r7 = r9 ? a0.localVideoDisabled : !r9;
+    }
+    return r7;
+  };
+}
+let env7064 = {};
+export default function usePipVideoOrStream(a0) {
+  let env18105;
+  const r1 = env18105 = {
+    $parent: env7064
+  };
+  env18105[0] = a0;
+  return useStateFromStores([ChannelRTCStore, VideoSpeakerStore, ApplicationStreamingStore], $mk85016(r1), [a0]);
+};
+export function useHasPipParticipant({ isActivityViewFocused }) {
+  let stateFromStores2;
+  stateFromStores2 = void 0;
+  const stateFromStores = useStateFromStores([RTCConnectionStore], () => RTCConnectionStore.getChannelId());
+  const r13 = stateFromStores == null ? void 0 : stateFromStores;
+  let env18107;
+  const r18 = env18107 = {
+    $parent: env7064
+  };
+  env18107[0] = r13;
+  stateFromStores2 = useStateFromStores([ChannelRTCStore, VideoSpeakerStore, ApplicationStreamingStore], $mk85016(r18), [r13]);
+  return useStateFromStores([ChannelStore, EmbeddedActivitiesStore, MediaEngineStore], () => {
+    if (ChannelStore.getChannel(stateFromStores) == null) {
+      return false;
+    }
+    const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
+    const r15 = stateFromStores2 != null && MediaEngineStore.isLocalVideoDisabled(stateFromStores2.id);
+    return currentEmbeddedActivity != null && !isActivityViewFocused || stateFromStores2 != null && stateFromStores2.streamId != null && !r15;
+  }, [stateFromStores, stateFromStores2, isActivityViewFocused]);
+}

modules/video_calls/native/useScreenshareUtils.tsx

@@ -0,0 +1,127 @@
+// Metro module 10745 (f10746).
+import { useMemo } from "react";
+import { NativeModules } from "react-native";
+import ApplicationStreamingStore from "../../../stores/ApplicationStreamingStore";
+import { ApplicationStreamStates } from "../../../Constants";
+import { getSystemVersionMajor } from "../../../utils/native/DeviceUtils";
+import ForegroundServiceManager_android from "../../foreground_service/mobile/ForegroundServiceManager.android";
+import { getVoiceEngine } from "../../../_bundle/Module4238";
+import { showScreenshareDisabledAlert } from "../../voice_calls/native/CallsUtils";
+import { stopStream } from "../../../actions/StreamActionCreators";
+import { encodeStreamKey } from "../../go_live/utils/StreamKeyUtils";
+import AudioActionCreators from "../../../actions/AudioActionCreators";
+import useHasVideoPermission, { getVideoPermission } from "../useHasVideoPermission";
+import { isMetaQuest } from "../../device/MetaQuestUtils.android";
+import Module10757 from "../../../_bundle/Module10757";
+import Module10758 from "../../../_bundle/Module10758";
+import MobileGoLiveUpsellExperiment from "../../go_live/native/MobileGoLiveUpsellExperiment";
+import { useStateFromStores } from "../../../_bundle/Module589";
+import useAnalyticsLocations from "../../app_analytics/useAnalyticsLocations";
+import { intl, t } from "../../../intl/index.native";
+function $mk85467($env) {
+  return () => {
+    const r1 = $env.$parent;
+    return (0, r1[0])(r1[2][12]).showMobileGoLiveActionSheet($env[1]);
+  };
+}
+function $mk85468($env) {
+  return () => {
+    const r1 = $env.$parent;
+    const r2 = r1[0];
+    const r7 = r1[2];
+    r2(r7[11]).reportAVError({
+      type: r2(r7[11]).AVError.SCREENSHARE_OS_NOT_SUPPORTED,
+      channelId: $env[0].id
+    });
+    r2(r7[7]).showMinOSScreenshareRequirementAlert();
+  };
+}
+let startStream, c7222_6, BroadcastUploadManager;
+let $mk107474 = function() {
+  return (a0) => {
+    if (a0) {
+      getVoiceEngine().startBroadcast();
+    } else {
+      showScreenshareDisabledAlert();
+    }
+  };
+};
+let env7222 = {};
+export function stopScreenshare() {
+  getVoiceEngine().stopBroadcast();
+  const currentUserActiveStream = ApplicationStreamingStore.getCurrentUserActiveStream();
+  if (currentUserActiveStream != null) {
+    stopStream(encodeStreamKey(currentUserActiveStream));
+  }
+  AudioActionCreators.setGoLiveSource(null);
+}
+startStream = function startStream() {
+  if (getVoiceEngine().platform === "android") {
+    ForegroundServiceManager_android.isForegroundServiceRunning($mk107474());
+  } else {
+    BroadcastUploadManager.showPicker();
+  }
+};
+c7222_6 = getSystemVersionMajor();
+BroadcastUploadManager = NativeModules.BroadcastUploadManager;
+export default function useScreenshareUtils(a0) {
+  let analyticsLocations;
+  const hasVideoPermission = useHasVideoPermission(a0);
+  let c18246_1 = hasVideoPermission;
+  const isFeatureEnabled = c7222_6 >= 12;
+  const showMobileGoLiveUpsell = MobileGoLiveUpsellExperiment.useConfig({
+    location: "useScreenshareUtils"
+  }).showMobileGoLiveUpsell;
+  const stateFromStores = useStateFromStores([ApplicationStreamingStore], () => ApplicationStreamingStore.getCurrentUserActiveStream());
+  analyticsLocations = useAnalyticsLocations().analyticsLocations;
+  return useMemo(() => {
+    const isActive = stateFromStores != null && stateFromStores.state === ApplicationStreamStates.ACTIVE;
+    const isFeatureEnabled2 = c18246_1 && isFeatureEnabled;
+    const text = !showMobileGoLiveUpsell && isActive ? intl.string(t.CpkXwZ) : intl.string(t.fjBNo1);
+    let env26809;
+    const r43 = env7222;
+    const r46 = env26809 = {
+      $parent: r43
+    };
+    env26809[0] = a0;
+    const r48 = showMobileGoLiveUpsell === void 0 ? false : showMobileGoLiveUpsell;
+    env26809[1] = analyticsLocations;
+    return {
+      isFeatureEnabled: isFeatureEnabled2,
+      isActive,
+      text,
+      onPress: isFeatureEnabled ? c18246_1 ? r48 ? $mk85467(r46) : isActive ? stopScreenshare : startStream : showScreenshareDisabledAlert : $mk85468(r46),
+      imgSource: isMetaQuest() ? isActive ? Module10757 : Module10758 : importDefault(showMobileGoLiveUpsell ? dependencyMap[17] : isActive ? dependencyMap[18] : dependencyMap[17])
+    };
+  }, [stateFromStores, a0, hasVideoPermission, isFeatureEnabled, showMobileGoLiveUpsell, analyticsLocations]);
+};
+export function handleCloseScreenshare() {
+  const currentUserActiveStream = ApplicationStreamingStore.getCurrentUserActiveStream();
+  if (currentUserActiveStream != null) {
+    stopStream(encodeStreamKey(currentUserActiveStream));
+  }
+  AudioActionCreators.setGoLiveSource(null);
+}
+export { startStream };
+export function getOSRequirement() {
+  return c7222_6 >= 12;
+}
+export function getStreamPressHandler(a0) {
+  let env18245;
+  const r3 = env18245 = {
+    $parent: env7222
+  };
+  env18245[0] = a0.channel;
+  const { hasPermission, isActive, osRequirement, showMobileGoLiveUpsell: showMobileGoLiveUpsell2 = false } = a0;
+  env18245[1] = a0.analyticsLocations;
+  return osRequirement ? hasPermission ? showMobileGoLiveUpsell2 ? $mk85467(r3) : isActive ? stopScreenshare : startStream : showScreenshareDisabledAlert : $mk85468(r3);
+}
+export function tryStartScreenShare(a0) {
+  if (c7222_6 >= 12 && getVideoPermission(a0)) {
+    if (getVoiceEngine().platform === "android") {
+      ForegroundServiceManager_android.isForegroundServiceRunning($mk107474());
+    } else {
+      BroadcastUploadManager.showPicker();
+    }
+  }
+}

modules/video_calls/native/useSelectedActiveStream.tsx

@@ -0,0 +1,10 @@
+// Metro module 12850 (f12851).
+import ChannelRTCStore from "../../calls/ChannelRTCStore";
+import ApplicationStreamingStore from "../../../stores/ApplicationStreamingStore";
+import { useStateFromStores } from "../../../_bundle/Module589";
+export default function useSelectedActiveStream(c20252_0) {
+  return useStateFromStores([ChannelRTCStore, ApplicationStreamingStore], () => {
+    const selectedParticipantId = ChannelRTCStore.getSelectedParticipantId(c20252_0.id);
+    return selectedParticipantId != null ? ApplicationStreamingStore.getActiveStreamForStreamKey(selectedParticipantId) : null;
+  });
+};

modules/video_calls/native/useTrackActivityVideoPip.tsx

@@ -0,0 +1,29 @@
+// Metro module 10673 (f10674).
+import { useEffect } from "react";
+import ChannelCallLifecycleStore from "./ChannelCallLifecycleStore";
+import { AnalyticEvents } from "../../../Constants";
+import { useStateFromStores } from "../../../_bundle/defaultAreStatesEqual";
+import usePrevious from "../../../hooks/usePrevious";
+import useCurrentEmbeddedActivity from "../../activities/utils/useCurrentEmbeddedActivity";
+import AnalyticsUtils from "../../../utils/AnalyticsUtils";
+export default function useTrackActivityPip(a0) {
+  let c18178_2, c18178_3;
+  const stateFromStores = useStateFromStores([ChannelCallLifecycleStore], () => ChannelCallLifecycleStore.isPipEnabledWhileFocusedOnActivityOrStream());
+  const previous = usePrevious(stateFromStores);
+  c18178_2 = previous;
+  const currentEmbeddedActivity = useCurrentEmbeddedActivity();
+  c18178_3 = currentEmbeddedActivity;
+  useEffect(() => {
+    if (c18178_3 != null) {
+      if (c18178_2 != null && stateFromStores !== c18178_2) {
+        const r4 = stateFromStores ? AnalyticEvents.ACTIVITY_VIDEO_PIP_SHOWN : AnalyticEvents.ACTIVITY_VIDEO_PIP_HIDDEN;
+        AnalyticsUtils.track(r4, {
+          channel_id: a0.id,
+          guild_id: a0.guild_id,
+          application_id: c18178_3.applicationId,
+          activity_session_id: c18178_3.compositeInstanceId
+        });
+      }
+    }
+  }, [stateFromStores, previous, a0, currentEmbeddedActivity]);
+};

modules/video_calls/participantHasVideo.tsx

@@ -0,0 +1,55 @@
+// Metro module 10043 (f10044).
+import AuthenticationStore from "../../stores/AuthenticationStore";
+import MediaEngineStore from "../../stores/MediaEngineStore";
+import { ParticipantTypes, isStreamParticipant, isUserParticipant } from "../calls/CallConstants";
+import { useStateFromStores } from "../../_bundle/Module589";
+const canRenderParticipantVideo = function canRenderParticipantVideo(a0, r7 = MediaEngineStore) {
+  let r15;
+  let r3 = a0 != null;
+  if (r3) {
+    let r12 = a0.type !== ParticipantTypes.ACTIVITY;
+    if (r12) {
+      if (isStreamParticipant(a0)) {
+        r15 = a0.streamId != null;
+      } else {
+        r15 = a0.voiceState?.selfVideo;
+        if (r15 == null) {
+          r15 = false;
+        }
+      }
+      r12 = r15;
+    }
+    let r18 = !!r12;
+    if (r18) {
+      const isStreamParticipant2 = isStreamParticipant(a0);
+      let r21 = isStreamParticipant2 ? a0.user.id !== AuthenticationStore.getId() : !isStreamParticipant2;
+      if (r21) {
+        const isUserParticipant2 = isUserParticipant(a0);
+        r21 = isUserParticipant2 ? !r7.isLocalVideoDisabled(a0.id) : !isUserParticipant2;
+      }
+      r18 = r21;
+    }
+    r3 = r18;
+  }
+  return r3;
+};
+export default function participantHasVideo(a0) {
+  let r12;
+  let r8 = a0.type !== ParticipantTypes.ACTIVITY;
+  if (r8) {
+    if (isStreamParticipant(a0)) {
+      r12 = a0.streamId != null;
+    } else {
+      r12 = a0.voiceState?.selfVideo;
+      if (r12 == null) {
+        r12 = false;
+      }
+    }
+    r8 = r12;
+  }
+  return r8;
+};
+export { canRenderParticipantVideo };
+export function useCanRenderParticipantVideo(c17651_0) {
+  return useStateFromStores([MediaEngineStore], () => canRenderParticipantVideo(c17651_0, MediaEngineStore));
+}

modules/video_calls/useChannelVideoLimit.tsx

@@ -0,0 +1,35 @@
+// Metro module 8837 (f8838).
+import GuildStore from "../../stores/GuildStore";
+import SortedVoiceStateStore from "../../stores/views/SortedVoiceStateStore";
+import { ChannelTypes } from "../../Constants";
+import { useStateFromStoresObject } from "../../_bundle/Module589";
+export default function useChannelVideoLimit(a0) {
+  return useStateFromStoresObject([SortedVoiceStateStore, GuildStore], () => {
+    const r10 = SortedVoiceStateStore.countVoiceStatesForChannel(a0.id);
+    const guild = GuildStore.getGuild(a0.getGuildId());
+    return guild == null ? {
+      reachedLimit: false,
+      limit: -1
+    } : a0.type === ChannelTypes.GUILD_STAGE_VOICE ? {
+      reachedLimit: r10 > guild.maxStageVideoChannelUsers,
+      limit: guild.maxStageVideoChannelUsers
+    } : {
+      reachedLimit: guild.maxVideoChannelUsers > 0 && r10 > guild.maxVideoChannelUsers,
+      limit: guild.maxVideoChannelUsers
+    };
+  }, [a0]);
+};
+export function getChannelVideoLimit(a0) {
+  const r9 = SortedVoiceStateStore.countVoiceStatesForChannel(a0.id);
+  const guild = GuildStore.getGuild(a0.getGuildId());
+  return guild == null ? {
+    reachedLimit: false,
+    limit: -1
+  } : a0.type === ChannelTypes.GUILD_STAGE_VOICE ? {
+    reachedLimit: r9 > guild.maxStageVideoChannelUsers,
+    limit: guild.maxStageVideoChannelUsers
+  } : {
+    reachedLimit: guild.maxVideoChannelUsers > 0 && r9 > guild.maxVideoChannelUsers,
+    limit: guild.maxVideoChannelUsers
+  };
+}

modules/video_calls/useDeafStates.tsx

@@ -0,0 +1,35 @@
+// Metro module 10812 (f10813).
+import AuthenticationStore from "../../stores/AuthenticationStore";
+import MediaEngineStore from "../../stores/MediaEngineStore";
+import VoiceStateStore from "../../stores/VoiceStateStore";
+import { useStateFromStoresObject } from "../../_bundle/Module589";
+export default function useDeafStates(a0) {
+  return useStateFromStoresObject([VoiceStateStore, MediaEngineStore, AuthenticationStore], () => {
+    if (VoiceStateStore !== void 0 && MediaEngineStore !== void 0 && AuthenticationStore !== void 0) {
+      const r4 = a0 != null ? VoiceStateStore.getVoiceState(a0.getGuildId(), AuthenticationStore.getId()) : null;
+      const r17 = {
+        selfDeaf: MediaEngineStore.isSelfDeaf(),
+        deaf: null
+      };
+      let deaf = r4?.deaf;
+      if (deaf == null) {
+        deaf = false;
+      }
+      r17.deaf = deaf;
+      return r17;
+    }
+  }, [a0]);
+};
+export function getDeafStates(a0, r8 = VoiceStateStore, r6 = MediaEngineStore, r9 = AuthenticationStore) {
+  const r4 = a0 != null ? r8.getVoiceState(a0.getGuildId(), r9.getId()) : null;
+  const r16 = {
+    selfDeaf: r6.isSelfDeaf(),
+    deaf: null
+  };
+  let deaf = r4?.deaf;
+  if (deaf == null) {
+    deaf = false;
+  }
+  r16.deaf = deaf;
+  return r16;
+}

modules/video_calls/useHasVideoPermission.tsx

@@ -0,0 +1,11 @@
+// Metro module 10741 (f10742).
+import GuildStore from "../../stores/GuildStore";
+import PermissionStore from "../../stores/PermissionStore";
+import { useStateFromStores } from "../../_bundle/Module589";
+import { canStreamInChannel } from "../go_live/utils/StreamPermissionUtils";
+export default function useHasVideoPermission(a0) {
+  return useStateFromStores([GuildStore, PermissionStore], () => a0 != null && (a0.isPrivate() || canStreamInChannel(a0, GuildStore, PermissionStore, false)), [a0]);
+};
+export function getVideoPermission(a0) {
+  return a0.isPrivate() || canStreamInChannel(a0, GuildStore, PermissionStore, false);
+}

modules/video_calls/useIsStreamFocused.tsx

@@ -0,0 +1,8 @@
+// Metro module 10672 (f10673).
+import ChannelRTCStore from "../calls/ChannelRTCStore";
+import { isStreamParticipant } from "../calls/CallConstants";
+import { useStateFromStores } from "../../_bundle/Module589";
+export function useIsStreamFocused(c18177_0) {
+  const stateFromStores = useStateFromStores([ChannelRTCStore], () => c18177_0 != null ? ChannelRTCStore.getSelectedParticipant(c18177_0) : null);
+  return stateFromStores != null && isStreamParticipant(stateFromStores);
+}

modules/video_calls/useMuteStates.tsx

@@ -0,0 +1,34 @@
+// Metro module 10777 (f10778).
+import ImpersonateStore from "../impersonate/ImpersonateStore";
+import AuthenticationStore from "../../stores/AuthenticationStore";
+import MediaEngineStore from "../../stores/MediaEngineStore";
+import PermissionStore from "../../stores/PermissionStore";
+import VoiceStateStore from "../../stores/VoiceStateStore";
+import { Permissions } from "../../Constants";
+import { useStateFromStoresObject } from "../../_bundle/Module589";
+const getMuteStates = function getMuteStates({ channel: channel2, authenticationStore = AuthenticationStore, voiceStateStore = VoiceStateStore, mediaEngineStore = MediaEngineStore, permissionStore = PermissionStore, impersonateStore = ImpersonateStore }) {
+  const r14 = channel2 != null ? voiceStateStore.getVoiceState(channel2.getGuildId(), authenticationStore.getId()) : null;
+  const selfMute = mediaEngineStore.isSelfMute() || mediaEngineStore.isSelfMutedTemporarily();
+  const r24 = impersonateStore.isViewingRoles(channel2 == null ? void 0 : channel2.getGuildId()) && !permissionStore.can(Permissions.SPEAK, channel2);
+  const suppress = r14?.suppress || r24;
+  let mute = r14?.mute;
+  if (mute == null) {
+    mute = false;
+  }
+  return {
+    selfMute,
+    suppress,
+    mute
+  };
+};
+export default function useMuteStates(channel) {
+  return useStateFromStoresObject([AuthenticationStore, VoiceStateStore, MediaEngineStore, PermissionStore, ImpersonateStore], () => getMuteStates({
+    channel,
+    authenticationStore: AuthenticationStore,
+    voiceStateStore: VoiceStateStore,
+    mediaEngineStore: MediaEngineStore,
+    permissionStore: PermissionStore,
+    impersonateStore: ImpersonateStore
+  }));
+};
+export { getMuteStates };

modules/video_calls/useSelectedParticipant.tsx

@@ -0,0 +1,6 @@
+// Metro module 10238 (f10239).
+import ChannelRTCStore from "../calls/ChannelRTCStore";
+import { useStateFromStores } from "../../_bundle/Module589";
+export default function useSelectedParticipant(c17791_0) {
+  return useStateFromStores([ChannelRTCStore], () => ChannelRTCStore.getSelectedParticipant(c17791_0.id));
+};

modules/video_calls/useVideoSpinnerTimer.tsx

@@ -0,0 +1,16 @@
+// Metro module 10556 (f10557).
+import { useState, useEffect } from "react";
+import { VideoSpinnerTimer } from "../../lib/VideoSpinnerTimer";
+export default function useVideoSpinnerTimer({ location: location2, videoSpinnerContext, userId, streamId, loading, paused = false }) {
+  let c18128_5 = paused;
+  const [state] = useState(() => new VideoSpinnerTimer(location2));
+  useEffect(() => {
+    if (!c18128_5) {
+      if (loading) {
+        state.onSpinnerStarted();
+      } else if (streamId != null) {
+        state.trackSpinnerDuration(videoSpinnerContext, userId, streamId);
+      }
+    }
+  }, [loading, paused, streamId, state, videoSpinnerContext, userId]);
+};