discord-decomp/modules/autocompleter/native/Autocomplete.tsx

// Metro module 11485 (f11486).
import { useMemo } from "react";
import { View } from "react-native";
import GuildStore from "../../../stores/GuildStore";
import RelationshipStore from "../../../stores/RelationshipStore";
import UserStore from "../../../stores/UserStore";
import { ChannelTypes, Fonts } from "../../../Constants";
import { AUTOCOMPLETE_ROW_HEIGHT } from "../../application_commands/native/ApplicationCommandsConstants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import { FormRow } from "../../../design/void/Form/native/index";
import { useStateFromStores } from "../../../_bundle/Module589";
import UserUtils from "../../../utils/UserUtils";
import { Avatar, AvatarSizes, Icon, LegacyText } from "../../../design/void/native";
import DiscordTag from "../../user_profile/native/DiscordTag";
import { TableRow } from "../../../design/components/TableRow/native/TableRow.native";
import { TableRowTrailingText } from "../../../design/components/TableRow/native/TableRowTrailingText.native";
import { intl, t } from "../../../intl/index.native";
import Module7903 from "../../../_bundle/Module7903";
import { getChannelIconWithGuild } from "../../../utils/native/ChannelUtils";
import { computeChannelName } from "../../channel/useChannelName";
import { Text } from "../../../design/components/Text/native/Text";
import FastImage from "../../../components_native/common/FastImage";
import ChannelAutocompleteEmojiUpsell from "../../channel_text_area/native/ChannelAutocompleteEmojiUpsell";
import { useShouldAnimateSticker } from "../../stickers/StickersHooks";
import { PressableOpacity } from "../../../design/void/Pressables/native/Pressables";
import Sticker2 from "../../stickers/native/Sticker";
import Module12 from "../../../_bundle/Module12";
import getGameMediaRefURL from "../../games/getGameMediaRefURL";
import { isNullOrEmpty } from "../../../utils/StringUtils";
import { UnknownGameIcon } from "../../../design/components/Icon/native/redesign/generated/UnknownGameIcon";
let useStyles;
const AutocompleteLabel = function AutocompleteLabel(props) {
  return <FormRow.Label style={useStyles().leading} text={props.text} />;
};
useStyles = createStyles({
  row: {
    height: AUTOCOMPLETE_ROW_HEIGHT,
    paddingVertical: 0,
    backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGH
  },
  leading: {
    fontSize: 16,
    color: Module712.colors.INTERACTIVE_TEXT_ACTIVE,
    fontFamily: Fonts.PRIMARY_SEMIBOLD
  },
  trailing: {
    fontSize: 14,
    color: Module712.colors.TEXT_MUTED
  },
  username: {
    color: Module712.unsafe_rawColors.PRIMARY_400
  },
  emoji: {
    width: 32,
    height: 32
  },
  emojiImage: {
    resizeMode: "contain"
  },
  emojiText: {
    lineHeight: 32,
    fontSize: 27,
    textAlign: "center",
    color: Module712.colors.TEXT_DEFAULT
  },
  stickerContainer: {
    width: 56,
    height: 56,
    marginHorizontal: 4,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: Module712.colors.BACKGROUND_MOD_NORMAL,
    borderRadius: Module712.radii.sm
  },
  commandChoiceLoadingContainer: {
    flex: 1,
    justifyContent: "center"
  },
  commandChoiceLoadingItem: {
    backgroundColor: Module712.colors.BACKGROUND_MOD_MUTED,
    height: 16,
    borderRadius: Module712.radii.lg,
    alignSelf: "flex-start"
  },
  autocompleteIcon: {
    opacity: 0.6
  },
  gameIcon: {
    width: 32,
    height: 32,
    borderRadius: Module712.radii.sm
  },
  labelRow: {
    flexDirection: "row",
    alignItems: "center",
    gap: Module712.space.PX_8
  }
});
const r101 = {
  User: function User(props) {
    const user = props.user;
    let nick = props.nick;
    const { status, guildId, onPress } = props;
    const styles = useStyles();
    const stateFromStores = useStateFromStores([RelationshipStore], () => guildId == null ? RelationshipStore.getNickname(user.id) : null);
    if (nick == null) {
      nick = stateFromStores;
    }
    if (nick == null) {
      nick = UserUtils.getName(user);
    }
    return <FormRow DEPRECATED_style={styles.row} onPress={onPress} accessibilityRole="menuitem" label={<AutocompleteLabel text={nick} />} leading={<Avatar status={status} user={user} size={AvatarSizes.SMALL} guildId={guildId} autoStatusCutout />} trailing={<DiscordTag user={user} usernameStyle={[styles.trailing, styles.username]} discriminatorStyle={styles.trailing} />} />;
  },
  Global: function Global(props) {
    const { text, description, badge, onPress } = props;
    const styles = useStyles();
    return <TableRow onPress={onPress} accessibilityRole="menuitem" label={badge != null ? <View style={styles.labelRow}>
      <AutocompleteLabel text={text} />
      {badge}
    </View> : <AutocompleteLabel text={text} />} trailing={<TableRowTrailingText text={description} />} />;
  },
  Role: function Role(props) {
    const { onPress, showDescription, name, colorString } = props;
    return <TableRow onPress={onPress} accessibilityRole="menuitem" label={<FormRow.Label style={[useStyles().leading, colorString != null ? {
      color: colorString
    } : void 0]} text={`@${name}`} />} trailing={<TableRowTrailingText text={showDescription ? intl.string(t.HrUmDH) : ""} />} />;
  },
  Channel: function Channel(props) {
    const { channel, category, onPress } = props;
    const styles = useStyles();
    const guild = GuildStore.getGuild(channel.getGuildId());
    return <FormRow onPress={onPress} accessibilityRole="menuitem" leading={<Icon source={channel.type === ChannelTypes.GUILD_CATEGORY ? Module7903 : getChannelIconWithGuild(channel, guild)} style={styles.autocompleteIcon} />} label={<AutocompleteLabel text={computeChannelName(channel, UserStore, RelationshipStore)} />} trailing={<Text style={styles.trailing} variant="text-sm/medium" color="text-muted">
      {category != null && category.name}
    </Text>} />;
  },
  Emoji: function Emoji(props) {
    const { name, url, surrogates, onPress } = props;
    const styles = useStyles();
    return <FormRow onPress={onPress} accessibilityRole="menuitem" leading={url !== "" ? <FastImage style={[styles.emoji, styles.emojiImage]} source={{
      uri: url
    }} /> : <LegacyText style={[styles.emoji, styles.emojiText]} allowFontScaling={false}>{surrogates}</LegacyText>} label={<AutocompleteLabel text={`:${name}:`} />} />;
  },
  EmojiPremiumUpsell: function EmojiPremiumUpsell(props) {
    return <FormRow onPress={props.onPress} accessibilityRole="menuitem" label={<ChannelAutocompleteEmojiUpsell results={props.results} />} />;
  },
  Choice: function Choice(props) {
    return <FormRow onPress={props.onPress} accessibilityRole="menuitem" label={<AutocompleteLabel text={props.choice.displayName} />} />;
  },
  ChoiceLoading: function ChoiceLoading() {
    const styles = useStyles();
    return <FormRow DEPRECATED_style={styles.row} leading={<View style={styles.commandChoiceLoadingContainer}>
      <View style={[styles.commandChoiceLoadingItem, {
        width: useMemo(() => Module12.random(100, 300), [])
      }]} />
    </View>} />;
  },
  Sticker: function Sticker(props) {
    const { sticker, onPress, onLongPress, isInteracting } = props;
    return <PressableOpacity accessibilityRole="menuitem" style={useStyles().stickerContainer} onPress={onPress} onLongPress={onLongPress} pointerEvents="box-only">
      <Sticker2 sticker={sticker} size={40} animated={useShouldAnimateSticker(isInteracting)} />
    </PressableOpacity>;
  },
  Label: function Label(props) {
    return <FormRow label={<AutocompleteLabel text={props.label} />} />;
  },
  Game: function Game(props) {
    const { game, onPress } = props;
    const styles = useStyles();
    const gameMediaRefURL = getGameMediaRefURL(game.id, game.icon, {
      size: 32
    });
    return <FormRow onPress={onPress} accessibilityRole="menuitem" leading={isNullOrEmpty(gameMediaRefURL) ? <UnknownGameIcon size="sm" style={styles.gameIcon} /> : <FastImage style={styles.gameIcon} source={{
      uri: gameMediaRefURL
    }} />} label={<AutocompleteLabel text={game.name} />} />;
  }
};
export default r101;
export const AUTOCOMPLETE_STICKER_NODE_SIZE = 56;
export const AUTOCOMPLETE_STICKER_NODE_MARGIN = 4;