621 lines
27 KiB
TypeScript
621 lines
27 KiB
TypeScript
// Metro module 15978 (f15979).
|
|
import { useContext, memo, useCallback } from "react";
|
|
import { Pressable, Platform } from "react-native";
|
|
import AccessibilityStore from "../../../a11y/AccessibilityStore";
|
|
import EmbeddedActivitiesStore from "../../../activities/EmbeddedActivitiesStore";
|
|
import ApplicationStreamingStore from "../../../../stores/ApplicationStreamingStore";
|
|
import RTCConnectionStore from "../../../../stores/RTCConnectionStore";
|
|
import { MODE_CHANGE_PHYSICS, VoicePanelModes } from "../../VoicePanelConstants";
|
|
import { VoicePanelControlsModes } from "../controls/VoicePanelControlsConstants";
|
|
import { VOICE_PANEL_CARD_INNER_PADDING } from "./VoicePanelCardConstants";
|
|
import { ThemeTypes } from "../../../../Constants";
|
|
import { ParticipantTypes, VoicePlatforms } from "../../../calls/CallConstants";
|
|
import ReanimatedRexport, { useAnimatedStyle, useSharedValue, useAnimatedReaction, useDerivedValue } from "../../../reanimated/ReanimatedRexport";
|
|
import { Icon, IconSizes } from "../../../../design/void/native";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import MobileVisualRefreshExperiment from "../../../themes/experiments/MobileVisualRefreshExperiment";
|
|
import VoicePanelStateContext from "../VoicePanelStateContext";
|
|
import Module15934 from "../../../../_bundle/Module15934";
|
|
import Module15979 from "../../../../_bundle/Module15979";
|
|
import Module10855 from "../../../../_bundle/Module10855";
|
|
import Module15980 from "../../../../_bundle/Module15980";
|
|
import useVoicePanelCardUserStateIcons, { VoicePanelCardUserStateIconType } from "../hooks/useVoicePanelCardUserStateIcons";
|
|
import { VoiceXIcon } from "../../../../design/components/Icon/native/redesign/generated/VoiceXIcon";
|
|
import { VideoIcon, MuteDeafenIcon } from "../shared/VoiceStateIcons";
|
|
import NativeView from "../../../core/native/NativeView";
|
|
import { CircleErrorIcon } from "../../../../design/components/Icon/native/redesign/generated/CircleErrorIcon";
|
|
import { intl, t } from "../../../../intl/index.native";
|
|
import { MuteDeafenIconState } from "../utils/VoiceStateIconUtils";
|
|
import * as _spring from "../../../../design/animation/reanimated/spring/spring";
|
|
import { isStableStreamParticipant, isStableActivityParticipant, isStableParticipantWithUser } from "../utils/useStableParticipant";
|
|
import { stopStream } from "../../../../actions/StreamActionCreators";
|
|
import { encodeStreamKey } from "../../../go_live/utils/StreamKeyUtils";
|
|
import EmbeddedActivitiesNativeManager from "../../../activities/native/EmbeddedActivitiesNativeManager";
|
|
import VoicePanelIconButton from "../shared/VoicePanelIconButton";
|
|
import Module15981 from "../../../../_bundle/Module15981";
|
|
import Module15982 from "../../../../_bundle/Module15982";
|
|
import { useStateFromStores } from "../../../../_bundle/Module589";
|
|
import getRandomNumberInRange from "../utils/getRandomNumberInRange";
|
|
import ReanimatedNativeView from "../../../core/native/ReanimatedNativeView";
|
|
import Module15983 from "../../../../_bundle/Module15983";
|
|
import { ThemeContextProvider } from "../../../../_bundle/Module3901";
|
|
import { useIsScreenReaderEnabled } from "../../../a11y/native/useIsScreenReaderEnabled.native";
|
|
import useAnalyticsLocations from "../../../app_analytics/useAnalyticsLocations";
|
|
import showUserProfileActionSheet from "../../../user_profile/native/showUserProfileActionSheet";
|
|
import { useIsUserSecureFramesVerified } from "../../../rtc/hooks/useIsSecureFramesVerified";
|
|
import useDisplayNameStyles from "../../../display_name_styles/hooks/useDisplayNameStyles";
|
|
import { useDisplayNameStylesFont } from "../../../display_name_styles/native/useDisplayNameStylesFont";
|
|
import { Text } from "../../../../design/components/Text/native/Text";
|
|
import GuildTag from "../../../guild_tag/native/GuildTag";
|
|
import { ShieldLockIcon } from "../../../../design/components/Icon/native/redesign/generated/ShieldLockIcon";
|
|
import useIsVoicePanelParticipantFocusable from "../utils/useIsVoicePanelParticipantFocusable";
|
|
let AnimatedComponent, AnimatedComponent2, height, useStyles, __initData, AnimatedLabelIcon, __initData2, Component4, __initData3, Component5, RING_PHYSICS, __initData4, __initData5, __initData6, __initData7, __initData8, __initData9, Component, Component3, __initData10, __initData11, __initData12, __initData13, __initData14, Component2, __initData15;
|
|
const StreamIcon = function StreamIcon(props) {
|
|
const voicePlatform = props.voicePlatform;
|
|
const styles = useStyles(MobileVisualRefreshExperiment("VoicePanelCardFloatingControls"));
|
|
const controlsSpecs = useContext(VoicePanelStateContext).controlsSpecs;
|
|
const r24 = function() {
|
|
const r2 = controlsSpecs.get().mode === VoicePanelControlsModes.HIDDEN;
|
|
return {
|
|
marginLeft: r2 ? 2 : 4,
|
|
marginRight: r2 ? 2 : 0
|
|
};
|
|
};
|
|
r24.__closure = {
|
|
controlsSpecs,
|
|
VoicePanelControlsModes,
|
|
GAP: 4
|
|
};
|
|
r24.__workletHash = 3270040588948;
|
|
r24.__initData = __initData;
|
|
const animatedStyle = useAnimatedStyle(r24);
|
|
let source = Module15934;
|
|
if (voicePlatform === VoicePlatforms.XBOX) {
|
|
source = Module15979;
|
|
} else if (voicePlatform === VoicePlatforms.MOBILE) {
|
|
source = Module10855;
|
|
} else if (voicePlatform === VoicePlatforms.QUEST) {
|
|
source = Module15980;
|
|
}
|
|
return <AnimatedComponent source={source} style={[styles.iconWithoutBackground, animatedStyle]} />;
|
|
};
|
|
AnimatedLabelIcon = function AnimatedLabelIcon(props) {
|
|
const icon = props.icon;
|
|
const styles = useStyles(MobileVisualRefreshExperiment("VoicePanelCardFloatingControls"));
|
|
const type = icon.type;
|
|
if (VoicePanelCardUserStateIconType.STREAM_ICON === type) {
|
|
return <StreamIcon voicePlatform={icon.voicePlatform} />;
|
|
}
|
|
if (VoicePanelCardUserStateIconType.SPEAKER_MUTE_ICON === type) {
|
|
return <Pressable style={styles.speakerMuteIcon} hitSlop={12} onPress={icon.onPress}>
|
|
<VoiceXIcon style={styles.iconWithoutBackground} />
|
|
</Pressable>;
|
|
}
|
|
if (VoicePanelCardUserStateIconType.USER_VIDEO_ICON === type) {
|
|
return <Pressable style={styles.iconContainer} onPress={icon.onPress}>
|
|
<VideoIcon style={styles.icon} state={icon.videoIconState} />
|
|
</Pressable>;
|
|
}
|
|
if (VoicePanelCardUserStateIconType.MUTE_DEAFEN_ICON === type) {
|
|
return <NativeView style={styles.iconContainer}>
|
|
<Pressable onPress={icon.onPress} hitSlop={12}>
|
|
<MuteDeafenIcon style={styles.icon} state={icon.muteDeafenIconState} alwaysWhite />
|
|
</Pressable>
|
|
</NativeView>;
|
|
}
|
|
if (VoicePanelCardUserStateIconType.USER_DISCONNECTED_ICON === type) {
|
|
return <Pressable style={styles.iconContainer} onPress={icon.onPress}>
|
|
<CircleErrorIcon size="xs" color={Module712.colors.TEXT_FEEDBACK_WARNING} />
|
|
</Pressable>;
|
|
}
|
|
};
|
|
Platform;
|
|
AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Icon);
|
|
AnimatedComponent2 = ReanimatedRexport.createAnimatedComponent(Pressable);
|
|
height = 28;
|
|
useStyles = createStyles((a0) => ({
|
|
labelPositionContainer: {
|
|
position: "absolute",
|
|
left: 8,
|
|
right: 8,
|
|
bottom: 8,
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
marginHorizontal: 8
|
|
},
|
|
labelOuterContainer: {
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
justifyContent: "flex-start",
|
|
alignItems: "center",
|
|
borderRadius: a0 ? Module712.radii.sm : Module712.radii.round,
|
|
overflow: "hidden",
|
|
paddingHorizontal: 8,
|
|
backgroundColor: Module712.colors.CONTROL_OVERLAY_SECONDARY_BACKGROUND_DEFAULT,
|
|
height,
|
|
gap: 4
|
|
},
|
|
initialIcons: {
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
marginStart: -4,
|
|
marginEnd: -4
|
|
},
|
|
icon: {
|
|
width: 12,
|
|
height: 12,
|
|
tintColor: Module712.colors.WHITE
|
|
},
|
|
iconWithoutBackground: {
|
|
width: 16,
|
|
height: 16,
|
|
tintColor: Module712.colors.WHITE
|
|
},
|
|
iconContainer: {
|
|
width: 20,
|
|
height: 20,
|
|
borderRadius: Module712.radii.round,
|
|
alignItems: "center",
|
|
justifyContent: "center"
|
|
},
|
|
speakerMuteIcon: {
|
|
marginRight: 4
|
|
},
|
|
floatingContainer: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
gap: 4,
|
|
overflow: "hidden",
|
|
flexShrink: 1
|
|
},
|
|
floatingText: {
|
|
overflow: "hidden",
|
|
paddingStart: 4,
|
|
paddingEnd: 4,
|
|
flexShrink: 1,
|
|
lineHeight: 14
|
|
},
|
|
ringingIconContainer: {
|
|
position: "absolute",
|
|
top: 8,
|
|
right: 8,
|
|
padding: 6,
|
|
borderRadius: Module712.radii.round,
|
|
backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGH
|
|
},
|
|
ringingIcon: {
|
|
tintColor: Module712.colors.STATUS_POSITIVE
|
|
},
|
|
secureFramesIcon: {
|
|
marginEnd: -2
|
|
}
|
|
}));
|
|
__initData = {
|
|
code: "function VoicePanelCardFloatingControlsTsx1(){const{controlsSpecs,VoicePanelControlsModes,GAP}=this.__closure;const hidden=controlsSpecs.get().mode===VoicePanelControlsModes.HIDDEN;return{marginLeft:hidden?2:GAP,marginRight:hidden?2:0};}"
|
|
};
|
|
__initData2 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx2(){const{controlsHidden,FLOATING_BAR_HEIGHT,VOICE_PANEL_CARD_INNER_PADDING,withSpring,MODE_CHANGE_PHYSICS}=this.__closure;const hidden=controlsHidden.get();return{position:'absolute',top:hidden?-(FLOATING_BAR_HEIGHT+VOICE_PANEL_CARD_INNER_PADDING*2):VOICE_PANEL_CARD_INNER_PADDING,left:VOICE_PANEL_CARD_INNER_PADDING,opacity:withSpring(hidden?0:1,MODE_CHANGE_PHYSICS),zIndex:1};}"
|
|
};
|
|
Component4 = memo(function({ participant, controlsHidden: controlsHidden5, isSelf, layout }) {
|
|
const guildId = useContext(VoicePanelStateContext).guildId;
|
|
const controlsHidden = controlsHidden5;
|
|
const r24 = function n() {
|
|
const r7 = controlsHidden.get();
|
|
return {
|
|
position: "absolute",
|
|
top: r7 ? -(height + 2 * VOICE_PANEL_CARD_INNER_PADDING) : VOICE_PANEL_CARD_INNER_PADDING,
|
|
left: VOICE_PANEL_CARD_INNER_PADDING,
|
|
opacity: _spring.withSpring(r7 ? 0 : 1, MODE_CHANGE_PHYSICS),
|
|
zIndex: 1
|
|
};
|
|
};
|
|
r24.__closure = {
|
|
controlsHidden,
|
|
FLOATING_BAR_HEIGHT: height,
|
|
VOICE_PANEL_CARD_INNER_PADDING,
|
|
withSpring: _spring.withSpring,
|
|
MODE_CHANGE_PHYSICS
|
|
};
|
|
r24.__workletHash = 4080439075039;
|
|
r24.__initData = __initData2;
|
|
const animatedStyle = useAnimatedStyle(r24);
|
|
return <VoicePanelIconButton icon={Module15981} onPress={useCallback(() => {
|
|
if (isStableStreamParticipant(participant)) {
|
|
const streamForUser = ApplicationStreamingStore.getStreamForUser(participant.user.id, guildId);
|
|
if (streamForUser == null) {
|
|
return void 0;
|
|
}
|
|
stopStream(encodeStreamKey(streamForUser));
|
|
}
|
|
if (isStableActivityParticipant(participant)) {
|
|
EmbeddedActivitiesNativeManager.leaveActivity({
|
|
location: EmbeddedActivitiesStore.getCurrentEmbeddedActivity()?.location,
|
|
applicationId: participant.applicationId
|
|
});
|
|
}
|
|
}, [guildId, participant])} style={animatedStyle} layout={layout} accessibilityLabel={isStableActivityParticipant(participant) ? intl.string(t["R/FK4A"]) : isSelf ? intl.string(t.S5anIc) : intl.string(t.q3O3J8)} />;
|
|
});
|
|
__initData3 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx3(){const{controlsHidden,mode,VoicePanelModes,FLOATING_BAR_HEIGHT,VOICE_PANEL_CARD_INNER_PADDING,withSpring,MODE_CHANGE_PHYSICS}=this.__closure;const hidden=controlsHidden.get()||mode.get()===VoicePanelModes.PIP;return{position:'absolute',top:hidden?-(FLOATING_BAR_HEIGHT+VOICE_PANEL_CARD_INNER_PADDING*2):VOICE_PANEL_CARD_INNER_PADDING,right:VOICE_PANEL_CARD_INNER_PADDING,opacity:withSpring(hidden?0:1,MODE_CHANGE_PHYSICS),zIndex:1};}"
|
|
};
|
|
Component5 = memo(function({ participantId, controlsHidden: controlsHidden2, targetName, isActivityParticipant, layout }) {
|
|
const context = useContext(VoicePanelStateContext);
|
|
const { setFocused, mode } = context;
|
|
const callback = useCallback(() => {
|
|
setFocused(participantId);
|
|
}, [setFocused, participantId]);
|
|
const r28 = function _() {
|
|
const r7 = controlsHidden2.get() || mode.get() === VoicePanelModes.PIP;
|
|
return {
|
|
position: "absolute",
|
|
top: r7 ? -(height + 2 * VOICE_PANEL_CARD_INNER_PADDING) : VOICE_PANEL_CARD_INNER_PADDING,
|
|
right: VOICE_PANEL_CARD_INNER_PADDING,
|
|
opacity: _spring.withSpring(r7 ? 0 : 1, MODE_CHANGE_PHYSICS),
|
|
zIndex: 1
|
|
};
|
|
};
|
|
r28.__closure = {
|
|
controlsHidden: controlsHidden2,
|
|
mode,
|
|
VoicePanelModes,
|
|
FLOATING_BAR_HEIGHT: height,
|
|
VOICE_PANEL_CARD_INNER_PADDING,
|
|
withSpring: _spring.withSpring,
|
|
MODE_CHANGE_PHYSICS
|
|
};
|
|
r28.__workletHash = 12421495364262;
|
|
r28.__initData = __initData3;
|
|
return <VoicePanelIconButton icon={Module15982} onPress={callback} style={useAnimatedStyle(r28)} layout={layout} accessibilityLabel={isActivityParticipant ? intl.string(t["3ejJer"]) : targetName != null ? intl.formatToPlainString(t.OervdV, {
|
|
targetName
|
|
}) : intl.string(t["77cRN4"])} />;
|
|
});
|
|
RING_PHYSICS = {
|
|
mass: 0.1,
|
|
stiffness: 400,
|
|
overshootClamping: true
|
|
};
|
|
__initData4 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx4(){const{flip}=this.__closure;return flip.get();}"
|
|
};
|
|
__initData5 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx5(flipped){const{angle,withSpring,getRandomNumberInRange,RING_PHYSICS,flip}=this.__closure;if(flipped){angle.set(withSpring(getRandomNumberInRange(45-10,45+10),RING_PHYSICS,'respect-motion-settings',function(finished){if(!finished)return;flip.set(!flip.get());}));}else{angle.set(withSpring(getRandomNumberInRange(0-10,0+10),RING_PHYSICS,'respect-motion-settings',function(finished){if(!finished)return;flip.set(!flip.get());}));}}"
|
|
};
|
|
__initData6 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx6(finished){const{flip}=this.__closure;if(!finished)return;flip.set(!flip.get());}"
|
|
};
|
|
__initData7 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx7(finished){const{flip}=this.__closure;if(!finished)return;flip.set(!flip.get());}"
|
|
};
|
|
__initData8 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx8(){const{controlsHidden,FLOATING_BAR_HEIGHT,VOICE_PANEL_CARD_INNER_PADDING}=this.__closure;return{top:controlsHidden.get()?-(FLOATING_BAR_HEIGHT+VOICE_PANEL_CARD_INNER_PADDING*2):0};}"
|
|
};
|
|
__initData9 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx9(){const{angle}=this.__closure;return{transform:[{rotate:angle.get()+\"deg\"}]};}"
|
|
};
|
|
Component = memo(function({ controlsHidden: controlsHidden3 }) {
|
|
const styles = useStyles(MobileVisualRefreshExperiment("VoicePanelCardFloatingControls"));
|
|
const sharedValue = useSharedValue(true);
|
|
const sharedValue2 = useSharedValue(0);
|
|
const stateFromStores = useStateFromStores([AccessibilityStore], () => AccessibilityStore.useReducedMotion);
|
|
const r36 = () => sharedValue.get();
|
|
r36.__closure = {
|
|
flip: sharedValue
|
|
};
|
|
r36.__workletHash = 7663309832237;
|
|
r36.__initData = __initData4;
|
|
const r40 = function n(a0) {
|
|
if (a0) {
|
|
const randomNumberInRange2 = getRandomNumberInRange(35, 55);
|
|
const r35 = function(a0) {
|
|
if (a0) {
|
|
sharedValue.set(!sharedValue.get());
|
|
}
|
|
};
|
|
r35.__closure = {
|
|
flip: sharedValue
|
|
};
|
|
r35.__workletHash = 17264907521028;
|
|
r35.__initData = __initData6;
|
|
sharedValue2.set(_spring.withSpring(randomNumberInRange2, RING_PHYSICS, "respect-motion-settings", r35));
|
|
} else {
|
|
const randomNumberInRange = getRandomNumberInRange(-10, 10);
|
|
const r8 = function n(a0) {
|
|
if (a0) {
|
|
sharedValue.set(!sharedValue.get());
|
|
}
|
|
};
|
|
r8.__closure = {
|
|
flip: sharedValue
|
|
};
|
|
r8.__workletHash = 1799436949573;
|
|
r8.__initData = __initData7;
|
|
sharedValue2.set(_spring.withSpring(randomNumberInRange, RING_PHYSICS, "respect-motion-settings", r8));
|
|
}
|
|
};
|
|
r40.__closure = {
|
|
angle: sharedValue2,
|
|
withSpring: _spring.withSpring,
|
|
getRandomNumberInRange,
|
|
RING_PHYSICS,
|
|
flip: sharedValue
|
|
};
|
|
r40.__workletHash = 15646860695268;
|
|
r40.__initData = __initData5;
|
|
useAnimatedReaction(r36, r40);
|
|
const r52 = () => ({
|
|
top: controlsHidden3.get() ? -(height + 2 * VOICE_PANEL_CARD_INNER_PADDING) : 0
|
|
});
|
|
r52.__closure = {
|
|
controlsHidden: controlsHidden3,
|
|
FLOATING_BAR_HEIGHT: height,
|
|
VOICE_PANEL_CARD_INNER_PADDING
|
|
};
|
|
r52.__workletHash = 726627995932;
|
|
r52.__initData = __initData8;
|
|
const animatedStyle = useAnimatedStyle(r52);
|
|
const C = () => ({
|
|
transform: [{
|
|
rotate: `${sharedValue2.get()}deg`
|
|
}]
|
|
});
|
|
C.__closure = {
|
|
angle: sharedValue2
|
|
};
|
|
C.__workletHash = 791392364030;
|
|
C.__initData = __initData9;
|
|
const animatedStyle2 = useAnimatedStyle(C);
|
|
return <ReanimatedNativeView style={[animatedStyle, styles.ringingIconContainer]}>
|
|
<ReanimatedNativeView style={stateFromStores ? !stateFromStores : animatedStyle2} pointerEvents="none">
|
|
<Icon source={Module15983} size={IconSizes.SMALL_20} style={styles.ringingIcon} />
|
|
</ReanimatedNativeView>
|
|
</ReanimatedNativeView>;
|
|
});
|
|
Component3 = memo(function(a0) {
|
|
return <ThemeContextProvider theme={ThemeTypes.LIGHT}>
|
|
<Component controlsHidden={a0.controlsHidden} />
|
|
</ThemeContextProvider>;
|
|
});
|
|
__initData10 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx10(){const{hasHiddenVisibleIcon,focused,connected,mode,VoicePanelModes,controlsHidden}=this.__closure;const showIcon=hasHiddenVisibleIcon&&focused.get()==null;return!connected.get()||mode.get()===VoicePanelModes.PIP||!showIcon&&controlsHidden.get();}"
|
|
};
|
|
__initData11 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx11(){const{isPillHidden}=this.__closure;return isPillHidden.get();}"
|
|
};
|
|
__initData12 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx12(hidden){const{pillOpacity,withSpring,MODE_CHANGE_PHYSICS}=this.__closure;pillOpacity.set(withSpring(hidden?0:1,MODE_CHANGE_PHYSICS));}"
|
|
};
|
|
__initData13 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx13(){const{pillOpacity,isPillHidden,FLOATING_BAR_HEIGHT,VOICE_PANEL_CARD_INNER_PADDING}=this.__closure;return{opacity:pillOpacity.get(),top:isPillHidden.get()?FLOATING_BAR_HEIGHT+VOICE_PANEL_CARD_INNER_PADDING:0,height:FLOATING_BAR_HEIGHT,pointerEvents:isPillHidden.get()?'none':'auto'};}"
|
|
};
|
|
__initData14 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx14(){const{connected,isScreenReaderEnabled,controlsSpecs,VoicePanelControlsModes,hasIcon,GAP}=this.__closure;const hidden=!connected.get()||!isScreenReaderEnabled&&controlsSpecs.get().mode===VoicePanelControlsModes.HIDDEN&&hasIcon;const shouldCollapseWidth=hidden&&hasIcon;return{width:shouldCollapseWidth?0:'auto',marginRight:hidden?-GAP:0};}"
|
|
};
|
|
Component2 = memo(function({ controlsHidden: controlsHidden4, label, layout, participant: participant3 }) {
|
|
let accessibilityLabel, props4;
|
|
let c22672_9, c22672_10, derivedValue, sharedValue3;
|
|
c22672_9 = void 0;
|
|
c22672_10 = void 0;
|
|
derivedValue = void 0;
|
|
sharedValue3 = void 0;
|
|
const context = useContext(VoicePanelStateContext);
|
|
const { guildId: guildId3, channelId, controlsSpecs: controlsSpecs2, focused, connected, mode: mode2 } = context;
|
|
const isScreenReaderEnabled = useIsScreenReaderEnabled();
|
|
const styles = useStyles(MobileVisualRefreshExperiment("VoicePanelCardFloatingControls"));
|
|
const id = isStableParticipantWithUser(participant3) ? participant3.user.id : void 0;
|
|
const analyticsLocations = useAnalyticsLocations().analyticsLocations;
|
|
const callback = useCallback(() => {
|
|
if (id != null) {
|
|
showUserProfileActionSheet({
|
|
userId: id,
|
|
channelId,
|
|
isVoiceContext: true,
|
|
sourceAnalyticsLocations: analyticsLocations
|
|
});
|
|
}
|
|
}, [id, channelId, analyticsLocations]);
|
|
let r15 = useIsUserSecureFramesVerified({
|
|
userId: id,
|
|
channelId
|
|
});
|
|
const voicePanelCardUserStateIcons = useVoicePanelCardUserStateIcons(participant3.type, isStableParticipantWithUser(participant3) ? participant3.user.id : void 0, guildId3, channelId);
|
|
const displayNameStylesFont = useDisplayNameStylesFont({
|
|
displayNameStyles: useDisplayNameStyles({
|
|
userId: id,
|
|
guildId: guildId3
|
|
})
|
|
});
|
|
const length = voicePanelCardUserStateIcons.length;
|
|
let r0 = 1;
|
|
const hasIcon = length >= 1;
|
|
c22672_9 = hasIcon;
|
|
const hasHiddenVisibleIcon = voicePanelCardUserStateIcons.filter((voicePanelCardUserStateIcon) => voicePanelCardUserStateIcon.type !== VoicePanelCardUserStateIconType.STREAM_ICON).length >= 1;
|
|
c22672_10 = hasHiddenVisibleIcon;
|
|
const c = function c() {
|
|
const r0 = c22672_10 && focused.get() == null;
|
|
const r9 = connected.get();
|
|
return (r9 ? mode2.get() === VoicePanelModes.PIP : !r9) || (r0 ? !r0 : controlsHidden4.get());
|
|
};
|
|
c.__closure = {
|
|
hasHiddenVisibleIcon,
|
|
focused,
|
|
connected,
|
|
mode: mode2,
|
|
VoicePanelModes,
|
|
controlsHidden: controlsHidden4
|
|
};
|
|
c.__workletHash = 14354852732719;
|
|
c.__initData = __initData10;
|
|
derivedValue = useDerivedValue(c);
|
|
if (derivedValue.get()) {
|
|
r0 = 0;
|
|
}
|
|
sharedValue3 = useSharedValue(r0);
|
|
const u = () => derivedValue.get();
|
|
u.__closure = {
|
|
isPillHidden: derivedValue
|
|
};
|
|
u.__workletHash = 653298163833;
|
|
u.__initData = __initData11;
|
|
const r106 = function _(a0) {
|
|
sharedValue3.set(_spring.withSpring(a0 ? 0 : 1, MODE_CHANGE_PHYSICS));
|
|
};
|
|
r106.__closure = {
|
|
pillOpacity: sharedValue3,
|
|
withSpring: _spring.withSpring,
|
|
MODE_CHANGE_PHYSICS
|
|
};
|
|
r106.__workletHash = 158794425133;
|
|
r106.__initData = __initData12;
|
|
useAnimatedReaction(u, r106);
|
|
const Q = () => ({
|
|
opacity: sharedValue3.get(),
|
|
top: derivedValue.get() ? height + VOICE_PANEL_CARD_INNER_PADDING : 0,
|
|
height,
|
|
pointerEvents: derivedValue.get() ? "none" : "auto"
|
|
});
|
|
Q.__closure = {
|
|
pillOpacity: sharedValue3,
|
|
isPillHidden: derivedValue,
|
|
FLOATING_BAR_HEIGHT: height,
|
|
VOICE_PANEL_CARD_INNER_PADDING
|
|
};
|
|
Q.__workletHash = 12355778282621;
|
|
Q.__initData = __initData13;
|
|
const animatedStyle = useAnimatedStyle(Q);
|
|
const r127 = function() {
|
|
const r8 = connected.get();
|
|
const r3 = r8 ? (isScreenReaderEnabled ? !isScreenReaderEnabled : controlsSpecs2.get().mode === VoicePanelControlsModes.HIDDEN) && c22672_9 : !r8;
|
|
return {
|
|
width: r3 ? c22672_9 ? 0 : "auto" : "auto",
|
|
marginRight: r3 ? -4 : 0
|
|
};
|
|
};
|
|
r127.__closure = {
|
|
connected,
|
|
isScreenReaderEnabled,
|
|
controlsSpecs: controlsSpecs2,
|
|
VoicePanelControlsModes,
|
|
hasIcon,
|
|
GAP: 4
|
|
};
|
|
r127.__workletHash = 10013340978870;
|
|
r127.__initData = __initData14;
|
|
const animatedStyle2 = useAnimatedStyle(r127);
|
|
const props = {
|
|
style: [styles.labelPositionContainer],
|
|
layout,
|
|
pointerEvents: "box-none",
|
|
children: null
|
|
};
|
|
const props2 = {
|
|
onPress: id != null ? callback : void 0,
|
|
style: [styles.labelOuterContainer, animatedStyle],
|
|
layout,
|
|
children: null
|
|
};
|
|
const children = [voicePanelCardUserStateIcons.length > 0 && <NativeView style={styles.initialIcons}>
|
|
{voicePanelCardUserStateIcons.map((voicePanelCardUserStateIcon) => <AnimatedLabelIcon key={voicePanelCardUserStateIcon.type} icon={voicePanelCardUserStateIcon} />)}
|
|
</NativeView>, ,];
|
|
const props3 = {
|
|
style: [styles.floatingContainer, animatedStyle2],
|
|
layout,
|
|
children: null
|
|
};
|
|
const style = [styles.floatingText, ,];
|
|
const r168 = displayNameStylesFont != null && {
|
|
fontFamily: displayNameStylesFont
|
|
};
|
|
L19: {
|
|
style[1] = r168;
|
|
props4 = {
|
|
variant: "heading-sm/semibold",
|
|
color: "text-overlay-light",
|
|
lineClamp: 1,
|
|
style,
|
|
ellipsizeMode: "tail",
|
|
accessibilityLabel: null,
|
|
children: null
|
|
};
|
|
if (voicePanelCardUserStateIcons.find((voicePanelCardUserStateIcon) => voicePanelCardUserStateIcon.type === VoicePanelCardUserStateIconType.STREAM_ICON) != null) {
|
|
accessibilityLabel = intl.formatToPlainString(t.I0mOAs, {
|
|
username: label
|
|
});
|
|
} else {
|
|
const r176 = voicePanelCardUserStateIcons.find((voicePanelCardUserStateIcon) => voicePanelCardUserStateIcon.type === VoicePanelCardUserStateIconType.MUTE_DEAFEN_ICON);
|
|
accessibilityLabel = label;
|
|
if (r176 != null) {
|
|
const muteDeafenIconState = r176.muteDeafenIconState;
|
|
if (MuteDeafenIconState.DEAFENED !== muteDeafenIconState && MuteDeafenIconState.DEAFENED_SERVER !== muteDeafenIconState) {
|
|
accessibilityLabel = intl.formatToPlainString(t.Hd1oVG, {
|
|
username: label
|
|
});
|
|
break L19;
|
|
}
|
|
accessibilityLabel = intl.formatToPlainString(t["9hDjai"], {
|
|
username: label
|
|
});
|
|
}
|
|
}
|
|
}
|
|
props4.accessibilityLabel = accessibilityLabel;
|
|
props4.children = label;
|
|
const children2 = [<Text {...props4} />, participant3.type === ParticipantTypes.USER && <GuildTag userId={participant3.user.id} textColor="text-overlay-light" />, ,];
|
|
if (r15) {
|
|
r15 = <ShieldLockIcon style={styles.secureFramesIcon} size="xs" accessibilityLabel={intl.string(t.mR9cf3)} />;
|
|
}
|
|
children2[2] = r15;
|
|
props3.children = children2;
|
|
children[1] = <ReanimatedNativeView {...props3} />;
|
|
props2.children = children;
|
|
props.children = <AnimatedComponent2 {...props2} />;
|
|
return <ReanimatedNativeView {...props} />;
|
|
});
|
|
__initData15 = {
|
|
code: "function VoicePanelCardFloatingControlsTsx15(){const{controlsSpecs,VoicePanelControlsModes,focused,mode,VoicePanelModes}=this.__closure;return controlsSpecs.get().mode===VoicePanelControlsModes.HIDDEN||focused.get()!=null||mode.get()===VoicePanelModes.PIP;}"
|
|
};
|
|
const r101 = memo(function FloatingControls(props) {
|
|
const { label, participant: participant2 } = props;
|
|
let isRinging = props.isRinging;
|
|
const layout = props.layout;
|
|
const context = useContext(VoicePanelStateContext);
|
|
const { guildId: guildId2, channelId: channelId2, controlsSpecs: controlsSpecs3, focused: focused2, mode: mode3 } = context;
|
|
let r31 = useStateFromStores([RTCConnectionStore], () => RTCConnectionStore.isConnected());
|
|
const isSelf = !!isStableParticipantWithUser(participant2) && participant2.isSelf;
|
|
const stateFromStores = useStateFromStores([EmbeddedActivitiesStore, ApplicationStreamingStore], () => {
|
|
if (isStableActivityParticipant(participant2)) {
|
|
return participant2.applicationId === EmbeddedActivitiesStore.getCurrentEmbeddedActivity()?.applicationId;
|
|
}
|
|
return !!isStableStreamParticipant(participant2) && ApplicationStreamingStore.getActiveStreamForUser(participant2.user.id, guildId2) != null;
|
|
});
|
|
const isVoicePanelParticipantFocusable = useIsVoicePanelParticipantFocusable(guildId2, channelId2, participant2.id);
|
|
const I = function I() {
|
|
return controlsSpecs3.get().mode === VoicePanelControlsModes.HIDDEN || focused2.get() != null || mode3.get() === VoicePanelModes.PIP;
|
|
};
|
|
I.__closure = {
|
|
controlsSpecs: controlsSpecs3,
|
|
VoicePanelControlsModes,
|
|
focused: focused2,
|
|
mode: mode3,
|
|
VoicePanelModes
|
|
};
|
|
I.__workletHash = 8765031976276;
|
|
I.__initData = __initData15;
|
|
const derivedValue2 = useDerivedValue(I);
|
|
const r57 = label != null && <Component2 controlsHidden={derivedValue2} label={label} layout={layout} participant={participant2} />;
|
|
if (isRinging) {
|
|
isRinging = <Component3 controlsHidden={derivedValue2} />;
|
|
}
|
|
const r66 = [isRinging, (r31 ? stateFromStores : r31) && <Component4 controlsHidden={derivedValue2} participant={participant2} isSelf={isSelf} layout={layout} />, , ,];
|
|
if (r31) {
|
|
r31 = isVoicePanelParticipantFocusable;
|
|
}
|
|
if (r31) {
|
|
r31 = <Component5 controlsHidden={derivedValue2} participantId={participant2.id} targetName={label} isActivityParticipant={isStableActivityParticipant(participant2)} layout={layout} />;
|
|
}
|
|
r66[2] = r31;
|
|
r66[3] = r57;
|
|
return <>{r66}</>;
|
|
});
|
|
export default r101;
|