573 lines
23 KiB
TypeScript
573 lines
23 KiB
TypeScript
// Metro module 9452 (f9453).
|
|
import { useRef, useCallback, useEffect, useState } from "react";
|
|
import { ActivityIndicator, Pressable, View, Platform } from "react-native";
|
|
import AccessibilityStore from "../../a11y/AccessibilityStore";
|
|
import ChannelStore from "../../../stores/ChannelStore";
|
|
import GuildMemberStore from "../../../stores/GuildMemberStore";
|
|
import MessageReactionsStore from "../../../stores/MessageReactionsStore";
|
|
import PermissionStore from "../../../stores/PermissionStore";
|
|
import { DEFAULT_NUM_REACTION_USERS, Permissions } from "../../../Constants";
|
|
import ReanimatedRexport, { useSharedValue, useAnimatedStyle } from "../../reanimated/ReanimatedRexport";
|
|
import { Text } from "../../../design/components/Text/native/Text";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import { useStateFromStores } from "../../../_bundle/Module589";
|
|
import { MAX_REACTIONS, getReactionEmojiName, emojiEquals } from "../ReactionUtils";
|
|
import isUndefinedOrNull from "../../../_bundle/isUndefinedOrNull";
|
|
import { ReactionTypes } from "../../messages/MessageReactionsTypes";
|
|
import { getReactors, removeEmojiReactions, removeReaction, ReactionLocations } from "../ReactionActionCreators";
|
|
import useInitialValue from "../../../hooks/useInitialValue";
|
|
import Module12 from "../../../_bundle/Module12";
|
|
import useAnalyticsLocations from "../../app_analytics/useAnalyticsLocations";
|
|
import ReactionToProfileExperiment from "../ReactionToProfileExperiment";
|
|
import NicknameUtils from "../../../utils/NicknameUtils";
|
|
import UserUtils from "../../../utils/UserUtils";
|
|
import showUserProfileActionSheet from "../../user_profile/native/showUserProfileActionSheet";
|
|
import FormRow from "../../../design/void/Form/native/FormRow";
|
|
import { RefreshEmptyState, Avatar, AvatarSizes } from "../../../design/void/native";
|
|
import AvatarUtils from "../../../utils/AvatarUtils";
|
|
import DiscordTag from "../../user_profile/native/DiscordTag";
|
|
import { isAndroid, isIOS } from "../../../utils/PlatformUtils";
|
|
import { XSmallIcon } from "../../../design/components/Icon/native/redesign/generated/XSmallIcon";
|
|
import FormDivider from "../../../design/void/Form/native/FormDivider";
|
|
import SlideoutButton from "../../../components_native/common/SlideoutButton";
|
|
import { intl, t } from "../../../intl/index.native";
|
|
import { useEmojiColorPalette } from "../../emojis/hooks/useEmojiColorPalette";
|
|
import { hexOpacityToRgba } from "../../../utils/ColorUtils";
|
|
import { AnimateEmoji } from "../../user_settings/UserSettings";
|
|
import Emoji from "../../emojis/native/Emoji";
|
|
import useCanRemoveAllReactions from "../useCanRemoveAllReactions";
|
|
import * as _timing from "../../../design/animation/reanimated/timing/timing";
|
|
import { getWindowDimensions } from "../../screen/useWindowDimensions.native";
|
|
import { TrashIcon } from "../../../design/components/Icon/native/redesign/generated/TrashIcon";
|
|
import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
|
|
import { ChevronSmallRightIcon } from "../../../design/components/Icon/native/redesign/generated/ChevronSmallRightIcon";
|
|
import TidaWebformExperiment from "../../guild/TidaWebformExperiment";
|
|
import TabBar from "../../../components_native/common/TabBar";
|
|
import { triggerHapticFeedback } from "../../haptics/HapticUtils.native";
|
|
import HapticFeedbackTypes from "../../haptics/HapticFeedbackTypes";
|
|
import useSafeAreaInsets_native from "../../safe_area/useSafeAreaInsets.native";
|
|
import { useNoResultsSource } from "../../../design/components/Illustration/native/redesign/generated/NoResults";
|
|
import { BottomSheet } from "../../../design/components/Sheet/native/BottomSheet.native";
|
|
import { BottomSheetView } from "../../../_bundle/Module5245";
|
|
import { Storage } from "../../../_bundle/Module595";
|
|
import { useIsActiveChannelOrUnarchivableThread } from "../../threads/ThreadHooks";
|
|
import { BACKDROP_OPACITY } from "../../messages/native/burst_reactions/BurstReactionEffectUtils";
|
|
import BurstReactionAnimationPreview from "../../messages/native/burst_reactions/BurstReactionAnimationPreview";
|
|
import SwipeableFastList from "../../../components_native/common/SwipeableFastList";
|
|
import FastList from "../../../lib/native/FastList";
|
|
let AnimatedComponent, useStyles, useReactorsOnScrollNative, ReactionTab, __initData, __initData2, RemoveAllButton, EmojiOptionsButton, ReactionTabs, c6232_28, c6232_29;
|
|
const useReactors = function useReactors({ channelId, messageId, reaction, reactionType }) {
|
|
let r37;
|
|
const stateFromStores = useStateFromStores([MessageReactionsStore], () => {
|
|
const reactions3 = MessageReactionsStore.getReactions(channelId, messageId, reaction.emoji, DEFAULT_NUM_REACTION_USERS, reactionType);
|
|
const r16 = Array;
|
|
let r18 = reactions3 == null ? void 0 : reactions3.values();
|
|
if (r18 == null) {
|
|
r18 = [];
|
|
}
|
|
return r16.from(r18);
|
|
}, [channelId, messageId, reaction.emoji, reactionType], isUndefinedOrNull);
|
|
if (reactionType === ReactionTypes.VOTE) {
|
|
let r39 = reaction.count_details?.vote;
|
|
if (r39 == null) {
|
|
r39 = 0;
|
|
}
|
|
r37 = r39;
|
|
} else {
|
|
r37 = reactionType === ReactionTypes.BURST ? reaction.burst_count : reaction.count;
|
|
}
|
|
return {
|
|
reactors: stateFromStores,
|
|
reactorsHasMore: r37 > stateFromStores.length
|
|
};
|
|
};
|
|
useReactorsOnScrollNative = function useReactorsOnScrollNative({ channelId: channelId2, messageId: messageId2, reactionSelected, reactors: reactors4, reactorsHasMore, reactionType: reactionType2 }) {
|
|
let ref2, c17221_9;
|
|
ref2 = void 0;
|
|
c17221_9 = void 0;
|
|
const ref = useRef(false);
|
|
const id = reactors4.length > 0 ? reactors4[reactors4.length - 1].id : null;
|
|
const callback = useCallback((a0, a1) => {
|
|
if (a0 / a1 > 0.75 && reactorsHasMore && !ref.current) {
|
|
ref.current = true;
|
|
getReactors({
|
|
channelId: channelId2,
|
|
messageId: messageId2,
|
|
emoji: reactionSelected.emoji,
|
|
limit: DEFAULT_NUM_REACTION_USERS,
|
|
after: id,
|
|
type: reactionType2
|
|
}).then(() => {
|
|
ref.current = false;
|
|
});
|
|
}
|
|
}, [channelId2, messageId2, reactionSelected, reactorsHasMore, id, reactionType2]);
|
|
ref2 = useRef(callback);
|
|
useEffect(() => {
|
|
ref2.current = callback;
|
|
}, [callback]);
|
|
c17221_9 = useInitialValue(() => Module12.debounce((a0, a1) => ref2.current(a0, a1), 16));
|
|
return useInitialValue(() => ({ nativeEvent }) => c17221_9(nativeEvent.contentOffset.y, nativeEvent.contentSize.height));
|
|
};
|
|
ReactionTab = function ReactionTab(props) {
|
|
const { reaction: reaction3, selected } = props;
|
|
const styles4 = useStyles();
|
|
const r4 = reaction3.burst_count > 0;
|
|
let burst_colors = reaction3.burst_colors;
|
|
if (burst_colors == null) {
|
|
burst_colors = [];
|
|
}
|
|
const emojiColorPalette = useEmojiColorPalette(burst_colors);
|
|
const r10 = emojiColorPalette?.accentColor != null ? {
|
|
color: emojiColorPalette.accentColor
|
|
} : null;
|
|
const r31 = emojiColorPalette != null ? {
|
|
backgroundColor: hexOpacityToRgba(emojiColorPalette.backgroundColor, emojiColorPalette.opacity)
|
|
} : null;
|
|
const emoji2 = reaction3.emoji;
|
|
const stateFromStores = useStateFromStores([AccessibilityStore], () => AccessibilityStore.useReducedMotion);
|
|
const setting = AnimateEmoji.useSetting();
|
|
const props2 = {
|
|
style: [styles4.tabContainer, selected ? styles4.tabContainerSelected : null, selected ? r4 ? r31 : null : null],
|
|
accessible: true,
|
|
accessibilityLabel: emoji2.name,
|
|
accessibilityState: {
|
|
selected
|
|
},
|
|
children: [<Emoji src={emoji2.id != null ? AvatarUtils.getEmojiURL({
|
|
id: emoji2.id,
|
|
animated: emoji2.animated && !stateFromStores && setting,
|
|
size: 48
|
|
}) : void 0} name={emoji2.name} textEmojiStyle={[styles4.emoji, styles4.emojiText]} fastImageStyle={[styles4.emoji, styles4.emojiImage]} />, <Text variant="text-md/bold" style={[styles4.reactionCountText, selected ? styles4.reactionCountTextSelected : null, r4 ? r10 : null]}>
|
|
{reaction3.burst_count > 0 ? reaction3.burst_count : reaction3.count}
|
|
</Text>]
|
|
};
|
|
let id3 = emoji2.id;
|
|
if (id3 == null) {
|
|
id3 = emoji2.name;
|
|
}
|
|
return <View key={id3} {...props2} />;
|
|
};
|
|
RemoveAllButton = function RemoveAllButton(props) {
|
|
let useReducedMotion, state, setState, sharedValue, sharedValue2, callback2;
|
|
const { reactions, reactionSelectedIndex, channelId: channelId3, messageId: messageId3 } = props;
|
|
useReducedMotion = void 0;
|
|
state = void 0;
|
|
setState = void 0;
|
|
sharedValue = void 0;
|
|
sharedValue2 = void 0;
|
|
callback2 = void 0;
|
|
const styles4 = useStyles();
|
|
const canRemoveAllReactions = useCanRemoveAllReactions(useStateFromStores([ChannelStore], () => ChannelStore.getChannel(channelId3), [channelId3]));
|
|
useReducedMotion = AccessibilityStore.useReducedMotion;
|
|
[state, setState] = useState(true);
|
|
sharedValue = useSharedValue(64);
|
|
const S = function S() {
|
|
return {
|
|
maxWidth: useReducedMotion ? sharedValue.get() : _timing.withTiming(sharedValue.get(), {
|
|
duration: 200
|
|
})
|
|
};
|
|
};
|
|
S.__closure = {
|
|
useReducedMotion,
|
|
buttonWidth: sharedValue,
|
|
withTiming: _timing.withTiming
|
|
};
|
|
S.__workletHash = 16499689496895;
|
|
S.__initData = __initData;
|
|
const animatedStyle = useAnimatedStyle(S);
|
|
sharedValue2 = useSharedValue(0);
|
|
const T = function T() {
|
|
return {
|
|
opacity: useReducedMotion ? sharedValue2.get() : _timing.withTiming(sharedValue2.get(), {
|
|
duration: 125
|
|
}),
|
|
color: "white",
|
|
fontSize: 14,
|
|
marginLeft: 8,
|
|
textAlignVertical: "center"
|
|
};
|
|
};
|
|
T.__closure = {
|
|
useReducedMotion,
|
|
textOpacity: sharedValue2,
|
|
withTiming: _timing.withTiming
|
|
};
|
|
T.__workletHash = 8698187840986;
|
|
T.__initData = __initData2;
|
|
const animatedStyle2 = useAnimatedStyle(T);
|
|
callback2 = useCallback(() => {
|
|
setState(true);
|
|
sharedValue.set(32);
|
|
sharedValue2.set(0);
|
|
}, [sharedValue, sharedValue2]);
|
|
useEffect(() => {
|
|
callback2();
|
|
}, [reactionSelectedIndex, callback2]);
|
|
return canRemoveAllReactions ? <Pressable onPress={() => {
|
|
if (state) {
|
|
setState(false);
|
|
sharedValue.set(getWindowDimensions().width);
|
|
sharedValue2.set(1);
|
|
} else {
|
|
removeEmojiReactions(channelId3, messageId3, reactions[reactionSelectedIndex].emoji);
|
|
callback2();
|
|
}
|
|
}}>
|
|
<ReanimatedRexport.View style={[styles4.removeAllButton, animatedStyle]}>
|
|
<TrashIcon color={Module712.unsafe_rawColors.WHITE} size="sm" />
|
|
<AnimatedComponent style={animatedStyle2} variant="text-sm/semibold" color="text-overlay-light">
|
|
{intl.string(t["zx/e4P"])}
|
|
</AnimatedComponent>
|
|
</ReanimatedRexport.View>
|
|
</Pressable> : null;
|
|
};
|
|
EmojiOptionsButton = function EmojiOptionsButton(props) {
|
|
let reaction2;
|
|
const { reactions: reactions3, reactionSelectedIndex: reactionSelectedIndex3, channelId: channelId4, messageId: messageId4 } = props;
|
|
reaction2 = void 0;
|
|
const styles4 = useStyles();
|
|
const canRemoveReactions = useCanRemoveAllReactions(useStateFromStores([ChannelStore], () => ChannelStore.getChannel(channelId4), [channelId4]));
|
|
reaction2 = reactions3[reactionSelectedIndex3];
|
|
return <Pressable onPress={useCallback(() => {
|
|
ActionSheetActionCreators.openLazy(import("./ReactionEmojiOptionsActionSheet"), "ReactionEmojiOptionsActionSheet", {
|
|
channelId: channelId4,
|
|
messageId: messageId4,
|
|
reaction: reaction2,
|
|
canRemoveReactions
|
|
}, "replaceTopSheet");
|
|
}, [channelId4, messageId4, reaction2, canRemoveReactions])} style={styles4.emojiOptionsButton}>
|
|
<Text variant="text-xs/semibold" color="text-subtle">
|
|
{intl.string(t.pCaYID)}
|
|
</Text>
|
|
<ChevronSmallRightIcon color={Module712.colors.ICON_SUBTLE} size="xs" />
|
|
</Pressable>;
|
|
};
|
|
ReactionTabs = function ReactionTabs(props) {
|
|
const styles4 = useStyles();
|
|
const { reactions: reactions3, reactionSelectedIndex: reactionSelectedIndex2, setReactionSelectedIndex } = props;
|
|
const tidaWebformEnabled = TidaWebformExperiment.useExperiment({
|
|
location: "ReactionTabs"
|
|
}, {
|
|
autoTrackExposure: false
|
|
}).tidaWebformEnabled;
|
|
return <View style={styles4.reactionTab}>
|
|
<TabBar tabs={reactions3.map((item, index) => {
|
|
const props = {
|
|
reaction: item,
|
|
selected: index === reactionSelectedIndex2
|
|
};
|
|
let id3 = item.emoji.id;
|
|
if (id3 == null) {
|
|
id3 = "";
|
|
}
|
|
return <ReactionTab key={`${id3}:${item.emoji.name}`} {...props} />;
|
|
})} tabStyle={styles4.tab} tabStyleActive={styles4.tabActive} tabStyleSelected={styles4.tabSelected} tabIndexSelected={reactionSelectedIndex2} onSelect={(event) => {
|
|
triggerHapticFeedback(HapticFeedbackTypes.IMPACT_LIGHT);
|
|
setReactionSelectedIndex(event);
|
|
}} initialNumTabsToRender={MAX_REACTIONS} />
|
|
<FormDivider outer />
|
|
<View style={styles4.removeButtonContainer}>
|
|
<Text style={styles4.emojiTextIdentifier} variant="eyebrow" color="text-default">
|
|
{getReactionEmojiName(reactions3[reactionSelectedIndex2].emoji)}
|
|
</Text>
|
|
{tidaWebformEnabled ? <EmojiOptionsButton {...props} /> : <RemoveAllButton {...props} />}
|
|
</View>
|
|
</View>;
|
|
};
|
|
Platform;
|
|
AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Text);
|
|
useStyles = createStyles({
|
|
container: {
|
|
flex: 1
|
|
},
|
|
containerEmpty: {
|
|
padding: 32,
|
|
borderTopLeftRadius: Module712.radii.sm,
|
|
borderTopRightRadius: Module712.radii.sm
|
|
},
|
|
listRow: {
|
|
height: 48,
|
|
backgroundColor: Module712.colors.MOBILE_ACTIONSHEET_BACKGROUND
|
|
},
|
|
tabContainer: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
borderRadius: Module712.radii.sm,
|
|
padding: 8,
|
|
marginTop: 8
|
|
},
|
|
tabContainerSelected: {
|
|
backgroundColor: Module712.colors.INTERACTIVE_BACKGROUND_SELECTED
|
|
},
|
|
tab: {
|
|
padding: 0,
|
|
marginHorizontal: 8,
|
|
marginBottom: 8
|
|
},
|
|
tabSelected: {
|
|
borderBottomColor: "transparent"
|
|
},
|
|
tabActive: {
|
|
borderRadius: Module712.radii.sm
|
|
},
|
|
reactionTab: {
|
|
display: "flex",
|
|
flexDirection: "column"
|
|
},
|
|
removeButtonContainer: {
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
justifyContent: "space-between",
|
|
alignItems: "center"
|
|
},
|
|
emojiOptionsButton: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
marginRight: Module712.space.PX_16,
|
|
gap: 2
|
|
},
|
|
removeAllButton: {
|
|
backgroundColor: Module712.colors.BACKGROUND_FEEDBACK_CRITICAL,
|
|
borderRadius: Module712.radii.xxl,
|
|
height: 32,
|
|
overflow: "hidden",
|
|
minWidth: 42,
|
|
marginRight: 20,
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
paddingHorizontal: 12
|
|
},
|
|
reactionCountText: {
|
|
color: Module712.colors.INTERACTIVE_TEXT_DEFAULT
|
|
},
|
|
reactionCountTextSelected: {
|
|
color: Module712.colors.INTERACTIVE_TEXT_ACTIVE
|
|
},
|
|
emoji: {
|
|
marginRight: 8
|
|
},
|
|
emojiText: {
|
|
lineHeight: 24,
|
|
fontSize: 20,
|
|
textAlign: "center",
|
|
color: Module712.colors.INTERACTIVE_TEXT_DEFAULT
|
|
},
|
|
emojiImage: {
|
|
resizeMode: "contain",
|
|
width: 24,
|
|
height: 24
|
|
},
|
|
emojiTextIdentifier: {
|
|
padding: 16
|
|
},
|
|
avatar: {
|
|
marginRight: 10
|
|
},
|
|
buttonRow: {
|
|
flexDirection: "row",
|
|
justifyContent: "flex-end",
|
|
alignItems: "center"
|
|
},
|
|
loadingSpinner: {
|
|
height: 48,
|
|
padding: 6
|
|
}
|
|
});
|
|
__initData = {
|
|
code: "function MessageReactionsContentTsx1(){const{useReducedMotion,buttonWidth,withTiming}=this.__closure;return{maxWidth:useReducedMotion?buttonWidth.get():withTiming(buttonWidth.get(),{duration:200})};}"
|
|
};
|
|
__initData2 = {
|
|
code: "function MessageReactionsContentTsx2(){const{useReducedMotion,textOpacity,withTiming}=this.__closure;return{opacity:useReducedMotion?textOpacity.get():withTiming(textOpacity.get(),{duration:125}),color:'white',fontSize:14,marginLeft:8,textAlignVertical:'center'};}"
|
|
};
|
|
c6232_28 = "MessageReactionsContent_SwipableBounced";
|
|
c6232_29 = Storage.get("MessageReactionsContent_SwipableBounced", false);
|
|
export { useReactors };
|
|
export { useReactorsOnScrollNative };
|
|
export function MessageReactionsEmpty() {
|
|
const styles4 = useStyles();
|
|
return <BottomSheet scrollable startHeight={338 + useSafeAreaInsets_native().bottom}>
|
|
<BottomSheetView style={styles4.containerEmpty}>
|
|
<RefreshEmptyState source={useNoResultsSource()} title={intl.string(t.HmPOrp)} body={intl.string(t["pTJ5J/"])} />
|
|
</BottomSheetView>
|
|
</BottomSheet>;
|
|
}
|
|
export function MessageReactionsContent(props) {
|
|
const { channelId: channelId5, messageId: messageId7, emoji: emoji2, reactions: reactions3 } = props;
|
|
let isSelectedBurst = props.isSelectedBurst;
|
|
const { disableManage = false, disableTabs = false } = props;
|
|
const styles4 = useStyles();
|
|
const reactions2 = reactions3;
|
|
const emoji = emoji2;
|
|
if (isSelectedBurst === void 0) {
|
|
isSelectedBurst = false;
|
|
}
|
|
let c17226_2 = isSelectedBurst;
|
|
const [state, setReactionSelectedIndex2] = useState(() => {
|
|
if (emoji == null) {
|
|
return 0;
|
|
}
|
|
const r7 = reactions2.findIndex((item) => {
|
|
let r17;
|
|
const r12 = emojiEquals(item.emoji, emoji);
|
|
let burst_count = item.burst_count;
|
|
if (burst_count == null) {
|
|
burst_count = 0;
|
|
}
|
|
let r15 = burst_count > 0;
|
|
if (c17226_2) {
|
|
if (r15) {
|
|
r15 = r12;
|
|
}
|
|
r17 = r15;
|
|
} else {
|
|
r17 = r15 ? !r15 : r12;
|
|
}
|
|
return r17;
|
|
});
|
|
return r7 >= 0 ? r7 : 0;
|
|
});
|
|
const reactionSelectedIndex3 = Math.min(state, reactions2.length - 1);
|
|
const reaction3 = reactions2[reactionSelectedIndex3];
|
|
const reactionType3 = reaction3.me_vote != null ? ReactionTypes.VOTE : reaction3.burst_count > 0 ? ReactionTypes.BURST : ReactionTypes.NORMAL;
|
|
let channelId6;
|
|
const reactors4 = useReactors({
|
|
channelId: channelId5,
|
|
messageId: messageId7,
|
|
reaction: reaction3,
|
|
reactionType: reactionType3
|
|
});
|
|
const { reactors: reactors5, reactorsHasMore: reactorsHasMore3 } = reactors4;
|
|
const isActiveChannelOrUnarchivableThread2 = useIsActiveChannelOrUnarchivableThread(useStateFromStores([ChannelStore], () => ChannelStore.getChannel(channelId5), [channelId5]));
|
|
const safeAreaInsets_native = useSafeAreaInsets_native();
|
|
channelId6 = channelId5;
|
|
const r96 = useStateFromStores([PermissionStore], () => PermissionStore.canWithPartialContext(Permissions.MANAGE_MESSAGES, {
|
|
channelId: channelId6
|
|
}), [channelId5]) && !disableManage && isActiveChannelOrUnarchivableThread2;
|
|
let id3 = reaction3.emoji.id;
|
|
if (id3 == null) {
|
|
id3 = reaction3.emoji.name;
|
|
}
|
|
let reactors2, messageId5, channelId7, c17229_3, isActiveChannelOrUnarchivableThread, styles2, analyticsLocations, reactionToProfileEnabled;
|
|
let channelId8, messageId6, c17230_2, reactors3, styles3;
|
|
const props2 = {
|
|
accessibilityLabel: intl.string(t.gHp0C4),
|
|
footerSize: 48,
|
|
insetBottom: safeAreaInsets_native.bottom,
|
|
onScroll: useReactorsOnScrollNative({
|
|
channelId: channelId5,
|
|
messageId: messageId7,
|
|
reactionSelected: reaction3,
|
|
reactors: reactors5,
|
|
reactorsHasMore: reactorsHasMore3,
|
|
reactionType: reactionType3
|
|
}),
|
|
renderFooter: null,
|
|
renderItem: null,
|
|
renderQuickActions: null,
|
|
itemSize: 48,
|
|
sections: null,
|
|
style: null
|
|
};
|
|
const reactors = reactors5;
|
|
const reactorsHasMore2 = reactorsHasMore3;
|
|
const styles = useStyles();
|
|
props2.renderFooter = useCallback(() => reactorsHasMore2 ? <ActivityIndicator style={styles.loadingSpinner} size="large" /> : reactors.length === 0 ? <ActivityIndicator style={styles.loadingSpinner} size="large" /> : null, [reactors, reactorsHasMore2, styles]);
|
|
reactors2 = reactors;
|
|
messageId5 = messageId7;
|
|
channelId7 = channelId5;
|
|
c17229_3 = reaction3;
|
|
isActiveChannelOrUnarchivableThread = r96;
|
|
styles2 = void 0;
|
|
analyticsLocations = void 0;
|
|
reactionToProfileEnabled = void 0;
|
|
styles2 = useStyles();
|
|
analyticsLocations = useAnalyticsLocations().analyticsLocations;
|
|
reactionToProfileEnabled = ReactionToProfileExperiment.useConfig({
|
|
location: "MessageReactionsContent"
|
|
}).reactionToProfileEnabled;
|
|
props2.renderItem = useCallback((a0, a1) => {
|
|
const localUser = reactors2[a1];
|
|
const id2 = localUser.id;
|
|
const r26 = reactors2.length - 1;
|
|
const channel = ChannelStore.getChannel(channelId7);
|
|
const r28 = channel != null ? channel.getGuildId() : null;
|
|
let nick = NicknameUtils.getNickname(r28, channelId7, localUser);
|
|
if (nick == null) {
|
|
nick = UserUtils.getGlobalName(localUser);
|
|
}
|
|
const r24 = r28 != null ? GuildMemberStore.getMember(r28, id2) : null;
|
|
const BURST = c17229_3.burst_count > 0 ? ReactionTypes.BURST : ReactionTypes.NORMAL;
|
|
const avatarSource = localUser.getAvatarSource(r28);
|
|
const props = {
|
|
leading: <Avatar style={styles2.avatar} size={AvatarSizes.SMALL} source={r28 != null ? r24?.avatar != null ? AvatarUtils.getGuildMemberAvatarSource(r24, localUser) : avatarSource : avatarSource} />,
|
|
label: <DiscordTag user={localUser} nick={nick} />,
|
|
trailing: null,
|
|
onPress: null,
|
|
onLongPress: null
|
|
};
|
|
const trailing = isActiveChannelOrUnarchivableThread ? isAndroid() ? <Pressable onPress={() => removeReaction({
|
|
channelId: channelId7,
|
|
messageId: messageId5,
|
|
emoji: c17229_3.emoji,
|
|
location: ReactionLocations.MESSAGE,
|
|
userId: localUser.id,
|
|
options: {
|
|
burst: BURST === ReactionTypes.BURST
|
|
}
|
|
})}>
|
|
<XSmallIcon />
|
|
</Pressable> : null : null;
|
|
const openProfile = function openProfile() {
|
|
showUserProfileActionSheet({
|
|
userId: id2,
|
|
channelId: channelId7,
|
|
messageId: messageId5,
|
|
localUser,
|
|
sourceAnalyticsLocations: analyticsLocations
|
|
});
|
|
};
|
|
props.trailing = trailing;
|
|
props.onPress = reactionToProfileEnabled ? openProfile : void 0;
|
|
props.onLongPress = openProfile;
|
|
return <View style={styles2.listRow}>
|
|
<FormRow {...props} />
|
|
{a1 !== r26 ? <FormDivider /> : null}
|
|
</View>;
|
|
}, [reactors, channelId5, isActiveChannelOrUnarchivableThread, messageId5, reaction3, styles2, analyticsLocations, reactionToProfileEnabled]);
|
|
channelId8 = channelId5;
|
|
messageId6 = messageId5;
|
|
c17230_2 = reaction3;
|
|
reactors3 = reactors;
|
|
styles3 = void 0;
|
|
styles3 = useStyles();
|
|
props2.renderQuickActions = useCallback((a0, a1) => {
|
|
let c26439_0 = reactors3[a1];
|
|
const BURST2 = c17230_2.burst_count > 0 ? ReactionTypes.BURST : ReactionTypes.NORMAL;
|
|
return <View style={styles3.buttonRow}>
|
|
<SlideoutButton title={intl.string(t.N86XcP)} IconComponent={XSmallIcon} color={Module712.unsafe_rawColors.RED_400} onPress={() => removeReaction({
|
|
channelId: channelId8,
|
|
messageId: messageId6,
|
|
emoji: c17230_2.emoji,
|
|
location: ReactionLocations.MESSAGE,
|
|
userId: c26439_0.id,
|
|
options: {
|
|
burst: BURST2 === ReactionTypes.BURST
|
|
}
|
|
})} height={48} />
|
|
</View>;
|
|
}, [reactors, channelId5, messageId5, reaction3, styles3]);
|
|
props2.sections = [reactors.length];
|
|
props2.style = styles4.container;
|
|
const callback3 = useCallback(() => {
|
|
c6232_29 = true;
|
|
Storage.set(c6232_28, true);
|
|
}, []);
|
|
return <BottomSheet scrollable backdropOpacity={BACKDROP_OPACITY} backdropChildren={reactionType3 === ReactionTypes.BURST ? <BurstReactionAnimationPreview emoji={reaction3.emoji} reactionType={reactionType3} messageId={messageId5} channelId={channelId5} /> : null} header={disableTabs !== true ? <ReactionTabs reactions={reactions2} reactionSelectedIndex={reactionSelectedIndex3} setReactionSelectedIndex={setReactionSelectedIndex2} messageId={messageId5} channelId={channelId5} /> : null}>
|
|
{isIOS() && isActiveChannelOrUnarchivableThread ? <SwipeableFastList key={id3} inActionSheet bounceFirstRowOnMount={!c6232_29} onBounceSwipable={callback3} {...props2} /> : <FastList key={id3} inActionSheet {...props2} />}
|
|
</BottomSheet>;
|
|
}
|