diff --git a/src/state/queries/usePostThread/index.ts b/src/state/queries/usePostThread/index.ts index bfa596d7cc..7696f87c41 100644 --- a/src/state/queries/usePostThread/index.ts +++ b/src/state/queries/usePostThread/index.ts @@ -15,6 +15,7 @@ import { type ThreadItem, } from '#/state/queries/usePostThread/types' import {getThreadgateRecord} from '#/state/queries/usePostThread/utils' +import * as views from '#/state/queries/usePostThread/views' import {useAgent, useSession} from '#/state/session' import {useMergeThreadgateHiddenReplies} from '#/state/threadgate-hidden-replies' @@ -124,11 +125,12 @@ export function usePostThread({anchor}: {anchor?: string}) { if (!hasServerHiddenReplies) return setAdditionalHiddenItems( - Array.from({length: 2}).map((_, i) => ({ - type: 'skeleton', - key: `${anchor!}-reply-${i}`, - item: 'reply', - })), + Array.from({length: 2}).map((_, i) => + views.skeleton({ + key: `${anchor!}-reply-${i}`, + item: 'reply', + }), + ), ) const params = { @@ -212,27 +214,30 @@ export function usePostThread({anchor}: {anchor?: string}) { : 4 if (!items.length) { - items.push({ - type: 'skeleton', - key: anchor!, - item: 'anchor', - }) + items.push( + views.skeleton({ + key: anchor!, + item: 'anchor', + }), + ) if (hasSession) { - items.push({ - type: 'skeleton', - key: 'replyComposer', - item: 'replyComposer', - }) + items.push( + views.skeleton({ + key: 'replyComposer', + item: 'replyComposer', + }), + ) } } for (let i = 0; i < skeletonReplies; i++) { - items.push({ - type: 'skeleton', - key: `${anchor!}-reply-${i}`, - item: 'reply', - }) + items.push( + views.skeleton({ + key: `${anchor!}-reply-${i}`, + item: 'reply', + }), + ) } } diff --git a/src/state/queries/usePostThread/views.ts b/src/state/queries/usePostThread/views.ts index 3006425e46..99bae72b6f 100644 --- a/src/state/queries/usePostThread/views.ts +++ b/src/state/queries/usePostThread/views.ts @@ -115,6 +115,20 @@ export function readMore({ } } +export function skeleton({ + key, + item, +}: Omit, 'type'>): Extract< + ThreadItem, + {type: 'skeleton'} +> { + return { + type: 'skeleton', + key, + item, + } +} + export function postViewToThreadPlaceholder( post: AppBskyFeedDefs.PostView, ): $Typed<