acetheking987/bsky-social-app
1
0
Fork 0
Code Issues Actions Packages Projects Releases 1 Wiki Activity

Improve miminum age handling

Browse Source
This commit is contained in:
Eric Bailey
2026-01-07 11:37:13 -06:00
parent 80049bbe82
commit c5d06185fc
9 changed files with 213 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/ageAssurance/components/NoAccessScreen.tsx
+10 -1
View File
@@ -177,10 +177,19 @@ export function NoAccessScreen() {
</Trans>
</Text>
{!aa.flags.isOverRegionMinAccessAge && (
<Text style={[textStyles]}>
<Trans>
Unfortunately, your declared age indicates that you
are not old enough to access Bluesky in your region.
</Trans>
</Text>
)}
{!isBlocked && birthdateUpdateText}
</View>
<AccessSection />
{aa.flags.isOverRegionMinAccessAge && <AccessSection />}
</>
) : (
<View style={[a.gap_lg]}>
src/ageAssurance/debug.ts
+21 -7
View File
@@ -12,23 +12,26 @@ export const enabled = (IS_DEV && false) || IS_E2E
export const geolocation: Geolocation | undefined = enabled
? {
countryCode: 'AA',
countryCode: 'BB',
regionCode: undefined,
}
: undefined
export const deviceGeolocation: Geolocation | undefined = enabled
? {
countryCode: 'AA',
regionCode: undefined,
}
: undefined
const deviceGeolocationEnabled = false
export const deviceGeolocation: Geolocation | undefined =
enabled && deviceGeolocationEnabled
? {
countryCode: 'AA',
regionCode: undefined,
}
: undefined
export const config: AppBskyAgeassuranceDefs.Config = {
regions: [
{
countryCode: 'AA',
regionCode: undefined,
minAccessAge: 13,
rules: [
{
$type: ids.Default,
@@ -36,6 +39,17 @@ export const config: AppBskyAgeassuranceDefs.Config = {
},
],
},
{
countryCode: 'BB',
regionCode: undefined,
minAccessAge: 16,
rules: [
{
$type: ids.Default,
access: 'none',
},
],
},
],
}
src/ageAssurance/index.tsx
+23 -5
View File
@@ -14,7 +14,11 @@ import {
type AgeAssuranceState,
AgeAssuranceStatus,
} from '#/ageAssurance/types'
import {isUserUnderAdultAge} from '#/ageAssurance/util'
import {
isUnderAge,
MIN_ACCESS_AGE,
useAgeAssuranceRegionConfigWithFallback,
} from '#/ageAssurance/util'
export {
prefetchConfig as prefetchAgeAssuranceConfig,
@@ -24,6 +28,7 @@ export {
usePatchServerState as usePatchAgeAssuranceServerState,
} from '#/ageAssurance/data'
export {logger} from '#/ageAssurance/logger'
export {MIN_ACCESS_AGE} from '#/ageAssurance/util'
const AgeAssuranceStateContext = createContext<{
Access: typeof AgeAssuranceAccess
@@ -32,6 +37,8 @@ const AgeAssuranceStateContext = createContext<{
flags: {
adultContentDisabled: boolean
chatDisabled: boolean
isOverRegionMinAccessAge: boolean
isOverAppMinAccessAge: boolean
}
}>({
Access: AgeAssuranceAccess,
@@ -44,6 +51,8 @@ const AgeAssuranceStateContext = createContext<{
flags: {
adultContentDisabled: false,
chatDisabled: false,
isOverRegionMinAccessAge: false,
isOverAppMinAccessAge: false,
},
})
@@ -69,6 +78,7 @@ export function Provider({children}: {children: React.ReactNode}) {
function InnerProvider({children}: {children: React.ReactNode}) {
const state = useAgeAssuranceState()
const {data} = useAgeAssuranceDataContext()
const config = useAgeAssuranceRegionConfigWithFallback()
const getAndRegisterPushToken = useGetAndRegisterPushToken()
const handleAccessUpdate = useCallback(
@@ -89,11 +99,17 @@ function InnerProvider({children}: {children: React.ReactNode}) {
<AgeAssuranceStateContext.Provider
value={useMemo(() => {
const chatDisabled = state.access !== AgeAssuranceAccess.Full
const isUnderage = data?.birthdate
? isUserUnderAdultAge(data.birthdate)
const isUnderAdultAge = data?.birthdate
? isUnderAge(data.birthdate, 18)
: true
const isOverRegionMinAccessAge = data?.birthdate
? !isUnderAge(data.birthdate, config.minAccessAge)
: false
const isOverAppMinAccessAge = data?.birthdate
? !isUnderAge(data.birthdate, MIN_ACCESS_AGE)
: false
const adultContentDisabled =
state.access !== AgeAssuranceAccess.Full || isUnderage
state.access !== AgeAssuranceAccess.Full || isUnderAdultAge
return {
Access: AgeAssuranceAccess,
Status: AgeAssuranceStatus,
@@ -101,9 +117,11 @@ function InnerProvider({children}: {children: React.ReactNode}) {
flags: {
adultContentDisabled,
chatDisabled,
isOverRegionMinAccessAge,
isOverAppMinAccessAge,
},
}
}, [state, data])}>
}, [state, data, config])}>
{children}
</AgeAssuranceStateContext.Provider>
)
src/ageAssurance/util.ts
+30 -26
View File
@@ -12,7 +12,23 @@ import {useAgeAssuranceDataContext} from '#/ageAssurance/data'
import {AgeAssuranceAccess} from '#/ageAssurance/types'
import {type Geolocation, useGeolocation} from '#/geolocation'
const DEFAULT_MIN_AGE = 13
export const MIN_ACCESS_AGE = 13
const FALLBACK_REGION_CONFIG: AppBskyAgeassuranceDefs.ConfigRegion = {
countryCode: '*',
regionCode: undefined,
minAccessAge: MIN_ACCESS_AGE,
rules: [
{
$type: ids.IfDeclaredOverAge,
age: MIN_ACCESS_AGE,
access: AgeAssuranceAccess.Full,
},
{
$type: ids.Default,
access: AgeAssuranceAccess.None,
},
],
}
/**
* Get age assurance region config based on geolocation, with fallback to
@@ -30,23 +46,7 @@ export function getAgeAssuranceRegionConfigWithFallback(
regionCode: geolocation.regionCode,
})
return (
region || {
countryCode: '*',
regionCode: undefined,
rules: [
{
$type: ids.IfDeclaredOverAge,
age: DEFAULT_MIN_AGE,
access: AgeAssuranceAccess.Full,
},
{
$type: ids.Default,
access: AgeAssuranceAccess.None,
},
],
}
)
return region || FALLBACK_REGION_CONFIG
}
/**
@@ -67,6 +67,14 @@ export function useAgeAssuranceRegionConfig() {
}, [config, geolocation])
}
/**
* Hook to get the age assurance region config based on current geolocation.
* Falls back to our app defaults if no region config is found.
*/
export function useAgeAssuranceRegionConfigWithFallback() {
return useAgeAssuranceRegionConfig() || FALLBACK_REGION_CONFIG
}
/**
* Some users may have erroneously set their birth date to the current date
* if one wasn't set on their account. We previously didn't do validation on
@@ -78,15 +86,11 @@ export function isLegacyBirthdateBug(birthDate: string) {
}
/**
* Returns whether the user is under the minimum age required to use the app.
* This applies to all regions.
* Returns whether the date (converted to an age as a whole integer) is under
* the provided minimum age.
*/
export function isUserUnderMinimumAge(birthDate: string) {
return getAge(new Date(birthDate)) < DEFAULT_MIN_AGE
}
export function isUserUnderAdultAge(birthDate: string) {
return getAge(new Date(birthDate)) < 18
export function isUnderAge(birthDate: string, age: number) {
return getAge(new Date(birthDate)) < age
}
export function getBirthdateStringFromAge(age: number) {
src/geolocation/debug.ts
+12 -6
View File
@@ -5,14 +5,20 @@ import {type Geolocation} from '#/geolocation/types'
const localEnabled = false
export const enabled = IS_DEV && (localEnabled || aaDebug.geolocation)
export const geolocation: Geolocation = aaDebug.geolocation ?? {
countryCode: 'AU',
regionCode: undefined,
}
export const deviceGeolocation: Geolocation = aaDebug.deviceGeolocation ?? {
countryCode: 'AU',
regionCode: undefined,
countryCode: 'US',
regionCode: 'TX',
}
const deviceLocalEnabled = false
export const deviceGeolocation: Geolocation | undefined =
aaDebug.deviceGeolocation ||
(deviceLocalEnabled
? {
countryCode: 'US',
regionCode: 'TX',
}
: undefined)
export async function resolve<T>(data: T) {
await new Promise(y => setTimeout(y, 500)) // simulate network
return data
src/geolocation/device.ts
+7 -1
View File
@@ -46,7 +46,8 @@ const useForegroundPermissions = createPermissionHook({
})
export async function getDeviceGeolocation(): Promise<Geolocation> {
if (debug.enabled) return debug.resolve(debug.deviceGeolocation)
if (debug.enabled && debug.deviceGeolocation)
return debug.resolve(debug.deviceGeolocation)
try {
const geocode = await Location.getCurrentPositionAsync()
@@ -142,3 +143,8 @@ export function useSyncDeviceGeolocationOnStartup(
})
}, [status, sync])
}
export function useIsDeviceGeolocationGranted() {
const [status] = useForegroundPermissions()
return status?.granted === true
}
src/geolocation/index.tsx
+4 -1
View File
@@ -12,7 +12,10 @@ import {type Geolocation} from '#/geolocation/types'
import {mergeGeolocations} from '#/geolocation/util'
import {device, useStorage} from '#/storage'
export {useRequestDeviceGeolocation} from '#/geolocation/device'
export {
useIsDeviceGeolocationGranted,
useRequestDeviceGeolocation,
} from '#/geolocation/device'
export {resolve} from '#/geolocation/service'
export * from '#/geolocation/types'
src/screens/Signup/StepInfo/Policies.tsx
+3 -28
View File
@@ -11,12 +11,8 @@ import {Text} from '#/components/Typography'
export const Policies = ({
serviceDescription,
needsGuardian,
under13,
}: {
serviceDescription: ComAtprotoServerDescribeServer.OutputSchema
needsGuardian: boolean
under13: boolean
}) => {
const t = useTheme()
const {_} = useLingui()
@@ -91,30 +87,9 @@ export const Policies = ({
return null
}
return (
<View style={[a.gap_sm]}>
{els ? (
<Text style={[a.leading_snug, t.atoms.text_contrast_medium]}>
{els}
</Text>
) : null}
{under13 ? (
<Admonition type="error">
<Trans>
You must be 13 years of age or older to create an account.
</Trans>
</Admonition>
) : needsGuardian ? (
<Admonition type="warning">
<Trans>
If you are not yet an adult according to the laws of your country,
your parent or legal guardian must read these Terms on your behalf.
</Trans>
</Admonition>
) : undefined}
</View>
)
return els ? (
<Text style={[a.leading_snug, t.atoms.text_contrast_medium]}>{els}</Text>
) : null
}
function validWebLink(url?: string): string | undefined {
src/screens/Signup/StepInfo/index.tsx
+103 -8
View File
@@ -7,9 +7,13 @@ import type tldts from 'tldts'
import {isEmailMaybeInvalid} from '#/lib/strings/email'
import {logger} from '#/logger'
import {is13, is18, useSignupContext} from '#/screens/Signup/state'
import {isNative} from '#/platform/detection'
import {useSignupContext} from '#/screens/Signup/state'
import {Policies} from '#/screens/Signup/StepInfo/Policies'
import {atoms as a, native} from '#/alf'
import * as Admonition from '#/components/Admonition'
import * as Dialog from '#/components/Dialog'
import {DeviceLocationRequestDialog} from '#/components/dialogs/DeviceLocationRequestDialog'
import * as DateField from '#/components/forms/DateField'
import {type DateFieldRef} from '#/components/forms/DateField/types'
import {FormError} from '#/components/forms/FormError'
@@ -18,8 +22,19 @@ import * as TextField from '#/components/forms/TextField'
import {Envelope_Stroke2_Corner0_Rounded as Envelope} from '#/components/icons/Envelope'
import {Lock_Stroke2_Corner0_Rounded as Lock} from '#/components/icons/Lock'
import {Ticket_Stroke2_Corner0_Rounded as Ticket} from '#/components/icons/Ticket'
import {createStaticClick, SimpleInlineLinkText} from '#/components/Link'
import {Loader} from '#/components/Loader'
import {usePreemptivelyCompleteActivePolicyUpdate} from '#/components/PolicyUpdateOverlay/usePreemptivelyCompleteActivePolicyUpdate'
import * as Toast from '#/components/Toast'
import {
isUserUnderAge,
MIN_ACCESS_AGE,
useAgeAssuranceRegionConfigWithFallback,
} from '#/ageAssurance/util'
import {
useDeviceGeolocationApi,
useIsDeviceGeolocationGranted,
} from '#/geolocation'
import {BackNextButtons} from '../BackNextButtons'
function sanitizeDate(date: Date): Date {
@@ -57,6 +72,23 @@ export function StepInfo({
const passwordInputRef = useRef<TextInput>(null)
const birthdateInputRef = useRef<DateFieldRef>(null)
const aaRegionConfig = useAgeAssuranceRegionConfigWithFallback()
const {setDeviceGeolocation} = useDeviceGeolocationApi()
const locationControl = Dialog.useDialogControl()
const isOverRegionMinAccessAge = state.dateOfBirth
? !isUserUnderAge(
state.dateOfBirth.toISOString(),
aaRegionConfig.minAccessAge,
)
: true
const isOverAppMinAccessAge = state.dateOfBirth
? !isUserUnderAge(state.dateOfBirth.toISOString(), MIN_ACCESS_AGE)
: true
const isOverMinAdultAge = state.dateOfBirth
? !isUserUnderAge(state.dateOfBirth.toISOString(), 18)
: true
const isDeviceGeolocationGranted = useIsDeviceGeolocationGranted()
const [hasWarnedEmail, setHasWarnedEmail] = React.useState<boolean>(false)
const tldtsRef = React.useRef<typeof tldts>(undefined)
@@ -76,7 +108,7 @@ export function StepInfo({
const emailChanged = prevEmailValueRef.current !== email
const password = passwordValueRef.current
if (!is13(state.dateOfBirth)) {
if (!isOverRegionMinAccessAge) {
return
}
@@ -274,16 +306,79 @@ export function StepInfo({
maximumDate={new Date()}
/>
</View>
<Policies
serviceDescription={state.serviceDescription}
needsGuardian={!is18(state.dateOfBirth)}
under13={!is13(state.dateOfBirth)}
/>
<View style={[a.gap_sm]}>
<Policies serviceDescription={state.serviceDescription} />
{!isOverRegionMinAccessAge || !isOverAppMinAccessAge ? (
<Admonition.Outer type="error">
<Admonition.Row>
<Admonition.Icon />
<Admonition.Content>
<Admonition.Text>
{!isOverAppMinAccessAge ? (
<Trans>
You must be {MIN_ACCESS_AGE} years of age or older
to create an account.
</Trans>
) : (
<Trans>
You must be {aaRegionConfig.minAccessAge} years of
age or older to create an account in your region.
</Trans>
)}
</Admonition.Text>
{isNative &&
!isDeviceGeolocationGranted &&
isOverAppMinAccessAge && (
<Admonition.Text>
<Trans>
Have we got your location wrong?{' '}
<SimpleInlineLinkText
label={_(
msg`Tap here to confirm your location with GPS.`,
)}
{...createStaticClick(() => {
locationControl.open()
})}>
Tap here to confirm your location with GPS.
</SimpleInlineLinkText>
</Trans>
</Admonition.Text>
)}
</Admonition.Content>
</Admonition.Row>
</Admonition.Outer>
) : !isOverMinAdultAge ? (
<Admonition.Admonition type="warning">
<Trans>
If you are not yet an adult according to the laws of your
country, your parent or legal guardian must read these Terms
on your behalf.
</Trans>
</Admonition.Admonition>
) : undefined}
</View>
{isNative && (
<DeviceLocationRequestDialog
control={locationControl}
onLocationAcquired={props => {
props.closeDialog(() => {
// set this after close!
setDeviceGeolocation(props.geolocation)
Toast.show(_(msg`Your location has been updated.`), {
type: 'success',
})
})
}}
/>
)}
</>
) : undefined}
</View>
<BackNextButtons
hideNext={!is13(state.dateOfBirth)}
hideNext={!isOverRegionMinAccessAge}
showRetry={isServerError}
isLoading={state.isLoading}
onBackPress={onPressBack}