diff --git a/src/components/ageAssurance/AgeAssuranceAccountCard.tsx b/src/components/ageAssurance/AgeAssuranceAccountCard.tsx index e3f0844a85..ebd1e8199a 100644 --- a/src/components/ageAssurance/AgeAssuranceAccountCard.tsx +++ b/src/components/ageAssurance/AgeAssuranceAccountCard.tsx @@ -38,11 +38,11 @@ function Inner({style}: ViewStyleProp & {}) { const {gtPhone} = useBreakpoints() const copy = useAgeAssuranceCopy() - const {assurance} = useAgeAssurance() - const isBlocked = assurance.status === 'blocked' - const hasInitiated = !!assurance.lastInitiatedAt - const timeAgo = assurance.lastInitiatedAt - ? getTimeAgo(assurance.lastInitiatedAt, new Date()) + const {status, lastInitiatedAt} = useAgeAssurance() + const isBlocked = status === 'blocked' + const hasInitiated = !!lastInitiatedAt + const timeAgo = lastInitiatedAt + ? getTimeAgo(lastInitiatedAt, new Date()) : null return ( @@ -96,10 +96,10 @@ function Inner({style}: ViewStyleProp & {}) { a.align_center, gtPhone ? [a.flex_row, a.gap_xl] : [a.gap_md], ]}> - {assurance.lastInitiatedAt ? ( + {hasInitiated ? ( diff --git a/src/components/ageAssurance/AgeAssuranceDismissableNotice.tsx b/src/components/ageAssurance/AgeAssuranceDismissableNotice.tsx index dc7e2a6ec5..51382cebad 100644 --- a/src/components/ageAssurance/AgeAssuranceDismissableNotice.tsx +++ b/src/components/ageAssurance/AgeAssuranceDismissableNotice.tsx @@ -12,7 +12,7 @@ import {TimesLarge_Stroke2_Corner0_Rounded as X} from '#/components/icons/Times' export function AgeAssuranceDismissableNotice({style}: ViewStyleProp & {}) { const {_} = useLingui() - const {isReady, isDeclaredUnderage, isAgeRestricted, assurance} = + const {isReady, isDeclaredUnderage, isAgeRestricted, lastInitiatedAt} = useAgeAssurance() const {nux} = useNux(Nux.AgeAssuranceDismissableNotice) const copy = useAgeAssuranceCopy() @@ -22,7 +22,7 @@ export function AgeAssuranceDismissableNotice({style}: ViewStyleProp & {}) { if (!isReady) return null if (isDeclaredUnderage) return null if (!isAgeRestricted) return null - if (assurance.lastInitiatedAt) return null + if (lastInitiatedAt) return null if (hidden) return null if (nux && nux.completed) return null diff --git a/src/state/ageAssurance/useAgeAssurance.ts b/src/state/ageAssurance/useAgeAssurance.ts index dc2dc23432..1359782b31 100644 --- a/src/state/ageAssurance/useAgeAssurance.ts +++ b/src/state/ageAssurance/useAgeAssurance.ts @@ -7,12 +7,21 @@ import {usePreferencesQuery} from '#/state/queries/preferences' const logger = Logger.create(Logger.Context.AgeAssurance) -type AgeAssurance = { - isReady: boolean - declaredAge: number | undefined - isDeclaredUnderage: boolean +type AgeAssurance = ReturnType & { + /** + * Indicates the user is age restricted based on the requirements of their + * region, and their server-provided age assurance status. Does not factor in + * the user's declared age. + */ isAgeRestricted: boolean - assurance: ReturnType + /** + * The age the user has declared in their preferences, if any. + */ + declaredAge: number | undefined + /** + * Indicates whether the user has declared an age under 18. + */ + isDeclaredUnderage: boolean } /** @@ -32,11 +41,11 @@ export function useAgeAssurance(): AgeAssurance { const isDeclaredUnderage = (declaredAge || 0) < 18 const state: AgeAssurance = { isReady, + status: ctx.status, + lastInitiatedAt: ctx.lastInitiatedAt, + isAgeRestricted, declaredAge, isDeclaredUnderage, - isAgeRestricted, - - assurance: ctx, } logger.debug(`state`, state) return state