yeet

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} />;
+};