Fixes to feed preference and state sync [APP-678] (#829)

* Remove extraneous custom-feed health check

* Fixes to custom feed preference sync

* Fix lint

* Fix to how preferences are synced to enable membership modifications

src/state/models/feeds/posts.ts

@@ -436,9 +436,6 @@ export class PostsFeedModel {
     } else if (this.feedType === 'home') {
       return this.rootStore.agent.getTimeline(params as GetTimeline.QueryParams)
     } else if (this.feedType === 'custom') {
-      this.checkIfCustomFeedIsOnlineAndValid(
-        params as GetCustomFeed.QueryParams,
-      )
       return this.rootStore.agent.app.bsky.feed.getFeed(
         params as GetCustomFeed.QueryParams,
       )
@@ -448,18 +445,4 @@ export class PostsFeedModel {
       )
     }
   }
-
-  private async checkIfCustomFeedIsOnlineAndValid(
-    params: GetCustomFeed.QueryParams,
-  ) {
-    const res = await this.rootStore.agent.app.bsky.feed.getFeedGenerator({
-      feed: params.feed,
-    })
-    if (!res.data.isOnline || !res.data.isValid) {
-      runInAction(() => {
-        this.error =
-          'This custom feed is not online or may be experiencing issues.'
-      })
-    }
-  }
 }

src/state/models/me.ts

@@ -52,7 +52,6 @@ export class MeModel {
     this.mainFeed.clear()
     this.notifications.clear()
     this.follows.clear()
-    this.savedFeeds.clear()
     this.did = ''
     this.handle = ''
     this.displayName = ''
@@ -114,7 +113,6 @@ export class MeModel {
       /* dont await */ this.notifications.setup().catch(e => {
         this.rootStore.log.error('Failed to setup notifications model', e)
       })
-      /* dont await */ this.savedFeeds.refresh(true)
       this.rootStore.emitSessionLoaded()
       await this.fetchInviteCodes()
       await this.fetchAppPasswords()
@@ -124,7 +122,6 @@ export class MeModel {
   }
 
   async updateIfNeeded() {
-    /* dont await */ this.savedFeeds.refresh(true)
     if (Date.now() - this.lastProfileStateUpdate > PROFILE_UPDATE_INTERVAL) {
       this.rootStore.log.debug('Updating me profile information')
       this.lastProfileStateUpdate = Date.now()

src/state/models/ui/preferences.ts

@@ -1,5 +1,7 @@
 import {makeAutoObservable, runInAction} from 'mobx'
 import {getLocales} from 'expo-localization'
+import AwaitLock from 'await-lock'
+import isEqual from 'lodash.isequal'
 import {isObj, hasProp} from 'lib/type-guards'
 import {RootStoreModel} from '../root-store'
 import {ComAtprotoLabelDefs, AppBskyActorDefs} from '@atproto/api'
@@ -50,8 +52,11 @@ export class PreferencesModel {
   savedFeeds: string[] = []
   pinnedFeeds: string[] = []
 
+  // used to linearize async modifications to state
+  lock = new AwaitLock()
+
   constructor(public rootStore: RootStoreModel) {
-    makeAutoObservable(this, {}, {autoBind: true})
+    makeAutoObservable(this, {lock: false}, {autoBind: true})
   }
 
   serialize() {
@@ -103,7 +108,9 @@ export class PreferencesModel {
   /**
    * This function fetches preferences and sets defaults for missing items.
    */
-  async sync() {
+  async sync({clearCache}: {clearCache?: boolean} = {}) {
+    await this.lock.acquireAsync()
+    try {
       // fetch preferences
       let hasSavedFeedsPref = false
       const res = await this.rootStore.agent.app.bsky.actor.getPreferences({})
@@ -129,8 +136,12 @@ export class PreferencesModel {
             AppBskyActorDefs.isSavedFeedsPref(pref) &&
             AppBskyActorDefs.validateSavedFeedsPref(pref).success
           ) {
+            if (!isEqual(this.savedFeeds, pref.saved)) {
               this.savedFeeds = pref.saved
+            }
+            if (!isEqual(this.pinnedFeeds, pref.pinned)) {
               this.pinnedFeeds = pref.pinned
+            }
             hasSavedFeedsPref = true
           }
         }
@@ -157,8 +168,12 @@ export class PreferencesModel {
         await this.rootStore.agent.app.bsky.actor.putPreferences({
           preferences: res.data.preferences,
         })
-      /* dont await */ this.rootStore.me.savedFeeds.refresh()
       }
+    } finally {
+      this.lock.release()
+    }
+
+    await this.rootStore.me.savedFeeds.updateCache(clearCache)
   }
 
   /**
@@ -170,20 +185,32 @@ export class PreferencesModel {
    * argument and if the callback returns false, the preferences are not updated.
    * @returns void
    */
-  async update(cb: (prefs: AppBskyActorDefs.Preferences) => boolean | void) {
+  async update(
+    cb: (
+      prefs: AppBskyActorDefs.Preferences,
+    ) => AppBskyActorDefs.Preferences | false,
+  ) {
+    await this.lock.acquireAsync()
+    try {
       const res = await this.rootStore.agent.app.bsky.actor.getPreferences({})
-    if (cb(res.data.preferences) === false) {
+      const newPrefs = cb(res.data.preferences)
+      if (newPrefs === false) {
         return
       }
       await this.rootStore.agent.app.bsky.actor.putPreferences({
-      preferences: res.data.preferences,
+        preferences: newPrefs,
       })
+    } finally {
+      this.lock.release()
+    }
   }
 
   /**
    * This function resets the preferences to an empty array of no preferences.
    */
   async reset() {
+    await this.lock.acquireAsync()
+    try {
       runInAction(() => {
         this.contentLabels = new LabelPreferencesModel()
         this.contentLanguages = deviceLocales.map(locale => locale.languageCode)
@@ -193,6 +220,9 @@ export class PreferencesModel {
       await this.rootStore.agent.app.bsky.actor.putPreferences({
         preferences: [],
       })
+    } finally {
+      this.lock.release()
+    }
   }
 
   hasContentLanguage(code2: string) {
@@ -231,6 +261,7 @@ export class PreferencesModel {
           visibility: value,
         })
       }
+      return prefs
     })
   }
 
@@ -250,6 +281,7 @@ export class PreferencesModel {
           enabled: v,
         })
       }
+      return prefs
     })
   }
 
@@ -292,32 +324,31 @@ export class PreferencesModel {
     return res
   }
 
-  setFeeds(saved: string[], pinned: string[]) {
-    this.savedFeeds = saved
-    this.pinnedFeeds = pinned
-  }
-
   async setSavedFeeds(saved: string[], pinned: string[]) {
     const oldSaved = this.savedFeeds
     const oldPinned = this.pinnedFeeds
-    this.setFeeds(saved, pinned)
+    this.savedFeeds = saved
+    this.pinnedFeeds = pinned
     try {
       await this.update((prefs: AppBskyActorDefs.Preferences) => {
-        const existing = prefs.find(
+        let feedsPref = prefs.find(
           pref =>
             AppBskyActorDefs.isSavedFeedsPref(pref) &&
             AppBskyActorDefs.validateSavedFeedsPref(pref).success,
         )
-        if (existing) {
+        if (feedsPref) {
-          existing.saved = saved
+          feedsPref.saved = saved
-          existing.pinned = pinned
+          feedsPref.pinned = pinned
         } else {
-          prefs.push({
+          feedsPref = {
             $type: 'app.bsky.actor.defs#savedFeedsPref',
             saved,
             pinned,
-          })
           }
+        }
+        return prefs
+          .filter(pref => !AppBskyActorDefs.isSavedFeedsPref(pref))
+          .concat([feedsPref])
       })
     } catch (e) {
       runInAction(() => {

src/state/models/ui/saved-feeds.ts

@@ -1,5 +1,4 @@
 import {makeAutoObservable, runInAction} from 'mobx'
-import {AppBskyFeedDefs} from '@atproto/api'
 import {RootStoreModel} from '../root-store'
 import {bundleAsync} from 'lib/async/bundle'
 import {cleanError} from 'lib/strings/errors'
@@ -13,7 +12,7 @@ export class SavedFeedsModel {
   error = ''
 
   // data
-  feeds: CustomFeedModel[] = []
+  _feedModelCache: Record<string, CustomFeedModel> = {}
 
   constructor(public rootStore: RootStoreModel) {
     makeAutoObservable(
@@ -26,7 +25,7 @@ export class SavedFeedsModel {
   }
 
   get hasContent() {
-    return this.feeds.length > 0
+    return this.all.length > 0
   }
 
   get hasError() {
@@ -39,16 +38,19 @@ export class SavedFeedsModel {
 
   get pinned() {
     return this.rootStore.preferences.pinnedFeeds
-      .map(uri => this.feeds.find(f => f.uri === uri) as CustomFeedModel)
+      .map(uri => this._feedModelCache[uri] as CustomFeedModel)
       .filter(Boolean)
   }
 
   get unpinned() {
-    return this.feeds.filter(f => !this.isPinned(f))
+    return this.rootStore.preferences.savedFeeds
+      .filter(uri => !this.isPinned(uri))
+      .map(uri => this._feedModelCache[uri] as CustomFeedModel)
+      .filter(Boolean)
   }
 
   get all() {
-    return this.pinned.concat(this.unpinned)
+    return [...this.pinned, ...this.unpinned]
   }
 
   get pinnedFeedNames() {
@@ -58,31 +60,50 @@ export class SavedFeedsModel {
   // public api
   // =
 
-  clear() {
+  /**
-    this.isLoading = false
+   * Syncs the cached models against the current state
-    this.isRefreshing = false
+   * - Should only be called by the preferences model after syncing state
-    this.hasLoaded = false
+   */
-    this.error = ''
+  updateCache = bundleAsync(async (clearCache?: boolean) => {
-    this.feeds = []
+    let newFeedModels: Record<string, CustomFeedModel> = {}
+    if (!clearCache) {
+      newFeedModels = {...this._feedModelCache}
     }
 
-  refresh = bundleAsync(async (quietRefresh = false) => {
+    // collect the feed URIs that havent been synced yet
-    this._xLoading(!quietRefresh)
+    const neededFeedUris = []
-    try {
+    for (const feedUri of this.rootStore.preferences.savedFeeds) {
-      let feeds: AppBskyFeedDefs.GeneratorView[] = []
+      if (!(feedUri in newFeedModels)) {
-      for (
+        neededFeedUris.push(feedUri)
-        let i = 0;
-        i < this.rootStore.preferences.savedFeeds.length;
-        i += 25
-      ) {
-        const res = await this.rootStore.agent.app.bsky.feed.getFeedGenerators({
-          feeds: this.rootStore.preferences.savedFeeds.slice(i, 25),
-        })
-        feeds = feeds.concat(res.data.feeds)
       }
-      runInAction(() => {
+    }
-        this.feeds = feeds.map(f => new CustomFeedModel(this.rootStore, f))
+
+    // fetch the missing models
+    for (let i = 0; i < neededFeedUris.length; i += 25) {
+      const res = await this.rootStore.agent.app.bsky.feed.getFeedGenerators({
+        feeds: neededFeedUris.slice(i, 25),
       })
+      for (const feedInfo of res.data.feeds) {
+        newFeedModels[feedInfo.uri] = new CustomFeedModel(
+          this.rootStore,
+          feedInfo,
+        )
+      }
+    }
+
+    // merge into the cache
+    runInAction(() => {
+      this._feedModelCache = newFeedModels
+    })
+  })
+
+  /**
+   * Refresh the preferences then reload all feed infos
+   */
+  refresh = bundleAsync(async () => {
+    this._xLoading(true)
+    try {
+      await this.rootStore.preferences.sync({clearCache: true})
       this._xIdle()
     } catch (e: any) {
       this._xIdle(e)
@@ -92,12 +113,7 @@ export class SavedFeedsModel {
   async save(feed: CustomFeedModel) {
     try {
       await feed.save()
-      runInAction(() => {
+      await this.updateCache()
-        this.feeds = [
-          ...this.feeds,
-          new CustomFeedModel(this.rootStore, feed.data),
-        ]
-      })
     } catch (e: any) {
       this.rootStore.log.error('Failed to save feed', e)
     }
@@ -110,9 +126,6 @@ export class SavedFeedsModel {
         await this.rootStore.preferences.removePinnedFeed(uri)
       }
       await feed.unsave()
-      runInAction(() => {
-        this.feeds = this.feeds.filter(f => f.data.uri !== uri)
-      })
     } catch (e: any) {
       this.rootStore.log.error('Failed to unsave feed', e)
     }

src/view/screens/DiscoverFeeds.tsx

@@ -29,8 +29,8 @@ export const DiscoverFeedsScreen = withAuthRequired(
     )
 
     const onRefresh = React.useCallback(() => {
-      store.me.savedFeeds.refresh()
+      feeds.refresh()
-    }, [store])
+    }, [feeds])
 
     const renderListEmptyComponent = React.useCallback(() => {
       return (