Move suggested follow recommendations to the server (#836)

* Move suggested follow recommendations to the server

* fix search results color in dark mode

---------

Co-authored-by: Ansh Nanda <anshnanda10@gmail.com>

src/lib/constants.ts

@@ -35,67 +35,6 @@ export function TEAM_HANDLES(serviceUrl: string) {
   }
 }
 
-// NOTE
-// this is a temporary list that we periodically update
-// it is used in the search interface if the user doesn't follow anybody
-// -prf
-export const PROD_SUGGESTED_FOLLOWS = [
-  'bsky.app',
-  'jay.bsky.team',
-  'pfrazee.com',
-  'why.bsky.team',
-  'dholms.xyz',
-  'emily.bsky.team',
-  'rose.bsky.team',
-  'jack.bsky.social',
-  'faithlove.art',
-  'annaghughes.bsky.social',
-  'astrokatie.com',
-  'whysharksmatter.bsky.social',
-  'jamesgunn.bsky.social',
-  'seangunn.bsky.social',
-  'kumail.bsky.social',
-  'craignewmark.bsky.social',
-  'xychelsea.tv',
-  'catsofyore.bsky.social',
-  'mcq.bsky.social',
-  'mmasnick.bsky.social',
-  'kelseyhightower.com',
-  'aliafonzy.bsky.social',
-  'bradfitz.com',
-  'danabramov.bsky.social',
-  'shinyakato.dev',
-  'karpathy.bsky.social',
-  'lookitup.baby',
-  'pariss.blacktechpipeline.com',
-  'swiftonsecurity.com',
-  'ericajoy.astrel.la',
-  'b0rk.jvns.ca',
-  'vickiboykis.com',
-  'brooke.vibe.camp',
-  'amir.blue',
-  'moskov.bsky.social',
-  'neilhimself.bsky.social',
-  'kylierobison.com',
-  'carnage4life.bsky.social',
-  'lolennui.bsky.social',
-]
-export const STAGING_SUGGESTED_FOLLOWS = ['arcalinea', 'paul', 'paul2'].map(
-  handle => `${handle}.staging.bsky.dev`,
-)
-export const DEV_SUGGESTED_FOLLOWS = ['alice', 'bob', 'carla'].map(
-  handle => `${handle}.test`,
-)
-export function SUGGESTED_FOLLOWS(serviceUrl: string) {
-  if (serviceUrl.includes('localhost')) {
-    return DEV_SUGGESTED_FOLLOWS
-  } else if (serviceUrl.includes('staging')) {
-    return STAGING_SUGGESTED_FOLLOWS
-  } else {
-    return PROD_SUGGESTED_FOLLOWS
-  }
-}
-
 export const STAGING_DEFAULT_FEED = (rkey: string) =>
   `at://did:plc:wqzurwm3kmaig6e6hnc2gqwo/app.bsky.feed.generator/${rkey}`
 export const PROD_DEFAULT_FEED = (rkey: string) =>

src/state/models/discovery/suggested-actors.ts

@@ -1,10 +1,8 @@
 import {makeAutoObservable, runInAction} from 'mobx'
 import {AppBskyActorDefs} from '@atproto/api'
-import shuffle from 'lodash.shuffle'
 import {RootStoreModel} from '../root-store'
 import {cleanError} from 'lib/strings/errors'
 import {bundleAsync} from 'lib/async/bundle'
-import {SUGGESTED_FOLLOWS} from 'lib/constants'
 
 const PAGE_SIZE = 30
 
@@ -18,6 +16,7 @@ export class SuggestedActorsModel {
   isLoading = false
   isRefreshing = false
   hasLoaded = false
+  loadMoreCursor: string | undefined = undefined
   error = ''
   hasMore = false
 
@@ -57,33 +56,39 @@ export class SuggestedActorsModel {
   }
 
   loadMore = bundleAsync(async (replace: boolean = false) => {
-    if (this.suggestions.length && !replace) {
+    if (replace) {
+      this.hasMore = true
+      this.loadMoreCursor = undefined
+    }
+    if (!this.hasMore) {
       return
     }
     this._xLoading(replace)
     try {
-      // clone the array so we can mutate it
-      const actors = [
-        ...SUGGESTED_FOLLOWS(
-          this.rootStore.session.currentSession?.service || '',
-        ),
-      ]
-      const res = await this.rootStore.agent.getProfiles({
-        actors: shuffle(actors).splice(0, 25),
+      const res = await this.rootStore.agent.app.bsky.actor.getSuggestions({
+        limit: 25,
+        cursor: this.loadMoreCursor,
       })
-      const {profiles} = res.data
-      this.rootStore.me.follows.hydrateProfiles(profiles)
+      const {actors, cursor} = res.data
+      this.rootStore.me.follows.hydrateProfiles(actors)
 
       runInAction(() => {
-        this.suggestions = profiles.filter(profile => {
-          if (profile.viewer?.following) {
-            return false
-          }
-          if (profile.did === this.rootStore.me.did) {
-            return false
-          }
-          return true
-        })
+        if (replace) {
+          this.suggestions = []
+        }
+        this.loadMoreCursor = cursor
+        this.hasMore = !!cursor
+        this.suggestions = this.suggestions.concat(
+          actors.filter(actor => {
+            if (actor.viewer?.following) {
+              return false
+            }
+            if (actor.did === this.rootStore.me.did) {
+              return false
+            }
+            return true
+          }),
+        )
       })
       this._xIdle()
     } catch (e: any) {

src/view/com/search/SearchResults.tsx

@@ -24,7 +24,7 @@ export const SearchResults = observer(({model}: {model: SearchUIModel}) => {
   const renderTabBar = React.useCallback(
     (props: RenderTabBarFnProps) => {
       return (
-        <CenteredView style={[pal.border, styles.tabBar]}>
+        <CenteredView style={[pal.border, pal.view, styles.tabBar]}>
           <TabBar
             items={SECTIONS}
             {...props}
@@ -128,7 +128,6 @@ const styles = StyleSheet.create({
     top: 0,
     flexDirection: 'column',
     alignItems: 'center',
-    backgroundColor: 'white',
   },
   empty: {
     paddingHorizontal: 14,