Sort follows and following behind gate (#11237)

src/state/queries/profile-followers.ts

@@ -10,15 +10,33 @@ import {
 } from '@tanstack/react-query'
 
 import {useAgent} from '#/state/session'
+import {useAnalytics} from '#/analytics'
 
+const DEFAULT_SORT = 'latest'
 const PAGE_SIZE = 30
 type RQPageParam = string | undefined
 
 const RQKEY_ROOT = 'profile-followers'
-export const RQKEY = (did: string) => [RQKEY_ROOT, did]
+export const RQKEY = (did: string, sort: 'latest' | 'top' = DEFAULT_SORT) => [
+  RQKEY_ROOT,
+  did,
+  sort,
+]
 
-export function useProfileFollowersQuery(did: string | undefined) {
+export function useProfileFollowersQuery(
+  did?: string,
+  {
+    sort,
+  }: {
+    sort?: 'latest' | 'top'
+  } = {},
+) {
+  const ax = useAnalytics()
+  const isSortEnabled = ax.features.enabled(ax.features.FollowSortEnable)
   const agent = useAgent()
+
+  const sortParam = isSortEnabled ? sort || DEFAULT_SORT : undefined
+
   return useInfiniteQuery<
     AppBskyGraphGetFollowers.OutputSchema,
     Error,
@@ -26,12 +44,13 @@ export function useProfileFollowersQuery(did: string | undefined) {
     QueryKey,
     RQPageParam
   >({
-    queryKey: RQKEY(did || ''),
+    queryKey: RQKEY(did || '', sortParam),
     async queryFn({pageParam}: {pageParam: RQPageParam}) {
       const res = await agent.app.bsky.graph.getFollowers({
         actor: did || '',
         limit: PAGE_SIZE,
         cursor: pageParam,
+        sort: sortParam,
       })
       return res.data
     },

src/state/queries/profile-follows.ts

@@ -8,25 +8,36 @@ import {
 
 import {STALE} from '#/state/queries'
 import {useAgent} from '#/state/session'
+import {useAnalytics} from '#/analytics'
 
+const DEFAULT_SORT = 'latest'
 const PAGE_SIZE = 30
 type RQPageParam = string | undefined
 
 // TODO refactor invalidate on mutate?
 const RQKEY_ROOT = 'profile-follows'
-export const RQKEY = (did: string) => [RQKEY_ROOT, did]
+export const RQKEY = (did: string, sort: 'latest' | 'top' = DEFAULT_SORT) => [
+  RQKEY_ROOT,
+  did,
+  sort,
+]
 
 export function useProfileFollowsQuery(
   did: string | undefined,
   {
     limit,
+    sort,
   }: {
     limit?: number
-  } = {
-    limit: PAGE_SIZE,
-  },
+    sort?: 'latest' | 'top'
+  } = {},
 ) {
+  const ax = useAnalytics()
+  const isSortEnabled = ax.features.enabled(ax.features.FollowSortEnable)
   const agent = useAgent()
+
+  const sortParam = isSortEnabled ? sort || DEFAULT_SORT : undefined
+
   return useInfiniteQuery<
     AppBskyGraphGetFollows.OutputSchema,
     Error,
@@ -35,12 +46,13 @@ export function useProfileFollowsQuery(
     RQPageParam
   >({
     staleTime: STALE.MINUTES.ONE,
-    queryKey: RQKEY(did || ''),
+    queryKey: RQKEY(did || '', sortParam),
     async queryFn({pageParam}: {pageParam: RQPageParam}) {
       const res = await agent.app.bsky.graph.getFollows({
         actor: did || '',
         limit: limit || PAGE_SIZE,
         cursor: pageParam,
+        sort: sortParam,
       })
       return res.data
     },