// Metro module 7624 (f7625).
import { useMemo } from "react";
import { ActivityIndicator, ScrollView, View } from "react-native";
import { HelpdeskArticles } from "../../../Constants";
import { SafetyHubLinks } from "../../safety_hub/SafetyHubConstants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import { useInitiateAgeVerification } from "../AgeVerificationUtils";
import { AgeVerificationModalEntryPoint, trackAgeVerificationModalClicked, AgeVerificationModalVersion, AgeVerificationModalCta } from "../AgeVerificationAnalyticsUtils";
import { useIsManualAgeVerificationHidden } from "../HideManualAgeVerificationExperiment";
import { intl, t } from "../../../intl/index.native";
import AgeVerificationActionCreators_native from "../AgeVerificationActionCreators.native";
import { isAndroid } from "../../../utils/PlatformUtils";
import { ShieldSpotIllustration } from "../../../design/assets/native";
import { Text } from "../../../design/components/Text/native/Text";
import { TableRowGroup } from "../../../design/components/TableRow/native/TableRowGroup.native";
import { TableRow } from "../../../design/components/TableRow/native/TableRow.native";
import HelpdeskUtils from "../../../utils/HelpdeskUtils";
const useStyles = createStyles({
  loadingIndicator: {
    position: "absolute",
    top: 0,
    left: 0,
    right: 0,
    bottom: 0,
    zIndex: 1
  },
  container: {
    paddingHorizontal: Module712.space.PX_16,
    flex: 1
  },
  headerContainer: {
    paddingVertical: Module712.space.PX_16,
    alignItems: "center",
    gap: Module712.space.PX_8
  },
  centerText: {
    textAlign: "center"
  },
  helpLink: {
    marginTop: Module712.space.PX_8
  }
});
export default function GetStartedScreen(props) {
  const { onClose, modalSessionId } = props;
  const styles = useStyles();
  const initiateAgeVerification2 = useInitiateAgeVerification({
    onComplete: onClose,
    entryPoint: AgeVerificationModalEntryPoint.RETRY_MODAL
  });
  let loading = initiateAgeVerification2.loading;
  const initiateAgeVerification = initiateAgeVerification2.initiateAgeVerification;
  const isManualAgeVerificationHidden = useIsManualAgeVerificationHidden("age_verification_retry_modal");
  const r20 = intl.string(t.JSdbBe);
  const r19 = intl.string(t.JNK1ue);
  const title = intl.string(t.mFvt9M);
  const memo = useMemo(() => {
    const r2 = {
      title,
      description: intl.string(t.ecdUKD),
      onPress: null
    };
    let c26010_0 = async () => {
      trackAgeVerificationModalClicked(modalSessionId, AgeVerificationModalVersion.RETRY, AgeVerificationModalCta.GET_STARTED);
      await initiateAgeVerification();
    };
    r2.onPress = function() {
      return c26010_0.apply(this, arguments);
    };
    const r21 = [r2];
    if (!isManualAgeVerificationHidden) {
      r21.push({
        title: intl.string(t["LZO+Hd"]),
        description: intl.string(t["ty+iWP"]),
        onPress: () => {
          AgeVerificationActionCreators_native.openUrl(SafetyHubLinks.APPEALS_LINK);
          trackAgeVerificationModalClicked(modalSessionId, AgeVerificationModalVersion.RETRY, AgeVerificationModalCta.MANUAL_REVIEW_REQUEST);
        }
      });
    }
    return r21;
  }, [initiateAgeVerification, modalSessionId, isManualAgeVerificationHidden, title]);
  if (loading) {
    loading = <ActivityIndicator style={styles.loadingIndicator} size="small" color={isAndroid() ? Module712.unsafe_rawColors.WHITE : void 0} />;
  }
  return <>
    {loading}
    <ScrollView style={styles.container}>
      <View style={styles.headerContainer}>
        <ShieldSpotIllustration />
        <Text variant="heading-xl/bold" color="mobile-text-heading-primary" style={styles.centerText}>{r20}</Text>
        <Text variant="heading-md/medium" color="text-strong" style={styles.centerText}>{r19}</Text>
      </View>
      <TableRowGroup hasIcons={false}>
        {memo.map((item, index) => <TableRow key={index} arrow label={item.title} subLabel={item.description} onPress={item.onPress} />)}
      </TableRowGroup>
      <Text variant="text-xs/medium" color="text-muted" style={[styles.centerText, styles.helpLink]}>
        {intl.format(t["L+FgkZ"], {
          handleOnHelpUrlHook: () => {
            AgeVerificationActionCreators_native.openUrl(HelpdeskUtils.getArticleURL(HelpdeskArticles.TIGGER_PAWTECT_LEARN_MORE));
            trackAgeVerificationModalClicked(modalSessionId, AgeVerificationModalVersion.RETRY, AgeVerificationModalCta.LEARN_MORE);
          }
        })}
      </Text>
    </ScrollView>
  </>;
};