[APP-549] Language controls for Whats Hot (#563)

* Add a content-language preference control

* Update whats hot to only show the selected languages and to refresh on lang pref changes

* Fix lint

* Fix tests

* Add missing accessibility role

src/state/models/feeds/posts.ts

@@ -297,6 +297,9 @@ export class PostsFeedModel {
   // used to linearize async modifications to state
   lock = new AwaitLock()
 
+  // used to track if what's hot is coming up empty
+  emptyFetches = 0
+
   // data
   slices: PostsFeedSliceModel[] = []
 
@@ -603,6 +606,9 @@ export class PostsFeedModel {
   ) {
     this.loadMoreCursor = res.data.cursor
     this.hasMore = !!this.loadMoreCursor
+    if (replace) {
+      this.emptyFetches = 0
+    }
 
     this.rootStore.me.follows.hydrateProfiles(
       res.data.feed.map(item => item.post.author),
@@ -625,6 +631,12 @@ export class PostsFeedModel {
       } else {
         this.slices = this.slices.concat(toAppend)
       }
+      if (toAppend.length === 0) {
+        this.emptyFetches++
+        if (this.emptyFetches >= 10) {
+          this.hasMore = false
+        }
+      }
     })
   }
 

src/state/models/ui/preferences.ts

@@ -2,12 +2,9 @@ import {makeAutoObservable} from 'mobx'
 import {getLocales} from 'expo-localization'
 import {isObj, hasProp} from 'lib/type-guards'
 import {ComAtprotoLabelDefs} from '@atproto/api'
+import {LabelValGroup} from 'lib/labeling/types'
 import {getLabelValueGroup} from 'lib/labeling/helpers'
-import {
-  LabelValGroup,
-  UNKNOWN_LABEL_GROUP,
-  ILLEGAL_LABEL_GROUP,
-} from 'lib/labeling/const'
+import {UNKNOWN_LABEL_GROUP, ILLEGAL_LABEL_GROUP} from 'lib/labeling/const'
 
 const deviceLocales = getLocales()
 
@@ -28,24 +25,17 @@ export class LabelPreferencesModel {
 }
 
 export class PreferencesModel {
-  _contentLanguages: string[] | undefined
+  contentLanguages: string[] =
+    deviceLocales?.map?.(locale => locale.languageCode) || []
   contentLabels = new LabelPreferencesModel()
 
   constructor() {
     makeAutoObservable(this, {}, {autoBind: true})
   }
 
-  // gives an array of BCP 47 language tags without region codes
-  get contentLanguages() {
-    if (this._contentLanguages) {
-      return this._contentLanguages
-    }
-    return deviceLocales.map(locale => locale.languageCode)
-  }
-
   serialize() {
     return {
-      contentLanguages: this._contentLanguages,
+      contentLanguages: this.contentLanguages,
       contentLabels: this.contentLabels,
     }
   }
@@ -57,14 +47,31 @@ export class PreferencesModel {
         Array.isArray(v.contentLanguages) &&
         typeof v.contentLanguages.every(item => typeof item === 'string')
       ) {
-        this._contentLanguages = v.contentLanguages
+        this.contentLanguages = v.contentLanguages
       }
       if (hasProp(v, 'contentLabels') && typeof v.contentLabels === 'object') {
         Object.assign(this.contentLabels, v.contentLabels)
+      } else {
+        // default to the device languages
+        this.contentLanguages = deviceLocales.map(locale => locale.languageCode)
       }
     }
   }
 
+  hasContentLanguage(code2: string) {
+    return this.contentLanguages.includes(code2)
+  }
+
+  toggleContentLanguage(code2: string) {
+    if (this.hasContentLanguage(code2)) {
+      this.contentLanguages = this.contentLanguages.filter(
+        lang => lang !== code2,
+      )
+    } else {
+      this.contentLanguages = this.contentLanguages.concat([code2])
+    }
+  }
+
   setContentLabelPref(
     key: keyof LabelPreferencesModel,
     value: LabelPreference,

src/state/models/ui/shell.ts

@@ -85,6 +85,10 @@ export interface ContentFilteringSettingsModal {
   name: 'content-filtering-settings'
 }
 
+export interface ContentLanguagesSettingsModal {
+  name: 'content-languages-settings'
+}
+
 export type Modal =
   // Account
   | AddAppPasswordModal
@@ -94,6 +98,7 @@ export type Modal =
 
   // Curation
   | ContentFilteringSettingsModal
+  | ContentLanguagesSettingsModal
 
   // Reporting
   | ReportAccountModal