diff options
Diffstat (limited to 'src/components/ageAssurance/AgeAssuranceDismissibleHeaderButton.tsx')
-rw-r--r-- | src/components/ageAssurance/AgeAssuranceDismissibleHeaderButton.tsx | 95 |
1 files changed, 0 insertions, 95 deletions
diff --git a/src/components/ageAssurance/AgeAssuranceDismissibleHeaderButton.tsx b/src/components/ageAssurance/AgeAssuranceDismissibleHeaderButton.tsx deleted file mode 100644 index b6505fb0e..000000000 --- a/src/components/ageAssurance/AgeAssuranceDismissibleHeaderButton.tsx +++ /dev/null @@ -1,95 +0,0 @@ -import {useMemo} from 'react' -import {View} from 'react-native' -import {msg, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' - -import {useAgeAssurance} from '#/state/ageAssurance/useAgeAssurance' -import {Nux, useNux, useSaveNux} from '#/state/queries/nuxs' -import {atoms as a, select, useTheme} from '#/alf' -import {ShieldCheck_Stroke2_Corner0_Rounded as Shield} from '#/components/icons/Shield' -import {Link} from '#/components/Link' -import {Text} from '#/components/Typography' - -export function useInternalState() { - const {isReady, isDeclaredUnderage, isAgeRestricted, lastInitiatedAt} = - useAgeAssurance() - const {nux} = useNux(Nux.AgeAssuranceDismissibleHeaderButton) - const {mutate: save, variables} = useSaveNux() - const hidden = !!variables - - const visible = useMemo(() => { - if (!isReady) return false - if (isDeclaredUnderage) return false - if (!isAgeRestricted) return false - if (lastInitiatedAt) return false - if (hidden) return false - if (nux && nux.completed) return false - return true - }, [ - isReady, - isDeclaredUnderage, - isAgeRestricted, - lastInitiatedAt, - hidden, - nux, - ]) - - const close = () => { - save({ - id: Nux.AgeAssuranceDismissibleHeaderButton, - completed: true, - data: undefined, - }) - } - - return {visible, close} -} - -export function AgeAssuranceDismissibleHeaderButton() { - const t = useTheme() - const {_} = useLingui() - const {visible, close} = useInternalState() - - if (!visible) return null - - return ( - <Link - label={_(msg`Learn more about age assurance`)} - to="/settings/account" - onPress={close}> - <View - style={[ - a.flex_row, - a.align_center, - a.gap_xs, - a.px_sm, - a.pr_sm, - a.rounded_full, - { - paddingVertical: 6, - backgroundColor: select(t.name, { - light: t.palette.primary_100, - dark: t.palette.primary_100, - dim: t.palette.primary_100, - }), - }, - ]}> - <Shield size="sm" /> - <Text - style={[ - a.font_bold, - a.leading_snug, - { - color: select(t.name, { - light: t.palette.primary_800, - dark: t.palette.primary_800, - dim: t.palette.primary_800, - }), - }, - ]}> - <Trans>Age Assurance</Trans> - </Text> - </View> - </Link> - ) -} |