101 lines
3.8 KiB
TypeScript
101 lines
3.8 KiB
TypeScript
// Metro module 16279 (f16280).
|
|
import { useRef, useEffect } from "react";
|
|
import { View } from "react-native";
|
|
import { AnalyticEvents } from "../../../../Constants";
|
|
import { FamilyCenterAction } from "../../../parent_tools/FamilyCenterConstants";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
|
|
import { useConnectGuardianGate } from "../../../parent_tools/hooks/useConnectGuardianGate";
|
|
import AnalyticsUtils from "../../../../utils/AnalyticsUtils";
|
|
import { ActivityIndicator } from "../../../../design/components/ActivityIndicator/native/ActivityIndicator.native";
|
|
import { Text } from "../../../../design/components/Text/native/Text";
|
|
import { intl, t } from "../../../../intl/index.native";
|
|
import FamilyCenter_messages from "../../../parent_tools/FamilyCenter.messages";
|
|
import { ConnectGuardianCard } from "../../../parent_tools/native/ConnectGuardianCard";
|
|
import { Button } from "../../../../design/components/Button/native/Button.native";
|
|
const useStyles = createStyles({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: Module712.colors.BACKGROUND_BASE_LOW
|
|
},
|
|
centered: {
|
|
flex: 1,
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
paddingHorizontal: Module712.space.PX_16
|
|
},
|
|
header: {
|
|
marginBottom: Module712.space.PX_40
|
|
},
|
|
title: {
|
|
paddingHorizontal: Module712.space.PX_16,
|
|
marginBottom: Module712.space.PX_8,
|
|
textAlign: "center"
|
|
},
|
|
description: {
|
|
paddingHorizontal: Module712.space.PX_16,
|
|
textAlign: "center"
|
|
},
|
|
cardSection: {
|
|
alignItems: "center"
|
|
},
|
|
scanPrompt: {
|
|
paddingHorizontal: Module712.space.PX_16,
|
|
marginBottom: Module712.space.PX_24,
|
|
textAlign: "center"
|
|
},
|
|
grow: {
|
|
flexGrow: 1
|
|
},
|
|
footer: {
|
|
paddingHorizontal: Module712.space.PX_16
|
|
}
|
|
});
|
|
export default function ConnectGuardianModal(props) {
|
|
const route = props.route;
|
|
const onComplete = route.params.onComplete;
|
|
const styles = useStyles();
|
|
const bottom = useSafeAreaInsets_native().bottom;
|
|
const connectGuardianGate = useConnectGuardianGate();
|
|
const ref = useRef(false);
|
|
useEffect(() => {
|
|
if (!(connectGuardianGate.state !== "error" || ref.current)) {
|
|
ref.current = true;
|
|
AnalyticsUtils.track(AnalyticEvents.FAMILY_CENTER_ACTION, {
|
|
action: FamilyCenterAction.NufConsentGateLinkCodeError,
|
|
source: "NUF Connect Guardian"
|
|
});
|
|
if (onComplete != null) {
|
|
onComplete(true);
|
|
}
|
|
}
|
|
}, [connectGuardianGate.state, onComplete]);
|
|
return connectGuardianGate.state !== "gate" ? <View style={[styles.container, styles.centered]}>
|
|
<ActivityIndicator />
|
|
</View> : <View style={styles.container}>
|
|
<View style={styles.header}>
|
|
<Text style={styles.title} variant="heading-xl/bold" color="text-default">
|
|
{intl.string(FamilyCenter_messages.ITlV6p)}
|
|
</Text>
|
|
<Text style={styles.description} variant="text-sm/medium" color="text-muted">
|
|
{intl.format(FamilyCenter_messages.F4GT2S, {
|
|
link: "https://support.discord.com/hc/articles/14155060633623"
|
|
})}
|
|
</Text>
|
|
</View>
|
|
<View style={styles.cardSection}>
|
|
<Text style={styles.scanPrompt} variant="text-md/semibold" color="text-default">
|
|
{intl.string(FamilyCenter_messages.Mi60fm)}
|
|
</Text>
|
|
<ConnectGuardianCard shareActions="compact" linkCode={connectGuardianGate.linkCode} expiresAt={connectGuardianGate.expiresAt} onRefresh={connectGuardianGate.refresh} />
|
|
</View>
|
|
<View style={styles.grow} />
|
|
<View style={[styles.footer, {
|
|
paddingBottom: bottom + Module712.space.PX_16
|
|
}]}>
|
|
<Button variant="primary" size="lg" text={intl.string(t["3PatSz"])} onPress={() => onComplete == null ? void 0 : onComplete(false)} />
|
|
</View>
|
|
</View>;
|
|
};
|