Sync prefs, add background task provider

src/App.native.tsx

@@ -35,6 +35,7 @@ import {
 } from 'state/session'
 import {Provider as UnreadNotifsProvider} from 'state/queries/notifications/unread'
 import * as persisted from '#/state/persisted'
+import {AccountBackgroundTaskProvider} from '#/state/AccountBackgroundTaskProvider'
 
 SplashScreen.preventAutoHideAsync()
 
@@ -69,6 +70,9 @@ function InnerApp() {
     <React.Fragment
       // Resets the entire tree below when it changes:
       key={currentAccount?.did}>
+      {/* Must live inside the tree reset above */}
+      <AccountBackgroundTaskProvider />
+
       <LoggedOutViewProvider>
         <UnreadNotifsProvider>
           <ThemeProvider theme={colorMode}>

src/App.web.tsx

@@ -29,6 +29,7 @@ import {
 } from 'state/session'
 import {Provider as UnreadNotifsProvider} from 'state/queries/notifications/unread'
 import * as persisted from '#/state/persisted'
+import {AccountBackgroundTaskProvider} from '#/state/AccountBackgroundTaskProvider'
 
 function InnerApp() {
   const {isInitialLoad, currentAccount} = useSession()
@@ -56,6 +57,9 @@ function InnerApp() {
     <React.Fragment
       // Resets the entire tree below when it changes:
       key={currentAccount?.did}>
+      {/* Must live inside the tree reset above */}
+      <AccountBackgroundTaskProvider />
+
       <LoggedOutViewProvider>
         <UnreadNotifsProvider>
           <ThemeProvider theme={colorMode}>

src/state/AccountBackgroundTaskProvider.tsx

@@ -0,0 +1,24 @@
+import React from 'react'
+
+import {useSession} from '#/state/session'
+import {useSyncPreferences} from '#/state/queries/preferences'
+
+/**
+ * Must live inside our "tree-reset" fragment in App.tsx, so that when the
+ * current user changes, we clean up the intervals.
+ */
+export function AccountBackgroundTaskProvider() {
+  const {currentAccount} = useSession()
+  const syncPreferences = useSyncPreferences()
+  const preferencesSyncInterval = React.useRef<NodeJS.Timeout | undefined>(
+    undefined,
+  )
+
+  React.useEffect(() => {
+    if (!currentAccount) return
+    preferencesSyncInterval.current = setInterval(syncPreferences, 15e3)
+    return () => clearInterval(preferencesSyncInterval.current)
+  }, [currentAccount, syncPreferences])
+
+  return null
+}

src/state/queries/preferences/index.ts

@@ -1,6 +1,10 @@
-import {useMemo} from 'react'
+import {useMemo, useCallback} from 'react'
 import {useQuery, useMutation, useQueryClient} from '@tanstack/react-query'
-import {LabelPreference, BskyFeedViewPreference} from '@atproto/api'
+import {
+  LabelPreference,
+  BskyFeedViewPreference,
+  BskyPreferences,
+} from '@atproto/api'
 
 import {track} from '#/lib/analytics/analytics'
 import {getAge} from '#/lib/strings/time'
@@ -26,18 +30,10 @@ export * from '#/state/queries/preferences/const'
 
 export const preferencesQueryKey = ['getPreferences']
 
-export function usePreferencesQuery() {
-  return useQuery({
-    staleTime: STALE.MINUTES.ONE,
-    queryKey: preferencesQueryKey,
-    queryFn: async () => {
-      const agent = getAgent()
-
-      if (agent.session?.did === undefined) {
-        return DEFAULT_LOGGED_OUT_PREFERENCES
-      } else {
-        const res = await agent.getPreferences()
-        const preferences: UsePreferencesQueryResponse = {
+function mergePreferencesResponseWithDefaults(
+  res: BskyPreferences,
+): UsePreferencesQueryResponse {
+  return {
     ...res,
     feeds: {
       saved: res.feeds?.saved || [],
@@ -56,8 +52,7 @@ export function usePreferencesQuery() {
         res.contentLabels?.nudity || DEFAULT_LABEL_PREFERENCES.nudity,
       ),
       suggestive: temp__migrateLabelPref(
-              res.contentLabels?.suggestive ||
-                DEFAULT_LABEL_PREFERENCES.suggestive,
+        res.contentLabels?.suggestive || DEFAULT_LABEL_PREFERENCES.suggestive,
       ),
       gore: temp__migrateLabelPref(
         res.contentLabels?.gore || DEFAULT_LABEL_PREFERENCES.gore,
@@ -83,12 +78,37 @@ export function usePreferencesQuery() {
     },
     userAge: res.birthDate ? getAge(res.birthDate) : undefined,
   }
+}
+
+export function usePreferencesQuery() {
+  return useQuery({
+    staleTime: STALE.MINUTES.ONE,
+    queryKey: preferencesQueryKey,
+    queryFn: async () => {
+      const agent = getAgent()
+
+      if (agent.session?.did === undefined) {
+        return DEFAULT_LOGGED_OUT_PREFERENCES
+      } else {
+        const res = await agent.getPreferences()
+        const preferences = mergePreferencesResponseWithDefaults(res)
         return preferences
       }
     },
   })
 }
 
+export function useSyncPreferences() {
+  const queryClient = useQueryClient()
+
+  return useCallback(async () => {
+    queryClient.invalidateQueries({
+      queryKey: preferencesQueryKey,
+      refetchType: 'none',
+    })
+  }, [queryClient])
+}
+
 export function useModerationOpts() {
   const {currentAccount} = useSession()
   const prefs = usePreferencesQuery()