diff --git a/src/components/__tests__/post-community-address-compat.test.tsx b/src/components/__tests__/post-community-address-compat.test.tsx index 9d809773..b189f141 100644 --- a/src/components/__tests__/post-community-address-compat.test.tsx +++ b/src/components/__tests__/post-community-address-compat.test.tsx @@ -53,6 +53,7 @@ const testState = vi.hoisted(() => ({ pseudonymityMode: 'none', replyComments: [] as Array, setResetFunctionMock: vi.fn(), + stateString: undefined as string | undefined, virtuosoProps: [] as Array<{ defaultItemHeight?: number; heightEstimates?: number[]; itemSize?: unknown }>, })); @@ -242,7 +243,7 @@ vi.mock('../../hooks/use-hide', () => ({ })); vi.mock('../../hooks/use-state-string', () => ({ - default: () => undefined, + default: () => testState.stateString, })); vi.mock('../../hooks/use-scroll-to-reply', () => ({ @@ -460,6 +461,7 @@ describe('post community address compatibility', () => { testState.hasMoreReplies = false; testState.pseudonymityMode = 'none'; testState.replyComments = []; + testState.stateString = undefined; testState.virtuosoProps = []; container = document.createElement('div'); @@ -496,6 +498,23 @@ describe('post community address compatibility', () => { expect(container.textContent).toContain('reply-1'); }); + it('hides stale initializing post footers after a thread post has loaded', async () => { + testState.stateString = 'Initializing'; + const post = { + ...makeLegacyThreadWithoutReplies(), + state: 'initializing', + updatedAt: 1_710_000_100, + }; + + await renderWithRoute(createElement(PostDesktop, { post, showAllReplies: true }), '/mu/thread/post-1'); + expect(container.textContent).not.toContain('Initializing'); + expect(container.textContent).toContain('post-1'); + + await renderWithRoute(createElement(PostMobile, { post, showAllReplies: true }), '/mu/thread/post-1'); + expect(container.textContent).not.toContain('Initializing'); + expect(container.textContent).toContain('post-1'); + }); + it('renders known developer badges and keeps anonymous as the default name on desktop and mobile', async () => { const post = { ...makeLegacyThread(), diff --git a/src/components/post-desktop/post-desktop.tsx b/src/components/post-desktop/post-desktop.tsx index ef641d58..8a681139 100644 --- a/src/components/post-desktop/post-desktop.tsx +++ b/src/components/post-desktop/post-desktop.tsx @@ -73,6 +73,7 @@ import { getCommentUserID } from '../../lib/utils/comment-user-id-utils'; import { getFeedPostHeightEstimate, getReplyHeightEstimates, reportReplyHeightAuditSample } from '../../lib/utils/pretext-height-estimates'; import { getAuthorBadge } from '../../lib/utils/author-display-utils'; import { hasCommentFlagsForDirectory } from '../../lib/comment-flag-selection'; +import { shouldSuppressPostLoadingState } from '../../lib/utils/post-loading-state-utils'; const RepliesFooter = ({ hasMore, loadingString }: { hasMore: boolean; loadingString: string }) => hasMore ? ( @@ -1331,7 +1332,7 @@ const PostDesktop = ({ stateString && !hasFailedState && state !== 'succeeded' && - !(resolvedPost?.timestamp && !resolvedPost?.updatedAt) && + !shouldSuppressPostLoadingState(resolvedPost) && isInPostPageView && !(!showReplies && !showAllReplies) ? (
diff --git a/src/components/post-mobile/post-mobile.tsx b/src/components/post-mobile/post-mobile.tsx index 4448507f..58e13988 100644 --- a/src/components/post-mobile/post-mobile.tsx +++ b/src/components/post-mobile/post-mobile.tsx @@ -62,6 +62,7 @@ import { getCommentUserID } from '../../lib/utils/comment-user-id-utils'; import { getFeedPostHeightEstimate, getReplyHeightEstimates, reportReplyHeightAuditSample } from '../../lib/utils/pretext-height-estimates'; import { getAuthorBadge } from '../../lib/utils/author-display-utils'; import { hasCommentFlagsForDirectory } from '../../lib/comment-flag-selection'; +import { shouldSuppressPostLoadingState } from '../../lib/utils/post-loading-state-utils'; const RepliesFooter = ({ hasMore, loadingString }: { hasMore: boolean; loadingString: string }) => hasMore ? ( @@ -1031,7 +1032,7 @@ const PostMobile = ({ stateString && !hasFailedState && state !== 'succeeded' && - !(resolvedPost?.timestamp && !resolvedPost?.updatedAt) && + !shouldSuppressPostLoadingState(resolvedPost) && isInPostPageView && !(!showReplies && !showAllReplies) ? (
diff --git a/src/lib/utils/post-loading-state-utils.ts b/src/lib/utils/post-loading-state-utils.ts new file mode 100644 index 00000000..9f9373ad --- /dev/null +++ b/src/lib/utils/post-loading-state-utils.ts @@ -0,0 +1,8 @@ +type PostLoadingStateComment = { + state?: string; + timestamp?: number; + updatedAt?: number; +}; + +export const shouldSuppressPostLoadingState = (post: PostLoadingStateComment | undefined): boolean => + Boolean(post?.timestamp && (!post.updatedAt || post.state === 'initializing'));