// Metro module 10962 (f10963).
import { useMemo, useCallback } from "react";
import { View } from "react-native";
import UserStore from "../../../stores/UserStore";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import { showQuestUnavailableAlert } from "./QuestUtils.native";
import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
import { useNonNullableQuest } from "../hooks/QuestHooks";
import { isCollectibleQuestRewardPremiumExtendable, getQuestPrimaryReward, getDefaultRewardName } from "../utils/QuestRewardUtils";
import { QuestRewardTypes } from "../../../_bundle/Module5990";
import { intl, t } from "../../../intl/index.native";
import { useStateFromStores } from "../../../_bundle/Module589";
import { BottomSheet } from "../../../design/components/Sheet/native/BottomSheet.native";
import { Stack } from "../../../design/components/Stack/native/Stack.native";
import QuestRewardTile from "./QuestRewardTile";
import { Text } from "../../../design/components/Text/native/Text";
let useStyles;
const QuestRewardDetailsBottomSheet = function QuestRewardDetailsBottomSheet(props) {
  const quest = props.quest;
  const styles = useStyles();
  const memo = useMemo(() => isCollectibleQuestRewardPremiumExtendable(quest.config), [quest.config]);
  const memo2 = useMemo(() => {
    const type = getQuestPrimaryReward(quest).type;
    if (QuestRewardTypes.COLLECTIBLE === type) {
      return intl.string(memo ? t["66YyBJ"] : t.ABD2CN);
    }
    if (QuestRewardTypes.FRACTIONAL_PREMIUM === type) {
      return intl.string(t.maMtqM);
    }
    return null;
  }, [quest, memo]);
  const defaultRewardName = getDefaultRewardName(quest.config, useStateFromStores([UserStore], () => UserStore.getCurrentUser()));
  return <BottomSheet startExpanded>
    <Stack direction="vertical" spacing={Module712.space.PX_16} style={styles.wrapper}>
      <Stack align="center" direction="horizontal" spacing={Module712.space.PX_16}>
        <QuestRewardTile quest={quest} height={56} width={56} withAnimation />
        <Stack direction="vertical" spacing={Module712.space.PX_4} style={styles.rewardDetailsCopy}>
          <Text variant="eyebrow" color="text-subtle">
            {intl.string(t["jyYgZ+"])}
          </Text>
          <Text variant="heading-lg/semibold" color="text-strong">{defaultRewardName}</Text>
        </Stack>
      </Stack>
      {memo2 != null && <>
        <View style={styles.separator} />
        <Text variant="text-md/normal" color="text-subtle">{memo2}</Text>
      </>}
    </Stack>
  </BottomSheet>;
};
useStyles = createStyles({
  wrapper: {
    paddingHorizontal: Module712.space.PX_16,
    paddingBottom: Module712.space.PX_8
  },
  rewardDetailsCopy: {
    flexShrink: 1
  },
  separator: {
    height: 1,
    backgroundColor: Module712.colors.BORDER_STRONG
  }
});
export default function QuestRewardDetailsBottomSheetConnected(props) {
  const nonNullableQuest = useNonNullableQuest(props.questId, useCallback(() => {
    showQuestUnavailableAlert();
    ActionSheetActionCreators.hideActionSheet();
  }, []));
  return nonNullableQuest != null ? <QuestRewardDetailsBottomSheet quest={nonNullableQuest} /> : null;
};