From 6fe2b52f6860916a62bf9a4d680a0a3b91b50d91 Mon Sep 17 00:00:00 2001 From: Paul Frazee Date: Wed, 29 Nov 2023 10:10:04 -0800 Subject: Get more rigorous about getAgent() consistency (#2026) * Get more rigorous about getAgent() consistency * Update the feed wrapper API to use getAgent() directly --- src/lib/api/feed/author.ts | 11 ++++------- src/lib/api/feed/custom.ts | 11 ++++------- src/lib/api/feed/following.ts | 9 +++++---- src/lib/api/feed/likes.ts | 11 ++++------- src/lib/api/feed/list.ts | 11 ++++------- src/lib/api/feed/merge.ts | 36 ++++++++++++++---------------------- 6 files changed, 35 insertions(+), 54 deletions(-) (limited to 'src/lib/api/feed') diff --git a/src/lib/api/feed/author.ts b/src/lib/api/feed/author.ts index 77c167869..92df84f8b 100644 --- a/src/lib/api/feed/author.ts +++ b/src/lib/api/feed/author.ts @@ -1,18 +1,15 @@ import { AppBskyFeedDefs, AppBskyFeedGetAuthorFeed as GetAuthorFeed, - BskyAgent, } from '@atproto/api' import {FeedAPI, FeedAPIResponse} from './types' +import {getAgent} from '#/state/session' export class AuthorFeedAPI implements FeedAPI { - constructor( - public agent: BskyAgent, - public params: GetAuthorFeed.QueryParams, - ) {} + constructor(public params: GetAuthorFeed.QueryParams) {} async peekLatest(): Promise { - const res = await this.agent.getAuthorFeed({ + const res = await getAgent().getAuthorFeed({ ...this.params, limit: 1, }) @@ -26,7 +23,7 @@ export class AuthorFeedAPI implements FeedAPI { cursor: string | undefined limit: number }): Promise { - const res = await this.agent.getAuthorFeed({ + const res = await getAgent().getAuthorFeed({ ...this.params, cursor, limit, diff --git a/src/lib/api/feed/custom.ts b/src/lib/api/feed/custom.ts index 0be98fb4a..47ffc65ed 100644 --- a/src/lib/api/feed/custom.ts +++ b/src/lib/api/feed/custom.ts @@ -1,18 +1,15 @@ import { AppBskyFeedDefs, AppBskyFeedGetFeed as GetCustomFeed, - BskyAgent, } from '@atproto/api' import {FeedAPI, FeedAPIResponse} from './types' +import {getAgent} from '#/state/session' export class CustomFeedAPI implements FeedAPI { - constructor( - public agent: BskyAgent, - public params: GetCustomFeed.QueryParams, - ) {} + constructor(public params: GetCustomFeed.QueryParams) {} async peekLatest(): Promise { - const res = await this.agent.app.bsky.feed.getFeed({ + const res = await getAgent().app.bsky.feed.getFeed({ ...this.params, limit: 1, }) @@ -26,7 +23,7 @@ export class CustomFeedAPI implements FeedAPI { cursor: string | undefined limit: number }): Promise { - const res = await this.agent.app.bsky.feed.getFeed({ + const res = await getAgent().app.bsky.feed.getFeed({ ...this.params, cursor, limit, diff --git a/src/lib/api/feed/following.ts b/src/lib/api/feed/following.ts index 13f06c7ab..24389b5ed 100644 --- a/src/lib/api/feed/following.ts +++ b/src/lib/api/feed/following.ts @@ -1,11 +1,12 @@ -import {AppBskyFeedDefs, BskyAgent} from '@atproto/api' +import {AppBskyFeedDefs} from '@atproto/api' import {FeedAPI, FeedAPIResponse} from './types' +import {getAgent} from '#/state/session' export class FollowingFeedAPI implements FeedAPI { - constructor(public agent: BskyAgent) {} + constructor() {} async peekLatest(): Promise { - const res = await this.agent.getTimeline({ + const res = await getAgent().getTimeline({ limit: 1, }) return res.data.feed[0] @@ -18,7 +19,7 @@ export class FollowingFeedAPI implements FeedAPI { cursor: string | undefined limit: number }): Promise { - const res = await this.agent.getTimeline({ + const res = await getAgent().getTimeline({ cursor, limit, }) diff --git a/src/lib/api/feed/likes.ts b/src/lib/api/feed/likes.ts index 434ed7719..2b0afdf11 100644 --- a/src/lib/api/feed/likes.ts +++ b/src/lib/api/feed/likes.ts @@ -1,18 +1,15 @@ import { AppBskyFeedDefs, AppBskyFeedGetActorLikes as GetActorLikes, - BskyAgent, } from '@atproto/api' import {FeedAPI, FeedAPIResponse} from './types' +import {getAgent} from '#/state/session' export class LikesFeedAPI implements FeedAPI { - constructor( - public agent: BskyAgent, - public params: GetActorLikes.QueryParams, - ) {} + constructor(public params: GetActorLikes.QueryParams) {} async peekLatest(): Promise { - const res = await this.agent.getActorLikes({ + const res = await getAgent().getActorLikes({ ...this.params, limit: 1, }) @@ -26,7 +23,7 @@ export class LikesFeedAPI implements FeedAPI { cursor: string | undefined limit: number }): Promise { - const res = await this.agent.getActorLikes({ + const res = await getAgent().getActorLikes({ ...this.params, cursor, limit, diff --git a/src/lib/api/feed/list.ts b/src/lib/api/feed/list.ts index 6cb0730e7..19f2ff177 100644 --- a/src/lib/api/feed/list.ts +++ b/src/lib/api/feed/list.ts @@ -1,18 +1,15 @@ import { AppBskyFeedDefs, AppBskyFeedGetListFeed as GetListFeed, - BskyAgent, } from '@atproto/api' import {FeedAPI, FeedAPIResponse} from './types' +import {getAgent} from '#/state/session' export class ListFeedAPI implements FeedAPI { - constructor( - public agent: BskyAgent, - public params: GetListFeed.QueryParams, - ) {} + constructor(public params: GetListFeed.QueryParams) {} async peekLatest(): Promise { - const res = await this.agent.app.bsky.feed.getListFeed({ + const res = await getAgent().app.bsky.feed.getListFeed({ ...this.params, limit: 1, }) @@ -26,7 +23,7 @@ export class ListFeedAPI implements FeedAPI { cursor: string | undefined limit: number }): Promise { - const res = await this.agent.app.bsky.feed.getListFeed({ + const res = await getAgent().app.bsky.feed.getListFeed({ ...this.params, cursor, limit, diff --git a/src/lib/api/feed/merge.ts b/src/lib/api/feed/merge.ts index 7a0f02887..bc1b08831 100644 --- a/src/lib/api/feed/merge.ts +++ b/src/lib/api/feed/merge.ts @@ -1,4 +1,4 @@ -import {AppBskyFeedDefs, AppBskyFeedGetTimeline, BskyAgent} from '@atproto/api' +import {AppBskyFeedDefs, AppBskyFeedGetTimeline} from '@atproto/api' import shuffle from 'lodash.shuffle' import {timeout} from 'lib/async/timeout' import {bundleAsync} from 'lib/async/bundle' @@ -7,6 +7,7 @@ import {FeedTuner} from '../feed-manip' import {FeedAPI, FeedAPIResponse, ReasonFeedSource} from './types' import {FeedParams} from '#/state/queries/post-feed' import {FeedTunerFn} from '../feed-manip' +import {getAgent} from '#/state/session' const REQUEST_WAIT_MS = 500 // 500ms const POST_AGE_CUTOFF = 60e3 * 60 * 24 // 24hours @@ -18,16 +19,12 @@ export class MergeFeedAPI implements FeedAPI { itemCursor = 0 sampleCursor = 0 - constructor( - public agent: BskyAgent, - public params: FeedParams, - public feedTuners: FeedTunerFn[], - ) { - this.following = new MergeFeedSource_Following(this.agent, this.feedTuners) + constructor(public params: FeedParams, public feedTuners: FeedTunerFn[]) { + this.following = new MergeFeedSource_Following(this.feedTuners) } reset() { - this.following = new MergeFeedSource_Following(this.agent, this.feedTuners) + this.following = new MergeFeedSource_Following(this.feedTuners) this.customFeeds = [] // just empty the array, they will be captured in _fetchNext() this.feedCursor = 0 this.itemCursor = 0 @@ -35,8 +32,7 @@ export class MergeFeedAPI implements FeedAPI { if (this.params.mergeFeedEnabled && this.params.mergeFeedSources) { this.customFeeds = shuffle( this.params.mergeFeedSources.map( - feedUri => - new MergeFeedSource_Custom(this.agent, feedUri, this.feedTuners), + feedUri => new MergeFeedSource_Custom(feedUri, this.feedTuners), ), ) } else { @@ -45,7 +41,7 @@ export class MergeFeedAPI implements FeedAPI { } async peekLatest(): Promise { - const res = await this.agent.getTimeline({ + const res = await getAgent().getTimeline({ limit: 1, }) return res.data.feed[0] @@ -137,7 +133,7 @@ class MergeFeedSource { queue: AppBskyFeedDefs.FeedViewPost[] = [] hasMore = true - constructor(public agent: BskyAgent, public feedTuners: FeedTunerFn[]) {} + constructor(public feedTuners: FeedTunerFn[]) {} get numReady() { return this.queue.length @@ -199,7 +195,7 @@ class MergeFeedSource_Following extends MergeFeedSource { cursor: string | undefined, limit: number, ): Promise { - const res = await this.agent.getTimeline({cursor, limit}) + const res = await getAgent().getTimeline({cursor, limit}) // run the tuner pre-emptively to ensure better mixing const slices = this.tuner.tune(res.data.feed, this.feedTuners, { dryRun: false, @@ -213,20 +209,16 @@ class MergeFeedSource_Following extends MergeFeedSource { class MergeFeedSource_Custom extends MergeFeedSource { minDate: Date - constructor( - public agent: BskyAgent, - public feedUri: string, - public feedTuners: FeedTunerFn[], - ) { - super(agent, feedTuners) + constructor(public feedUri: string, public feedTuners: FeedTunerFn[]) { + super(feedTuners) this.sourceInfo = { $type: 'reasonFeedSource', displayName: feedUri.split('/').pop() || '', uri: feedUriToHref(feedUri), } this.minDate = new Date(Date.now() - POST_AGE_CUTOFF) - this.agent.app.bsky.feed - .getFeedGenerator({ + getAgent() + .app.bsky.feed.getFeedGenerator({ feed: feedUri, }) .then( @@ -244,7 +236,7 @@ class MergeFeedSource_Custom extends MergeFeedSource { limit: number, ): Promise { try { - const res = await this.agent.app.bsky.feed.getFeed({ + const res = await getAgent().app.bsky.feed.getFeed({ cursor, limit, feed: this.feedUri, -- cgit 1.4.1 From 630637874db9bf188214657b576cbf2965a77278 Mon Sep 17 00:00:00 2001 From: Paul Frazee Date: Wed, 29 Nov 2023 16:58:14 -0800 Subject: Fix state lifecycle management with post-feed query, solving the duplicate key issue (#2034) * Assign keys to feed slices via a counter, to enable duplicate items in the feed if needed * Move post-feed query state into the query's page params to consistently bind their lifecycles --- src/lib/api/feed-manip.ts | 35 +++++----- src/lib/api/feed/merge.ts | 4 +- src/state/queries/post-feed.ts | 143 +++++++++++++++++++++-------------------- src/view/com/posts/Feed.tsx | 8 +-- 4 files changed, 99 insertions(+), 91 deletions(-) (limited to 'src/lib/api/feed') diff --git a/src/lib/api/feed-manip.ts b/src/lib/api/feed-manip.ts index 912302d0a..1123c4e23 100644 --- a/src/lib/api/feed-manip.ts +++ b/src/lib/api/feed-manip.ts @@ -16,14 +16,7 @@ export type FeedTunerFn = ( export class FeedViewPostsSlice { isFlattenedReply = false - constructor(public items: FeedViewPost[] = []) {} - - get _reactKey() { - const rootItem = this.isFlattenedReply ? this.items[1] : this.items[0] - return `slice-${rootItem.post.uri}-${ - rootItem.reason?.indexedAt || rootItem.post.indexedAt - }` - } + constructor(public items: FeedViewPost[], public _reactKey: string) {} get uri() { if (this.isFlattenedReply) { @@ -118,28 +111,34 @@ export class FeedViewPostsSlice { } export class NoopFeedTuner { - reset() {} + private keyCounter = 0 + + reset() { + this.keyCounter = 0 + } tune( feed: FeedViewPost[], - _tunerFns: FeedTunerFn[] = [], _opts?: {dryRun: boolean; maintainOrder: boolean}, ): FeedViewPostsSlice[] { - return feed.map(item => new FeedViewPostsSlice([item])) + return feed.map( + item => new FeedViewPostsSlice([item], `slice-${this.keyCounter++}`), + ) } } export class FeedTuner { + private keyCounter = 0 seenUris: Set = new Set() - constructor() {} + constructor(public tunerFns: FeedTunerFn[]) {} reset() { + this.keyCounter = 0 this.seenUris.clear() } tune( feed: FeedViewPost[], - tunerFns: FeedTunerFn[] = [], {dryRun, maintainOrder}: {dryRun: boolean; maintainOrder: boolean} = { dryRun: false, maintainOrder: false, @@ -148,7 +147,9 @@ export class FeedTuner { let slices: FeedViewPostsSlice[] = [] if (maintainOrder) { - slices = feed.map(item => new FeedViewPostsSlice([item])) + slices = feed.map( + item => new FeedViewPostsSlice([item], `slice-${this.keyCounter++}`), + ) } else { // arrange the posts into thread slices for (let i = feed.length - 1; i >= 0; i--) { @@ -164,12 +165,14 @@ export class FeedTuner { continue } } - slices.unshift(new FeedViewPostsSlice([item])) + slices.unshift( + new FeedViewPostsSlice([item], `slice-${this.keyCounter++}`), + ) } } // run the custom tuners - for (const tunerFn of tunerFns) { + for (const tunerFn of this.tunerFns) { slices = tunerFn(this, slices.slice()) } diff --git a/src/lib/api/feed/merge.ts b/src/lib/api/feed/merge.ts index bc1b08831..11e963f0a 100644 --- a/src/lib/api/feed/merge.ts +++ b/src/lib/api/feed/merge.ts @@ -180,7 +180,7 @@ class MergeFeedSource { } class MergeFeedSource_Following extends MergeFeedSource { - tuner = new FeedTuner() + tuner = new FeedTuner(this.feedTuners) reset() { super.reset() @@ -197,7 +197,7 @@ class MergeFeedSource_Following extends MergeFeedSource { ): Promise { const res = await getAgent().getTimeline({cursor, limit}) // run the tuner pre-emptively to ensure better mixing - const slices = this.tuner.tune(res.data.feed, this.feedTuners, { + const slices = this.tuner.tune(res.data.feed, { dryRun: false, maintainOrder: true, }) diff --git a/src/state/queries/post-feed.ts b/src/state/queries/post-feed.ts index c3f0c758f..74c0c064e 100644 --- a/src/state/queries/post-feed.ts +++ b/src/state/queries/post-feed.ts @@ -1,5 +1,4 @@ -import {useCallback, useMemo} from 'react' -import {AppBskyFeedDefs, AppBskyFeedPost, moderatePost} from '@atproto/api' +import {AppBskyFeedDefs, AppBskyFeedPost} from '@atproto/api' import { useInfiniteQuery, InfiniteData, @@ -8,7 +7,7 @@ import { useQueryClient, } from '@tanstack/react-query' import {useFeedTuners} from '../preferences/feed-tuners' -import {FeedTuner, NoopFeedTuner} from 'lib/api/feed-manip' +import {FeedTuner, FeedTunerFn, NoopFeedTuner} from 'lib/api/feed-manip' import {FeedAPI, ReasonFeedSource} from 'lib/api/feed/types' import {FollowingFeedAPI} from 'lib/api/feed/following' import {AuthorFeedAPI} from 'lib/api/feed/author' @@ -16,7 +15,6 @@ import {LikesFeedAPI} from 'lib/api/feed/likes' import {CustomFeedAPI} from 'lib/api/feed/custom' import {ListFeedAPI} from 'lib/api/feed/list' import {MergeFeedAPI} from 'lib/api/feed/merge' -import {useModerationOpts} from '#/state/queries/preferences' import {logger} from '#/logger' import {STALE} from '#/state/queries' import {precacheFeedPosts as precacheResolvedUris} from './resolve-uri' @@ -41,7 +39,9 @@ export interface FeedParams { mergeFeedSources?: string[] } -type RQPageParam = string | undefined +type RQPageParam = + | {cursor: string | undefined; api: FeedAPI; tuner: FeedTuner | NoopFeedTuner} + | undefined export function RQKEY(feedDesc: FeedDescriptor, params?: FeedParams) { return ['post-feed', feedDesc, params || {}] @@ -63,6 +63,8 @@ export interface FeedPostSlice { } export interface FeedPage { + api: FeedAPI + tuner: FeedTuner | NoopFeedTuner cursor: string | undefined slices: FeedPostSlice[] } @@ -75,64 +77,8 @@ export function usePostFeedQuery( const queryClient = useQueryClient() const feedTuners = useFeedTuners(feedDesc) const enabled = opts?.enabled !== false - const moderationOpts = useModerationOpts() - const api: FeedAPI = useMemo(() => { - if (feedDesc === 'home') { - return new MergeFeedAPI(params || {}, feedTuners) - } else if (feedDesc === 'following') { - return new FollowingFeedAPI() - } else if (feedDesc.startsWith('author')) { - const [_, actor, filter] = feedDesc.split('|') - return new AuthorFeedAPI({actor, filter}) - } else if (feedDesc.startsWith('likes')) { - const [_, actor] = feedDesc.split('|') - return new LikesFeedAPI({actor}) - } else if (feedDesc.startsWith('feedgen')) { - const [_, feed] = feedDesc.split('|') - return new CustomFeedAPI({feed}) - } else if (feedDesc.startsWith('list')) { - const [_, list] = feedDesc.split('|') - return new ListFeedAPI({list}) - } else { - // shouldnt happen - return new FollowingFeedAPI() - } - }, [feedDesc, params, feedTuners]) - - const disableTuner = !!params?.disableTuner - const tuner = useMemo( - () => (disableTuner ? new NoopFeedTuner() : new FeedTuner()), - [disableTuner], - ) - - const pollLatest = useCallback(async () => { - if (!enabled) { - return false - } - - logger.debug('usePostFeedQuery: pollLatest') - - const post = await api.peekLatest() - - if (post && moderationOpts) { - const slices = tuner.tune([post], feedTuners, { - dryRun: true, - maintainOrder: true, - }) - if (slices[0]) { - if ( - !moderatePost(slices[0].items[0].post, moderationOpts).content.filter - ) { - return true - } - } - } - - return false - }, [api, tuner, feedTuners, moderationOpts, enabled]) - - const out = useInfiniteQuery< + return useInfiniteQuery< FeedPage, Error, InfiniteData, @@ -143,13 +89,23 @@ export function usePostFeedQuery( queryKey: RQKEY(feedDesc, params), async queryFn({pageParam}: {pageParam: RQPageParam}) { logger.debug('usePostFeedQuery', {feedDesc, pageParam}) - if (!pageParam) { - tuner.reset() - } - const res = await api.fetch({cursor: pageParam, limit: 30}) + + const {api, tuner, cursor} = pageParam + ? pageParam + : { + api: createApi(feedDesc, params || {}, feedTuners), + tuner: params?.disableTuner + ? new NoopFeedTuner() + : new FeedTuner(feedTuners), + cursor: undefined, + } + + const res = await api.fetch({cursor, limit: 30}) precacheResolvedUris(queryClient, res.feed) // precache the handle->did resolution - const slices = tuner.tune(res.feed, feedTuners) + const slices = tuner.tune(res.feed) return { + api, + tuner, cursor: res.cursor, slices: slices.map(slice => ({ _reactKey: slice._reactKey, @@ -180,11 +136,60 @@ export function usePostFeedQuery( } }, initialPageParam: undefined, - getNextPageParam: lastPage => lastPage.cursor, + getNextPageParam: lastPage => ({ + api: lastPage.api, + tuner: lastPage.tuner, + cursor: lastPage.cursor, + }), enabled, }) +} + +export async function pollLatest(page: FeedPage | undefined) { + if (!page) { + return false + } + + logger.debug('usePostFeedQuery: pollLatest') + const post = await page.api.peekLatest() + if (post) { + const slices = page.tuner.tune([post], { + dryRun: true, + maintainOrder: true, + }) + if (slices[0]) { + return true + } + } + + return false +} - return {...out, pollLatest} +function createApi( + feedDesc: FeedDescriptor, + params: FeedParams, + feedTuners: FeedTunerFn[], +) { + if (feedDesc === 'home') { + return new MergeFeedAPI(params, feedTuners) + } else if (feedDesc === 'following') { + return new FollowingFeedAPI() + } else if (feedDesc.startsWith('author')) { + const [_, actor, filter] = feedDesc.split('|') + return new AuthorFeedAPI({actor, filter}) + } else if (feedDesc.startsWith('likes')) { + const [_, actor] = feedDesc.split('|') + return new LikesFeedAPI({actor}) + } else if (feedDesc.startsWith('feedgen')) { + const [_, feed] = feedDesc.split('|') + return new CustomFeedAPI({feed}) + } else if (feedDesc.startsWith('list')) { + const [_, list] = feedDesc.split('|') + return new ListFeedAPI({list}) + } else { + // shouldnt happen + return new FollowingFeedAPI() + } } /** diff --git a/src/view/com/posts/Feed.tsx b/src/view/com/posts/Feed.tsx index fc6d77696..393c1bc91 100644 --- a/src/view/com/posts/Feed.tsx +++ b/src/view/com/posts/Feed.tsx @@ -23,6 +23,7 @@ import { FeedDescriptor, FeedParams, usePostFeedQuery, + pollLatest, } from '#/state/queries/post-feed' import {useModerationOpts} from '#/state/queries/preferences' @@ -84,22 +85,21 @@ let Feed = ({ hasNextPage, isFetchingNextPage, fetchNextPage, - pollLatest, } = usePostFeedQuery(feed, feedParams, opts) const isEmpty = !isFetching && !data?.pages[0]?.slices.length const checkForNew = React.useCallback(async () => { - if (!isFetched || isFetching || !onHasNew) { + if (!data?.pages[0] || isFetching || !onHasNew) { return } try { - if (await pollLatest()) { + if (await pollLatest(data.pages[0])) { onHasNew(true) } } catch (e) { logger.error('Poll latest failed', {feed, error: String(e)}) } - }, [feed, isFetched, isFetching, pollLatest, onHasNew]) + }, [feed, data, isFetching, onHasNew]) React.useEffect(() => { // we store the interval handler in a ref to avoid needless -- cgit 1.4.1