Refactor feeds to use react-query

package.json

@@ -63,7 +63,7 @@
     "@segment/analytics-react-native": "^2.10.1",
     "@segment/sovran-react-native": "^0.4.5",
     "@sentry/react-native": "5.10.0",
-    "@tanstack/react-query": "^4.33.0",
+    "@tanstack/react-query": "^5.8.1",
     "@tiptap/core": "^2.0.0-beta.220",
     "@tiptap/extension-document": "^2.0.0-beta.220",
     "@tiptap/extension-hard-break": "^2.0.3",

src/lib/api/feed-manip.ts

@@ -116,6 +116,17 @@ export class FeedViewPostsSlice {
   }
 }
 
+export class NoopFeedTuner {
+  reset() {}
+  tune(
+    feed: FeedViewPost[],
+    _tunerFns: FeedTunerFn[] = [],
+    _opts?: {dryRun: boolean; maintainOrder: boolean},
+  ): FeedViewPostsSlice[] {
+    return feed.map(item => new FeedViewPostsSlice([item]))
+  }
+}
+
 export class FeedTuner {
   seenUris: Set<string> = new Set()
 

src/lib/api/feed/author.ts

@@ -1,38 +1,37 @@
 import {
   AppBskyFeedDefs,
   AppBskyFeedGetAuthorFeed as GetAuthorFeed,
+  BskyAgent,
 } from '@atproto/api'
-import {RootStoreModel} from 'state/index'
 import {FeedAPI, FeedAPIResponse} from './types'
 
 export class AuthorFeedAPI implements FeedAPI {
-  cursor: string | undefined
-
   constructor(
-    public rootStore: RootStoreModel,
+    public agent: BskyAgent,
     public params: GetAuthorFeed.QueryParams,
   ) {}
 
-  reset() {
-    this.cursor = undefined
-  }
-
   async peekLatest(): Promise<AppBskyFeedDefs.FeedViewPost> {
-    const res = await this.rootStore.agent.getAuthorFeed({
+    const res = await this.agent.getAuthorFeed({
       ...this.params,
       limit: 1,
     })
     return res.data.feed[0]
   }
 
-  async fetchNext({limit}: {limit: number}): Promise<FeedAPIResponse> {
-    const res = await this.rootStore.agent.getAuthorFeed({
+  async fetch({
+    cursor,
+    limit,
+  }: {
+    cursor: string | undefined
+    limit: number
+  }): Promise<FeedAPIResponse> {
+    const res = await this.agent.getAuthorFeed({
       ...this.params,
-      cursor: this.cursor,
+      cursor,
       limit,
     })
     if (res.success) {
-      this.cursor = res.data.cursor
       return {
         cursor: res.data.cursor,
         feed: this._filter(res.data.feed),

src/lib/api/feed/custom.ts

@@ -1,38 +1,37 @@
 import {
   AppBskyFeedDefs,
   AppBskyFeedGetFeed as GetCustomFeed,
+  BskyAgent,
 } from '@atproto/api'
-import {RootStoreModel} from 'state/index'
 import {FeedAPI, FeedAPIResponse} from './types'
 
 export class CustomFeedAPI implements FeedAPI {
-  cursor: string | undefined
-
   constructor(
-    public rootStore: RootStoreModel,
+    public agent: BskyAgent,
     public params: GetCustomFeed.QueryParams,
   ) {}
 
-  reset() {
-    this.cursor = undefined
-  }
-
   async peekLatest(): Promise<AppBskyFeedDefs.FeedViewPost> {
-    const res = await this.rootStore.agent.app.bsky.feed.getFeed({
+    const res = await this.agent.app.bsky.feed.getFeed({
       ...this.params,
       limit: 1,
     })
     return res.data.feed[0]
   }
 
-  async fetchNext({limit}: {limit: number}): Promise<FeedAPIResponse> {
-    const res = await this.rootStore.agent.app.bsky.feed.getFeed({
+  async fetch({
+    cursor,
+    limit,
+  }: {
+    cursor: string | undefined
+    limit: number
+  }): Promise<FeedAPIResponse> {
+    const res = await this.agent.app.bsky.feed.getFeed({
       ...this.params,
-      cursor: this.cursor,
+      cursor,
       limit,
     })
     if (res.success) {
-      this.cursor = res.data.cursor
       // NOTE
       // some custom feeds fail to enforce the pagination limit
       // so we manually truncate here

src/lib/api/feed/following.ts

@@ -1,30 +1,28 @@
-import {AppBskyFeedDefs} from '@atproto/api'
-import {RootStoreModel} from 'state/index'
+import {AppBskyFeedDefs, BskyAgent} from '@atproto/api'
 import {FeedAPI, FeedAPIResponse} from './types'
 
 export class FollowingFeedAPI implements FeedAPI {
-  cursor: string | undefined
-
-  constructor(public rootStore: RootStoreModel) {}
-
-  reset() {
-    this.cursor = undefined
-  }
+  constructor(public agent: BskyAgent) {}
 
   async peekLatest(): Promise<AppBskyFeedDefs.FeedViewPost> {
-    const res = await this.rootStore.agent.getTimeline({
+    const res = await this.agent.getTimeline({
       limit: 1,
     })
     return res.data.feed[0]
   }
 
-  async fetchNext({limit}: {limit: number}): Promise<FeedAPIResponse> {
-    const res = await this.rootStore.agent.getTimeline({
-      cursor: this.cursor,
+  async fetch({
+    cursor,
+    limit,
+  }: {
+    cursor: string | undefined
+    limit: number
+  }): Promise<FeedAPIResponse> {
+    const res = await this.agent.getTimeline({
+      cursor,
       limit,
     })
     if (res.success) {
-      this.cursor = res.data.cursor
       return {
         cursor: res.data.cursor,
         feed: res.data.feed,

src/lib/api/feed/likes.ts

@@ -1,38 +1,37 @@
 import {
   AppBskyFeedDefs,
   AppBskyFeedGetActorLikes as GetActorLikes,
+  BskyAgent,
 } from '@atproto/api'
-import {RootStoreModel} from 'state/index'
 import {FeedAPI, FeedAPIResponse} from './types'
 
 export class LikesFeedAPI implements FeedAPI {
-  cursor: string | undefined
-
   constructor(
-    public rootStore: RootStoreModel,
+    public agent: BskyAgent,
     public params: GetActorLikes.QueryParams,
   ) {}
 
-  reset() {
-    this.cursor = undefined
-  }
-
   async peekLatest(): Promise<AppBskyFeedDefs.FeedViewPost> {
-    const res = await this.rootStore.agent.getActorLikes({
+    const res = await this.agent.getActorLikes({
       ...this.params,
       limit: 1,
     })
     return res.data.feed[0]
   }
 
-  async fetchNext({limit}: {limit: number}): Promise<FeedAPIResponse> {
-    const res = await this.rootStore.agent.getActorLikes({
+  async fetch({
+    cursor,
+    limit,
+  }: {
+    cursor: string | undefined
+    limit: number
+  }): Promise<FeedAPIResponse> {
+    const res = await this.agent.getActorLikes({
       ...this.params,
-      cursor: this.cursor,
+      cursor,
       limit,
     })
     if (res.success) {
-      this.cursor = res.data.cursor
       return {
         cursor: res.data.cursor,
         feed: res.data.feed,

src/lib/api/feed/list.ts

@@ -1,38 +1,37 @@
 import {
   AppBskyFeedDefs,
   AppBskyFeedGetListFeed as GetListFeed,
+  BskyAgent,
 } from '@atproto/api'
-import {RootStoreModel} from 'state/index'
 import {FeedAPI, FeedAPIResponse} from './types'
 
 export class ListFeedAPI implements FeedAPI {
-  cursor: string | undefined
-
   constructor(
-    public rootStore: RootStoreModel,
+    public agent: BskyAgent,
     public params: GetListFeed.QueryParams,
   ) {}
 
-  reset() {
-    this.cursor = undefined
-  }
-
   async peekLatest(): Promise<AppBskyFeedDefs.FeedViewPost> {
-    const res = await this.rootStore.agent.app.bsky.feed.getListFeed({
+    const res = await this.agent.app.bsky.feed.getListFeed({
       ...this.params,
       limit: 1,
     })
     return res.data.feed[0]
   }
 
-  async fetchNext({limit}: {limit: number}): Promise<FeedAPIResponse> {
-    const res = await this.rootStore.agent.app.bsky.feed.getListFeed({
+  async fetch({
+    cursor,
+    limit,
+  }: {
+    cursor: string | undefined
+    limit: number
+  }): Promise<FeedAPIResponse> {
+    const res = await this.agent.app.bsky.feed.getListFeed({
       ...this.params,
-      cursor: this.cursor,
+      cursor,
       limit,
     })
     if (res.success) {
-      this.cursor = res.data.cursor
       return {
         cursor: res.data.cursor,
         feed: res.data.feed,