From b1c496f46dd038b8dd194a5c1eb5f63352ef4919 Mon Sep 17 00:00:00 2001 From: Michael Barrett Date: Thu, 27 Feb 2025 20:13:37 +0000 Subject: [PATCH] Updated thread implementation to work with posts in `admin-x-activitypub` (#22301) refs [AP-721](https://linear.app/ghost/issue/AP-721/update-getactivitythread-to-work-with-posts-instead-of-activities) Updated thread implementation to work with posts instead of activities in `admin-x-activitypub` as part of the posts migration --- .../admin-x-activitypub/src/api/activitypub.ts | 8 ++++---- .../src/components/feed/ArticleModal.tsx | 18 +++++++++--------- .../src/hooks/use-activity-pub-queries.ts | 11 +++++++---- .../src/views/Inbox/Inbox.tsx | 4 ++-- 4 files changed, 22 insertions(+), 19 deletions(-) diff --git a/apps/admin-x-activitypub/src/api/activitypub.ts b/apps/admin-x-activitypub/src/api/activitypub.ts index 3268fd12a7..396041fc6e 100644 --- a/apps/admin-x-activitypub/src/api/activitypub.ts +++ b/apps/admin-x-activitypub/src/api/activitypub.ts @@ -38,8 +38,8 @@ export interface SearchResults { accounts: AccountSearchResult[]; } -export interface ActivityThread { - items: Activity[]; +export interface Thread { + posts: Post[]; } export type ActivityPubCollectionResponse = {data: T[], next: string | null}; @@ -426,10 +426,10 @@ export class ActivityPubAPI { }; } - async getThread(id: string): Promise { + async getThread(id: string): Promise { const url = new URL(`.ghost/activitypub/thread/${encodeURIComponent(id)}`, this.apiUrl); const json = await this.fetchJSON(url); - return json as ActivityThread; + return json as Thread; } get accountApiUrl() { diff --git a/apps/admin-x-activitypub/src/components/feed/ArticleModal.tsx b/apps/admin-x-activitypub/src/components/feed/ArticleModal.tsx index a6f504a16c..9126022df7 100644 --- a/apps/admin-x-activitypub/src/components/feed/ArticleModal.tsx +++ b/apps/admin-x-activitypub/src/components/feed/ArticleModal.tsx @@ -379,10 +379,10 @@ const ArticleModal: React.FC = ({ const [isFocused] = useState(focusReply ? 1 : 0); const {threadQuery, addToThread} = useThreadForUser('index', activityId); - const {data: activityThread, isLoading: isLoadingThread} = threadQuery; - const activtyThreadActivityIdx = (activityThread?.items ?? []).findIndex(item => item.object.id === activityId); - const activityThreadChildren = (activityThread?.items ?? []).slice(activtyThreadActivityIdx + 1); - const activityThreadParents = (activityThread?.items ?? []).slice(0, activtyThreadActivityIdx); + const {data: thread, isLoading: isLoadingThread} = threadQuery; + const threadPostIdx = (thread?.posts ?? []).findIndex(item => item.object.id === activityId); + const threadChildren = (thread?.posts ?? []).slice(threadPostIdx + 1); + const threadParents = (thread?.posts ?? []).slice(0, threadPostIdx); const modalSize = width === 'narrow' ? MODAL_SIZE_SM : MODAL_SIZE_LG; const modal = useModal(); @@ -720,7 +720,7 @@ const ArticleModal: React.FC = ({ gridTemplateColumns: `1fr minmax(0,${currentGridWidth}) 1fr` } : undefined} > - {(canNavigateBack || (activityThreadParents.length > 0)) ? ( + {(canNavigateBack || (threadParents.length > 0)) ? (
@@ -853,7 +853,7 @@ const ArticleModal: React.FC = ({ )}
- {activityThreadParents.map((item) => { + {threadParents.map((item) => { return ( <> = ({ layout={'modal'} object={object} repostCount={object.repostCount ?? 0} - showHeader={(canNavigateBack || (activityThreadParents.length > 0))} + showHeader={(canNavigateBack || (threadParents.length > 0))} type='Note' onCommentClick={() => { repliesRef.current?.scrollIntoView({ @@ -938,8 +938,8 @@ const ArticleModal: React.FC = ({ {isLoadingThread && }
- {activityThreadChildren.map((item, index) => { - const showDivider = index !== activityThreadChildren.length - 1; + {threadChildren.map((item, index) => { + const showDivider = index !== threadChildren.length - 1; return ( diff --git a/apps/admin-x-activitypub/src/hooks/use-activity-pub-queries.ts b/apps/admin-x-activitypub/src/hooks/use-activity-pub-queries.ts index 80499c09e3..3b2dd1e3e2 100644 --- a/apps/admin-x-activitypub/src/hooks/use-activity-pub-queries.ts +++ b/apps/admin-x-activitypub/src/hooks/use-activity-pub-queries.ts @@ -3,7 +3,6 @@ import { type AccountSearchResult, ActivityPubAPI, ActivityPubCollectionResponse, - ActivityThread, FollowAccount, type GetAccountFollowsResponse, type Profile, @@ -591,19 +590,23 @@ export function useThreadForUser(handle: string, id: string) { const siteUrl = await getSiteUrl(); const api = createActivityPubAPI(handle, siteUrl); - return api.getThread(id); + return api.getThread(id).then((response) => { + return { + posts: response.posts.map(mapPostToActivity) + }; + }); } }); const addToThread = (activity: Activity) => { // Add the activity to the thread stored in the thread query cache - queryClient.setQueryData(queryKey, (current: ActivityThread | undefined) => { + queryClient.setQueryData(queryKey, (current: {posts: Activity[]} | undefined) => { if (!current) { return current; } return { - items: [...current.items, activity] + posts: [...current.posts, activity] }; }); }; diff --git a/apps/admin-x-activitypub/src/views/Inbox/Inbox.tsx b/apps/admin-x-activitypub/src/views/Inbox/Inbox.tsx index 889484dc0f..178dff3114 100644 --- a/apps/admin-x-activitypub/src/views/Inbox/Inbox.tsx +++ b/apps/admin-x-activitypub/src/views/Inbox/Inbox.tsx @@ -30,7 +30,7 @@ const Inbox: React.FC = () => { const activities = (data?.pages.flatMap(page => page.posts) ?? Array.from({length: 5}, (_, index) => ({id: `placeholder-${index}`, object: {}}))); const observerRef = useRef(null); - const loadMoreRef = useRef(null); + const loadMoreRef = useRef(null); const endLoadMoreRef = useRef(null); useEffect(() => { @@ -103,7 +103,7 @@ const Inbox: React.FC = () => { )} {index === loadMoreIndex && ( -
  • +
    )} ))}