// Metro module 9640 (f9641).
import * as Module19 from "react";
import { useMemo, useEffect, useCallback, useState, useRef } from "react";
import { ActivityIndicator, View, Pressable } from "react-native";
import GuildStore from "../../../stores/GuildStore";
import UserStore from "../../../stores/UserStore";
import StickersStore from "../StickersStore";
import { PADDING_HORIZONTAL, MIN_MARGIN, STICKER_SIZE } from "./StickerPickerConstants";
import { AnalyticsPages, AnalyticsSections, AnalyticEvents, UserSettingsSections, GuildFeatures } from "../../../Constants";
import { ACTION_SHEET_MAX_WIDTH } from "../../action_sheet/native/ActionSheetConstants";
import { jsx } from "react/jsx-runtime";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import { isAndroid } from "../../../utils/PlatformUtils";
import Module712 from "../../../_bundle/Module712";
import { useFetchStickerPack, useFavoriteStickerIds, useStickerForRenderableSticker } from "../StickersHooks";
import { StarIcon } from "../../../design/components/Icon/native/redesign/generated/StarIcon";
import { StarOutlineIcon } from "../../../design/components/Icon/native/redesign/generated/StarOutlineIcon";
import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
import { Text } from "../../../design/components/Text/native/Text";
import { intl, t } from "../../../intl/index.native";
import { unfavoriteSticker, favoriteSticker } from "../StickersActionCreators";
import ToastActionCreators from "../../toast/native/ToastActionCreators";
import { useStateFromStores } from "../../../_bundle/Module589";
import useWindowDimensions_native from "../../screen/useWindowDimensions.native";
import AnalyticsUtils from "../../../utils/AnalyticsUtils";
import StickerPickerListRow from "./StickerPickerListRow";
import { Button } from "../../../design/components/Button/native/Button.native";
import { hideStickerDetailActionSheet } from "./showStickerDetailActionSheet";
import { openStickerPickerToPackId } from "./StickersUtils";
import openStickerPackDetailActionSheet, { AnalyticsPopoutType } from "./openStickerPackDetailActionSheet";
import PremiumUtils from "../../../utils/PremiumUtils";
import TidaWebformExperiment from "../../guild/TidaWebformExperiment";
import { DeveloperMode } from "../../user_settings/UserSettings";
import { getStickerAssetUrl, isStandardSticker, isGuildSticker } from "../StickersUtils";
import { collectChannelAnalyticsMetadata } from "../../app_analytics/AppAnalyticsUtils";
import GuildActionCreators from "../../../actions/GuildActionCreators";
import getStickerDiscoverableGuild from "../../messages/getStickerDiscoverableGuild";
import { openUserSettings } from "../../user_settings/core/native/openUserSettings";
import Sticker from "./Sticker";
import { MoreHorizontalIcon } from "../../../design/components/Icon/native/redesign/generated/MoreHorizontalIcon";
import NitroUpsellButton from "../../premium/components/native/NitroUpsellButton";
import openStickersPremiumUpsellAlert from "./premium/openStickersPremiumUpsellAlert";
import { FormDivider } from "../../../design/void/Form/native/index";
import ExpressionGuildDetails from "../../messages/native/emoji/ExpressionGuildDetails";
import { BottomSheet } from "../../../design/components/Sheet/native/BottomSheet.native";
import { HermesBuiltin } from "../../../_hermes/prelude";
let UnavailableStickerDetail, useStyles, GuildStickerDetail;
let env6375 = {};
const StandardStickerDetail = function StandardStickerDetail(props) {
  let r125;
  let env17365 = {
    $parent: env6375
  };
  const { sticker: sticker2, channel: channel3 } = props;
  env17365[0] = channel3;
  env17365[1] = props.chatInputRef;
  env17365[2] = void 0;
  env17365[3] = void 0;
  env17365[4] = void 0;
  env17365[5] = void 0;
  const styles = useStyles();
  const pack_id = sticker2.pack_id;
  env17365[2] = pack_id;
  const name = sticker2.name;
  const stateFromStores2 = useStateFromStores([StickersStore], () => StickersStore.getStickerPack(env17365[2]));
  env17365[3] = stateFromStores2;
  const stateFromStores3 = useStateFromStores([StickersStore], () => StickersStore.isPremiumPack(env17365[2]));
  env17365[4] = stateFromStores3;
  useFetchStickerPack(pack_id);
  const containerWidth = useWindowDimensions_native().width - 2 * PADDING_HORIZONTAL;
  const rowSize = Math.floor(Math.min(ACTION_SHEET_MAX_WIDTH, containerWidth - MIN_MARGIN) / (STICKER_SIZE + MIN_MARGIN));
  const memo3 = useMemo(() => ({
    page: env17365[0].guild_id != null ? AnalyticsPages.GUILD_CHANNEL : AnalyticsPages.DM_CHANNEL,
    section: AnalyticsSections.STICKER_POPOUT
  }), [channel3.guild_id]);
  env17365[5] = memo3;
  useEffect(() => {
    const r5 = env17365[3];
    if (r5 != null) {
      AnalyticsUtils.track(AnalyticEvents.OPEN_POPOUT, {
        location: env17365[5],
        type: "Sticker Upsell Sheet",
        sticker_pack_id: r5.id
      });
    }
  }, [memo3, stateFromStores2]);
  if (stateFromStores2 == null) {
    r125 = (0, jsx)(ActivityIndicator, {
      size: "large"
    });
  } else {
    const stateFromStores = stateFromStores2;
    r125 = <>
      <Text variant="heading-md/extrabold" color="mobile-text-heading-primary">{name}</Text>
      <Text style={styles.description} variant="text-sm/medium">
        {stateFromStores3 ? intl.format(t.auckXz, {
          stickerPackName: stateFromStores.name
        }) : intl.format(t.OzB6e3, {
          stickerPackName: stateFromStores.name
        })}
      </Text>
      <StickerPickerListRow containerWidth={containerWidth} stickers={stateFromStores.stickers.slice(0, rowSize)} rowSize={rowSize} />
      {stateFromStores3 ? <View style={{
        height: Module712.space.PX_16
      }} /> : null}
      {stateFromStores3 && <Button variant="secondary" text={intl.string(t.GPy3Ar)} onPress={() => {
        hideStickerDetailActionSheet();
        if (stateFromStores != null && env17365[4]) {
          const r15 = env17365[1];
          if (r15 != null) {
            openStickerPickerToPackId(r15, env17365[2]);
          } else {
            openStickerPackDetailActionSheet({
              analyticsLocation: env17365[5],
              analyticsPopoutType: AnalyticsPopoutType.STICKER_PACK_UPSELL,
              stickerPack: stateFromStores
            });
          }
        } else {
          openStickerPackDetailActionSheet({
            analyticsLocation: env17365[5],
            analyticsPopoutType: AnalyticsPopoutType.STICKER_PACK_UPSELL,
            stickerPack: stateFromStores
          });
        }
      }} />}
    </>;
  }
  return r125;
};
UnavailableStickerDetail = function UnavailableStickerDetail(props) {
  let stickerAssetUrl;
  const { renderableSticker, channel } = props;
  stickerAssetUrl = void 0;
  const styles = useStyles();
  const canUseCustomStickersEverywhere = PremiumUtils.canUseCustomStickersEverywhere(UserStore.getCurrentUser());
  const memo = useMemo(() => ({
    page: channel.guild_id != null ? AnalyticsPages.GUILD_CHANNEL : AnalyticsPages.DM_CHANNEL,
    section: AnalyticsSections.STICKER_POPOUT
  }), [channel.guild_id]);
  let tidaWebformEnabled = TidaWebformExperiment.useExperiment({
    location: "StickerDetailActionSheet"
  }, {
    autoTrackExposure: false
  }).tidaWebformEnabled;
  const setting = DeveloperMode.useSetting();
  if (tidaWebformEnabled) {
    tidaWebformEnabled = setting;
  }
  stickerAssetUrl = getStickerAssetUrl(renderableSticker);
  const callback2 = useCallback(() => {
    if (stickerAssetUrl != null) {
      ActionSheetActionCreators.openLazy(import("./StickerOptionsActionSheet"), "StickerOptionsActionSheet", {
        stickerUrl: stickerAssetUrl
      }, "stack");
    }
  }, [stickerAssetUrl]);
  const r59 = [<Sticker sticker={renderableSticker} size={48} />, <View style={styles.guildEmojiDescription}>
    <Text variant="heading-md/extrabold" color="mobile-text-heading-primary">{renderableSticker.name}</Text>
    <Text style={styles.description} variant="text-sm/medium">
      {canUseCustomStickersEverywhere ? intl.string(t.vZaScH) : intl.format(t.hGWuxU, {
        openPremiumSettings: () => {
          ActionSheetActionCreators.hideActionSheet();
          AnalyticsUtils.track(AnalyticEvents.PREMIUM_PROMOTION_OPENED, {
            location_page: memo.page,
            location_section: memo.section
          });
          openUserSettings({
            screen: UserSettingsSections.PREMIUM,
            params: {
              analyticsLocation: memo
            }
          });
        }
      })}
    </Text>
  </View>, ,];
  if (tidaWebformEnabled) {
    tidaWebformEnabled = stickerAssetUrl != null;
  }
  if (tidaWebformEnabled) {
    tidaWebformEnabled = <Pressable accessibilityLabel={intl.string(t.PdRCRg)} style={styles.moreMenuIcon} onPress={callback2}>
      <MoreHorizontalIcon color={Module712.colors.INTERACTIVE_TEXT_DEFAULT} />
    </Pressable>;
  }
  r59[2] = tidaWebformEnabled;
  return <View style={styles.guildEmojiTopContainer}>{r59}</View>;
};
useStyles = createStyles({
  content: {
    padding: 16,
    paddingBottom: isAndroid() ? 16 : 0
  },
  description: {
    lineHeight: 18,
    marginTop: 4
  },
  guildEmojiTopContainer: {
    flexDirection: "row",
    alignItems: "center"
  },
  buttonContainer: {
    marginTop: Module712.space.PX_12
  },
  guildEmojiDescription: {
    paddingLeft: 16,
    flex: 1
  },
  divider: {
    marginLeft: 0,
    marginTop: Module712.space.PX_16,
    marginBottom: Module712.space.PX_16,
    backgroundColor: Module712.colors.BORDER_SUBTLE
  },
  moreMenuIcon: {
    height: 32,
    width: 32,
    justifyContent: "center",
    alignItems: "center"
  },
  favoriteContainer: {
    paddingTop: Module712.space.PX_4
  },
  starIcon: {
    height: 32,
    width: 32
  },
  starIconSelected: {
    tintColor: Module712.colors.ICON_FEEDBACK_WARNING
  },
  starIconUnselected: {
    tintColor: Module712.colors.INTERACTIVE_TEXT_DEFAULT
  }
});
GuildStickerDetail = (props) => {
  let r3, r33, r125, popoutType;
  let state2, setState2, stickerAssetUrl2, memo2, current, ref;
  const { sticker, channel: channel2 } = props;
  state2 = void 0;
  setState2 = void 0;
  stickerAssetUrl2 = void 0;
  memo2 = void 0;
  current = void 0;
  ref = void 0;
  const r19 = useStyles();
  let [guild, setState] = useState(null);
  const state = guild;
  const stateFromStores2 = useStateFromStores([GuildStore], () => GuildStore.getGuild(sticker.guild_id));
  const hasJoinedGuild = stateFromStores2 != null;
  const r44 = stateFromStores2 == null || stateFromStores2.features.has(GuildFeatures.DISCOVERABLE);
  [state2, setState2] = useState(!r44);
  const canUseCustomStickersEverywhere = PremiumUtils.canUseCustomStickersEverywhere(UserStore.getCurrentUser());
  let tidaWebformEnabled = TidaWebformExperiment.useExperiment({
    location: "StickerDetailActionSheet"
  }, {
    autoTrackExposure: false
  }).tidaWebformEnabled;
  const setting = DeveloperMode.useSetting();
  const id = sticker.id;
  const r73 = useStyles();
  let c17369_1 = r73;
  const r78 = useFavoriteStickerIds().includes(id);
  let c17369_2 = r78;
  const callback = useCallback((a0) => {
    let style;
    const r1 = {};
    HermesBuiltin.copyDataProperties(r1, c17369_1.starIcon);
    if (a0) {
      HermesBuiltin.copyDataProperties(r1, c17369_1.starIconSelected);
      style = r1;
    } else {
      HermesBuiltin.copyDataProperties(r1, c17369_1.starIconUnselected);
      style = r1;
    }
    return a0 ? <StarIcon style={style} /> : <StarOutlineIcon style={style} />;
  }, [r73]);
  const callback3 = useCallback(() => {
    const content = function content() {
      return <Text style={{
        marginLeft: 8,
        marginTop: 2
      }} variant="text-md/bold">
        {c17369_2 ? intl.string(t.in1rga) : intl.string(t.mE2e8A)}
      </Text>;
    };
    ActionSheetActionCreators.hideActionSheet();
    if (c17369_2) {
      unfavoriteSticker(id);
      ToastActionCreators.open({
        key: "STICKER_UNFAVORITED",
        icon: () => callback(false),
        content
      });
    } else {
      favoriteSticker(id);
      ToastActionCreators.open({
        key: "STICKER_FAVORITED",
        icon: () => callback(true),
        content
      });
    }
  }, [r78, id, callback]);
  if (tidaWebformEnabled) {
    tidaWebformEnabled = setting;
  }
  stickerAssetUrl2 = getStickerAssetUrl(sticker);
  const callback2 = useCallback(() => {
    if (stickerAssetUrl2 != null) {
      ActionSheetActionCreators.openLazy(import("./StickerOptionsActionSheet"), "StickerOptionsActionSheet", {
        stickerUrl: stickerAssetUrl2
      }, "stack");
    }
  }, [stickerAssetUrl2]);
  memo2 = useMemo(() => ({
    page: channel2.guild_id != null ? AnalyticsPages.GUILD_CHANNEL : AnalyticsPages.DM_CHANNEL,
    section: AnalyticsSections.STICKER_POPOUT
  }), [channel2.guild_id]);
  const current2 = useRef({
    guild_id: channel2.getGuildId(),
    ...collectChannelAnalyticsMetadata(channel2)
  }).current;
  useEffect(() => {
    let _fetchDiscoverableGuild2 = function _fetchDiscoverableGuild() {
      const r9 = async () => {
        let c31508_1;
        c31508_1 = void 0;
        let c31989_0 = await getStickerDiscoverableGuild(sticker.id);
        (0, setState)(c31989_0);
        (0, setState2)(true);
      };
      _fetchDiscoverableGuild2 = r9;
      return r9.apply(this, arguments);
    };
    if (!state2) {
      (function fetchDiscoverableGuild() {
        return _fetchDiscoverableGuild2.apply(this, arguments);
      })();
    }
  }, [sticker.id, state2]);
  const r115 = sticker.guild_id === channel2.getGuildId();
  const r6 = state != null;
  if (canUseCustomStickersEverywhere) {
    const r143 = hasJoinedGuild ? r115 ? intl.string(t.fZ0DiG) : intl.string(t["1f6D9m"]) : r6 ? intl.string(t.yHmoR9) : intl.string(t.vZaScH);
    r125 = false;
    popoutType = "Custom Sticker Popout";
    r33 = r143;
    r3 = false;
  } else if (hasJoinedGuild) {
    if (r115) {
      r33 = intl.string(t.jNphpt);
      r125 = true;
      popoutType = "Custom Sticker Popout (Upsell)";
      r3 = true;
    } else {
      r33 = intl.string(t.lyD5ZW);
      r125 = true;
      popoutType = "Custom Sticker Popout (Upsell)";
      r3 = true;
    }
  } else if (r6) {
    r33 = intl.string(t.IuXYch);
    r125 = true;
    popoutType = "Custom Sticker Popout (Upsell)";
    r3 = true;
  } else {
    r33 = intl.format(t.hGWuxU, {
      openPremiumSettings: () => {
        ActionSheetActionCreators.hideActionSheet();
        AnalyticsUtils.track(AnalyticEvents.PREMIUM_PROMOTION_OPENED, {
          location_page: memo2.page,
          location_section: memo2.section
        });
        openUserSettings({
          screen: UserSettingsSections.PREMIUM,
          params: {
            analyticsLocation: memo2
          }
        });
      }
    });
    r125 = false;
    popoutType = "Custom Sticker Popout (Soft Upsell)";
    r3 = false;
  }
  const showingJoinGuildCta = (r3 ? !r3 : !hasJoinedGuild) && r6;
  current = {
    popoutAnalyticsConfig: current2,
    popoutType
  };
  ref = useRef(current);
  useEffect(() => {
    ref.current = current;
  });
  useEffect(() => {
    const current2 = ref.current;
    const { popoutAnalyticsConfig, popoutType } = current2;
    if (state2) {
      AnalyticsUtils.track(AnalyticEvents.OPEN_POPOUT, {
        type: popoutType,
        ...popoutAnalyticsConfig
      });
    }
  }, [state2]);
  let r159 = null;
  if (state2) {
    const r208 = [<View style={r19.guildEmojiTopContainer}>
      <Sticker sticker={sticker} size={48} />
      <View style={r19.guildEmojiDescription}>
        <Text variant="heading-md/extrabold" color="mobile-text-heading-primary">{sticker.name}</Text>
        <Text style={r19.description} variant="text-sm/medium">{r33}</Text>
      </View>
      {(tidaWebformEnabled ? stickerAssetUrl2 != null : tidaWebformEnabled) && <Pressable accessibilityLabel={intl.string(t.PdRCRg)} style={r19.moreMenuIcon} onPress={callback2}>
        <MoreHorizontalIcon color={Module712.colors.INTERACTIVE_TEXT_DEFAULT} />
      </Pressable>}
    </View>, , , , ,];
    if (r125) {
      r125 = <View style={r19.buttonContainer}>
        <NitroUpsellButton text={intl.string(t["gl/XHJ"])} onPress={() => openStickersPremiumUpsellAlert(memo2)} />
        <View style={{
          height: Module712.space.PX_16
        }} />
      </View>;
    }
    r208[1] = r125;
    r208[2] = showingJoinGuildCta && <View style={r19.buttonContainer}>
      <Button text={intl.string(t.riu2R5)} onPress={() => {
        if (state != null) {
          const id2 = state.id;
          GuildActionCreators.joinGuild(id2).then(() => {
            GuildActionCreators.transitionToGuildSync(id2);
          });
        }
      }} />
      <View style={{
        height: Module712.space.PX_16
      }} />
    </View>;
    let r259 = stateFromStores2 != null || state != null;
    if (r259) {
      const r266 = [<FormDivider style={r19.divider} />, ,];
      if (state == null) {
        guild = stateFromStores2;
      }
      r266[1] = <ExpressionGuildDetails guild={guild} showingJoinGuildCta={showingJoinGuildCta} hasJoinedGuild={hasJoinedGuild} title={hasJoinedGuild ? intl.string(t.kx6pEG) : intl.string(t.pDE7Gb)} />;
      r259 = <>{r266}</>;
    }
    r208[3] = r259;
    if (tidaWebformEnabled) {
      tidaWebformEnabled = hasJoinedGuild;
    }
    if (tidaWebformEnabled) {
      tidaWebformEnabled = <>
        {[<FormDivider style={r19.divider} />, <View style={r19.favoriteContainer}>
          <Button text={r78 ? intl.string(t.XhzKyF) : intl.string(t.kWmiPW)} variant={r78 ? "tertiary" : "primary"} size="md" onPress={callback3} />
        </View>]}
      </>;
    }
    r208[4] = tidaWebformEnabled;
    r159 = <>{r208}</>;
  }
  return r159;
};
const r105 = Module19.memo(function StickerDetailActionSheet(props) {
  let r26;
  const { renderableSticker, channel: channel3, chatInputRef } = props;
  const styles = useStyles();
  const [sticker2, r8] = useStickerForRenderableSticker(renderableSticker, true);
  let r24 = <ActivityIndicator size="large" />;
  if (sticker2 == null && r8) {
    r26 = <UnavailableStickerDetail renderableSticker={renderableSticker} channel={channel3} />;
  } else {
    r26 = r24;
    if (sticker2 != null) {
      if (isStandardSticker(sticker2)) {
        r24 = <StandardStickerDetail sticker={sticker2} channel={channel3} chatInputRef={chatInputRef} />;
      } else if (isGuildSticker(sticker2)) {
        r24 = <GuildStickerDetail sticker={sticker2} channel={channel3} />;
      }
      r26 = r24;
    }
  }
  return <BottomSheet startExpanded>
    <View style={styles.content}>{r26}</View>
  </BottomSheet>;
});
export default r105;