Files
discord-decomp/modules/stickers/native/StickerPicker.tsx
T
2026-11-01 12:12:55 +02:00

145 lines
6.5 KiB
TypeScript

// Metro module 9618 (f9619).
import { memo, useState, useCallback, useEffect } from "react";
import { ActivityIndicator, View } from "react-native";
import UserStore from "../../../stores/UserStore";
import StickersStore from "../StickersStore";
import { STICKER_SEARCH_HEADER_HEIGHT } from "../StickersConstants";
import { AnalyticEvents, AnalyticsPages, AnalyticsSections, ChatInputComponentViewedTypes, UpsellTypes } from "../../../Constants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import AnalyticsUtils from "../../../utils/AnalyticsUtils";
import { useFetchStickerPacks } from "../StickersHooks";
import { useStickerCategories } from "./StickersUtils";
import { useStateFromStores } from "../../../_bundle/Module589";
import useAnalyticsLocations, { AnalyticsLocationProvider } from "../../app_analytics/useAnalyticsLocations";
import AnalyticsLocation from "../../app_analytics/AnalyticsLocation";
import useExpressionPickerInsets from "../../expression_picker/native/useExpressionPickerInsets";
import { batchUpdates } from "../../../_bundle/Module705";
import { searchAllStickers } from "../StickersSearchUtils";
import { getStickerSendability, StickerSendability } from "../StickerSendability";
import { isStandardSticker, isGuildSticker } from "../StickersUtils";
import openStickerPackDetailActionSheet, { AnalyticsPopoutType } from "./openStickerPackDetailActionSheet";
import PremiumUpsellUtils from "../../../utils/native/PremiumUpsellUtils";
import TidaWebformExperiment from "../../guild/TidaWebformExperiment";
import { showStickerDetailActionSheet } from "./showStickerDetailActionSheet";
import { SearchField } from "../../../design/components/TextField/native/SearchField.native";
import { intl, t } from "../../../intl/index.native";
import StickerPickerEmptyState from "./StickerPickerEmptyState";
import StickerPickerList from "./StickerPickerList";
import StickerPickerCategories from "./StickerPickerCategories";
const useStyles = createStyles({
container: {
flex: 1
},
header: {
paddingVertical: Module712.space.PX_8
},
loadingIndicator: {
alignItems: "center",
justifyContent: "center",
flex: 1
},
emptyState: {
marginTop: STICKER_SEARCH_HEADER_HEIGHT,
alignItems: "center",
justifyContent: "center",
flex: 1
}
});
const r54 = memo(function StickerPicker(props) {
let setState, analyticsLocations, setState2;
const { bottomSheetRef, bottomSheetIndex, channel, paddingTop, onPressSticker, stickerFormats, inPortalKeyboard } = props;
setState = void 0;
analyticsLocations = void 0;
setState2 = void 0;
const styles = useStyles();
useFetchStickerPacks();
const stickerCategories = useStickerCategories(channel);
const stateFromStores = useStateFromStores([StickersStore], () => StickersStore.hasLoadedStickerPacks);
let categoryIndex;
[categoryIndex, setState] = useState(0);
analyticsLocations = useAnalyticsLocations(AnalyticsLocation.STICKER_PICKER).analyticsLocations;
let searchResults;
[searchResults, setState2] = useState(null);
const expressionPickerInsets = useExpressionPickerInsets({
hasCategories: true
});
const { safeAreaStyle, safeAreaBottomKeyboardAware } = expressionPickerInsets;
const callback4 = useCallback((a0) => {
if (a0 === "") {
batchUpdates(() => {
setState(0);
setState2(null);
});
} else {
setState2(searchAllStickers(a0));
}
}, []);
useEffect(() => {
AnalyticsUtils.track(AnalyticEvents.CHAT_INPUT_COMPONENT_VIEWED, {
type: ChatInputComponentViewedTypes.STICKER,
channel_id: channel.id,
guild_id: channel.guild_id
});
}, [channel.id, channel.guild_id]);
const callback = useCallback((a0) => {
const stickerSendability = getStickerSendability(a0, UserStore.getCurrentUser(), channel);
if (stickerSendability === StickerSendability.SENDABLE) {
onPressSticker(a0);
} else if (stickerSendability === StickerSendability.SENDABLE_WITH_PREMIUM) {
if (isStandardSticker(a0)) {
const stickerPack = StickersStore.getStickerPack(a0.pack_id);
if (stickerPack == null) {
return void 0;
}
openStickerPackDetailActionSheet({
analyticsLocation: {
page: channel.guild_id != null ? AnalyticsPages.GUILD_CHANNEL : AnalyticsPages.DM_CHANNEL
},
analyticsPopoutType: AnalyticsPopoutType.STICKER_PACK_DETAIL,
stickerPack
});
} else if (isGuildSticker(a0)) {
PremiumUpsellUtils.handleShowUpsellAlert({
initialUpsellKey: UpsellTypes.GLOBAL_STICKER,
analyticsLocation: {
page: channel.guild_id != null ? AnalyticsPages.GUILD_CHANNEL : AnalyticsPages.DM_CHANNEL,
section: AnalyticsSections.STICKER_PICKER_UPSELL
},
analyticsLocations
});
}
}
}, [channel, onPressSticker, analyticsLocations]);
const callback3 = useCallback(() => {
AnalyticsUtils.track(AnalyticEvents.CHAT_INPUT_COMPONENT_VIEWED, {
type: ChatInputComponentViewedTypes.STICKER_SEARCH,
channel_id: channel.id,
guild_id: channel.guild_id
});
}, [channel]);
const tidaWebformEnabled = TidaWebformExperiment.useExperiment({
location: "StickerPicker"
}, {
autoTrackExposure: false
}).tidaWebformEnabled;
const callback2 = useCallback((a0) => {
showStickerDetailActionSheet({
renderableSticker: a0,
channel
});
}, [channel]);
return <AnalyticsLocationProvider value={analyticsLocations}>
<View style={styles.container}>
{stickerCategories.length !== 0 ? <View style={styles.header}>
<SearchField size="md" placeholder={intl.string(t.dt5h1C)} onChange={callback4} onFocus={callback3} isRound />
</View> : null}
{stateFromStores ? stickerCategories.length === 0 ? <View style={styles.emptyState}>
<StickerPickerEmptyState />
</View> : <StickerPickerList bottomSheetRef={bottomSheetRef} bottomSheetIndex={bottomSheetIndex} setCategoryIndex={setState} onPressSticker={callback} onLongPressStickerDetail={tidaWebformEnabled ? callback2 : void 0} insetBottom={safeAreaBottomKeyboardAware} insetTop={paddingTop} channel={channel} stickerFormats={stickerFormats} searchResults={searchResults} inPortalKeyboard={inPortalKeyboard} /> : <ActivityIndicator animating size="large" style={styles.loadingIndicator} />}
<StickerPickerCategories categories={stickerCategories} categoryIndex={categoryIndex} style={safeAreaStyle} />
</View>
</AnalyticsLocationProvider>;
});
export default r54;