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