108 lines
4.5 KiB
TypeScript
108 lines
4.5 KiB
TypeScript
// 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>
|
|
</>;
|
|
};
|