diff --git a/.env.example b/.env.example index ac8dcab1f8..96a1548d66 100644 --- a/.env.example +++ b/.env.example @@ -36,6 +36,3 @@ EXPO_PUBLIC_BITDRIFT_API_KEY= # bapp-config web worker URL BAPP_CONFIG_DEV_URL= - -# Dev-only passthrough value for bapp-config web worker -BAPP_CONFIG_DEV_BYPASS_SECRET= diff --git a/__tests__/lib/string.test.ts b/__tests__/lib/string.test.ts index 6087ba5b14..c59c8b3e34 100644 --- a/__tests__/lib/string.test.ts +++ b/__tests__/lib/string.test.ts @@ -957,20 +957,20 @@ describe('parseStarterPackHttpUri', () => { }) it('returns the at uri when the input is a valid starterpack at uri', () => { - const validAtUri = 'at://did:123/app.bsky.graph.starterpack/rkey' + const validAtUri = 'at://did:plc:123/app.bsky.graph.starterpack/rkey' expect(parseStarterPackUri(validAtUri)).toEqual({ - name: 'did:123', + name: 'did:plc:123', rkey: 'rkey', }) }) it('returns null when the at uri has no rkey', () => { - const validAtUri = 'at://did:123/app.bsky.graph.starterpack' + const validAtUri = 'at://did:plc:123/app.bsky.graph.starterpack' expect(parseStarterPackUri(validAtUri)).toEqual(null) }) it('returns null when the collection is not app.bsky.graph.starterpack', () => { - const validAtUri = 'at://did:123/app.bsky.graph.list/rkey' + const validAtUri = 'at://did:plc:123/app.bsky.graph.list/rkey' expect(parseStarterPackUri(validAtUri)).toEqual(null) }) diff --git a/bskyweb/cmd/bskyweb/renderer.go b/bskyweb/cmd/bskyweb/renderer.go index 4bf8b80c5c..6e02456f53 100644 --- a/bskyweb/cmd/bskyweb/renderer.go +++ b/bskyweb/cmd/bskyweb/renderer.go @@ -71,7 +71,7 @@ func (r Renderer) Render(w io.Writer, name string, data interface{}, c echo.Cont if r.Debug { t, err = pongo2.FromFile(name) } else { - t, err = r.TemplateSet.FromFile(name) + t, err = r.TemplateSet.FromCache(name) } if err != nil { diff --git a/bskyweb/templates/base.html b/bskyweb/templates/base.html index 0bde22e77c..b5f504904f 100644 --- a/bskyweb/templates/base.html +++ b/bskyweb/templates/base.html @@ -68,11 +68,19 @@ width: 100%; } #splash { + display: flex; position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + align-items: center; + justify-content: center; + } + #splash svg { + position: relative; + top: -50px; width: 100px; - left: 50%; - top: 50%; - transform: translateX(-50%) translateY(-50%) translateY(-50px); } /** * We need these styles to prevent shifting due to scrollbar show/hide on @@ -106,7 +114,7 @@
- +
diff --git a/package.json b/package.json index e2653d5885..f7be70a77b 100644 --- a/package.json +++ b/package.json @@ -72,7 +72,7 @@ "icons:optimize": "svgo -f ./assets/icons" }, "dependencies": { - "@atproto/api": "^0.18.0", + "@atproto/api": "^0.18.4", "@bitdrift/react-native": "^0.6.8", "@braintree/sanitize-url": "^6.0.2", "@bsky.app/alf": "^0.1.5", @@ -103,7 +103,7 @@ "@react-navigation/native-stack": "^7.3.13", "@sentry/react-native": "~6.20.0", "@tanstack/query-async-storage-persister": "^5.25.0", - "@tanstack/react-query": "^5.8.1", + "@tanstack/react-query": "5.25.0", "@tanstack/react-query-persist-client": "^5.25.0", "@tiptap/core": "^2.9.1", "@tiptap/extension-document": "^2.9.1", diff --git a/patches/expo-modules-core+3.0.24.patch b/patches/expo-modules-core+3.0.24.patch index f3d9bfd149..d396099932 100644 --- a/patches/expo-modules-core+3.0.24.patch +++ b/patches/expo-modules-core+3.0.24.patch @@ -1,3 +1,32 @@ +diff --git a/node_modules/expo-modules-core/android/src/main/java/expo/modules/kotlin/activityresult/AppContextActivityResultLauncher.kt b/node_modules/expo-modules-core/android/src/main/java/expo/modules/kotlin/activityresult/AppContextActivityResultLauncher.kt +index d300fc2..0890878 100644 +--- a/node_modules/expo-modules-core/android/src/main/java/expo/modules/kotlin/activityresult/AppContextActivityResultLauncher.kt ++++ b/node_modules/expo-modules-core/android/src/main/java/expo/modules/kotlin/activityresult/AppContextActivityResultLauncher.kt +@@ -3,8 +3,8 @@ package expo.modules.kotlin.activityresult + import androidx.activity.result.ActivityResultCallback + import androidx.activity.result.contract.ActivityResultContract + import java.io.Serializable ++import kotlinx.coroutines.suspendCancellableCoroutine + import kotlin.coroutines.resume +-import kotlin.coroutines.suspendCoroutine + + /** + * A launcher for a previously-[AppContextActivityResultCaller.registerForActivityResult] prepared call +@@ -22,8 +22,12 @@ abstract class AppContextActivityResultLauncher { + */ + abstract fun launch(input: I, callback: ActivityResultCallback) + +- suspend fun launch(input: I): O = suspendCoroutine { continuation -> +- launch(input) { output -> continuation.resume(output) } ++ suspend fun launch(input: I): O = suspendCancellableCoroutine { continuation -> ++ launch(input) { output -> ++ if (continuation.isActive) { ++ continuation.resume(output) ++ } ++ } + } + + abstract val contract: AppContextActivityResultContract diff --git a/node_modules/expo-modules-core/android/src/main/java/expo/modules/kotlin/devtools/ExpoNetworkInspectOkHttpInterceptors.kt b/node_modules/expo-modules-core/android/src/main/java/expo/modules/kotlin/devtools/ExpoNetworkInspectOkHttpInterceptors.kt index 47c4d15..afe138d 100644 --- a/node_modules/expo-modules-core/android/src/main/java/expo/modules/kotlin/devtools/ExpoNetworkInspectOkHttpInterceptors.kt diff --git a/patches/react-native+0.81.5+004+IdleCallbackRunnable-crash-fix.patch b/patches/react-native+0.81.5+004+IdleCallbackRunnable-crash-fix.patch new file mode 100644 index 0000000000..b3954c14f1 --- /dev/null +++ b/patches/react-native+0.81.5+004+IdleCallbackRunnable-crash-fix.patch @@ -0,0 +1,16 @@ +diff --git a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.kt b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.kt +index 8b65716..27c97bf 100644 +--- a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.kt ++++ b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.kt +@@ -313,8 +313,9 @@ public open class JavaTimerManager( + // We also capture the idleCallbackRunnable to tentatively fix: + // https://github.com/facebook/react-native/issues/44842 + currentIdleCallbackRunnable?.cancel() +- currentIdleCallbackRunnable = IdleCallbackRunnable(frameTimeNanos) +- reactApplicationContext.runOnJSQueueThread(currentIdleCallbackRunnable) ++ val idleCallbackRunnable = IdleCallbackRunnable(frameTimeNanos) ++ currentIdleCallbackRunnable = idleCallbackRunnable ++ reactApplicationContext.runOnJSQueueThread(idleCallbackRunnable) + reactChoreographer.postFrameCallback(ReactChoreographer.CallbackType.IDLE_EVENT, this) + } + } diff --git a/src/App.native.tsx b/src/App.native.tsx index 30a5e81296..fb30086273 100644 --- a/src/App.native.tsx +++ b/src/App.native.tsx @@ -25,16 +25,10 @@ import I18nProvider from '#/locale/i18nProvider' import {logger} from '#/logger' import {isAndroid, isIOS} from '#/platform/detection' import {Provider as A11yProvider} from '#/state/a11y' -import {Provider as AgeAssuranceProvider} from '#/state/ageAssurance' import {Provider as MutedThreadsProvider} from '#/state/cache/thread-mutes' import {Provider as DialogStateProvider} from '#/state/dialogs' import {Provider as EmailVerificationProvider} from '#/state/email-verification' import {listenSessionDropped} from '#/state/events' -import { - beginResolveGeolocationConfig, - ensureGeolocationConfigIsResolved, - Provider as GeolocationProvider, -} from '#/state/geolocation' import {GlobalGestureEventsProvider} from '#/state/global-gesture-events' import {Provider as HomeBadgeProvider} from '#/state/home-badge' import {Provider as LightboxStateProvider} from '#/state/lightbox' @@ -56,6 +50,7 @@ import {readLastActiveAccount} from '#/state/session/util' import {Provider as ShellStateProvider} from '#/state/shell' import {Provider as ComposerProvider} from '#/state/shell/composer' import {Provider as LoggedOutViewProvider} from '#/state/shell/logged-out' +import {Provider as OnboardingProvider} from '#/state/shell/onboarding' import {Provider as ProgressGuideProvider} from '#/state/shell/progress-guide' import {Provider as SelectedFeedProvider} from '#/state/shell/selected-feed' import {Provider as StarterPackProvider} from '#/state/shell/starter-pack' @@ -73,6 +68,9 @@ import {Provider as PolicyUpdateOverlayProvider} from '#/components/PolicyUpdate import {Provider as PortalProvider} from '#/components/Portal' import {Provider as VideoVolumeProvider} from '#/components/Post/Embed/VideoEmbed/VideoVolumeContext' import {ToastOutlet} from '#/components/Toast' +import {Provider as AgeAssuranceV2Provider} from '#/ageAssurance' +import {prefetchAgeAssuranceConfig} from '#/ageAssurance' +import * as Geo from '#/geolocation' import {Splash} from '#/Splash' import {BottomSheetProvider} from '../modules/bottom-sheet' import {BackgroundNotificationPreferencesProvider} from '../modules/expo-background-notification-handler/src/BackgroundNotificationHandlerProvider' @@ -93,7 +91,8 @@ if (isAndroid) { /** * Begin geolocation ASAP */ -beginResolveGeolocationConfig() +Geo.resolve() +prefetchAgeAssuranceConfig() function InnerApp() { const [isReady, setIsReady] = React.useState(false) @@ -143,7 +142,7 @@ function InnerApp() { - + {/* LabelDefsProvider MUST come before ModerationOptsProvider */} @@ -186,7 +185,7 @@ function InnerApp() { - + @@ -203,10 +202,9 @@ function App() { const [isReady, setReady] = useState(false) React.useEffect(() => { - Promise.all([ - initPersistedState(), - ensureGeolocationConfigIsResolved(), - ]).then(() => setReady(true)) + Promise.all([initPersistedState(), Geo.resolve()]).then(() => + setReady(true), + ) }, []) if (!isReady) { @@ -218,36 +216,38 @@ function App() { * that is set up in the InnerApp component above. */ return ( - + - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + - + ) } diff --git a/src/App.web.tsx b/src/App.web.tsx index b7cba6122e..f4b514dfc1 100644 --- a/src/App.web.tsx +++ b/src/App.web.tsx @@ -14,16 +14,10 @@ import {ThemeProvider} from '#/lib/ThemeContext' import I18nProvider from '#/locale/i18nProvider' import {logger} from '#/logger' import {Provider as A11yProvider} from '#/state/a11y' -import {Provider as AgeAssuranceProvider} from '#/state/ageAssurance' import {Provider as MutedThreadsProvider} from '#/state/cache/thread-mutes' import {Provider as DialogStateProvider} from '#/state/dialogs' import {Provider as EmailVerificationProvider} from '#/state/email-verification' import {listenSessionDropped} from '#/state/events' -import { - beginResolveGeolocationConfig, - ensureGeolocationConfigIsResolved, - Provider as GeolocationProvider, -} from '#/state/geolocation' import {Provider as HomeBadgeProvider} from '#/state/home-badge' import {Provider as LightboxStateProvider} from '#/state/lightbox' import {MessagesProvider} from '#/state/messages' @@ -44,6 +38,7 @@ import {readLastActiveAccount} from '#/state/session/util' import {Provider as ShellStateProvider} from '#/state/shell' import {Provider as ComposerProvider} from '#/state/shell/composer' import {Provider as LoggedOutViewProvider} from '#/state/shell/logged-out' +import {Provider as OnboardingProvider} from '#/state/shell/onboarding' import {Provider as ProgressGuideProvider} from '#/state/shell/progress-guide' import {Provider as SelectedFeedProvider} from '#/state/shell/selected-feed' import {Provider as StarterPackProvider} from '#/state/shell/starter-pack' @@ -61,13 +56,18 @@ import {Provider as PortalProvider} from '#/components/Portal' import {Provider as ActiveVideoProvider} from '#/components/Post/Embed/VideoEmbed/ActiveVideoWebContext' import {Provider as VideoVolumeProvider} from '#/components/Post/Embed/VideoEmbed/VideoVolumeContext' import {ToastOutlet} from '#/components/Toast' +import {Provider as AgeAssuranceV2Provider} from '#/ageAssurance' +import {prefetchAgeAssuranceConfig} from '#/ageAssurance' +import * as Geo from '#/geolocation' +import {Splash} from '#/Splash' import {BackgroundNotificationPreferencesProvider} from '../modules/expo-background-notification-handler/src/BackgroundNotificationHandlerProvider' import {Provider as HideBottomBarBorderProvider} from './lib/hooks/useHideBottomBarBorder' /** * Begin geolocation ASAP */ -beginResolveGeolocationConfig() +Geo.resolve() +prefetchAgeAssuranceConfig() function InnerApp() { const [isReady, setIsReady] = React.useState(false) @@ -104,7 +104,7 @@ function InnerApp() { }, [_]) // wait for session to resume - if (!isReady || !hasCheckedReferrer) return null + if (!isReady || !hasCheckedReferrer) return return ( @@ -118,7 +118,7 @@ function InnerApp() { - + {/* LabelDefsProvider MUST come before ModerationOptsProvider */} @@ -157,7 +157,7 @@ function InnerApp() { - + @@ -174,14 +174,13 @@ function App() { const [isReady, setReady] = useState(false) React.useEffect(() => { - Promise.all([ - initPersistedState(), - ensureGeolocationConfigIsResolved(), - ]).then(() => setReady(true)) + Promise.all([initPersistedState(), Geo.resolve()]).then(() => + setReady(true), + ) }, []) if (!isReady) { - return null + return } /* @@ -189,29 +188,31 @@ function App() { * that is set up in the InnerApp component above. */ return ( - + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + - + ) } diff --git a/src/Splash.web.tsx b/src/Splash.web.tsx new file mode 100644 index 0000000000..eb4a405c85 --- /dev/null +++ b/src/Splash.web.tsx @@ -0,0 +1,29 @@ +/* + * This is a reimplementation of what exists in our HTML template files + * already. Once the React tree mounts, this is what gets rendered first, until + * the app is ready to go. + */ + +import {View} from 'react-native' +import Svg, {Path} from 'react-native-svg' + +import {atoms as a} from '#/alf' + +const size = 100 +const ratio = 57 / 64 + +export function Splash() { + return ( + + + + + + ) +} diff --git a/src/ageAssurance/__mocks__/data.tsx b/src/ageAssurance/__mocks__/data.tsx new file mode 100644 index 0000000000..b548a2f866 --- /dev/null +++ b/src/ageAssurance/__mocks__/data.tsx @@ -0,0 +1,3 @@ +export const prefetchAgeAssuranceData = () => {} +export const setBirthdateForDid = () => {} +export const setCreatedAtForDid = () => {} diff --git a/src/ageAssurance/components/NoAccessScreen.tsx b/src/ageAssurance/components/NoAccessScreen.tsx new file mode 100644 index 0000000000..3b4f7d7088 --- /dev/null +++ b/src/ageAssurance/components/NoAccessScreen.tsx @@ -0,0 +1,355 @@ +import {useCallback, useEffect} from 'react' +import {ScrollView, View} from 'react-native' +import {useSafeAreaInsets} from 'react-native-safe-area-context' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' + +import { + SupportCode, + useCreateSupportLink, +} from '#/lib/hooks/useCreateSupportLink' +import {dateDiff, useGetTimeAgo} from '#/lib/hooks/useTimeAgo' +import {logger} from '#/logger' +import {isWeb} from '#/platform/detection' +import {isNative} from '#/platform/detection' +import {useIsBirthdateUpdateAllowed} from '#/state/birthdate' +import {useSessionApi} from '#/state/session' +import {atoms as a, useBreakpoints, useTheme, web} from '#/alf' +import {Admonition} from '#/components/Admonition' +import {AgeAssuranceAppealDialog} from '#/components/ageAssurance/AgeAssuranceAppealDialog' +import {AgeAssuranceBadge} from '#/components/ageAssurance/AgeAssuranceBadge' +import {AgeAssuranceInitDialog} from '#/components/ageAssurance/AgeAssuranceInitDialog' +import {Button, ButtonIcon, ButtonText} from '#/components/Button' +import {useDialogControl} from '#/components/Dialog' +import * as Dialog from '#/components/Dialog' +import {BirthDateSettingsDialog} from '#/components/dialogs/BirthDateSettings' +import {DeviceLocationRequestDialog} from '#/components/dialogs/DeviceLocationRequestDialog' +import {Full as Logo} from '#/components/icons/Logo' +import {ShieldCheck_Stroke2_Corner0_Rounded as ShieldIcon} from '#/components/icons/Shield' +import {createStaticClick, SimpleInlineLinkText} from '#/components/Link' +import {Outlet as PortalOutlet} from '#/components/Portal' +import * as Toast from '#/components/Toast' +import {Text} from '#/components/Typography' +import {BottomSheetOutlet} from '#/../modules/bottom-sheet' +import {useAgeAssurance} from '#/ageAssurance' +import {useAgeAssuranceDataContext} from '#/ageAssurance/data' +import {useComputeAgeAssuranceRegionAccess} from '#/ageAssurance/useComputeAgeAssuranceRegionAccess' +import { + isLegacyBirthdateBug, + useAgeAssuranceRegionConfig, +} from '#/ageAssurance/util' +import {useDeviceGeolocationApi} from '#/geolocation' + +const textStyles = [a.text_md, a.leading_snug] + +export function NoAccessScreen() { + const t = useTheme() + const {_} = useLingui() + const {gtPhone} = useBreakpoints() + const insets = useSafeAreaInsets() + const birthdateControl = useDialogControl() + const {data} = useAgeAssuranceDataContext() + const region = useAgeAssuranceRegionConfig() + const isBirthdateUpdateAllowed = useIsBirthdateUpdateAllowed() + const {logoutCurrentAccount} = useSessionApi() + const createSupportLink = useCreateSupportLink() + + const aa = useAgeAssurance() + const isBlocked = aa.state.status === aa.Status.Blocked + const isAARegion = !!region + const hasDeclaredAge = data?.declaredAge !== undefined + const canUpdateBirthday = + isBirthdateUpdateAllowed || isLegacyBirthdateBug(data?.birthdate || '') + + useEffect(() => { + // just counting overall hits here + logger.metric(`blockedGeoOverlay:shown`, {}) + }, []) + + const onPressLogout = useCallback(() => { + if (isWeb) { + // We're switching accounts, which remounts the entire app. + // On mobile, this gets us Home, but on the web we also need reset the URL. + // We can't change the URL via a navigate() call because the navigator + // itself is about to unmount, and it calls pushState() too late. + // So we change the URL ourselves. The navigator will pick it up on remount. + history.pushState(null, '', '/') + } + logoutCurrentAccount('AgeAssuranceNoAccessScreen') + }, [logoutCurrentAccount]) + + const birthdateUpdateText = canUpdateBirthday ? ( + + + If you believe your birthdate is incorrect, you can update it by{' '} + { + birthdateControl.open() + })}> + clicking here + + . + + + ) : ( + + + If you believe your birthdate is incorrect, please{' '} + + contact our support team + + . + + + ) + + return ( + <> + + + + + + + {hasDeclaredAge ? ( + <> + {isAARegion ? ( + <> + + + + You are accessing Bluesky from a region that legally + requires us to verify your age before allowing you to + access the app. + + + + {!isBlocked && birthdateUpdateText} + + + + + ) : ( + + + + Unfortunately, the birthdate you have saved to your + profile makes you too young to access Bluesky. + + + + {birthdateUpdateText} + + )} + + ) : ( + + + + It looks like you haven't added your birthdate. You must + provide an accurate date of birth to use Bluesky. + + + + + )} + + + + + + To log out,{' '} + { + onPressLogout() + })}> + click here + + . + + + + + + + + + {/* + * While this blocking overlay is up, other dialogs in the shell + * are not mounted, so it _should_ be safe to use these here + * without fear of other modals showing up. + */} + + + + ) +} + +function AccessSection() { + const t = useTheme() + const {_, i18n} = useLingui() + const control = useDialogControl() + const appealControl = Dialog.useDialogControl() + const locationControl = Dialog.useDialogControl() + const getTimeAgo = useGetTimeAgo() + const {setDeviceGeolocation} = useDeviceGeolocationApi() + const computeAgeAssuranceRegionAccess = useComputeAgeAssuranceRegionAccess() + + const aa = useAgeAssurance() + const {status, lastInitiatedAt} = aa.state + const isBlocked = status === aa.Status.Blocked + const hasInitiated = !!lastInitiatedAt + const timeAgo = lastInitiatedAt + ? getTimeAgo(lastInitiatedAt, new Date()) + : null + const diff = lastInitiatedAt + ? dateDiff(lastInitiatedAt, new Date(), 'down') + : null + + return ( + <> + + + + + {isBlocked ? ( + + + You are currently unable to access Bluesky's Age Assurance flow. + Please{' '} + { + appealControl.open() + logger.metric('ageAssurance:appealDialogOpen', {}) + })}> + contact our moderation team + {' '} + if you believe this is an error. + + + ) : ( + <> + + + + {lastInitiatedAt && timeAgo && diff ? ( + + {diff.value === 0 ? ( + Last initiated just now + ) : ( + Last initiated {timeAgo} ago + )} + + ) : ( + + Age assurance only takes a few minutes + + )} + + + )} + + + {isNative && ( + <> + + + Is your location not accurate?{' '} + { + locationControl.open() + })}> + Tap here to confirm your location. + {' '} + + + + { + const access = computeAgeAssuranceRegionAccess( + props.geolocation, + ) + if (access !== aa.Access.Full) { + props.disableDialogAction() + props.setDialogError( + _( + msg`We're sorry, but based on your device's location, you are currently located in a region that requires age assurance.`, + ), + ) + } else { + props.closeDialog(() => { + // set this after close! + setDeviceGeolocation(props.geolocation) + Toast.show(_(msg`Thanks! You're all set.`), { + type: 'success', + }) + }) + } + }} + /> + + )} + + + + ) +} diff --git a/src/ageAssurance/components/RedirectOverlay.tsx b/src/ageAssurance/components/RedirectOverlay.tsx new file mode 100644 index 0000000000..dc4475187f --- /dev/null +++ b/src/ageAssurance/components/RedirectOverlay.tsx @@ -0,0 +1,334 @@ +import { + createContext, + useCallback, + useContext, + useEffect, + useMemo, + useRef, + useState, +} from 'react' +import {Dimensions, View} from 'react-native' +import * as Linking from 'expo-linking' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' + +import {retry} from '#/lib/async/retry' +import {wait} from '#/lib/async/wait' +import {parseLinkingUrl} from '#/lib/parseLinkingUrl' +import {isWeb} from '#/platform/detection' +import {isIOS} from '#/platform/detection' +import {useAgent, useSession} from '#/state/session' +import {atoms as a, platform, useBreakpoints, useTheme} from '#/alf' +import {AgeAssuranceBadge} from '#/components/ageAssurance/AgeAssuranceBadge' +import {Button, ButtonText} from '#/components/Button' +import {FullWindowOverlay} from '#/components/FullWindowOverlay' +import {CheckThick_Stroke2_Corner0_Rounded as SuccessIcon} from '#/components/icons/Check' +import {CircleInfo_Stroke2_Corner0_Rounded as ErrorIcon} from '#/components/icons/CircleInfo' +import {Loader} from '#/components/Loader' +import {Text} from '#/components/Typography' +import {refetchAgeAssuranceServerState} from '#/ageAssurance' +import {logger} from '#/ageAssurance' + +export type RedirectOverlayState = { + result: 'success' | 'unknown' + actorDid: string +} + +/** + * Validate and parse the query parameters returned from the age assurance + * redirect. If not valid, returns `undefined` and the dialog will not open. + */ +export function parseRedirectOverlayState( + state: { + result?: string + actorDid?: string + } = {}, +): RedirectOverlayState | undefined { + let result: RedirectOverlayState['result'] = 'unknown' + const actorDid = state.actorDid + + switch (state.result) { + case 'success': + result = 'success' + break + case 'unknown': + default: + result = 'unknown' + break + } + + if (actorDid) { + return { + result, + actorDid, + } + } +} + +const Context = createContext<{ + isOpen: boolean + open: (state: RedirectOverlayState) => void + close: () => void +}>({ + isOpen: false, + open: () => {}, + close: () => {}, +}) + +export function useRedirectOverlayContext() { + return useContext(Context) +} + +export function Provider({children}: {children?: React.ReactNode}) { + const {currentAccount} = useSession() + const incomingUrl = Linking.useLinkingURL() + const [state, setState] = useState(() => { + if (!incomingUrl) return null + const url = parseLinkingUrl(incomingUrl) + if (url.pathname !== '/intent/age-assurance') return null + const params = url.searchParams + const state = parseRedirectOverlayState({ + result: params.get('result') ?? undefined, + actorDid: params.get('actorDid') ?? undefined, + }) + + if (isWeb) { + // Clear the URL parameters so they don't re-trigger + history.pushState(null, '', '/') + } + + /* + * If we don't have an account or the account doesn't match, do + * nothing. By the time the user switches to their other account, AA + * state should be ready for them. + */ + if (state && currentAccount && state.actorDid === currentAccount.did) { + return state + } + + return null + }) + const open = useCallback((state: RedirectOverlayState) => { + setState(state) + }, []) + const close = useCallback(() => { + setState(null) + }, []) + + return ( + ({ + isOpen: state !== null, + open, + close, + }), + [state, open, close], + )}> + {children} + + ) +} + +export function RedirectOverlay() { + const t = useTheme() + const {_} = useLingui() + const {isOpen} = useRedirectOverlayContext() + const {gtMobile} = useBreakpoints() + + return isOpen ? ( + + + + + + + + + + ) : null +} + +function Inner() { + const t = useTheme() + const {_} = useLingui() + const agent = useAgent() + const polling = useRef(false) + const unmounted = useRef(false) + const [error, setError] = useState(false) + const [success, setSuccess] = useState(false) + const {close} = useRedirectOverlayContext() + + useEffect(() => { + if (polling.current) return + + polling.current = true + + logger.metric('ageAssurance:redirectDialogOpen', {}) + + wait( + 3e3, + retry( + 5, + () => true, + async () => { + if (!agent.session) return + if (unmounted.current) return + + const data = await refetchAgeAssuranceServerState({agent}) + + if (data?.state.status !== 'assured') { + throw new Error( + `Polling for age assurance state did not receive assured status`, + ) + } + + return data + }, + 1e3, + ), + ) + .then(async data => { + if (!data) return + if (!agent.session) return + if (unmounted.current) return + + setSuccess(true) + + logger.metric('ageAssurance:redirectDialogSuccess', {}) + }) + .catch(() => { + if (unmounted.current) return + setError(true) + logger.metric('ageAssurance:redirectDialogFail', {}) + }) + + return () => { + unmounted.current = true + } + }, [agent]) + + if (success) { + return ( + <> + + + + + + + Success + + + + + + We've confirmed your age assurance status. You can now close this + dialog. + + + + + + + + + ) + } + + return ( + <> + + + + + {error && } + + + {error ? Connection issue : Verifying} + + + {!error && } + + + + {error ? ( + + We were unable to receive the verification due to a connection + issue. It may arrive later. If it does, your account will update + automatically. + + ) : ( + + We're confirming your age assurance status with our servers. This + should only take a few seconds. + + )} + + + {error && ( + + + + )} + + + ) +} diff --git a/src/ageAssurance/data.tsx b/src/ageAssurance/data.tsx new file mode 100644 index 0000000000..24619890c8 --- /dev/null +++ b/src/ageAssurance/data.tsx @@ -0,0 +1,495 @@ +import {createContext, useCallback, useContext, useEffect, useMemo} from 'react' +import { + type AppBskyAgeassuranceDefs, + type AppBskyAgeassuranceGetConfig, + type AppBskyAgeassuranceGetState, + AtpAgent, + getAgeAssuranceRegionConfig, +} from '@atproto/api' +import AsyncStorage from '@react-native-async-storage/async-storage' +import {createAsyncStoragePersister} from '@tanstack/query-async-storage-persister' +import {focusManager, QueryClient, useQuery} from '@tanstack/react-query' +import {persistQueryClient} from '@tanstack/react-query-persist-client' +import debounce from 'lodash.debounce' + +import {networkRetry} from '#/lib/async/retry' +import {PUBLIC_BSKY_SERVICE} from '#/lib/constants' +import {getAge} from '#/lib/strings/time' +import {snoozeBirthdateUpdateAllowedForDid} from '#/state/birthdate' +import {useAgent, useSession} from '#/state/session' +import * as debug from '#/ageAssurance/debug' +import {logger} from '#/ageAssurance/logger' +import {isLegacyBirthdateBug} from '#/ageAssurance/util' +import {IS_DEV} from '#/env' +import {device} from '#/storage' + +/** + * Special query client for age assurance data so we can prefetch on app + * load without interfering with other queries. + */ +const qc = new QueryClient({ + defaultOptions: { + queries: { + /** + * We clear this manually, so disable automatic garbage collection. + * @see https://tanstack.com/query/latest/docs/framework/react/plugins/persistQueryClient#how-it-works + */ + gcTime: Infinity, + }, + }, +}) +const persister = createAsyncStoragePersister({ + storage: AsyncStorage, + key: 'age-assurance-query-client', +}) +const [, cacheHydrationPromise] = persistQueryClient({ + queryClient: qc, + persister, +}) + +function getDidFromAgentSession(agent: AtpAgent) { + const sessionManager = agent.sessionManager + if (!sessionManager || !sessionManager.did) return + return sessionManager.did +} + +/* + * Optimistic data + */ + +const createdAtCache = new Map() +export function setCreatedAtForDid({ + did, + createdAt, +}: { + did: string + createdAt: string +}) { + createdAtCache.set(did, createdAt) +} +const birthdateCache = new Map() +export function setBirthdateForDid({ + did, + birthdate, +}: { + did: string + birthdate: string +}) { + birthdateCache.set(did, birthdate) +} + +/* + * Config + */ + +export const configQueryKey = ['config'] +export async function getConfig() { + if (debug.enabled) return debug.resolve(debug.config) + const agent = new AtpAgent({ + service: PUBLIC_BSKY_SERVICE, + }) + const res = await agent.app.bsky.ageassurance.getConfig() + return res.data +} +export function getConfigFromCache(): + | AppBskyAgeassuranceGetConfig.OutputSchema + | undefined { + return qc.getQueryData( + configQueryKey, + ) +} +let configPrefetchPromise: Promise | undefined +export async function prefetchConfig() { + if (configPrefetchPromise) { + logger.debug(`prefetchAgeAssuranceConfig: already in progress`) + return + } + + configPrefetchPromise = new Promise(async resolve => { + await cacheHydrationPromise + const cached = getConfigFromCache() + + if (cached) { + logger.debug(`prefetchAgeAssuranceConfig: using cache`) + resolve() + } else { + try { + logger.debug(`prefetchAgeAssuranceConfig: resolving...`) + const res = await networkRetry(3, () => getConfig()) + qc.setQueryData( + configQueryKey, + res, + ) + } catch (e: any) { + logger.warn(`prefetchAgeAssuranceConfig: failed`, { + safeMessage: e.message, + }) + } finally { + resolve() + } + } + }) +} +export function useConfigQuery() { + return useQuery( + { + /** + * Will re-fetch when stale, at most every hour (or 5s in dev for easier + * testing). + * + * @see https://tanstack.com/query/latest/docs/framework/react/guides/initial-query-data#initial-data-from-the-cache-with-initialdataupdatedat + */ + staleTime: IS_DEV ? 5e3 : 1000 * 60 * 60, + initialData: getConfigFromCache(), + initialDataUpdatedAt: () => + qc.getQueryState(configQueryKey)?.dataUpdatedAt, + queryKey: configQueryKey, + async queryFn() { + logger.debug(`useConfigQuery: fetching config`) + return getConfig() + }, + }, + qc, + ) +} + +/* + * Server state + */ + +export function createServerStateQueryKey({did}: {did: string}) { + return ['serverState', did] +} +export async function getServerState({agent}: {agent: AtpAgent}) { + if (debug.enabled && debug.serverState) + return debug.resolve(debug.serverState) + const geolocation = device.get(['mergedGeolocation']) + if (!geolocation || !geolocation.countryCode) { + logger.error(`getServerState: missing geolocation countryCode`) + return + } + const {data} = await agent.app.bsky.ageassurance.getState({ + countryCode: geolocation.countryCode, + regionCode: geolocation.regionCode, + }) + const did = getDidFromAgentSession(agent) + if (data && did && createdAtCache.has(did)) { + /* + * If account was just created, just use the local cache if available. On + * subsequent reloads, the server should have the correct value. + */ + data.metadata.accountCreatedAt = createdAtCache.get(did) + } + return data ?? null +} +export function getServerStateFromCache({ + did, +}: { + did: string +}): AppBskyAgeassuranceGetState.OutputSchema | undefined { + return qc.getQueryData( + createServerStateQueryKey({did}), + ) +} +export async function prefetchServerState({agent}: {agent: AtpAgent}) { + const did = getDidFromAgentSession(agent) + + if (!did) return + + await cacheHydrationPromise + const qk = createServerStateQueryKey({did}) + const cached = getServerStateFromCache({did}) + + if (cached) { + logger.debug(`prefetchServerState: using cache`) + return + } + + try { + logger.debug(`prefetchServerState: resolving...`) + const res = await networkRetry(3, () => getServerState({agent})) + qc.setQueryData(qk, res) + } catch (e: any) { + logger.warn(`prefetchServerState: failed`, { + safeMessage: e.message, + }) + } +} +export async function refetchServerState({agent}: {agent: AtpAgent}) { + const did = getDidFromAgentSession(agent) + if (!did) return + logger.debug(`refetchServerState: fetching...`) + const res = await networkRetry(3, () => getServerState({agent})) + qc.setQueryData( + createServerStateQueryKey({did}), + res, + ) + return res +} +export function usePatchServerState() { + const {currentAccount} = useSession() + return useCallback( + async (next: AppBskyAgeassuranceDefs.State) => { + if (!currentAccount) return + const did = currentAccount.did + const prev = getServerStateFromCache({did}) + const merged: AppBskyAgeassuranceGetState.OutputSchema = { + metadata: {}, + ...(prev || {}), + state: next, + } + qc.setQueryData( + createServerStateQueryKey({did}), + merged, + ) + }, + [currentAccount], + ) +} +export function useServerStateQuery() { + const agent = useAgent() + const did = getDidFromAgentSession(agent) + const query = useQuery( + { + enabled: !!did, + initialData: () => { + if (!did) return + return getServerStateFromCache({did}) + }, + queryKey: createServerStateQueryKey({did: did!}), + async queryFn() { + return getServerState({agent}) + }, + }, + qc, + ) + const refetch = useMemo(() => debounce(query.refetch, 100), [query.refetch]) + + const isAssured = query.data?.state?.status === 'assured' + + /** + * `refetchOnWindowFocus` doesn't seem to want to work for this custom query + * client, so we manually subscribe to focus changes. + */ + useEffect(() => { + return focusManager.subscribe(() => { + // logged out + if (!did) return + + const isFocused = focusManager.isFocused() + + if (!isFocused) return + + const config = getConfigFromCache() + const geolocation = device.get(['mergedGeolocation']) + const isAArequired = Boolean( + config && + geolocation && + !!getAgeAssuranceRegionConfig(config, { + countryCode: geolocation?.countryCode ?? '', + regionCode: geolocation?.regionCode, + }), + ) + + // only refetch when needed + if (isAssured || !isAArequired) return + + refetch() + }) + }, [did, refetch, isAssured]) + + return query +} + +/* + * Other required data + */ + +export type OtherRequiredData = { + birthdate: string | undefined +} +export function createOtherRequiredDataQueryKey({did}: {did: string}) { + return ['otherRequiredData', did] +} +export async function getOtherRequiredData({ + agent, +}: { + agent: AtpAgent +}): Promise { + if (debug.enabled) return debug.resolve(debug.otherRequiredData) + const [prefs] = await Promise.all([agent.getPreferences()]) + const data: OtherRequiredData = { + birthdate: prefs.birthDate ? prefs.birthDate.toISOString() : undefined, + } + const did = getDidFromAgentSession(agent) + if (data && did && birthdateCache.has(did)) { + /* + * If birthdate was just set, use the local cache value. On subsequent + * reloads, the server should have the correct value. + */ + data.birthdate = birthdateCache.get(did) + } + + /** + * If the user is under the minimum age, and the birthdate is not due to + * the legacy bug, snooze further birthdate updates for this user. + */ + if (data.birthdate && !isLegacyBirthdateBug(data.birthdate)) { + snoozeBirthdateUpdateAllowedForDid(did!) + } + + return data +} +export function getOtherRequiredDataFromCache({ + did, +}: { + did: string +}): OtherRequiredData | undefined { + return qc.getQueryData( + createOtherRequiredDataQueryKey({did}), + ) +} +export async function prefetchOtherRequiredData({agent}: {agent: AtpAgent}) { + const did = getDidFromAgentSession(agent) + + if (!did) return + + await cacheHydrationPromise + const qk = createOtherRequiredDataQueryKey({did}) + const cached = getOtherRequiredDataFromCache({did}) + + if (cached) { + logger.debug(`prefetchOtherRequiredData: using cache`) + return + } + + try { + logger.debug(`prefetchOtherRequiredData: resolving...`) + const res = await networkRetry(3, () => getOtherRequiredData({agent})) + qc.setQueryData(qk, res) + } catch (e: any) { + logger.warn(`prefetchOtherRequiredData: failed`, { + safeMessage: e.message, + }) + } +} +export function usePatchOtherRequiredData() { + const {currentAccount} = useSession() + return useCallback( + async (next: OtherRequiredData) => { + if (!currentAccount) return + const did = currentAccount.did + const prev = getOtherRequiredDataFromCache({did}) + const merged: OtherRequiredData = { + ...(prev || {}), + ...next, + } + qc.setQueryData( + createOtherRequiredDataQueryKey({did}), + merged, + ) + }, + [currentAccount], + ) +} +export function useOtherRequiredDataQuery() { + const agent = useAgent() + const did = getDidFromAgentSession(agent) + return useQuery( + { + enabled: !!did, + initialData: () => { + if (!did) return + return getOtherRequiredDataFromCache({did}) + }, + queryKey: createOtherRequiredDataQueryKey({did: did!}), + async queryFn() { + return getOtherRequiredData({agent}) + }, + }, + qc, + ) +} + +/** + * Helper to prefetch all age assurance data. + */ +export function prefetchAgeAssuranceData({agent}: {agent: AtpAgent}) { + return Promise.allSettled([ + // config fetch initiated at the top of the App.platform.tsx files, awaited here + configPrefetchPromise, + prefetchServerState({agent}), + prefetchOtherRequiredData({agent}), + ]) +} + +export function clearAgeAssuranceDataForDid({did}: {did: string}) { + logger.debug(`clearAgeAssuranceDataForDid: ${did}`) + qc.removeQueries({queryKey: createServerStateQueryKey({did}), exact: true}) + qc.removeQueries({ + queryKey: createOtherRequiredDataQueryKey({did}), + exact: true, + }) +} + +export function clearAgeAssuranceData() { + logger.debug(`clearAgeAssuranceData`) + qc.clear() +} + +/* + * Context + */ + +export type AgeAssuranceData = { + config: AppBskyAgeassuranceDefs.Config | undefined + state: AppBskyAgeassuranceDefs.State | undefined + data: + | { + accountCreatedAt: AppBskyAgeassuranceDefs.StateMetadata['accountCreatedAt'] + declaredAge: number | undefined + birthdate: string | undefined + } + | undefined +} +export const AgeAssuranceDataContext = createContext({ + config: undefined, + state: undefined, + data: { + accountCreatedAt: undefined, + declaredAge: undefined, + birthdate: undefined, + }, +}) +export function useAgeAssuranceDataContext() { + return useContext(AgeAssuranceDataContext) +} +export function AgeAssuranceDataProvider({ + children, +}: { + children: React.ReactNode +}) { + const {data: config} = useConfigQuery() + const serverState = useServerStateQuery() + const {state, metadata} = serverState.data || {} + const {data} = useOtherRequiredDataQuery() + const ctx = useMemo( + () => ({ + config, + state, + data: { + accountCreatedAt: metadata?.accountCreatedAt, + declaredAge: data?.birthdate + ? getAge(new Date(data.birthdate)) + : undefined, + birthdate: data?.birthdate, + }, + }), + [config, state, data, metadata], + ) + return ( + + {children} + + ) +} diff --git a/src/ageAssurance/debug.ts b/src/ageAssurance/debug.ts new file mode 100644 index 0000000000..d31024755c --- /dev/null +++ b/src/ageAssurance/debug.ts @@ -0,0 +1,84 @@ +import { + ageAssuranceRuleIDs as ids, + type AppBskyAgeassuranceDefs, + type AppBskyAgeassuranceGetState, +} from '@atproto/api' + +import {type OtherRequiredData} from '#/ageAssurance/data' +import {IS_DEV} from '#/env' +import {type Geolocation} from '#/geolocation' + +export const enabled = IS_DEV && false + +export const geolocation: Geolocation | undefined = enabled + ? { + countryCode: 'AA', + regionCode: undefined, + } + : undefined + +export const deviceGeolocation: Geolocation | undefined = enabled + ? { + countryCode: 'AA', + regionCode: undefined, + } + : undefined + +export const config: AppBskyAgeassuranceDefs.Config = { + regions: [ + { + countryCode: 'AA', + regionCode: undefined, + rules: [ + { + $type: ids.IfAccountNewerThan, + date: '2025-12-01T00:00:00Z', + access: 'none', + }, + { + $type: ids.IfAssuredOverAge, + age: 18, + access: 'full', + }, + { + $type: ids.IfAssuredOverAge, + age: 16, + access: 'safe', + }, + { + $type: ids.IfDeclaredUnderAge, + age: 16, + access: 'none', + }, + { + $type: ids.Default, + access: 'safe', + }, + ], + }, + ], +} + +export const otherRequiredData: OtherRequiredData = { + birthdate: new Date(2000, 1, 1).toISOString(), +} + +const serverStateEnabled = false +export const serverState: AppBskyAgeassuranceGetState.OutputSchema | undefined = + serverStateEnabled + ? { + state: { + lastInitiatedAt: new Date(2023, 5, 1).toISOString(), + status: 'assured', + access: 'safe', + }, + metadata: { + accountCreatedAt: new Date(2023, 11, 1).toISOString(), + }, + } + : undefined + +export async function resolve(data: T) { + await new Promise(y => setTimeout(y, 2000)) // simulate network + return data +} diff --git a/src/ageAssurance/index.tsx b/src/ageAssurance/index.tsx new file mode 100644 index 0000000000..9a0a9c9d51 --- /dev/null +++ b/src/ageAssurance/index.tsx @@ -0,0 +1,110 @@ +import {createContext, useCallback, useContext, useEffect, useMemo} from 'react' + +import {useGetAndRegisterPushToken} from '#/lib/notifications/notifications' +import {Provider as RedirectOverlayProvider} from '#/ageAssurance/components/RedirectOverlay' +import {AgeAssuranceDataProvider} from '#/ageAssurance/data' +import {useAgeAssuranceDataContext} from '#/ageAssurance/data' +import {logger} from '#/ageAssurance/logger' +import { + useAgeAssuranceState, + useOnAgeAssuranceAccessUpdate, +} from '#/ageAssurance/state' +import { + AgeAssuranceAccess, + type AgeAssuranceState, + AgeAssuranceStatus, +} from '#/ageAssurance/types' +import {isUserUnderAdultAge} from '#/ageAssurance/util' + +export { + prefetchConfig as prefetchAgeAssuranceConfig, + prefetchAgeAssuranceData, + refetchServerState as refetchAgeAssuranceServerState, + usePatchOtherRequiredData as usePatchAgeAssuranceOtherRequiredData, + usePatchServerState as usePatchAgeAssuranceServerState, +} from '#/ageAssurance/data' +export {logger} from '#/ageAssurance/logger' + +const AgeAssuranceStateContext = createContext<{ + Access: typeof AgeAssuranceAccess + Status: typeof AgeAssuranceStatus + state: AgeAssuranceState + flags: { + adultContentDisabled: boolean + chatDisabled: boolean + } +}>({ + Access: AgeAssuranceAccess, + Status: AgeAssuranceStatus, + state: { + lastInitiatedAt: undefined, + status: AgeAssuranceStatus.Unknown, + access: AgeAssuranceAccess.Full, + }, + flags: { + adultContentDisabled: false, + chatDisabled: false, + }, +}) + +/** + * THE MAIN AGE ASSURANCE CONTEXT HOOK + * + * Prefer this to using any of the lower-level data-provider hooks. + */ +export function useAgeAssurance() { + return useContext(AgeAssuranceStateContext) +} + +export function Provider({children}: {children: React.ReactNode}) { + return ( + + + {children} + + + ) +} + +function InnerProvider({children}: {children: React.ReactNode}) { + const state = useAgeAssuranceState() + const {data} = useAgeAssuranceDataContext() + const getAndRegisterPushToken = useGetAndRegisterPushToken() + + const handleAccessUpdate = useCallback( + (s: AgeAssuranceState) => { + getAndRegisterPushToken({ + isAgeRestricted: s.access !== AgeAssuranceAccess.Full, + }) + }, + [getAndRegisterPushToken], + ) + useOnAgeAssuranceAccessUpdate(handleAccessUpdate) + + useEffect(() => { + logger.debug(`useAgeAssuranceState`, {state}) + }, [state]) + + return ( + { + const chatDisabled = state.access !== AgeAssuranceAccess.Full + const isUnderage = data?.birthdate + ? isUserUnderAdultAge(data.birthdate) + : true + const adultContentDisabled = + state.access !== AgeAssuranceAccess.Full || isUnderage + return { + Access: AgeAssuranceAccess, + Status: AgeAssuranceStatus, + state, + flags: { + adultContentDisabled, + chatDisabled, + }, + } + }, [state, data])}> + {children} + + ) +} diff --git a/src/state/ageAssurance/util.ts b/src/ageAssurance/logger.ts similarity index 100% rename from src/state/ageAssurance/util.ts rename to src/ageAssurance/logger.ts diff --git a/src/ageAssurance/state.ts b/src/ageAssurance/state.ts new file mode 100644 index 0000000000..cc8b60ac52 --- /dev/null +++ b/src/ageAssurance/state.ts @@ -0,0 +1,100 @@ +import {useEffect, useMemo, useState} from 'react' +import {computeAgeAssuranceRegionAccess} from '@atproto/api' + +import {useSession} from '#/state/session' +import {useAgeAssuranceDataContext} from '#/ageAssurance/data' +import {logger} from '#/ageAssurance/logger' +import { + AgeAssuranceAccess, + type AgeAssuranceState, + AgeAssuranceStatus, + parseAccessFromString, + parseStatusFromString, +} from '#/ageAssurance/types' +import {getAgeAssuranceRegionConfigWithFallback} from '#/ageAssurance/util' +import {useGeolocation} from '#/geolocation' + +export function useAgeAssuranceState(): AgeAssuranceState { + const {hasSession} = useSession() + const geolocation = useGeolocation() + const {config, state, data} = useAgeAssuranceDataContext() + + return useMemo(() => { + /** + * This is where we control logged-out moderation prefs. It's all + * downstream of AA now. + */ + if (!hasSession) + return { + status: AgeAssuranceStatus.Unknown, + access: AgeAssuranceAccess.Safe, + } + + // should never happen, but need to guard + if (!config) { + logger.warn('useAgeAssuranceState: missing config') + return { + status: AgeAssuranceStatus.Unknown, + access: AgeAssuranceAccess.Unknown, + } + } + + const region = getAgeAssuranceRegionConfigWithFallback(config, geolocation) + const isAARequired = region.countryCode !== '*' + const isTerminalState = + state?.status === 'assured' || state?.status === 'blocked' + + /* + * If we are in a terminal state and AA is required for this region, + * we can trust the server state completely and avoid recomputing. + */ + if (isTerminalState && isAARequired) { + return { + lastInitiatedAt: state.lastInitiatedAt, + status: parseStatusFromString(state.status), + access: parseAccessFromString(state.access), + } + } + + /* + * Otherwise, we need to compute the access based on the latest data. For + * accounts with an accurate birthdate, our default fallback rules should + * ensure correct access. + */ + const result = computeAgeAssuranceRegionAccess(region, data) + const computed = { + lastInitiatedAt: state?.lastInitiatedAt, + // prefer server state + status: state?.status + ? parseStatusFromString(state?.status) + : AgeAssuranceStatus.Unknown, + // prefer server state + access: result + ? parseAccessFromString(result.access) + : AgeAssuranceAccess.Full, + } + logger.debug('debug useAgeAssuranceState', { + region, + state, + data, + computed, + }) + return computed + }, [hasSession, geolocation, config, state, data]) +} + +export function useOnAgeAssuranceAccessUpdate( + cb: (state: AgeAssuranceState) => void, +) { + const state = useAgeAssuranceState() + // start with null to ensure callback is called on first render + const [prevAccess, setPrevAccess] = useState(null) + + useEffect(() => { + if (prevAccess !== state.access) { + setPrevAccess(state.access) + cb(state) + logger.debug(`useOnAgeAssuranceAccessUpdate`, {state}) + } + }, [cb, state, prevAccess]) +} diff --git a/src/ageAssurance/types.ts b/src/ageAssurance/types.ts new file mode 100644 index 0000000000..9f83975d3e --- /dev/null +++ b/src/ageAssurance/types.ts @@ -0,0 +1,53 @@ +import {logger} from '#/ageAssurance/logger' + +export enum AgeAssuranceAccess { + Unknown = 'unknown', + None = 'none', + Safe = 'safe', + Full = 'full', +} + +export enum AgeAssuranceStatus { + Unknown = 'unknown', + Pending = 'pending', + Assured = 'assured', + Blocked = 'blocked', +} + +export type AgeAssuranceState = { + lastInitiatedAt?: string + status: AgeAssuranceStatus + access: AgeAssuranceAccess +} + +export function parseStatusFromString(raw: string) { + switch (raw) { + case 'unknown': + return AgeAssuranceStatus.Unknown + case 'pending': + return AgeAssuranceStatus.Pending + case 'assured': + return AgeAssuranceStatus.Assured + case 'blocked': + return AgeAssuranceStatus.Blocked + default: + logger.error(`parseStatusFromString: unknown status value: ${raw}`) + return AgeAssuranceStatus.Unknown + } +} + +export function parseAccessFromString(raw: string) { + switch (raw) { + case 'unknown': + return AgeAssuranceAccess.Unknown + case 'none': + return AgeAssuranceAccess.None + case 'safe': + return AgeAssuranceAccess.Safe + case 'full': + return AgeAssuranceAccess.Full + default: + logger.error(`parseAccessFromString: unknown access value: ${raw}`) + return AgeAssuranceAccess.Full + } +} diff --git a/src/ageAssurance/useBeginAgeAssurance.ts b/src/ageAssurance/useBeginAgeAssurance.ts new file mode 100644 index 0000000000..9614155698 --- /dev/null +++ b/src/ageAssurance/useBeginAgeAssurance.ts @@ -0,0 +1,74 @@ +import {type AppBskyAgeassuranceBegin, AtpAgent} from '@atproto/api' +import {useMutation} from '@tanstack/react-query' + +import {wait} from '#/lib/async/wait' +import { + DEV_ENV_APPVIEW, + PUBLIC_APPVIEW, + PUBLIC_APPVIEW_DID, +} from '#/lib/constants' +import {isNetworkError} from '#/lib/hooks/useCleanError' +import {logger} from '#/logger' +import {useAgent} from '#/state/session' +import {usePatchAgeAssuranceServerState} from '#/ageAssurance' +import {BLUESKY_PROXY_DID} from '#/env' +import {useGeolocation} from '#/geolocation' + +const IS_DEV_ENV = BLUESKY_PROXY_DID !== PUBLIC_APPVIEW_DID +const APPVIEW = IS_DEV_ENV ? DEV_ENV_APPVIEW : PUBLIC_APPVIEW + +export function useBeginAgeAssurance() { + const agent = useAgent() + const geolocation = useGeolocation() + const patchAgeAssuranceStateResponse = usePatchAgeAssuranceServerState() + + return useMutation({ + async mutationFn( + props: Omit< + AppBskyAgeassuranceBegin.InputSchema, + 'countryCode' | 'regionCode' + >, + ) { + const countryCode = geolocation?.countryCode + const regionCode = geolocation?.regionCode + if (!countryCode) { + throw new Error(`Geolocation not available, cannot init age assurance.`) + } + + const { + data: {token}, + } = await agent.com.atproto.server.getServiceAuth({ + aud: BLUESKY_PROXY_DID, + lxm: `app.bsky.ageassurance.begin`, + }) + + const appView = new AtpAgent({service: APPVIEW}) + appView.sessionManager.session = {...agent.session!} + appView.sessionManager.session.accessJwt = token + appView.sessionManager.session.refreshJwt = '' + + /* + * 2s wait is good actually. Email sending takes a hot sec and this helps + * ensure the email is ready for the user once they open their inbox. + */ + const {data} = await wait( + 2e3, + appView.app.bsky.ageassurance.begin({ + ...props, + countryCode: countryCode.toUpperCase(), + regionCode: regionCode ? regionCode.toUpperCase() : undefined, + }), + ) + + // Just keeps this in sync, not necessarily used right now + patchAgeAssuranceStateResponse(data) + }, + onError(e) { + if (!isNetworkError(e)) { + logger.error(`useBeginAgeAssurance failed`, { + safeMessage: e, + }) + } + }, + }) +} diff --git a/src/ageAssurance/useComputeAgeAssuranceRegionAccess.ts b/src/ageAssurance/useComputeAgeAssuranceRegionAccess.ts new file mode 100644 index 0000000000..e3ea48860f --- /dev/null +++ b/src/ageAssurance/useComputeAgeAssuranceRegionAccess.ts @@ -0,0 +1,29 @@ +import {useCallback} from 'react' +import {computeAgeAssuranceRegionAccess} from '@atproto/api' + +import {useAgeAssuranceDataContext} from '#/ageAssurance/data' +import {logger} from '#/ageAssurance/logger' +import {AgeAssuranceAccess, parseAccessFromString} from '#/ageAssurance/types' +import {getAgeAssuranceRegionConfigWithFallback} from '#/ageAssurance/util' +import {type Geolocation} from '#/geolocation' + +export function useComputeAgeAssuranceRegionAccess() { + const {config, data} = useAgeAssuranceDataContext() + return useCallback( + (geolocation: Geolocation) => { + if (!config) { + logger.warn('useComputeAgeAssuranceRegionAccess: missing config') + return AgeAssuranceAccess.Unknown + } + const region = getAgeAssuranceRegionConfigWithFallback( + config, + geolocation, + ) + const result = computeAgeAssuranceRegionAccess(region, data) + return result + ? parseAccessFromString(result.access) + : AgeAssuranceAccess.Full + }, + [config, data], + ) +} diff --git a/src/ageAssurance/util.ts b/src/ageAssurance/util.ts new file mode 100644 index 0000000000..1043283305 --- /dev/null +++ b/src/ageAssurance/util.ts @@ -0,0 +1,88 @@ +import {useMemo} from 'react' +import { + ageAssuranceRuleIDs as ids, + type AppBskyAgeassuranceDefs, + getAgeAssuranceRegionConfig, +} from '@atproto/api' + +import {getAge} from '#/lib/strings/time' +import {useAgeAssuranceDataContext} from '#/ageAssurance/data' +import {AgeAssuranceAccess} from '#/ageAssurance/types' +import {type Geolocation, useGeolocation} from '#/geolocation' + +const DEFAULT_MIN_AGE = 13 + +/** + * Get age assurance region config based on geolocation, with fallback to + * app defaults if no region config is found. + * + * See {@link getAgeAssuranceRegionConfig} for the generic option, which can + * return undefined if the geolocation does not match any AA region. + */ +export function getAgeAssuranceRegionConfigWithFallback( + config: AppBskyAgeassuranceDefs.Config, + geolocation: Geolocation, +): AppBskyAgeassuranceDefs.ConfigRegion { + const region = getAgeAssuranceRegionConfig(config, { + countryCode: geolocation.countryCode ?? '', + 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, + }, + ], + } + ) +} + +/** + * Hook to get the age assurance region config based on current geolocation. + * Does not fall-back to our app defaults. If no config is found, returns + * undefined, which indicates no regional age assurance rules apply. + */ +export function useAgeAssuranceRegionConfig() { + const geolocation = useGeolocation() + const {config} = useAgeAssuranceDataContext() + return useMemo(() => { + if (!config) return + // use generic helper, we want to potentially return undefined + return getAgeAssuranceRegionConfig(config, { + countryCode: geolocation.countryCode ?? '', + regionCode: geolocation.regionCode, + }) + }, [config, geolocation]) +} + +/** + * 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 + * the bday dialog, and it defaulted to the current date. This bug _has_ been + * seen in production, so we need to check for it where possible. + */ +export function isLegacyBirthdateBug(birthDate: string) { + return ['2025', '2024', '2023'].includes((birthDate || '').slice(0, 4)) +} + +/** + * Returns whether the user is under the minimum age required to use the app. + * This applies to all regions. + */ +export function isUserUnderMinimumAge(birthDate: string) { + return getAge(new Date(birthDate)) < DEFAULT_MIN_AGE +} + +export function isUserUnderAdultAge(birthDate: string) { + return getAge(new Date(birthDate)) < 18 +} diff --git a/src/components/BlockedGeoOverlay.tsx b/src/components/BlockedGeoOverlay.tsx deleted file mode 100644 index d6e2626875..0000000000 --- a/src/components/BlockedGeoOverlay.tsx +++ /dev/null @@ -1,193 +0,0 @@ -import {useEffect} from 'react' -import {ScrollView, View} from 'react-native' -import {useSafeAreaInsets} from 'react-native-safe-area-context' -import {msg, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' - -import {logger} from '#/logger' -import {isWeb} from '#/platform/detection' -import {useDeviceGeolocationApi} from '#/state/geolocation' -import {atoms as a, useBreakpoints, useTheme, web} from '#/alf' -import {Button, ButtonIcon, ButtonText} from '#/components/Button' -import * as Dialog from '#/components/Dialog' -import {DeviceLocationRequestDialog} from '#/components/dialogs/DeviceLocationRequestDialog' -import {Divider} from '#/components/Divider' -import {Full as Logo, Mark} from '#/components/icons/Logo' -import {PinLocation_Stroke2_Corner0_Rounded as LocationIcon} from '#/components/icons/PinLocation' -import {SimpleInlineLinkText as InlineLinkText} from '#/components/Link' -import {Outlet as PortalOutlet} from '#/components/Portal' -import * as Toast from '#/components/Toast' -import {Text} from '#/components/Typography' -import {BottomSheetOutlet} from '#/../modules/bottom-sheet' - -export function BlockedGeoOverlay() { - const t = useTheme() - const {_} = useLingui() - const {gtPhone} = useBreakpoints() - const insets = useSafeAreaInsets() - const geoDialog = Dialog.useDialogControl() - const {setDeviceGeolocation} = useDeviceGeolocationApi() - - useEffect(() => { - // just counting overall hits here - logger.metric(`blockedGeoOverlay:shown`, {}) - }, []) - - const textStyles = [a.text_md, a.leading_normal] - const links = { - blog: { - to: `https://bsky.social/about/blog/08-22-2025-mississippi-hb1126`, - label: _(msg`Read our blog post`), - overridePresentation: false, - disableMismatchWarning: true, - style: textStyles, - }, - } - - const blocks = [ - _(msg`Unfortunately, Bluesky is unavailable in Mississippi right now.`), - _( - msg`A new Mississippi law requires us to implement age verification for all users before they can access Bluesky. We think this law creates challenges that go beyond its child safety goals, and creates significant barriers that limit free speech and disproportionately harm smaller platforms and emerging technologies.`, - ), - _( - msg`As a small team, we cannot justify building the expensive infrastructure this requirement demands while legal challenges to this law are pending.`, - ), - _( - msg`For now, we have made the difficult decision to block access to Bluesky in the state of Mississippi.`, - ), - <> - To learn more, read our{' '} - blog post. - , - ] - - return ( - <> - - - - - - - Announcement - - - - - - {blocks.map((block, index) => ( - - {block} - - ))} - - - {!isWeb && ( - <> - - - - - - - Not in Mississippi? - - - - Confirm your location with GPS. Your location data is not - tracked and does not leave your device. - - - - - - { - if (props.geolocationStatus.isAgeBlockedGeo) { - props.disableDialogAction() - props.setDialogError( - _( - msg`We're sorry, but based on your device's location, you are currently located in a region where we cannot provide access at this time.`, - ), - ) - } else { - props.closeDialog(() => { - // set this after close! - setDeviceGeolocation({ - countryCode: props.geolocationStatus.countryCode, - regionCode: props.geolocationStatus.regionCode, - }) - Toast.show(_(msg`Thanks! You're all set.`), { - type: 'success', - }) - }) - } - }} - /> - - )} - - - - - - - - {/* - * While this blocking overlay is up, other dialogs in the shell - * are not mounted, so it _should_ be safe to use these here - * without fear of other modals showing up. - */} - - - - ) -} diff --git a/src/components/FeedInterstitials.tsx b/src/components/FeedInterstitials.tsx index add8ffecd4..7418c8d766 100644 --- a/src/components/FeedInterstitials.tsx +++ b/src/components/FeedInterstitials.tsx @@ -27,13 +27,15 @@ import { web, } from '#/alf' import {Button, ButtonIcon, ButtonText} from '#/components/Button' +import {useDialogControl} from '#/components/Dialog' import * as FeedCard from '#/components/FeedCard' import {ArrowRight_Stroke2_Corner0_Rounded as ArrowRight} from '#/components/icons/Arrow' import {Hashtag_Stroke2_Corner0_Rounded as Hashtag} from '#/components/icons/Hashtag' -import {InlineLinkText, Link} from '#/components/Link' +import {InlineLinkText} from '#/components/Link' import * as ProfileCard from '#/components/ProfileCard' import {Text} from '#/components/Typography' import type * as bsky from '#/types/bsky' +import {FollowDialogWithoutGuide} from './ProgressGuide/FollowDialog' import {ProgressGuideList} from './ProgressGuide/List' const MOBILE_CARD_WIDTH = 165 @@ -253,6 +255,7 @@ export function ProfileGrid({ const {_} = useLingui() const moderationOpts = useModerationOpts() const {gtMobile} = useBreakpoints() + const followDialogControl = useDialogControl() const isLoading = isSuggestionsLoading || !moderationOpts const isProfileHeaderContext = viewContext === 'profileHeader' @@ -474,19 +477,34 @@ export function ProfileGrid({ )} {!isProfileHeaderContext && ( - { - logger.metric('suggestedUser:seeMore', { + followDialogControl.open() + logEvent('suggestedUser:seeMore', { logContext: isFeedContext ? 'Explore' : 'Profile', }) }}> - See more - + {({hovered}) => ( + + See more + + )} + )} + + {gtMobile ? ( @@ -503,7 +521,16 @@ export function ProfileGrid({ decelerationRate="fast"> {content} - {!isProfileHeaderContext && } + {!isProfileHeaderContext && ( + { + followDialogControl.open() + logger.metric('suggestedUser:seeMore', { + logContext: 'Explore', + }) + }} + /> + )} )} @@ -511,20 +538,14 @@ export function ProfileGrid({ ) } -function SeeMoreSuggestedProfilesCard() { +function SeeMoreSuggestedProfilesCard({onPress}: {onPress: () => void}) { const t = useTheme() const {_} = useLingui() return ( - { - logger.metric('suggestedUser:seeMore', { - logContext: 'Explore', - }) - }} + ) } diff --git a/src/components/Link.tsx b/src/components/Link.tsx index b075fa2e0a..8618364281 100644 --- a/src/components/Link.tsx +++ b/src/components/Link.tsx @@ -421,6 +421,7 @@ export function SimpleInlineLinkText({ label, disableUnderline, shouldProxy, + onPress: outerOnPress, ...rest }: Omit< InlineLinkProps, @@ -428,7 +429,6 @@ export function SimpleInlineLinkText({ | 'action' | 'disableMismatchWarning' | 'overridePresentation' - | 'onPress' | 'onLongPress' | 'shareOnLongPress' > & { @@ -448,7 +448,9 @@ export function SimpleInlineLinkText({ href = createProxiedUrl(href) } - const onPress = () => { + const onPress = (e: GestureResponderEvent) => { + const exitEarlyIfFalse = outerOnPress?.(e) + if (exitEarlyIfFalse === false) return Linking.openURL(href) } @@ -517,7 +519,7 @@ export function WebOnlyInlineLinkText({ export function createStaticClick( onPressHandler: Exclude, ): { - to: BaseLinkProps['to'] + to: string onPress: Exclude } { return { diff --git a/src/components/PostControls/ShareMenu/ShareMenuItems.tsx b/src/components/PostControls/ShareMenu/ShareMenuItems.tsx index 2a70a248e5..d3ec490d12 100644 --- a/src/components/PostControls/ShareMenu/ShareMenuItems.tsx +++ b/src/components/PostControls/ShareMenu/ShareMenuItems.tsx @@ -11,7 +11,6 @@ import {shareText, shareUrl} from '#/lib/sharing' import {toShareUrl} from '#/lib/strings/url-helpers' import {logger} from '#/logger' import {isIOS} from '#/platform/detection' -import {useAgeAssurance} from '#/state/ageAssurance/useAgeAssurance' import {useProfileShadow} from '#/state/cache/profile-shadow' import {useSession} from '#/state/session' import * as Toast from '#/view/com/util/Toast' @@ -24,6 +23,7 @@ import {ChainLink_Stroke2_Corner0_Rounded as ChainLinkIcon} from '#/components/i import {Clipboard_Stroke2_Corner2_Rounded as ClipboardIcon} from '#/components/icons/Clipboard' import {PaperPlane_Stroke2_Corner0_Rounded as PaperPlaneIcon} from '#/components/icons/PaperPlane' import * as Menu from '#/components/Menu' +import {useAgeAssurance} from '#/ageAssurance' import {useDevMode} from '#/storage/hooks/dev-mode' import {RecentChats} from './RecentChats' import {type ShareMenuItemsProps} from './ShareMenuItems.types' @@ -37,7 +37,7 @@ let ShareMenuItems = ({ const navigation = useNavigation() const sendViaChatControl = useDialogControl() const [devModeEnabled] = useDevMode() - const {isAgeRestricted} = useAgeAssurance() + const aa = useAgeAssurance() const postUri = post.uri const postAuthor = useProfileShadow(post.author) @@ -91,7 +91,7 @@ let ShareMenuItems = ({ return ( <> - {hasSession && !isAgeRestricted && ( + {hasSession && aa.state.access === aa.Access.Full && ( diff --git a/src/components/PostControls/ShareMenu/ShareMenuItems.web.tsx b/src/components/PostControls/ShareMenu/ShareMenuItems.web.tsx index ac424c37a0..e8657dac29 100644 --- a/src/components/PostControls/ShareMenu/ShareMenuItems.web.tsx +++ b/src/components/PostControls/ShareMenu/ShareMenuItems.web.tsx @@ -10,7 +10,6 @@ import {shareText, shareUrl} from '#/lib/sharing' import {toShareUrl} from '#/lib/strings/url-helpers' import {logger} from '#/logger' import {isWeb} from '#/platform/detection' -import {useAgeAssurance} from '#/state/ageAssurance/useAgeAssurance' import {useProfileShadow} from '#/state/cache/profile-shadow' import {useSession} from '#/state/session' import {useBreakpoints} from '#/alf' @@ -22,6 +21,7 @@ import {Clipboard_Stroke2_Corner2_Rounded as ClipboardIcon} from '#/components/i import {CodeBrackets_Stroke2_Corner0_Rounded as CodeBracketsIcon} from '#/components/icons/CodeBrackets' import {PaperPlane_Stroke2_Corner0_Rounded as Send} from '#/components/icons/PaperPlane' import * as Menu from '#/components/Menu' +import {useAgeAssurance} from '#/ageAssurance' import {useDevMode} from '#/storage/hooks/dev-mode' import {type ShareMenuItemsProps} from './ShareMenuItems.types' @@ -38,7 +38,7 @@ let ShareMenuItems = ({ const embedPostControl = useDialogControl() const sendViaChatControl = useDialogControl() const [devModeEnabled] = useDevMode() - const {isAgeRestricted} = useAgeAssurance() + const aa = useAgeAssurance() const postUri = post.uri const postCid = post.cid @@ -97,7 +97,7 @@ let ShareMenuItems = ({ {!hideInPWI && copyLinkItem} - {hasSession && !isAgeRestricted && ( + {hasSession && aa.state.access === aa.Access.Full && ( + + + + ) +} + // Fine to keep this top-level. let lastSelectedInterest = '' let lastSearchText = '' -function DialogInner({guide}: {guide: Follow10ProgressGuide}) { +function DialogInner({guide}: {guide?: Follow10ProgressGuide}) { const {_} = useLingui() const interestsDisplayNames = useInterestsDisplayNames() const {data: preferences} = usePreferencesQuery() @@ -334,7 +351,7 @@ let Header = ({ selectedInterest, interestsDisplayNames, }: { - guide: Follow10ProgressGuide + guide?: Follow10ProgressGuide inputRef: React.RefObject listRef: React.RefObject onSelectTab: (v: string) => void @@ -385,7 +402,7 @@ let Header = ({ } Header = memo(Header) -function HeaderTop({guide}: {guide: Follow10ProgressGuide}) { +function HeaderTop({guide}: {guide?: Follow10ProgressGuide}) { const {_} = useLingui() const t = useTheme() const control = Dialog.useDialogContext() @@ -408,14 +425,16 @@ function HeaderTop({guide}: {guide: Follow10ProgressGuide}) { ]}> Find people to follow - - - + {guide && ( + + + + )} {isWeb ? ( - - - - ) : !isDeclaredUnderage ? ( - <> - - - You must complete age assurance in order to access the settings - below. - - - - - - {!isDeclaredUnderage && ( - <> - - - Enable adult content + {aa.state.access === aa.Access.Full && ( + <> + + + Enable adult content + + + + + {adultContentEnabled ? ( + Enabled + ) : ( + Disabled + )} - - - - {adultContentEnabled ? ( - Enabled - ) : ( - Disabled - )} - - - - + - {disabledOnIOS && ( - - - - Adult content can only be enabled via the Web at{' '} - { - evt.preventDefault() - Linking.openURL('https://bsky.app/') - return false - }}> - bsky.app - - . - - - - )} + + + {adultContentUIDisabledOnIOS && ( + + + + Adult content can only be enabled via the Web at{' '} + { + evt.preventDefault() + Linking.openURL('https://bsky.app/') + return false + }}> + bsky.app + + . + + + + )} - {adultContentEnabled && ( - <> - - - - - - - - - - )} + {adultContentEnabled && ( + <> + + + + + + + + )} - - - - ) : null} + + )} + + - {niceDate(i18n, post.indexedAt, 'medium')} + {niceDate(i18n, post.indexedAt, 'dot separated')} {isRootPost && ( @@ -655,7 +655,7 @@ function BackdatedPostIndicator({post}: {post: AppBskyFeedDefs.PostView}) { a.leading_tight, t.atoms.text_contrast_medium, ]}> - Archived from {niceDate(i18n, createdAt)} + Archived from {niceDate(i18n, createdAt, 'medium')} )} diff --git a/src/screens/VideoFeed/index.tsx b/src/screens/VideoFeed/index.tsx index 98f0f3d477..b195dd49aa 100644 --- a/src/screens/VideoFeed/index.tsx +++ b/src/screens/VideoFeed/index.tsx @@ -8,7 +8,6 @@ import { type ViewabilityConfig, type ViewToken, } from 'react-native' -import {SystemBars} from 'react-native-edge-to-edge' import { Gesture, GestureDetector, @@ -153,7 +152,6 @@ export function VideoFeed({}: NativeStackScreenProps< - {} diff --git a/src/state/ageAssurance/const.ts b/src/state/ageAssurance/const.ts deleted file mode 100644 index a0844adc21..0000000000 --- a/src/state/ageAssurance/const.ts +++ /dev/null @@ -1,11 +0,0 @@ -import {type ModerationPrefs} from '@atproto/api' - -import {DEFAULT_LOGGED_OUT_LABEL_PREFERENCES} from '#/state/queries/preferences/moderation' - -export const makeAgeRestrictedModerationPrefs = ( - prefs: ModerationPrefs, -): ModerationPrefs => ({ - ...prefs, - adultContentEnabled: false, - labels: DEFAULT_LOGGED_OUT_LABEL_PREFERENCES, -}) diff --git a/src/state/ageAssurance/index.tsx b/src/state/ageAssurance/index.tsx deleted file mode 100644 index e85672b7c8..0000000000 --- a/src/state/ageAssurance/index.tsx +++ /dev/null @@ -1,156 +0,0 @@ -import {createContext, useContext, useMemo, useState} from 'react' -import {type AppBskyUnspeccedDefs} from '@atproto/api' -import {useQuery} from '@tanstack/react-query' - -import {networkRetry} from '#/lib/async/retry' -import {useGetAndRegisterPushToken} from '#/lib/notifications/notifications' -import {isNetworkError} from '#/lib/strings/errors' -import { - type AgeAssuranceAPIContextType, - type AgeAssuranceContextType, -} from '#/state/ageAssurance/types' -import {useIsAgeAssuranceEnabled} from '#/state/ageAssurance/useIsAgeAssuranceEnabled' -import {logger} from '#/state/ageAssurance/util' -import {useGeolocationStatus} from '#/state/geolocation' -import {useAgent} from '#/state/session' - -export const createAgeAssuranceQueryKey = (did: string) => - ['ageAssurance', did] as const - -const DEFAULT_AGE_ASSURANCE_STATE: AppBskyUnspeccedDefs.AgeAssuranceState = { - lastInitiatedAt: undefined, - status: 'unknown', -} - -const AgeAssuranceContext = createContext({ - status: 'unknown', - isReady: false, - lastInitiatedAt: undefined, - isAgeRestricted: false, -}) -AgeAssuranceContext.displayName = 'AgeAssuranceContext' - -const AgeAssuranceAPIContext = createContext({ - // @ts-ignore can't be bothered to type this - refetch: () => Promise.resolve(), -}) -AgeAssuranceAPIContext.displayName = 'AgeAssuranceAPIContext' - -/** - * Low-level provider for fetching age assurance state on app load. Do not add - * any other data fetching in here to avoid complications and reduced - * performance. - */ -export function Provider({children}: {children: React.ReactNode}) { - const agent = useAgent() - const {status: geolocation} = useGeolocationStatus() - const isAgeAssuranceEnabled = useIsAgeAssuranceEnabled() - const getAndRegisterPushToken = useGetAndRegisterPushToken() - const [refetchWhilePending, setRefetchWhilePending] = useState(false) - - const {data, isFetched, refetch} = useQuery({ - /** - * This is load bearing. We always want this query to run and end in a - * "fetched" state, even if we fall back to defaults. This lets the rest of - * the app know that we've at least attempted to load the AA state. - * - * However, it only needs to run if AA is enabled. - */ - enabled: isAgeAssuranceEnabled, - refetchOnWindowFocus: refetchWhilePending, - queryKey: createAgeAssuranceQueryKey(agent.session?.did ?? 'never'), - async queryFn() { - if (!agent.session) return null - - try { - const {data} = await networkRetry(3, () => - agent.app.bsky.unspecced.getAgeAssuranceState(), - ) - // const {data} = { - // data: { - // lastInitiatedAt: new Date().toISOString(), - // status: 'pending', - // } as AppBskyUnspeccedDefs.AgeAssuranceState, - // } - - logger.debug(`fetch`, { - data, - account: agent.session?.did, - }) - - await getAndRegisterPushToken({ - isAgeRestricted: - !!geolocation?.isAgeRestrictedGeo && data.status !== 'assured', - }) - - return data - } catch (e) { - if (!isNetworkError(e)) { - logger.error(`ageAssurance: failed to fetch`, {safeMessage: e}) - } - // don't re-throw error, we'll just fall back to defaults - return null - } - }, - }) - - /** - * Derive state, or fall back to defaults - */ - const ageAssuranceContext = useMemo(() => { - const {status, lastInitiatedAt} = data || DEFAULT_AGE_ASSURANCE_STATE - const ctx: AgeAssuranceContextType = { - isReady: isFetched || !isAgeAssuranceEnabled, - status, - lastInitiatedAt, - isAgeRestricted: isAgeAssuranceEnabled ? status !== 'assured' : false, - } - logger.debug(`context`, ctx) - return ctx - }, [isFetched, data, isAgeAssuranceEnabled]) - - if ( - !!ageAssuranceContext.lastInitiatedAt && - ageAssuranceContext.status === 'pending' && - !refetchWhilePending - ) { - /* - * If we have a pending state, we want to refetch on window focus to ensure - * that we get the latest state when the user returns to the app. - */ - setRefetchWhilePending(true) - } else if ( - !!ageAssuranceContext.lastInitiatedAt && - ageAssuranceContext.status !== 'pending' && - refetchWhilePending - ) { - setRefetchWhilePending(false) - } - - const ageAssuranceAPIContext = useMemo( - () => ({ - refetch, - }), - [refetch], - ) - - return ( - - - {children} - - - ) -} - -/** - * Access to low-level AA state. Prefer using {@link useAgeInfo} for a - * more user-friendly interface. - */ -export function useAgeAssuranceContext() { - return useContext(AgeAssuranceContext) -} - -export function useAgeAssuranceAPIContext() { - return useContext(AgeAssuranceAPIContext) -} diff --git a/src/state/ageAssurance/types.ts b/src/state/ageAssurance/types.ts deleted file mode 100644 index 63febb3cff..0000000000 --- a/src/state/ageAssurance/types.ts +++ /dev/null @@ -1,33 +0,0 @@ -import {type AppBskyUnspeccedDefs} from '@atproto/api' -import {type QueryObserverBaseResult} from '@tanstack/react-query' - -export type AgeAssuranceContextType = { - /** - * Whether the age assurance state has been fetched from the server. If user - * is not in a region that requires AA, or AA is otherwise disabled, this - * will always be `true`. - */ - isReady: boolean - /** - * The server-reported status of the user's age verification process. - */ - status: AppBskyUnspeccedDefs.AgeAssuranceState['status'] - /** - * The last time the age assurance state was attempted by the user. - */ - lastInitiatedAt: AppBskyUnspeccedDefs.AgeAssuranceState['lastInitiatedAt'] - /** - * 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. If AA is otherise disabled, this will always be - * `false`. - */ - isAgeRestricted: boolean -} - -export type AgeAssuranceAPIContextType = { - /** - * Refreshes the age assurance state by fetching it from the server. - */ - refetch: QueryObserverBaseResult['refetch'] -} diff --git a/src/state/ageAssurance/useAgeAssurance.ts b/src/state/ageAssurance/useAgeAssurance.ts deleted file mode 100644 index 0613848687..0000000000 --- a/src/state/ageAssurance/useAgeAssurance.ts +++ /dev/null @@ -1,44 +0,0 @@ -import {useMemo} from 'react' - -import {useAgeAssuranceContext} from '#/state/ageAssurance' -import {logger} from '#/state/ageAssurance/util' -import {usePreferencesQuery} from '#/state/queries/preferences' - -type AgeAssurance = 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 -} - -/** - * 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 useAgeAssurance(): AgeAssurance { - const aa = useAgeAssuranceContext() - const {isFetched: preferencesLoaded, data: preferences} = - usePreferencesQuery() - const declaredAge = preferences?.userAge - - return useMemo(() => { - const isReady = aa.isReady && preferencesLoaded - const isDeclaredUnderage = - declaredAge !== undefined ? declaredAge < 18 : false - const state: AgeAssurance = { - isReady, - status: aa.status, - lastInitiatedAt: aa.lastInitiatedAt, - isAgeRestricted: aa.isAgeRestricted, - declaredAge, - isDeclaredUnderage, - } - logger.debug(`state`, state) - return state - }, [aa, preferencesLoaded, declaredAge]) -} diff --git a/src/state/ageAssurance/useInitAgeAssurance.ts b/src/state/ageAssurance/useInitAgeAssurance.ts deleted file mode 100644 index b658afb893..0000000000 --- a/src/state/ageAssurance/useInitAgeAssurance.ts +++ /dev/null @@ -1,102 +0,0 @@ -import { - type AppBskyUnspeccedDefs, - type AppBskyUnspeccedInitAgeAssurance, - AtpAgent, -} from '@atproto/api' -import {useMutation, useQueryClient} from '@tanstack/react-query' - -import {wait} from '#/lib/async/wait' -import { - // DEV_ENV_APPVIEW, - PUBLIC_APPVIEW, - PUBLIC_APPVIEW_DID, -} from '#/lib/constants' -import {isNetworkError} from '#/lib/hooks/useCleanError' -import {logger} from '#/logger' -import {createAgeAssuranceQueryKey} from '#/state/ageAssurance' -import {type DeviceLocation, useGeolocationStatus} from '#/state/geolocation' -import {useAgent} from '#/state/session' - -let APPVIEW = PUBLIC_APPVIEW -let APPVIEW_DID = PUBLIC_APPVIEW_DID - -/* - * Uncomment if using the local dev-env - */ -// if (__DEV__) { -// APPVIEW = DEV_ENV_APPVIEW -// /* -// * IMPORTANT: you need to get this value from `http://localhost:2581` -// * introspection endpoint and updated in `constants`, since it changes -// * every time you run the dev-env. -// */ -// APPVIEW_DID = `` -// } - -/** - * Creates an ISO country code string from the given geolocation data. - * Examples: `GB` or `GB-ENG` - */ -function createISOCountryCode( - geolocation: Omit & { - countryCode: string - }, -): string { - return geolocation.countryCode.toUpperCase() -} - -export function useInitAgeAssurance() { - const qc = useQueryClient() - const agent = useAgent() - const {status: geolocation} = useGeolocationStatus() - return useMutation({ - async mutationFn( - props: Omit, - ) { - const countryCode = geolocation?.countryCode - const regionCode = geolocation?.regionCode - if (!countryCode) { - throw new Error(`Geolocation not available, cannot init age assurance.`) - } - - const { - data: {token}, - } = await agent.com.atproto.server.getServiceAuth({ - aud: APPVIEW_DID, - lxm: `app.bsky.unspecced.initAgeAssurance`, - }) - - const appView = new AtpAgent({service: APPVIEW}) - appView.sessionManager.session = {...agent.session!} - appView.sessionManager.session.accessJwt = token - appView.sessionManager.session.refreshJwt = '' - - /* - * 2s wait is good actually. Email sending takes a hot sec and this helps - * ensure the email is ready for the user once they open their inbox. - */ - const {data} = await wait( - 2e3, - appView.app.bsky.unspecced.initAgeAssurance({ - ...props, - countryCode: createISOCountryCode({ - countryCode, - regionCode, - }), - }), - ) - - qc.setQueryData( - createAgeAssuranceQueryKey(agent.session?.did ?? 'never'), - () => data, - ) - }, - onError(e) { - if (!isNetworkError(e)) { - logger.error(`useInitAgeAssurance failed`, { - safeMessage: e, - }) - } - }, - }) -} diff --git a/src/state/ageAssurance/useIsAgeAssuranceEnabled.ts b/src/state/ageAssurance/useIsAgeAssuranceEnabled.ts deleted file mode 100644 index 6e85edd0b8..0000000000 --- a/src/state/ageAssurance/useIsAgeAssuranceEnabled.ts +++ /dev/null @@ -1,11 +0,0 @@ -import {useMemo} from 'react' - -import {useGeolocationStatus} from '#/state/geolocation' - -export function useIsAgeAssuranceEnabled() { - const {status: geolocation} = useGeolocationStatus() - - return useMemo(() => { - return !!geolocation?.isAgeRestrictedGeo - }, [geolocation]) -} diff --git a/src/state/birthdate.ts b/src/state/birthdate.ts new file mode 100644 index 0000000000..bfa3e9561f --- /dev/null +++ b/src/state/birthdate.ts @@ -0,0 +1,64 @@ +import {useMemo} from 'react' +import {useMutation, useQueryClient} from '@tanstack/react-query' + +import {preferencesQueryKey} from '#/state/queries/preferences' +import {useAgent, useSession} from '#/state/session' +import {usePatchAgeAssuranceOtherRequiredData} from '#/ageAssurance' +import {IS_DEV} from '#/env' +import {account} from '#/storage' + +// 6s in dev, 48h in prod +const BIRTHDATE_DELAY_HOURS = IS_DEV ? 0.001 : 48 + +/** + * Stores the timestamp of the birthday update locally. This is used to + * debounce birthday updates globally. + * + * Use {@link useIsBirthDateUpdateAllowed} to check if an update is allowed. + */ +export function snoozeBirthdateUpdateAllowedForDid(did: string) { + account.set([did, 'birthdateLastUpdatedAt'], new Date().toISOString()) +} + +/** + * Returns whether a birthdate update is currently allowed, based on the + * last update timestamp stored locally. + */ +export function useIsBirthdateUpdateAllowed() { + const {currentAccount} = useSession() + return useMemo(() => { + if (!currentAccount) return false + const lastUpdated = account.get([ + currentAccount.did, + 'birthdateLastUpdatedAt', + ]) + if (!lastUpdated) return true + const lastUpdatedDate = new Date(lastUpdated) + const diffMs = Date.now() - lastUpdatedDate.getTime() + const diffHours = diffMs / (1000 * 60 * 60) + return diffHours >= BIRTHDATE_DELAY_HOURS + }, [currentAccount]) +} + +export function useBirthdateMutation() { + const queryClient = useQueryClient() + const agent = useAgent() + const patchOtherRequiredData = usePatchAgeAssuranceOtherRequiredData() + + return useMutation({ + mutationFn: async ({birthDate}: {birthDate: Date}) => { + const bday = birthDate.toISOString() + await agent.setPersonalDetails({birthDate: bday}) + // triggers a refetch + await queryClient.invalidateQueries({ + queryKey: preferencesQueryKey, + }) + /** + * Also patch the age assurance other required data with the new + * birthdate, which may change the user's age assurance access level. + */ + patchOtherRequiredData({birthdate: bday}) + snoozeBirthdateUpdateAllowedForDid(agent.sessionManager.did!) + }, + }) +} diff --git a/src/state/cache/profile-shadow.ts b/src/state/cache/profile-shadow.ts index e1cff94092..5ee7c9c423 100644 --- a/src/state/cache/profile-shadow.ts +++ b/src/state/cache/profile-shadow.ts @@ -13,7 +13,10 @@ import {findAllProfilesInQueryData as findAllProfilesInListConvosQueryData} from import {findAllProfilesInQueryData as findAllProfilesInMyBlockedAccountsQueryData} from '#/state/queries/my-blocked-accounts' import {findAllProfilesInQueryData as findAllProfilesInMyMutedAccountsQueryData} from '#/state/queries/my-muted-accounts' import {findAllProfilesInQueryData as findAllProfilesInNotifsQueryData} from '#/state/queries/notifications/feed' -import {findAllProfilesInQueryData as findAllProfilesInFeedsQueryData} from '#/state/queries/post-feed' +import { + type FeedPage, + findAllProfilesInQueryData as findAllProfilesInFeedsQueryData, +} from '#/state/queries/post-feed' import {findAllProfilesInQueryData as findAllProfilesInPostLikedByQueryData} from '#/state/queries/post-liked-by' import {findAllProfilesInQueryData as findAllProfilesInPostQuotesQueryData} from '#/state/queries/post-quotes' import {findAllProfilesInQueryData as findAllProfilesInPostRepostedByQueryData} from '#/state/queries/post-reposted-by' @@ -110,6 +113,81 @@ export function useMaybeProfileShadow< }, [profile, shadow]) } +/** + * Takes a list of posts, and returns a list of DIDs that should be filtered out + * + * Note: it doesn't retroactively scan the cache, but only listens to new updates. + * The use case here is intended for removing a post from a feed after you mute the author + */ +export function usePostAuthorShadowFilter(data?: FeedPage[]) { + const [trackedDids, setTrackedDids] = useState( + () => + data?.flatMap(page => + page.slices.flatMap(slice => + slice.items.map(item => item.post.author.did), + ), + ) ?? [], + ) + const [authors, setAuthors] = useState( + new Map(), + ) + + const [prevData, setPrevData] = useState(data) + if (data !== prevData) { + const newAuthors = new Set(trackedDids) + let hasNew = false + for (const slice of data?.flatMap(page => page.slices) ?? []) { + for (const item of slice.items) { + const author = item.post.author + if (!newAuthors.has(author.did)) { + hasNew = true + newAuthors.add(author.did) + } + } + } + if (hasNew) setTrackedDids([...newAuthors]) + setPrevData(data) + } + + useEffect(() => { + const unsubs: Array<() => void> = [] + + for (const did of trackedDids) { + function onUpdate(value: Partial) { + setAuthors(prev => { + const prevValue = prev.get(did) + const next = new Map(prev) + next.set(did, { + blocked: Boolean(value.blockingUri ?? prevValue?.blocked ?? false), + muted: Boolean(value.muted ?? prevValue?.muted ?? false), + }) + return next + }) + } + emitter.addListener(did, onUpdate) + unsubs.push(() => { + emitter.removeListener(did, onUpdate) + }) + } + + return () => { + unsubs.map(fn => fn()) + } + }, [trackedDids]) + + return useMemo(() => { + const dids: Array = [] + + for (const [did, value] of authors.entries()) { + if (value.blocked || value.muted) { + dids.push(did) + } + } + + return dids + }, [authors]) +} + export function updateProfileShadow( queryClient: QueryClient, did: string, diff --git a/src/state/gallery.ts b/src/state/gallery.ts index 2370df27d7..c8ddba7026 100644 --- a/src/state/gallery.ts +++ b/src/state/gallery.ts @@ -17,6 +17,7 @@ import {getImageDim} from '#/lib/media/manip' import {openCropper} from '#/lib/media/picker' import {type PickerImage} from '#/lib/media/picker.shared' import {getDataUriSize} from '#/lib/media/util' +import {isCancelledError} from '#/lib/strings/errors' import {isNative} from '#/platform/detection' export type ImageTransformation = { @@ -143,7 +144,7 @@ export async function cropImage(img: ComposerImage): Promise { }, } } catch (e) { - if (e instanceof Error && e.message.includes('User cancelled')) { + if (!isCancelledError(e)) { return img } diff --git a/src/state/geolocation/config.ts b/src/state/geolocation/config.ts deleted file mode 100644 index 913b674cbb..0000000000 --- a/src/state/geolocation/config.ts +++ /dev/null @@ -1,141 +0,0 @@ -import {networkRetry} from '#/lib/async/retry' -import { - DEFAULT_GEOLOCATION_CONFIG, - GEOLOCATION_CONFIG_URL, -} from '#/state/geolocation/const' -import {emitGeolocationConfigUpdate} from '#/state/geolocation/events' -import {logger} from '#/state/geolocation/logger' -import {BAPP_CONFIG_DEV_BYPASS_SECRET, IS_DEV} from '#/env' -import {type Device, device} from '#/storage' - -async function getGeolocationConfig( - url: string, -): Promise { - const res = await fetch(url, { - headers: IS_DEV - ? { - 'x-dev-bypass-secret': BAPP_CONFIG_DEV_BYPASS_SECRET, - } - : undefined, - }) - - if (!res.ok) { - throw new Error(`config: fetch failed ${res.status}`) - } - - const json = await res.json() - - if (json.countryCode) { - /** - * Only construct known values here, ignore any extras. - */ - const config: Device['geolocation'] = { - countryCode: json.countryCode, - regionCode: json.regionCode ?? undefined, - ageRestrictedGeos: json.ageRestrictedGeos ?? [], - ageBlockedGeos: json.ageBlockedGeos ?? [], - } - logger.debug(`config: success`) - return config - } else { - return undefined - } -} - -/** - * Local promise used within this file only. - */ -let geolocationConfigResolution: Promise<{success: boolean}> | undefined - -/** - * Begin the process of resolving geolocation config. This should be called - * once at app start. - * - * THIS METHOD SHOULD NEVER THROW. - * - * This method is otherwise not used for any purpose. To ensure geolocation - * config is resolved, use {@link ensureGeolocationConfigIsResolved} - */ -export function beginResolveGeolocationConfig() { - /** - * Here for debug purposes. Uncomment to prevent hitting the remote geo service, and apply whatever data you require for testing. - */ - // if (__DEV__) { - // geolocationConfigResolution = new Promise(y => y({success: true})) - // device.set(['deviceGeolocation'], undefined) // clears GPS data - // device.set(['geolocation'], DEFAULT_GEOLOCATION_CONFIG) // clears bapp-config data - // return - // } - - geolocationConfigResolution = new Promise(async resolve => { - let success = true - - try { - // Try once, fail fast - const config = await getGeolocationConfig(GEOLOCATION_CONFIG_URL) - if (config) { - device.set(['geolocation'], config) - emitGeolocationConfigUpdate(config) - } else { - // endpoint should throw on all failures, this is insurance - throw new Error( - `geolocation config: nothing returned from initial request`, - ) - } - } catch (e: any) { - success = false - - logger.debug(`config: failed initial request`, { - safeMessage: e.message, - }) - - // set to default - device.set(['geolocation'], DEFAULT_GEOLOCATION_CONFIG) - - // retry 3 times, but don't await, proceed with default - networkRetry(3, () => getGeolocationConfig(GEOLOCATION_CONFIG_URL)) - .then(config => { - if (config) { - device.set(['geolocation'], config) - emitGeolocationConfigUpdate(config) - success = true - } else { - // endpoint should throw on all failures, this is insurance - throw new Error(`config: nothing returned from retries`) - } - }) - .catch((e: any) => { - // complete fail closed - logger.debug(`config: failed retries`, { - safeMessage: e.message, - }) - }) - } finally { - resolve({success}) - } - }) -} - -/** - * Ensure that geolocation config has been resolved, or at the very least attempted - * once. Subsequent retries will not be captured by this `await`. Those will be - * reported via {@link emitGeolocationConfigUpdate}. - */ -export async function ensureGeolocationConfigIsResolved() { - if (!geolocationConfigResolution) { - throw new Error(`config: beginResolveGeolocationConfig not called yet`) - } - - const cached = device.get(['geolocation']) - if (cached) { - logger.debug(`config: using cache`) - } else { - logger.debug(`config: no cache`) - const {success} = await geolocationConfigResolution - if (success) { - logger.debug(`config: resolved`) - } else { - logger.info(`config: failed to resolve`) - } - } -} diff --git a/src/state/geolocation/const.ts b/src/state/geolocation/const.ts deleted file mode 100644 index 789d001aa5..0000000000 --- a/src/state/geolocation/const.ts +++ /dev/null @@ -1,30 +0,0 @@ -import {type GeolocationStatus} from '#/state/geolocation/types' -import {BAPP_CONFIG_DEV_URL, IS_DEV} from '#/env' -import {type Device} from '#/storage' - -export const IPCC_URL = `https://bsky.app/ipcc` -export const BAPP_CONFIG_URL_PROD = `https://ip.bsky.app/config` -export const BAPP_CONFIG_URL = IS_DEV - ? (BAPP_CONFIG_DEV_URL ?? BAPP_CONFIG_URL_PROD) - : BAPP_CONFIG_URL_PROD -export const GEOLOCATION_CONFIG_URL = BAPP_CONFIG_URL - -/** - * Default geolocation config. - */ -export const DEFAULT_GEOLOCATION_CONFIG: Device['geolocation'] = { - countryCode: undefined, - regionCode: undefined, - ageRestrictedGeos: [], - ageBlockedGeos: [], -} - -/** - * Default geolocation status. - */ -export const DEFAULT_GEOLOCATION_STATUS: GeolocationStatus = { - countryCode: undefined, - regionCode: undefined, - isAgeRestrictedGeo: false, - isAgeBlockedGeo: false, -} diff --git a/src/state/geolocation/events.ts b/src/state/geolocation/events.ts deleted file mode 100644 index 61433bb2a8..0000000000 --- a/src/state/geolocation/events.ts +++ /dev/null @@ -1,19 +0,0 @@ -import EventEmitter from 'eventemitter3' - -import {type Device} from '#/storage' - -const events = new EventEmitter() -const EVENT = 'geolocation-config-updated' - -export const emitGeolocationConfigUpdate = (config: Device['geolocation']) => { - events.emit(EVENT, config) -} - -export const onGeolocationConfigUpdate = ( - listener: (config: Device['geolocation']) => void, -) => { - events.on(EVENT, listener) - return () => { - events.off(EVENT, listener) - } -} diff --git a/src/state/geolocation/index.tsx b/src/state/geolocation/index.tsx deleted file mode 100644 index 8bddb23fb6..0000000000 --- a/src/state/geolocation/index.tsx +++ /dev/null @@ -1,155 +0,0 @@ -import React from 'react' - -import { - DEFAULT_GEOLOCATION_CONFIG, - DEFAULT_GEOLOCATION_STATUS, -} from '#/state/geolocation/const' -import {onGeolocationConfigUpdate} from '#/state/geolocation/events' -import {logger} from '#/state/geolocation/logger' -import { - type DeviceLocation, - type GeolocationStatus, -} from '#/state/geolocation/types' -import {useSyncedDeviceGeolocation} from '#/state/geolocation/useSyncedDeviceGeolocation' -import { - computeGeolocationStatus, - mergeGeolocation, -} from '#/state/geolocation/util' -import {type Device, device} from '#/storage' - -export * from '#/state/geolocation/config' -export * from '#/state/geolocation/types' -export * from '#/state/geolocation/util' - -type DeviceGeolocationContext = { - deviceGeolocation: DeviceLocation | undefined -} - -type DeviceGeolocationAPIContext = { - setDeviceGeolocation(deviceGeolocation: DeviceLocation): void -} - -type GeolocationConfigContext = { - config: Device['geolocation'] -} - -type GeolocationStatusContext = { - /** - * Merged geolocation from config and device GPS (if available). - */ - location: DeviceLocation - /** - * Computed geolocation status based on the merged location and config. - */ - status: GeolocationStatus -} - -const DeviceGeolocationContext = React.createContext({ - deviceGeolocation: undefined, -}) -DeviceGeolocationContext.displayName = 'DeviceGeolocationContext' - -const DeviceGeolocationAPIContext = - React.createContext({ - setDeviceGeolocation: () => {}, - }) -DeviceGeolocationAPIContext.displayName = 'DeviceGeolocationAPIContext' - -const GeolocationConfigContext = React.createContext({ - config: DEFAULT_GEOLOCATION_CONFIG, -}) -GeolocationConfigContext.displayName = 'GeolocationConfigContext' - -const GeolocationStatusContext = React.createContext({ - location: { - countryCode: undefined, - regionCode: undefined, - }, - status: DEFAULT_GEOLOCATION_STATUS, -}) -GeolocationStatusContext.displayName = 'GeolocationStatusContext' - -/** - * Provider of geolocation config and computed geolocation status. - */ -export function GeolocationStatusProvider({ - children, -}: { - children: React.ReactNode -}) { - const {deviceGeolocation} = React.useContext(DeviceGeolocationContext) - const [config, setConfig] = React.useState(() => { - const initial = device.get(['geolocation']) || DEFAULT_GEOLOCATION_CONFIG - return initial - }) - - React.useEffect(() => { - return onGeolocationConfigUpdate(config => { - setConfig(config!) - }) - }, []) - - const configContext = React.useMemo(() => ({config}), [config]) - const statusContext = React.useMemo(() => { - if (deviceGeolocation?.countryCode) { - logger.debug('has device geolocation available') - } - const geolocation = mergeGeolocation(deviceGeolocation, config) - const status = computeGeolocationStatus(geolocation, config) - // ensure this remains debug and never leaves device - logger.debug('result', {deviceGeolocation, geolocation, status, config}) - return {location: geolocation, status} - }, [config, deviceGeolocation]) - - return ( - - - {children} - - - ) -} - -/** - * Provider of providers. Provides device geolocation data to lower-level - * `GeolocationStatusProvider`, and device geolocation APIs to children. - */ -export function Provider({children}: {children: React.ReactNode}) { - const [deviceGeolocation, setDeviceGeolocation] = useSyncedDeviceGeolocation() - - const handleSetDeviceGeolocation = React.useCallback( - (location: DeviceLocation) => { - logger.debug('setting device geolocation') - setDeviceGeolocation({ - countryCode: location.countryCode ?? undefined, - regionCode: location.regionCode ?? undefined, - }) - }, - [setDeviceGeolocation], - ) - - return ( - ({setDeviceGeolocation: handleSetDeviceGeolocation}), - [handleSetDeviceGeolocation], - )}> - ({deviceGeolocation}), [deviceGeolocation])}> - {children} - - - ) -} - -export function useDeviceGeolocationApi() { - return React.useContext(DeviceGeolocationAPIContext) -} - -export function useGeolocationConfig() { - return React.useContext(GeolocationConfigContext) -} - -export function useGeolocationStatus() { - return React.useContext(GeolocationStatusContext) -} diff --git a/src/state/geolocation/types.ts b/src/state/geolocation/types.ts deleted file mode 100644 index 174761649f..0000000000 --- a/src/state/geolocation/types.ts +++ /dev/null @@ -1,9 +0,0 @@ -export type DeviceLocation = { - countryCode: string | undefined - regionCode: string | undefined -} - -export type GeolocationStatus = DeviceLocation & { - isAgeRestrictedGeo: boolean - isAgeBlockedGeo: boolean -} diff --git a/src/state/geolocation/useRequestDeviceLocation.ts b/src/state/geolocation/useRequestDeviceLocation.ts deleted file mode 100644 index 64e05b056a..0000000000 --- a/src/state/geolocation/useRequestDeviceLocation.ts +++ /dev/null @@ -1,43 +0,0 @@ -import {useCallback} from 'react' -import * as Location from 'expo-location' - -import {type DeviceLocation} from '#/state/geolocation/types' -import {getDeviceGeolocation} from '#/state/geolocation/util' - -export {PermissionStatus} from 'expo-location' - -export function useRequestDeviceLocation(): () => Promise< - | { - granted: true - location: DeviceLocation | undefined - } - | { - granted: false - status: { - canAskAgain: boolean - /** - * Enum, use `PermissionStatus` export for comparisons - */ - permissionStatus: Location.PermissionStatus - } - } -> { - return useCallback(async () => { - const status = await Location.requestForegroundPermissionsAsync() - - if (status.granted) { - return { - granted: true, - location: await getDeviceGeolocation(), - } - } else { - return { - granted: false, - status: { - canAskAgain: status.canAskAgain, - permissionStatus: status.status, - }, - } - } - }, []) -} diff --git a/src/state/geolocation/useSyncedDeviceGeolocation.ts b/src/state/geolocation/useSyncedDeviceGeolocation.ts deleted file mode 100644 index fea6198d46..0000000000 --- a/src/state/geolocation/useSyncedDeviceGeolocation.ts +++ /dev/null @@ -1,93 +0,0 @@ -import {useEffect, useRef} from 'react' -import * as Location from 'expo-location' -import {createPermissionHook} from 'expo-modules-core' - -import {logger} from '#/state/geolocation/logger' -import {getDeviceGeolocation} from '#/state/geolocation/util' -import {device, useStorage} from '#/storage' - -/** - * Location.useForegroundPermissions on web just errors if the navigator.permissions API is not available. - * We need to catch and ignore it, since it's effectively denied. - * @see https://github.com/expo/expo/blob/72f1562ed9cce5ff6dfe04aa415b71632a3d4b87/packages/expo-location/src/Location.ts#L290-L293 - */ -const useForegroundPermissions = createPermissionHook({ - getMethod: () => - Location.getForegroundPermissionsAsync().catch(error => { - logger.debug( - 'useForegroundPermission: error getting location permissions', - {safeMessage: error}, - ) - return { - status: Location.PermissionStatus.DENIED, - granted: false, - canAskAgain: false, - expires: 0, - } - }), - requestMethod: () => - Location.requestForegroundPermissionsAsync().catch(error => { - logger.debug( - 'useForegroundPermission: error requesting location permissions', - {safeMessage: error}, - ) - return { - status: Location.PermissionStatus.DENIED, - granted: false, - canAskAgain: false, - expires: 0, - } - }), -}) - -/** - * Hook to get and sync the device geolocation from the device GPS and store it - * using device storage. If permissions are not granted, it will clear any cached - * storage value. - */ -export function useSyncedDeviceGeolocation() { - const synced = useRef(false) - const [status] = useForegroundPermissions() - const [deviceGeolocation, setDeviceGeolocation] = useStorage(device, [ - 'deviceGeolocation', - ]) - - useEffect(() => { - async function get() { - // no need to set this more than once per session - if (synced.current) return - - logger.debug('useSyncedDeviceGeolocation: checking perms') - - if (status?.granted) { - const location = await getDeviceGeolocation() - if (location) { - logger.debug('useSyncedDeviceGeolocation: syncing location') - setDeviceGeolocation(location) - synced.current = true - } - } else { - const hasCachedValue = device.get(['deviceGeolocation']) !== undefined - - /** - * If we have a cached value, but user has revoked permissions, - * quietly (will take effect lazily) clear this out. - */ - if (hasCachedValue) { - logger.debug( - 'useSyncedDeviceGeolocation: clearing cached location, perms revoked', - ) - device.set(['deviceGeolocation'], undefined) - } - } - } - - get().catch(e => { - logger.error('useSyncedDeviceGeolocation: failed to sync', { - safeMessage: e, - }) - }) - }, [status, setDeviceGeolocation]) - - return [deviceGeolocation, setDeviceGeolocation] as const -} diff --git a/src/state/geolocation/util.ts b/src/state/geolocation/util.ts deleted file mode 100644 index c92b42b133..0000000000 --- a/src/state/geolocation/util.ts +++ /dev/null @@ -1,180 +0,0 @@ -import { - getCurrentPositionAsync, - type LocationGeocodedAddress, - reverseGeocodeAsync, -} from 'expo-location' - -import {logger} from '#/state/geolocation/logger' -import {type DeviceLocation} from '#/state/geolocation/types' -import {type Device} from '#/storage' - -/** - * Maps full US region names to their short codes. - * - * Context: in some cases, like on Android, we get the full region name instead - * of the short code. We may need to expand this in the future to other - * countries, hence the prefix. - */ -export const USRegionNameToRegionCode: { - [regionName: string]: string -} = { - Alabama: 'AL', - Alaska: 'AK', - Arizona: 'AZ', - Arkansas: 'AR', - California: 'CA', - Colorado: 'CO', - Connecticut: 'CT', - Delaware: 'DE', - Florida: 'FL', - Georgia: 'GA', - Hawaii: 'HI', - Idaho: 'ID', - Illinois: 'IL', - Indiana: 'IN', - Iowa: 'IA', - Kansas: 'KS', - Kentucky: 'KY', - Louisiana: 'LA', - Maine: 'ME', - Maryland: 'MD', - Massachusetts: 'MA', - Michigan: 'MI', - Minnesota: 'MN', - Mississippi: 'MS', - Missouri: 'MO', - Montana: 'MT', - Nebraska: 'NE', - Nevada: 'NV', - ['New Hampshire']: 'NH', - ['New Jersey']: 'NJ', - ['New Mexico']: 'NM', - ['New York']: 'NY', - ['North Carolina']: 'NC', - ['North Dakota']: 'ND', - Ohio: 'OH', - Oklahoma: 'OK', - Oregon: 'OR', - Pennsylvania: 'PA', - ['Rhode Island']: 'RI', - ['South Carolina']: 'SC', - ['South Dakota']: 'SD', - Tennessee: 'TN', - Texas: 'TX', - Utah: 'UT', - Vermont: 'VT', - Virginia: 'VA', - Washington: 'WA', - ['West Virginia']: 'WV', - Wisconsin: 'WI', - Wyoming: 'WY', -} - -/** - * Normalizes a `LocationGeocodedAddress` into a `DeviceLocation`. - * - * We don't want or care about the full location data, so we trim it down and - * normalize certain fields, like region, into the format we need. - */ -export function normalizeDeviceLocation( - location: LocationGeocodedAddress, -): DeviceLocation { - let {isoCountryCode, region} = location - - if (region) { - if (isoCountryCode === 'US') { - region = USRegionNameToRegionCode[region] ?? region - } - } - - return { - countryCode: isoCountryCode ?? undefined, - regionCode: region ?? undefined, - } -} - -/** - * Combines precise location data with the geolocation config fetched from the - * IP service, with preference to the precise data. - */ -export function mergeGeolocation( - location?: DeviceLocation, - config?: Device['geolocation'], -): DeviceLocation { - if (location?.countryCode) return location - return { - countryCode: config?.countryCode, - regionCode: config?.regionCode, - } -} - -/** - * Computes the geolocation status (age-restricted, age-blocked) based on the - * given location and geolocation config. `location` here should be merged with - * `mergeGeolocation()` ahead of time if needed. - */ -export function computeGeolocationStatus( - location: DeviceLocation, - config: Device['geolocation'], -) { - /** - * We can't do anything if we don't have this data. - */ - if (!location.countryCode) { - return { - ...location, - isAgeRestrictedGeo: false, - isAgeBlockedGeo: false, - } - } - - const isAgeRestrictedGeo = config?.ageRestrictedGeos?.some(rule => { - if (rule.countryCode === location.countryCode) { - if (!rule.regionCode) { - return true // whole country is blocked - } else if (rule.regionCode === location.regionCode) { - return true - } - } - }) - - const isAgeBlockedGeo = config?.ageBlockedGeos?.some(rule => { - if (rule.countryCode === location.countryCode) { - if (!rule.regionCode) { - return true // whole country is blocked - } else if (rule.regionCode === location.regionCode) { - return true - } - } - }) - - return { - ...location, - isAgeRestrictedGeo: !!isAgeRestrictedGeo, - isAgeBlockedGeo: !!isAgeBlockedGeo, - } -} - -export async function getDeviceGeolocation(): Promise { - try { - const geocode = await getCurrentPositionAsync() - const locations = await reverseGeocodeAsync({ - latitude: geocode.coords.latitude, - longitude: geocode.coords.longitude, - }) - const location = locations.at(0) - const normalized = location ? normalizeDeviceLocation(location) : undefined - return { - countryCode: normalized?.countryCode ?? undefined, - regionCode: normalized?.regionCode ?? undefined, - } - } catch (e) { - logger.error('getDeviceGeolocation: failed', { - safeMessage: e, - }) - return { - countryCode: undefined, - regionCode: undefined, - } - } -} diff --git a/src/state/queries/post-feed.ts b/src/state/queries/post-feed.ts index 3a1b4d24a5..0a3cfb6b47 100644 --- a/src/state/queries/post-feed.ts +++ b/src/state/queries/post-feed.ts @@ -31,7 +31,6 @@ import {aggregateUserInterests} from '#/lib/api/feed/utils' import {FeedTuner, type FeedTunerFn} from '#/lib/api/feed-manip' import {DISCOVER_FEED_URI} from '#/lib/constants' import {logger} from '#/logger' -import {useAgeAssuranceContext} from '#/state/ageAssurance' import {STALE} from '#/state/queries' import {DEFAULT_LOGGED_OUT_PREFERENCES} from '#/state/queries/preferences/const' import {useAgent} from '#/state/session' @@ -141,12 +140,8 @@ export function usePostFeedQuery( * available for the remainder of the session, so this delay only affects cold * loads. -esb */ - const {isReady: isAgeAssuranceReady} = useAgeAssuranceContext() const enabled = - opts?.enabled !== false && - Boolean(moderationOpts) && - Boolean(preferences) && - isAgeAssuranceReady + opts?.enabled !== false && Boolean(moderationOpts) && Boolean(preferences) const userInterests = aggregateUserInterests(preferences) const followingPinnedIndex = preferences?.savedFeeds?.findIndex( diff --git a/src/state/queries/post.ts b/src/state/queries/post.ts index e92847e75a..09ced9874e 100644 --- a/src/state/queries/post.ts +++ b/src/state/queries/post.ts @@ -26,6 +26,7 @@ export function usePostQuery(uri: string | undefined) { const res = await agent.resolveHandle({ handle: urip.host, }) + // @ts-expect-error TODO new-sdk-migration urip.host = res.data.did } @@ -54,6 +55,7 @@ export function useGetPost() { const res = await agent.resolveHandle({ handle: urip.host, }) + // @ts-expect-error TODO new-sdk-migration urip.host = res.data.did } diff --git a/src/state/queries/postgate/index.ts b/src/state/queries/postgate/index.ts index 95eb94f8ec..92689d534e 100644 --- a/src/state/queries/postgate/index.ts +++ b/src/state/queries/postgate/index.ts @@ -36,6 +36,7 @@ export async function getPostgateRecord({ const res = await agent.resolveHandle({ handle: urip.host, }) + // @ts-expect-error TODO new-sdk-migration urip.host = res.data.did } diff --git a/src/state/queries/preferences/index.ts b/src/state/queries/preferences/index.ts index fd1d70d7de..0cf6ab5469 100644 --- a/src/state/queries/preferences/index.ts +++ b/src/state/queries/preferences/index.ts @@ -10,8 +10,6 @@ import {PROD_DEFAULT_FEED} from '#/lib/constants' import {replaceEqualDeep} from '#/lib/functions' import {getAge} from '#/lib/strings/time' import {logger} from '#/logger' -import {useAgeAssuranceContext} from '#/state/ageAssurance' -import {makeAgeRestrictedModerationPrefs} from '#/state/ageAssurance/const' import {STALE} from '#/state/queries' import { DEFAULT_HOME_FEED_PREFS, @@ -24,6 +22,7 @@ import { } from '#/state/queries/preferences/types' import {useAgent} from '#/state/session' import {saveLabelers} from '#/state/session/agent-config' +import {useAgeAssurance} from '#/ageAssurance' export * from '#/state/queries/preferences/const' export * from '#/state/queries/preferences/moderation' @@ -34,7 +33,7 @@ export const preferencesQueryKey = [preferencesQueryKeyRoot] export function usePreferencesQuery() { const agent = useAgent() - const {isAgeRestricted} = useAgeAssuranceContext() + const aa = useAgeAssurance() return useQuery({ staleTime: STALE.SECONDS.FIFTEEN, @@ -75,18 +74,19 @@ export function usePreferencesQuery() { }, select: useCallback( (data: UsePreferencesQueryResponse) => { - const isUnderage = (data.userAge || 0) < 18 - if (isUnderage || isAgeRestricted) { + /** + * Prefs are all downstream of age assurance now. For logged-out + * users, we override moderation prefs based on AA state. + */ + if (aa.state.access !== aa.Access.Full) { data = { ...data, - moderationPrefs: makeAgeRestrictedModerationPrefs( - data.moderationPrefs, - ), + moderationPrefs: DEFAULT_LOGGED_OUT_PREFERENCES.moderationPrefs, } } return data }, - [isAgeRestricted], + [aa], ), }) } @@ -168,21 +168,6 @@ export function usePreferencesSetAdultContentMutation() { }) } -export function usePreferencesSetBirthDateMutation() { - const queryClient = useQueryClient() - const agent = useAgent() - - return useMutation({ - mutationFn: async ({birthDate}: {birthDate: Date}) => { - await agent.setPersonalDetails({birthDate: birthDate.toISOString()}) - // triggers a refetch - await queryClient.invalidateQueries({ - queryKey: preferencesQueryKey, - }) - }, - }) -} - export function useSetFeedViewPreferencesMutation() { const queryClient = useQueryClient() const agent = useAgent() diff --git a/src/state/queries/resolve-uri.ts b/src/state/queries/resolve-uri.ts index 850fb3fb61..b40e380724 100644 --- a/src/state/queries/resolve-uri.ts +++ b/src/state/queries/resolve-uri.ts @@ -17,6 +17,7 @@ export function useResolveUriQuery(uri: string | undefined): UriUseQueryResult { const urip = new AtUri(uri || '') const res = useResolveDidQuery(urip.host) if (res.data) { + // @ts-expect-error TODO new-sdk-migration urip.host = res.data return { ...res, diff --git a/src/state/queries/threadgate/index.ts b/src/state/queries/threadgate/index.ts index 5a34eb3104..e760873fb2 100644 --- a/src/state/queries/threadgate/index.ts +++ b/src/state/queries/threadgate/index.ts @@ -97,6 +97,7 @@ export async function getThreadgateRecord({ const res = await agent.resolveHandle({ handle: urip.host, }) + // @ts-expect-error TODO new-sdk-migration urip.host = res.data.did } diff --git a/src/state/session/__tests__/session-test.ts b/src/state/session/__tests__/session-test.ts index c58171bf91..eb56944ba6 100644 --- a/src/state/session/__tests__/session-test.ts +++ b/src/state/session/__tests__/session-test.ts @@ -10,6 +10,9 @@ jest.mock('jwt-decode', () => ({ }, })) +jest.mock('../../birthdate') +jest.mock('../../../ageAssurance/data') + describe('session', () => { it('can log in and out', () => { let state = getInitialState([]) diff --git a/src/state/session/agent.ts b/src/state/session/agent.ts index 36d19299b9..5c8ce3b97f 100644 --- a/src/state/session/agent.ts +++ b/src/state/session/agent.ts @@ -1,10 +1,12 @@ import { Agent as BaseAgent, + type AppBskyActorProfile, type AtprotoServiceType, type AtpSessionData, type AtpSessionEvent, BskyAgent, type Did, + type Un$Typed, } from '@atproto/api' import {type FetchHandler} from '@atproto/api/dist/agent' import {type SessionManager} from '@atproto/api/dist/session-manager' @@ -23,7 +25,13 @@ import { import {tryFetchGates} from '#/lib/statsig/statsig' import {getAge} from '#/lib/strings/time' import {logger} from '#/logger' +import {snoozeBirthdateUpdateAllowedForDid} from '#/state/birthdate' import {snoozeEmailConfirmationPrompt} from '#/state/shell/reminders' +import { + prefetchAgeAssuranceData, + setBirthdateForDid, + setCreatedAtForDid, +} from '#/ageAssurance/data' import {emitNetworkConfirmed, emitNetworkLost} from '../events' import {addSessionErrorLog} from './logging' import { @@ -77,9 +85,15 @@ export async function createAgentAndResume( } } + // after session is attached + const aa = prefetchAgeAssuranceData({agent}) + agent.configureProxy(BLUESKY_PROXY_HEADER.get()) - return agent.prepare(gates, moderation, onSessionChange) + return agent.prepare({ + resolvers: [gates, moderation, aa], + onSessionChange, + }) } export async function createAgentAndLogin( @@ -111,10 +125,14 @@ export async function createAgentAndLogin( const account = agentToSessionAccountOrThrow(agent) const gates = tryFetchGates(account.did, 'prefer-fresh-gates') const moderation = configureModerationForAccount(agent, account) + const aa = prefetchAgeAssuranceData({agent}) agent.configureProxy(BLUESKY_PROXY_HEADER.get()) - return agent.prepare(gates, moderation, onSessionChange) + return agent.prepare({ + resolvers: [gates, moderation, aa], + onSessionChange, + }) } export async function createAgentAndCreateAccount( @@ -156,42 +174,122 @@ export async function createAgentAndCreateAccount( const gates = tryFetchGates(account.did, 'prefer-fresh-gates') const moderation = configureModerationForAccount(agent, account) + const createdAt = new Date().toISOString() + const birthdate = birthDate.toISOString() + + /* + * Since we have a race with account creation, profile creation, and AA + * state, set these values locally to ensure sync reads. Values are written + * to the server in the next step, so on subsequent reloads, the server will + * be the source of truth. + */ + setCreatedAtForDid({did: account.did, createdAt}) + setBirthdateForDid({did: account.did, birthdate}) + snoozeBirthdateUpdateAllowedForDid(account.did) + // do this last + const aa = prefetchAgeAssuranceData({agent}) + // Not awaited so that we can still get into onboarding. // This is OK because we won't let you toggle adult stuff until you set the date. if (IS_PROD_SERVICE(service)) { - try { - networkRetry(1, async () => { - await agent.setPersonalDetails({birthDate: birthDate.toISOString()}) - await agent.overwriteSavedFeeds([ - { - ...DISCOVER_SAVED_FEED, - id: TID.nextStr(), - }, - { - ...TIMELINE_SAVED_FEED, - id: TID.nextStr(), - }, - ]) - - if (getAge(birthDate) < 18) { - await agent.api.com.atproto.repo.putRecord({ - repo: account.did, - collection: 'chat.bsky.actor.declaration', - rkey: 'self', - record: { - $type: 'chat.bsky.actor.declaration', - allowIncoming: 'none', - }, + Promise.allSettled( + [ + networkRetry(3, () => { + return agent.setPersonalDetails({ + birthDate: birthdate, }) - } - }) - } catch (e: any) { - logger.error(e, { - message: `session: createAgentAndCreateAccount failed to save personal details and feeds`, - }) - } + }).catch(e => { + logger.info(`createAgentAndCreateAccount: failed to set birthDate`) + throw e + }), + networkRetry(3, () => { + return agent.upsertProfile(prev => { + const next: Un$Typed = prev || {} + next.displayName = handle + next.createdAt = createdAt + return next + }) + }).catch(e => { + logger.info( + `createAgentAndCreateAccount: failed to set initial profile`, + ) + throw e + }), + networkRetry(1, () => { + return agent.overwriteSavedFeeds([ + { + ...DISCOVER_SAVED_FEED, + id: TID.nextStr(), + }, + { + ...TIMELINE_SAVED_FEED, + id: TID.nextStr(), + }, + ]) + }).catch(e => { + logger.info( + `createAgentAndCreateAccount: failed to set initial feeds`, + ) + throw e + }), + getAge(birthDate) < 18 && + networkRetry(3, () => { + return agent.com.atproto.repo.putRecord({ + repo: account.did, + collection: 'chat.bsky.actor.declaration', + rkey: 'self', + record: { + $type: 'chat.bsky.actor.declaration', + allowIncoming: 'none', + }, + }) + }).catch(e => { + logger.info( + `createAgentAndCreateAccount: failed to set chat declaration`, + ) + throw e + }), + ].filter(Boolean), + ).then(promises => { + const rejected = promises.filter(p => p.status === 'rejected') + if (rejected.length > 0) { + logger.error( + `session: createAgentAndCreateAccount failed to save personal details and feeds`, + ) + } + }) } else { - agent.setPersonalDetails({birthDate: birthDate.toISOString()}) + Promise.allSettled( + [ + networkRetry(3, () => { + return agent.setPersonalDetails({ + birthDate: birthDate.toISOString(), + }) + }).catch(e => { + logger.info(`createAgentAndCreateAccount: failed to set birthDate`) + throw e + }), + networkRetry(3, () => { + return agent.upsertProfile(prev => { + const next: Un$Typed = prev || {} + next.createdAt = prev?.createdAt || new Date().toISOString() + return next + }) + }).catch(e => { + logger.info( + `createAgentAndCreateAccount: failed to set initial profile`, + ) + throw e + }), + ].filter(Boolean), + ).then(promises => { + const rejected = promises.filter(p => p.status === 'rejected') + if (rejected.length > 0) { + logger.error( + `session: createAgentAndCreateAccount failed to save personal details and feeds`, + ) + } + }) } try { @@ -203,7 +301,10 @@ export async function createAgentAndCreateAccount( agent.configureProxy(BLUESKY_PROXY_HEADER.get()) - return agent.prepare(gates, moderation, onSessionChange) + return agent.prepare({ + resolvers: [gates, moderation, aa], + onSessionChange, + }) } export function agentToSessionAccountOrThrow(agent: BskyAgent): SessionAccount { @@ -306,18 +407,20 @@ class BskyAppAgent extends BskyAgent { }) } - async prepare( + async prepare({ + resolvers, + onSessionChange, + }: { // Not awaited in the calling code so we can delay blocking on them. - gates: Promise, - moderation: Promise, + resolvers: Promise[] onSessionChange: ( agent: BskyAgent, did: string, event: AtpSessionEvent, - ) => void, - ) { + ) => void + }) { // There's nothing else left to do, so block on them here. - await Promise.all([gates, moderation]) + await Promise.all(resolvers) // Now the agent is ready. const account = agentToSessionAccountOrThrow(this) diff --git a/src/state/session/index.tsx b/src/state/session/index.tsx index 71c9fbb7a3..4d4cb67282 100644 --- a/src/state/session/index.tsx +++ b/src/state/session/index.tsx @@ -24,6 +24,11 @@ import { type SessionApiContext, type SessionStateContext, } from '#/state/session/types' +import {useOnboardingDispatch} from '#/state/shell/onboarding' +import { + clearAgeAssuranceData, + clearAgeAssuranceDataForDid, +} from '#/ageAssurance/data' const StateContext = React.createContext({ accounts: [], @@ -91,6 +96,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) { const cancelPendingTask = useOneTaskAtATime() const [store] = React.useState(() => new SessionStore()) const state = React.useSyncExternalStore(store.subscribe, store.getState) + const onboardingDispatch = useOnboardingDispatch() const onAgentSessionChange = React.useCallback( (agent: BskyAgent, accountDid: string, sessionEvent: AtpSessionEvent) => { @@ -166,6 +172,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) { logContext => { addSessionDebugLog({type: 'method:start', method: 'logout'}) cancelPendingTask() + const prevState = store.getState() store.dispatch({ type: 'logged-out-current-account', }) @@ -175,8 +182,13 @@ export function Provider({children}: React.PropsWithChildren<{}>) { {statsig: true}, ) addSessionDebugLog({type: 'method:end', method: 'logout'}) + if (prevState.currentAgentState.did) { + clearAgeAssuranceDataForDid({did: prevState.currentAgentState.did}) + } + // reset onboarding flow on logout + onboardingDispatch({type: 'skip'}) }, - [store, cancelPendingTask], + [store, cancelPendingTask, onboardingDispatch], ) const logoutEveryAccount = React.useCallback< @@ -194,12 +206,15 @@ export function Provider({children}: React.PropsWithChildren<{}>) { {statsig: true}, ) addSessionDebugLog({type: 'method:end', method: 'logout'}) + clearAgeAssuranceData() + // reset onboarding flow on logout + onboardingDispatch({type: 'skip'}) }, - [store, cancelPendingTask], + [store, cancelPendingTask, onboardingDispatch], ) const resumeSession = React.useCallback( - async storedAccount => { + async (storedAccount, isSwitchingAccounts = false) => { addSessionDebugLog({ type: 'method:start', method: 'resumeSession', @@ -220,8 +235,12 @@ export function Provider({children}: React.PropsWithChildren<{}>) { newAccount: account, }) addSessionDebugLog({type: 'method:end', method: 'resumeSession', account}) + if (isSwitchingAccounts) { + // reset onboarding flow on switch account + onboardingDispatch({type: 'skip'}) + } }, - [store, onAgentSessionChange, cancelPendingTask], + [store, onAgentSessionChange, cancelPendingTask, onboardingDispatch], ) const partialRefreshSession = React.useCallback< @@ -254,6 +273,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) { accountDid: account.did, }) addSessionDebugLog({type: 'method:end', method: 'removeAccount', account}) + clearAgeAssuranceDataForDid({did: account.did}) }, [store, cancelPendingTask], ) diff --git a/src/state/session/types.ts b/src/state/session/types.ts index 4621b4f04b..2c1da187cb 100644 --- a/src/state/session/types.ts +++ b/src/state/session/types.ts @@ -38,7 +38,10 @@ export type SessionApiContext = { logoutEveryAccount: ( logContext: LogEvents['account:loggedOut']['logContext'], ) => void - resumeSession: (account: SessionAccount) => Promise + resumeSession: ( + account: SessionAccount, + isSwitchingAccounts?: boolean, + ) => Promise removeAccount: (account: SessionAccount) => void /** * Calls `getSession` and updates select fields on the current account and diff --git a/src/state/shell/composer/index.tsx b/src/state/shell/composer/index.tsx index 1d0973add1..8449847770 100644 --- a/src/state/shell/composer/index.tsx +++ b/src/state/shell/composer/index.tsx @@ -43,6 +43,7 @@ export interface ComposerOpts { text?: string imageUris?: {uri: string; width: number; height: number; altText?: string}[] videoUri?: {uri: string; width: number; height: number} + openGallery?: boolean } type StateContext = ComposerOpts | undefined diff --git a/src/state/shell/index.tsx b/src/state/shell/index.tsx index 809a521bf7..4615514909 100644 --- a/src/state/shell/index.tsx +++ b/src/state/shell/index.tsx @@ -2,7 +2,6 @@ import {Provider as ColorModeProvider} from './color-mode' import {Provider as DrawerOpenProvider} from './drawer-open' import {Provider as DrawerSwipableProvider} from './drawer-swipe-disabled' import {Provider as MinimalModeProvider} from './minimal-mode' -import {Provider as OnboardingProvider} from './onboarding' import {Provider as ShellLayoutProvder} from './shell-layout' import {Provider as TickEveryMinuteProvider} from './tick-every-minute' @@ -23,9 +22,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) { - - {children} - + {children} diff --git a/src/state/unstable-post-source.tsx b/src/state/unstable-post-source.tsx index 17fe188409..c5b7d1c2bf 100644 --- a/src/state/unstable-post-source.tsx +++ b/src/state/unstable-post-source.tsx @@ -81,6 +81,7 @@ export function useUnstablePostSource(key: string) { */ export function buildPostSourceKey(key: string, handle: string) { const urip = new AtUri(key) + // @ts-expect-error TODO new-sdk-migration urip.host = handle return urip.toString() } diff --git a/src/storage/schema.ts b/src/storage/schema.ts index 02923436a5..4cc9782262 100644 --- a/src/storage/schema.ts +++ b/src/storage/schema.ts @@ -1,4 +1,5 @@ import {type ID as PolicyUpdate202508} from '#/components/PolicyUpdateOverlay/updates/202508/config' +import {type Geolocation} from '#/geolocation/types' /** * Device data that's specific to the device and does not vary based account @@ -25,13 +26,21 @@ export type Device = { regionCode: string | undefined }[] } + + /** + * The raw response from the geolocation service, if available. We + * cache this here and update it lazily on session start. + */ + geolocationServiceResponse?: Geolocation /** * The GPS-based geolocation, if the user has granted permission. */ - deviceGeolocation?: { - countryCode: string | undefined - regionCode: string | undefined - } + deviceGeolocation?: Geolocation + /** + * The merged geolocation, combining `geolocationServiceResponse` and + * `deviceGeolocation`, with preference to `deviceGeolocation`. + */ + mergedGeolocation?: Geolocation trendingBetaEnabled: boolean devMode: boolean @@ -49,4 +58,10 @@ export type Device = { export type Account = { searchTermHistory?: string[] searchAccountHistory?: string[] + + /** + * The ISO date string of when this account's birthdate was last updated on + * this device. + */ + birthdateLastUpdatedAt?: string } diff --git a/src/view/com/composer/Composer.tsx b/src/view/com/composer/Composer.tsx index 7746d93c30..2b2eaed64e 100644 --- a/src/view/com/composer/Composer.tsx +++ b/src/view/com/composer/Composer.tsx @@ -172,6 +172,7 @@ export const ComposePost = ({ text: initText, imageUris: initImageUris, videoUri: initVideoUri, + openGallery, cancelRef, }: Props & { cancelRef?: React.RefObject @@ -721,6 +722,7 @@ export const ComposePost = ({ }} currentLanguages={currentLanguages} onSelectLanguage={onSelectLanguage} + openGallery={openGallery} /> ) @@ -1334,6 +1336,7 @@ function ComposerFooter({ onAddPost, currentLanguages, onSelectLanguage, + openGallery, }: { post: PostDraft dispatch: (action: PostAction) => void @@ -1344,6 +1347,7 @@ function ComposerFooter({ onAddPost: () => void currentLanguages: string[] onSelectLanguage?: (language: string) => void + openGallery?: boolean }) { const t = useTheme() const {_} = useLingui() @@ -1463,6 +1467,7 @@ function ComposerFooter({ allowedAssetTypes={selectedAssetsType} selectedAssetsCount={selectedAssetsCount} onSelectAssets={onSelectAssets} + autoOpen={openGallery} /> void + /** + * If true, automatically open the media picker when the component mounts. + */ + autoOpen?: boolean } /** @@ -358,12 +362,14 @@ export function SelectMediaButton({ allowedAssetTypes, selectedAssetsCount, onSelectAssets, + autoOpen, }: SelectMediaButtonProps) { const {_} = useLingui() const {requestPhotoAccessIfNeeded} = usePhotoLibraryPermission() const {requestVideoAccessIfNeeded} = useVideoLibraryPermission() const sheetWrapper = useSheetWrapper() const t = useTheme() + const hasAutoOpened = useRef(false) const selectionCountRemaining = MAX_IMAGES - selectedAssetsCount @@ -460,6 +466,13 @@ export function SelectMediaButton({ selectionCountRemaining, ]) + useEffect(() => { + if (autoOpen && !hasAutoOpened.current && !disabled) { + hasAutoOpened.current = true + onPressSelectMedia() + } + }, [autoOpen, disabled, onPressSelectMedia]) + return ( + )} + + + + + + ) +} diff --git a/src/view/com/posts/PostFeed.tsx b/src/view/com/posts/PostFeed.tsx index 4f4e6352ab..4f25468c95 100644 --- a/src/view/com/posts/PostFeed.tsx +++ b/src/view/com/posts/PostFeed.tsx @@ -31,10 +31,11 @@ import {isStatusStillActive, validateStatus} from '#/lib/actor-status' import {DISCOVER_FEED_URI, KNOWN_SHUTDOWN_FEEDS} from '#/lib/constants' import {useInitialNumToRender} from '#/lib/hooks/useInitialNumToRender' import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback' -import {logEvent} from '#/lib/statsig/statsig' +import {logEvent, useGate} from '#/lib/statsig/statsig' import {isNetworkError} from '#/lib/strings/errors' import {logger} from '#/logger' import {isIOS, isNative, isWeb} from '#/platform/detection' +import {usePostAuthorShadowFilter} from '#/state/cache/profile-shadow' import {listenPostCreated} from '#/state/events' import {useFeedFeedbackContext} from '#/state/feed-feedback' import {useTrendingSettings} from '#/state/preferences/trending' @@ -69,6 +70,7 @@ import { } from '#/components/feeds/PostFeedVideoGridRow' import {TrendingInterstitial} from '#/components/interstitials/Trending' import {TrendingVideos as TrendingVideosInterstitial} from '#/components/interstitials/TrendingVideos' +import {ComposerPrompt} from '../feeds/ComposerPrompt' import {DiscoverFallbackHeader} from './DiscoverFallbackHeader' import {FeedShutdownMsg} from './FeedShutdownMsg' import {PostFeedErrorMessage} from './PostFeedErrorMessage' @@ -149,6 +151,10 @@ type FeedRow = type: 'ageAssuranceBanner' key: string } + | { + type: 'composerPrompt' + key: string + } export function getItemsForFeedback(feedRow: FeedRow): { item: FeedPostSliceItem @@ -224,6 +230,7 @@ let PostFeed = ({ const {_} = useLingui() const queryClient = useQueryClient() const {currentAccount, hasSession} = useSession() + const gate = useGate() const initialNumToRender = useInitialNumToRender() const feedFeedback = useFeedFeedbackContext() const [isPTRing, setIsPTRing] = useState(false) @@ -363,6 +370,11 @@ let PostFeed = ({ */ const [isCurrentFeedAtStartupSelected] = useState(selectedFeed === feed) + const blockedOrMutedAuthors = usePostAuthorShadowFilter( + // author feeds have their own handling + feed.startsWith('author|') ? undefined : data?.pages, + ) + const feedItems: FeedRow[] = useMemo(() => { // wraps a slice item, and replaces it with a showLessFollowup item // if the user has pressed show less on it @@ -423,7 +435,11 @@ let PostFeed = ({ // eslint-disable-next-line @typescript-eslint/no-shadow item => item.uri === slice.feedPostUri, ) - if (item && AppBskyEmbedVideo.isView(item.post.embed)) { + if ( + item && + AppBskyEmbedVideo.isView(item.post.embed) && + !blockedOrMutedAuthors.includes(item.post.author.did) + ) { videos.push({ item, feedContext: slice.feedContext, @@ -501,6 +517,18 @@ let PostFeed = ({ 'interstitial2-' + sliceIndex + '-' + lastFetchedAt, }) } + // Show composer prompt for Discover and Following feeds + if ( + hasSession && + (feedUriOrActorDid === DISCOVER_FEED_URI || + feed === 'following') && + gate('show_composer_prompt') + ) { + arr.push({ + type: 'composerPrompt', + key: 'composerPrompt-' + sliceIndex, + }) + } } else if (sliceIndex === 15) { if (areVideoFeedsEnabled && !trendingVideoDisabled) { arr.push({ @@ -514,6 +542,16 @@ let PostFeed = ({ key: 'interstitial-' + sliceIndex + '-' + lastFetchedAt, }) } + } else if (feedKind === 'following') { + if (sliceIndex === 0) { + // Show composer prompt for Following feed + if (hasSession && gate('show_composer_prompt')) { + arr.push({ + type: 'composerPrompt', + key: 'composerPrompt-' + sliceIndex, + }) + } + } } else if (feedKind === 'profile') { if (sliceIndex === 5) { arr.push({ @@ -541,6 +579,12 @@ let PostFeed = ({ key: 'sliceFallbackMarker-' + sliceIndex + '-' + lastFetchedAt, }) + } else if ( + slice.items.some(item => + blockedOrMutedAuthors.includes(item.post.author.did), + ) + ) { + // skip } else if (slice.isIncompleteThread && slice.items.length >= 3) { const beforeLast = slice.items.length - 2 const last = slice.items.length - 1 @@ -622,6 +666,7 @@ let PostFeed = ({ isEmpty, lastFetchedAt, data, + feed, feedType, feedUriOrActorDid, feedTab, @@ -636,6 +681,8 @@ let PostFeed = ({ hasPressedShowLessUris, ageAssuranceBannerState, isCurrentFeedAtStartupSelected, + gate, + blockedOrMutedAuthors, ]) // events @@ -726,6 +773,8 @@ let PostFeed = ({ return } else if (row.type === 'interstitialTrending') { return + } else if (row.type === 'composerPrompt') { + return } else if (row.type === 'interstitialTrendingVideos') { return } else if (row.type === 'fallbackMarker') { diff --git a/src/view/com/posts/PostFeedReason.tsx b/src/view/com/posts/PostFeedReason.tsx index 4b0b34690d..575a59f83e 100644 --- a/src/view/com/posts/PostFeedReason.tsx +++ b/src/view/com/posts/PostFeedReason.tsx @@ -10,7 +10,7 @@ import {useSession} from '#/state/session' import {atoms as a, useTheme} from '#/alf' import {Pin_Stroke2_Corner0_Rounded as PinIcon} from '#/components/icons/Pin' import {Repost_Stroke2_Corner3_Rounded as RepostIcon} from '#/components/icons/Repost' -import {Link, WebOnlyInlineLinkText} from '#/components/Link' +import {Link} from '#/components/Link' import {ProfileHoverCard} from '#/components/ProfileHoverCard' import {Text} from '#/components/Typography' import {FeedNameText} from '../util/FeedInfoText' @@ -82,32 +82,21 @@ export function PostFeedReason({ width={13} height={13} /> - - {isOwner ? ( - Reposted by you - ) : ( - - Reposted by{' '} - - - {reposter} - - - - )} - + + + {isOwner ? ( + Reposted by you + ) : ( + Reposted by {reposter} + )} + + ) } diff --git a/src/view/com/profile/ProfileFollowers.tsx b/src/view/com/profile/ProfileFollowers.tsx index 3bafc0c987..39c251293e 100644 --- a/src/view/com/profile/ProfileFollowers.tsx +++ b/src/view/com/profile/ProfileFollowers.tsx @@ -71,6 +71,32 @@ export function ProfileFollowers({name}: {name: string}) { return [] }, [data]) + // Track pagination events - fire for page 3+ (pages 1-2 may auto-load) + const paginationTrackingRef = React.useRef<{ + did: string | undefined + page: number + }>({did: undefined, page: 0}) + React.useEffect(() => { + const currentPageCount = data?.pages?.length || 0 + // Reset tracking when profile changes + if (paginationTrackingRef.current.did !== resolvedDid) { + paginationTrackingRef.current = {did: resolvedDid, page: currentPageCount} + return + } + if ( + resolvedDid && + currentPageCount >= 3 && + currentPageCount > paginationTrackingRef.current.page + ) { + logger.metric('profile:followers:paginate', { + contextProfileDid: resolvedDid, + itemCount: followers.length, + page: currentPageCount, + }) + } + paginationTrackingRef.current.page = currentPageCount + }, [data?.pages?.length, resolvedDid, followers.length]) + const onRefresh = React.useCallback(async () => { setIsPTRing(true) try { @@ -96,6 +122,16 @@ export function ProfileFollowers({name}: {name: string}) { [resolvedDid], ) + // track pageview + React.useEffect(() => { + if (resolvedDid) { + logger.metric('profile:followers:view', { + contextProfileDid: resolvedDid, + isOwnProfile: isMe, + }) + } + }, [resolvedDid, isMe]) + // track seen items const seenItemsRef = React.useRef>(new Set()) React.useEffect(() => { diff --git a/src/view/com/profile/ProfileFollows.tsx b/src/view/com/profile/ProfileFollows.tsx index 28e3230414..243f3705b5 100644 --- a/src/view/com/profile/ProfileFollows.tsx +++ b/src/view/com/profile/ProfileFollows.tsx @@ -82,6 +82,32 @@ export function ProfileFollows({name}: {name: string}) { return [] }, [data]) + // Track pagination events - fire for page 3+ (pages 1-2 may auto-load) + const paginationTrackingRef = React.useRef<{ + did: string | undefined + page: number + }>({did: undefined, page: 0}) + React.useEffect(() => { + const currentPageCount = data?.pages?.length || 0 + // Reset tracking when profile changes + if (paginationTrackingRef.current.did !== resolvedDid) { + paginationTrackingRef.current = {did: resolvedDid, page: currentPageCount} + return + } + if ( + resolvedDid && + currentPageCount >= 3 && + currentPageCount > paginationTrackingRef.current.page + ) { + logger.metric('profile:following:paginate', { + contextProfileDid: resolvedDid, + itemCount: follows.length, + page: currentPageCount, + }) + } + paginationTrackingRef.current.page = currentPageCount + }, [data?.pages?.length, resolvedDid, follows.length]) + const onRefresh = React.useCallback(async () => { setIsPTRing(true) try { @@ -99,7 +125,7 @@ export function ProfileFollows({name}: {name: string}) { } catch (err) { logger.error('Failed to load more follows', {error: err}) } - }, [error, fetchNextPage, hasNextPage, isFetchingNextPage]) + }, [isFetchingNextPage, hasNextPage, error, fetchNextPage]) const renderItemWithContext = React.useCallback( ({item, index}: {item: ActorDefs.ProfileView; index: number}) => @@ -107,6 +133,16 @@ export function ProfileFollows({name}: {name: string}) { [resolvedDid], ) + // track pageview + React.useEffect(() => { + if (resolvedDid) { + logger.metric('profile:following:view', { + contextProfileDid: resolvedDid, + isOwnProfile: isMe, + }) + } + }, [resolvedDid, isMe]) + // track seen items const seenItemsRef = React.useRef>(new Set()) React.useEffect(() => { diff --git a/src/view/com/util/UserAvatar.tsx b/src/view/com/util/UserAvatar.tsx index aa5b22bd39..8a9e51a332 100644 --- a/src/view/com/util/UserAvatar.tsx +++ b/src/view/com/util/UserAvatar.tsx @@ -26,6 +26,7 @@ import {openCamera, openCropper, openPicker} from '#/lib/media/picker' import {type PickerImage} from '#/lib/media/picker.shared' import {makeProfileLink} from '#/lib/routes/links' import {sanitizeDisplayName} from '#/lib/strings/display-names' +import {isCancelledError} from '#/lib/strings/errors' import {sanitizeHandle} from '#/lib/strings/handles' import {logger} from '#/logger' import {isAndroid, isNative, isWeb} from '#/platform/detection' @@ -407,10 +408,10 @@ let EditableUserAvatar = ({ setRawImage(await createComposerImage(item)) editImageDialogControl.open() } - } catch (e: any) { + } catch (e) { // Don't log errors for cancelling selection to sentry on ios or android - if (!String(e).toLowerCase().includes('cancel')) { - logger.error('Failed to crop banner', {error: e}) + if (!isCancelledError(e)) { + logger.error('Failed to crop avatar', {error: e}) } } }, [ diff --git a/src/view/com/util/UserBanner.tsx b/src/view/com/util/UserBanner.tsx index 3600f5c24e..65e7b5a4a2 100644 --- a/src/view/com/util/UserBanner.tsx +++ b/src/view/com/util/UserBanner.tsx @@ -12,6 +12,7 @@ import { import {compressIfNeeded} from '#/lib/media/manip' import {openCamera, openCropper, openPicker} from '#/lib/media/picker' import {type PickerImage} from '#/lib/media/picker.shared' +import {isCancelledError} from '#/lib/strings/errors' import {logger} from '#/logger' import {isAndroid, isNative} from '#/platform/detection' import { @@ -87,8 +88,9 @@ export function UserBanner({ setRawImage(await createComposerImage(items[0])) editImageDialogControl.open() } - } catch (e: any) { - if (!String(e).includes('Canceled')) { + } catch (e) { + // Don't log errors for cancelling selection to sentry on ios or android + if (!isCancelledError(e)) { logger.error('Failed to crop banner', {error: e}) } } diff --git a/src/view/screens/Storybook/index.tsx b/src/view/screens/Storybook/index.tsx index f7eee5fee9..e8c972c667 100644 --- a/src/view/screens/Storybook/index.tsx +++ b/src/view/screens/Storybook/index.tsx @@ -3,12 +3,15 @@ import {View} from 'react-native' import {useNavigation} from '@react-navigation/native' import {type NavigationProp} from '#/lib/routes/types' -import {Sentry} from '#/logger/sentry/lib' import {useSetThemePrefs} from '#/state/shell' import {ListContained} from '#/view/screens/Storybook/ListContained' import {atoms as a, ThemeProvider} from '#/alf' import {Button, ButtonText} from '#/components/Button' import * as Layout from '#/components/Layout' +import { + useDeviceGeolocationApi, + useRequestDeviceGeolocation, +} from '#/geolocation' import {Admonitions} from './Admonitions' import {Breakpoints} from './Breakpoints' import {Buttons} from './Buttons' @@ -45,6 +48,8 @@ function StorybookInner() { const {setColorMode, setDarkTheme} = useSetThemePrefs() const [showContainedList, setShowContainedList] = React.useState(false) const navigation = useNavigation() + const requestDeviceGeolocation = useRequestDeviceGeolocation() + const {setDeviceGeolocation} = useDeviceGeolocationApi() return ( <> @@ -97,11 +102,17 @@ function StorybookInner() { Open Shared Prefs Tester diff --git a/src/view/shell/Composer.ios.tsx b/src/view/shell/Composer.ios.tsx index 8a0ee60055..3e4a551f0b 100644 --- a/src/view/shell/Composer.ios.tsx +++ b/src/view/shell/Composer.ios.tsx @@ -45,6 +45,7 @@ export function Composer({}: {winHeight: number}) { text={state?.text} imageUris={state?.imageUris} videoUri={state?.videoUri} + openGallery={state?.openGallery} /> diff --git a/src/view/shell/Composer.tsx b/src/view/shell/Composer.tsx index a17de6163d..a01cc9744d 100644 --- a/src/view/shell/Composer.tsx +++ b/src/view/shell/Composer.tsx @@ -55,6 +55,7 @@ export function Composer({winHeight}: {winHeight: number}) { text={state.text} imageUris={state.imageUris} videoUri={state.videoUri} + openGallery={state.openGallery} /> ) diff --git a/src/view/shell/Composer.web.tsx b/src/view/shell/Composer.web.tsx index a27e891680..df33ebcd4d 100644 --- a/src/view/shell/Composer.web.tsx +++ b/src/view/shell/Composer.web.tsx @@ -110,6 +110,7 @@ function Inner({state}: {state: ComposerOpts}) { openEmojiPicker={onOpenPicker} text={state.text} imageUris={state.imageUris} + openGallery={state.openGallery} /> diff --git a/src/view/shell/index.tsx b/src/view/shell/index.tsx index 5075f05cb5..c12141adb2 100644 --- a/src/view/shell/index.tsx +++ b/src/view/shell/index.tsx @@ -13,7 +13,6 @@ import {useNotificationsRegistration} from '#/lib/notifications/notifications' import {isStateAtTabRoot} from '#/lib/routes/helpers' import {isAndroid, isIOS} from '#/platform/detection' import {useDialogFullyExpandedCountContext} from '#/state/dialogs' -import {useGeolocationStatus} from '#/state/geolocation' import {useSession} from '#/state/session' import { useIsDrawerOpen, @@ -27,7 +26,6 @@ import {ErrorBoundary} from '#/view/com/util/ErrorBoundary' import {atoms as a, select, useTheme} from '#/alf' import {setSystemUITheme} from '#/alf/util/systemUI' import {AgeAssuranceRedirectDialog} from '#/components/ageAssurance/AgeAssuranceRedirectDialog' -import {BlockedGeoOverlay} from '#/components/BlockedGeoOverlay' import {EmailDialog} from '#/components/dialogs/EmailDialog' import {InAppBrowserConsentDialog} from '#/components/dialogs/InAppBrowserConsent' import {LinkWarningDialog} from '#/components/dialogs/LinkWarning' @@ -38,6 +36,9 @@ import { usePolicyUpdateContext, } from '#/components/PolicyUpdateOverlay' import {Outlet as PortalOutlet} from '#/components/Portal' +import {useAgeAssurance} from '#/ageAssurance' +import {NoAccessScreen} from '#/ageAssurance/components/NoAccessScreen' +import {RedirectOverlay} from '#/ageAssurance/components/RedirectOverlay' import {RoutesContainer, TabsNavigator} from '#/Navigation' import {BottomSheetOutlet} from '../../../modules/bottom-sheet' import {updateActiveViewAsync} from '../../../modules/expo-bluesky-swiss-army/src/VisibilityView' @@ -193,7 +194,7 @@ function DrawerLayout({children}: {children: React.ReactNode}) { export function Shell() { const t = useTheme() - const {status: geolocation} = useGeolocationStatus() + const aa = useAgeAssurance() const fullyExpandedCount = useDialogFullyExpandedCountContext() useIntentHandler() @@ -213,13 +214,15 @@ export function Shell() { navigationBar: t.name !== 'light' ? 'light' : 'dark', }} /> - {geolocation?.isAgeBlockedGeo ? ( - + {aa.state.access === aa.Access.None ? ( + ) : ( )} + + ) } diff --git a/src/view/shell/index.web.tsx b/src/view/shell/index.web.tsx index 4b8b47acd7..7fd5155ca3 100644 --- a/src/view/shell/index.web.tsx +++ b/src/view/shell/index.web.tsx @@ -8,7 +8,6 @@ import {RemoveScrollBar} from 'react-remove-scroll-bar' import {useIntentHandler} from '#/lib/hooks/useIntentHandler' import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' import {type NavigationProp} from '#/lib/routes/types' -import {useGeolocationStatus} from '#/state/geolocation' import {useIsDrawerOpen, useSetDrawerOpen} from '#/state/shell' import {useComposerKeyboardShortcut} from '#/state/shell/composer/useComposerKeyboardShortcut' import {useCloseAllActiveElements} from '#/state/util' @@ -17,7 +16,6 @@ import {ModalsContainer} from '#/view/com/modals/Modal' import {ErrorBoundary} from '#/view/com/util/ErrorBoundary' import {atoms as a, select, useTheme} from '#/alf' import {AgeAssuranceRedirectDialog} from '#/components/ageAssurance/AgeAssuranceRedirectDialog' -import {BlockedGeoOverlay} from '#/components/BlockedGeoOverlay' import {EmailDialog} from '#/components/dialogs/EmailDialog' import {LinkWarningDialog} from '#/components/dialogs/LinkWarning' import {MutedWordsDialog} from '#/components/dialogs/MutedWords' @@ -29,6 +27,9 @@ import { } from '#/components/PolicyUpdateOverlay' import {Outlet as PortalOutlet} from '#/components/Portal' import {WelcomeModal} from '#/components/WelcomeModal' +import {useAgeAssurance} from '#/ageAssurance' +import {NoAccessScreen} from '#/ageAssurance/components/NoAccessScreen' +import {RedirectOverlay} from '#/ageAssurance/components/RedirectOverlay' import {FlatNavigator, RoutesContainer} from '#/Navigation' import {Composer} from './Composer.web' import {DrawerContent} from './Drawer' @@ -139,16 +140,18 @@ function ShellInner() { export function Shell() { const t = useTheme() - const {status: geolocation} = useGeolocationStatus() + const aa = useAgeAssurance() return ( - {geolocation?.isAgeBlockedGeo ? ( - + {aa.state.access === aa.Access.None ? ( + ) : ( )} + + ) } diff --git a/web/index.html b/web/index.html index 2077530fe0..5458b57a36 100644 --- a/web/index.html +++ b/web/index.html @@ -73,11 +73,19 @@ width: 100%; } #splash { + display: flex; position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + align-items: center; + justify-content: center; + } + #splash svg { + position: relative; + top: -50px; width: 100px; - left: 50%; - top: 50%; - transform: translateX(-50%) translateY(-50%) translateY(-50px); } /** * We need these styles to prevent shifting due to scrollbar show/hide on @@ -146,7 +154,7 @@
- +
diff --git a/yarn.lock b/yarn.lock index 67ac38084c..6f1c16f8aa 100644 --- a/yarn.lock +++ b/yarn.lock @@ -84,15 +84,15 @@ tlds "^1.234.0" zod "^3.23.8" -"@atproto/api@^0.18.0": - version "0.18.0" - resolved "https://registry.yarnpkg.com/@atproto/api/-/api-0.18.0.tgz#d8c54ddc4521d915f0af238a4bfebd119e18197f" - integrity sha512-2GxKPhhvMocDjRU7VpNj+cvCdmCHVAmRwyfNgRLMrJtPZvrosFoi9VATX+7eKN0FZvYvy8KdLSkCcpP2owH3IA== +"@atproto/api@^0.18.4": + version "0.18.4" + resolved "https://registry.yarnpkg.com/@atproto/api/-/api-0.18.4.tgz#e6742f3b81acec2bcf63dd3787304166eb2891cb" + integrity sha512-+kSxto/GRFXRFFlGwfERrwEKnC6OqTgK34BUToer/Fv08q4WMR+GYPRabbWlnDoJWu3owcQfeYdcblQ88vi16g== dependencies: - "@atproto/common-web" "^0.4.3" - "@atproto/lexicon" "^0.5.1" - "@atproto/syntax" "^0.4.1" - "@atproto/xrpc" "^0.7.5" + "@atproto/common-web" "^0.4.6" + "@atproto/lexicon" "^0.5.2" + "@atproto/syntax" "^0.4.2" + "@atproto/xrpc" "^0.7.6" await-lock "^2.2.2" multiformats "^9.9.0" tlds "^1.234.0" @@ -192,6 +192,15 @@ uint8arrays "3.0.0" zod "^3.23.8" +"@atproto/common-web@^0.4.4", "@atproto/common-web@^0.4.6": + version "0.4.6" + resolved "https://registry.yarnpkg.com/@atproto/common-web/-/common-web-0.4.6.tgz#e32395d44d812610fd99f718b8644308b828d68b" + integrity sha512-+2mG/1oBcB/ZmYIU1ltrFMIiuy9aByKAkb2Fos/0eTdczcLBaH17k0KoxMGvhfsujN2r62XlanOAMzysa7lv1g== + dependencies: + "@atproto/lex-data" "0.0.2" + "@atproto/lex-json" "0.0.2" + zod "^3.23.8" + "@atproto/common@0.1.0": version "0.1.0" resolved "https://registry.yarnpkg.com/@atproto/common/-/common-0.1.0.tgz#4216a8fef5b985ab62ac21252a0f8ca0f4a0f210" @@ -301,6 +310,25 @@ multiformats "^9.9.0" zod "^3.23.8" +"@atproto/lex-data@0.0.2": + version "0.0.2" + resolved "https://registry.yarnpkg.com/@atproto/lex-data/-/lex-data-0.0.2.tgz#f90e7ac52dd6056199a84efc7a3c5196de7ceb63" + integrity sha512-euV2rDGi+coH8qvZOU+ieUOEbwPwff9ca6IiXIqjZJ76AvlIpj7vtAyIRCxHUW2BoU6h9yqyJgn9MKD2a7oIwg== + dependencies: + "@atproto/syntax" "0.4.2" + multiformats "^9.9.0" + tslib "^2.8.1" + uint8arrays "3.0.0" + unicode-segmenter "^0.14.0" + +"@atproto/lex-json@0.0.2": + version "0.0.2" + resolved "https://registry.yarnpkg.com/@atproto/lex-json/-/lex-json-0.0.2.tgz#c4d3b6a8e965898cbc80478ecd461ddd8ac38493" + integrity sha512-Pd72lO+l2rhOTutnf11omh9ZkoB/elbzE3HSmn2wuZlyH1mRhTYvoH8BOGokWQwbZkCE8LL3nOqMT3gHCD2l7g== + dependencies: + "@atproto/lex-data" "0.0.2" + tslib "^2.8.1" + "@atproto/lexicon-resolver@0.2.2", "@atproto/lexicon-resolver@^0.2.2": version "0.2.2" resolved "https://registry.yarnpkg.com/@atproto/lexicon-resolver/-/lexicon-resolver-0.2.2.tgz#2a91a1908f6b327c41cb5c290eb80aed5ef593c0" @@ -325,6 +353,17 @@ multiformats "^9.9.0" zod "^3.23.8" +"@atproto/lexicon@^0.5.2": + version "0.5.2" + resolved "https://registry.yarnpkg.com/@atproto/lexicon/-/lexicon-0.5.2.tgz#c2fb39b952644c9d88203850e0d61a26b39338ec" + integrity sha512-lRmJgMA8f5j7VB5Iu5cp188ald5FuI4FlmZ7nn6EBrk1dgOstWVrI5Ft6K3z2vjyLZRG6nzknlsw+tDP63p7bQ== + dependencies: + "@atproto/common-web" "^0.4.4" + "@atproto/syntax" "^0.4.1" + iso-datestring-validator "^2.2.2" + multiformats "^9.9.0" + zod "^3.23.8" + "@atproto/oauth-provider-api@0.3.1": version "0.3.1" resolved "https://registry.yarnpkg.com/@atproto/oauth-provider-api/-/oauth-provider-api-0.3.1.tgz#ade10e010d4b1c9cc8fc7afa3fa9e90d49ab05b9" @@ -516,6 +555,11 @@ resolved "https://registry.yarnpkg.com/@atproto/syntax/-/syntax-0.4.1.tgz#f77bc610ae0914449ff3f4731861e3da429915f5" integrity sha512-CJdImtLAiFO+0z3BWTtxwk6aY5w4t8orHTMVJgkf++QRJWTxPbIFko/0hrkADB7n2EruDxDSeAgfUGehpH6ngw== +"@atproto/syntax@0.4.2", "@atproto/syntax@^0.4.2": + version "0.4.2" + resolved "https://registry.yarnpkg.com/@atproto/syntax/-/syntax-0.4.2.tgz#a83ff62b82bf84308d78ad836c802bad6a52174a" + integrity sha512-X9XSRPinBy/0VQ677j8VXlBsYSsUXaiqxWVpGGxJYsAhugdQRb0jqaVKJFtm6RskeNkV6y9xclSUi9UYG/COrA== + "@atproto/xrpc-server@^0.9.5": version "0.9.5" resolved "https://registry.yarnpkg.com/@atproto/xrpc-server/-/xrpc-server-0.9.5.tgz#3a036ce2db85bcac40103fd160fef3ed7c364e2b" @@ -542,6 +586,14 @@ "@atproto/lexicon" "^0.5.1" zod "^3.23.8" +"@atproto/xrpc@^0.7.6": + version "0.7.6" + resolved "https://registry.yarnpkg.com/@atproto/xrpc/-/xrpc-0.7.6.tgz#bc12b0e37f81fa76589691634d4fac9774fd0cb5" + integrity sha512-RvCf4j0JnKYWuz3QzsYCntJi3VuiAAybQsMIUw2wLWcHhchO9F7UaBZINLL2z0qc/cYWPv5NSwcVydMseoCZLA== + dependencies: + "@atproto/lexicon" "^0.5.2" + zod "^3.23.8" + "@aws-crypto/crc32@5.2.0": version "5.2.0" resolved "https://registry.yarnpkg.com/@aws-crypto/crc32/-/crc32-5.2.0.tgz#cfcc22570949c98c6689cfcbd2d693d36cdae2e1" @@ -7189,11 +7241,6 @@ resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-5.25.0.tgz#e08ed0a9fad34c8005d1a282e57280031ac50cdc" integrity sha512-vlobHP64HTuSE68lWF1mEhwSRC5Q7gaT+a/m9S+ItuN+ruSOxe1rFnR9j0ACWQ314BPhBEVKfBQ6mHL0OWfdbQ== -"@tanstack/query-core@5.8.1": - version "5.8.1" - resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-5.8.1.tgz#5215a028370d9b2f32e83787a0ea119e2f977996" - integrity sha512-Y0enatz2zQXBAsd7XmajlCs+WaitdR7dIFkqz9Xd7HL4KV04JOigWVreYseTmNH7YFSBSC/BJ9uuNp1MAf+GfA== - "@tanstack/query-persist-client-core@5.25.0": version "5.25.0" resolved "https://registry.yarnpkg.com/@tanstack/query-persist-client-core/-/query-persist-client-core-5.25.0.tgz#52fa634a8067d7b965854a532a33077fd4df0eff" @@ -7208,12 +7255,12 @@ dependencies: "@tanstack/query-persist-client-core" "5.25.0" -"@tanstack/react-query@^5.8.1": - version "5.8.1" - resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-5.8.1.tgz#22a122016e23a39acd90341954a895980ec21ade" - integrity sha512-YMagxS8iNPOLg0pK6WOjdSDlAvWKOf69udLOwQrBVmkC2SRLNLko7elo5Ro3ptlJkXvTVHidxC/h5KGi5bH1XQ== +"@tanstack/react-query@5.25.0": + version "5.25.0" + resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-5.25.0.tgz#f4dac794cf10dd956aa56dbbdf67049a5ba2669d" + integrity sha512-u+n5R7mLO7RmeiIonpaCRVXNRWtZEef/aVZ/XGWRPa7trBIvGtzlfo0Ah7ZtnTYfrKEVwnZ/tzRCBcoiqJ/tFw== dependencies: - "@tanstack/query-core" "5.8.1" + "@tanstack/query-core" "5.25.0" "@testing-library/jest-native@^5.4.3": version "5.4.3" @@ -19041,7 +19088,7 @@ tsconfig-paths@^3.15.0: minimist "^1.2.6" strip-bom "^3.0.0" -tslib@2, tslib@^2.6.2: +tslib@2, tslib@^2.6.2, tslib@^2.8.1: version "2.8.1" resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.8.1.tgz#612efe4ed235d567e8aba5f2a5fab70280ade83f" integrity sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w== @@ -19323,6 +19370,11 @@ unicode-property-aliases-ecmascript@^2.0.0: resolved "https://registry.yarnpkg.com/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.1.0.tgz#43d41e3be698bd493ef911077c9b131f827e8ccd" integrity sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w== +unicode-segmenter@^0.14.0: + version "0.14.0" + resolved "https://registry.yarnpkg.com/unicode-segmenter/-/unicode-segmenter-0.14.0.tgz#090128182bcc710327a1b7e4af4f5834444eaa61" + integrity sha512-AH4lhPCJANUnSLEKnM4byboctePJzltF4xj8b+NbNiYeAkAXGh7px2K/4NANFp7dnr6+zB3e6HLu8Jj8SKyvYg== + unimodules-app-loader@~6.0.7: version "6.0.7" resolved "https://registry.yarnpkg.com/unimodules-app-loader/-/unimodules-app-loader-6.0.7.tgz#d88db74075815bcdc088c6c6823a2b08394a1225"