Checkpoint: cleanup

src/state/ageAssurance/index.tsx

@@ -55,7 +55,7 @@ export function Provider({children}: {children: React.ReactNode}) {
     enabled: true,
     queryKey: createAgeAssuranceQueryKey(agent.session?.did ?? 'never'),
     staleTime: STALE.MINUTES.ONE,
-    refetchOnWindowFocus: true,
+    refetchOnWindowFocus: geolocation?.isAgeRestrictedGeo === true,
     async queryFn() {
       if (!agent.session) return null
 
@@ -68,7 +68,7 @@ export function Provider({children}: {children: React.ReactNode}) {
         //   (() => ({
         //     data: {
         //       lastInitiatedAt: undefined,//new Date().toISOString(),
-        //       status: 'unknown',
+        //       status: 'pending',
         //     } as AppBskyUnspeccedDefs.AgeAssuranceState,
         //   }))(),
         // )

src/state/ageAssurance/useAgeInfo.ts

@@ -1,25 +1,44 @@
 import {useMemo} from 'react'
 
+import {Logger} from '#/logger'
 import {useAgeAssuranceContext} from '#/state/ageAssurance'
+import {useMustCompleteAgeAssurance} from '#/state/ageAssurance/useMustCompleteAgeAssurance'
 import {usePreferencesQuery} from '#/state/queries/preferences'
 
+const logger = Logger.create(Logger.Context.AgeAssurance)
+
+type AgeInfo = {
+  isLoaded: boolean
+  declaredAge: number | undefined
+  isUnderage: boolean
+  mustCompleteAgeAssurance: boolean
+  assurance: ReturnType<typeof useAgeAssuranceContext>
+}
+
 /**
  * Computed age information based on age assurance status and the user's
  * declared age. Use this instead of {@link useAgeAssuranceContext} to get a
  * more user-friendly interface.
  */
-export function useAgeInfo() {
+export function useAgeInfo(): AgeInfo {
+  const mustCompleteAgeAssurance = useMustCompleteAgeAssurance()
   const ctx = useAgeAssuranceContext()
   const {isFetched: preferencesLoaded, data: preferences} =
     usePreferencesQuery()
-  const declaredAge = useMemo(() => preferences?.userAge, [preferences])
+  const declaredAge = preferences?.userAge
 
   return useMemo(() => {
-    return {
-      isLoaded: ctx.isLoaded && preferencesLoaded,
+    const isLoaded = ctx.isLoaded && preferencesLoaded
+    const isUnderage = (declaredAge || 0) < 18
+    const info: AgeInfo = {
+      isLoaded,
       declaredAge,
-      isUnderage: ctx.isAgeRestricted && (declaredAge || 0) < 18,
+      isUnderage,
+      mustCompleteAgeAssurance,
+
       assurance: ctx,
     }
-  }, [ctx, preferencesLoaded, declaredAge])
+    logger.debug(`useAgeInfo`, info)
+    return info
+  }, [ctx, preferencesLoaded, declaredAge, mustCompleteAgeAssurance])
 }

src/state/ageAssurance/useMaybeApplyAgeRestrictedModerationPrefs.ts

@@ -1,23 +0,0 @@
-import {useCallback} from 'react'
-import {type ModerationPrefs} from '@atproto/api'
-
-import {useAgeAssuranceContext} from '#/state/ageAssurance'
-import {AGE_RESTRICTED_MODERATION_PREFS} from '#/state/ageAssurance/const'
-
-/**
- * Hook to conditionally apply age-restricted moderation preferences, if
- * needed. If not needed, the mod prefs passed to the callback will be used.
- */
-export function useMaybeApplyAgeRestrictedModerationPrefs() {
-  const state = useAgeAssuranceContext()
-  return useCallback(
-    (prev: ModerationPrefs) => {
-      if (state.isAgeRestricted) {
-        return AGE_RESTRICTED_MODERATION_PREFS
-      }
-
-      return prev
-    },
-    [state],
-  )
-}

src/state/ageAssurance/useMustCompleteAgeAssurance.ts

@@ -0,0 +1,17 @@
+import {useMemo} from 'react'
+
+import {useGate} from '#/lib/statsig/statsig'
+import {useAgeAssuranceContext} from '#/state/ageAssurance'
+import {useGeolocation} from '#/state/geolocation'
+
+export function useMustCompleteAgeAssurance() {
+  const gate = useGate()
+  const {geolocation} = useGeolocation()
+  const {isLoaded, status: ageAssuranceStatus} = useAgeAssuranceContext()
+  return useMemo(() => {
+    if (!gate('age_assurance')) return false
+    if (!geolocation?.isAgeRestrictedGeo) return false
+    if (!isLoaded) return false
+    return ageAssuranceStatus !== 'assured'
+  }, [isLoaded, gate, geolocation, ageAssuranceStatus])
+}

src/state/queries/preferences/index.ts

@@ -10,7 +10,8 @@ import {PROD_DEFAULT_FEED} from '#/lib/constants'
 import {replaceEqualDeep} from '#/lib/functions'
 import {getAge} from '#/lib/strings/time'
 import {logger} from '#/logger'
-import {useMaybeApplyAgeRestrictedModerationPrefs} from '#/state/ageAssurance/useMaybeApplyAgeRestrictedModerationPrefs'
+import {AGE_RESTRICTED_MODERATION_PREFS} from '#/state/ageAssurance/const'
+import {useMustCompleteAgeAssurance} from '#/state/ageAssurance/useMustCompleteAgeAssurance'
 import {STALE} from '#/state/queries'
 import {
   DEFAULT_HOME_FEED_PREFS,
@@ -33,7 +34,7 @@ export const preferencesQueryKey = [preferencesQueryKeyRoot]
 
 export function usePreferencesQuery() {
   const agent = useAgent()
-  const maybeOverrideModPrefs = useMaybeApplyAgeRestrictedModerationPrefs()
+  const mustCompleteAgeAssurance = useMustCompleteAgeAssurance()
 
   return useQuery({
     staleTime: STALE.SECONDS.FIFTEEN,
@@ -74,10 +75,13 @@ export function usePreferencesQuery() {
     },
     select: useCallback(
       (data: UsePreferencesQueryResponse) => {
-        data.moderationPrefs = maybeOverrideModPrefs(data.moderationPrefs)
+        const isUnderage = (data.userAge || 0) < 18
+        if (isUnderage || mustCompleteAgeAssurance) {
+          data.moderationPrefs = AGE_RESTRICTED_MODERATION_PREFS
+        }
         return data
       },
-      [maybeOverrideModPrefs],
+      [mustCompleteAgeAssurance],
     ),
   })
 }