fix(posts): hide stale initializing footer

This commit is contained in:
Tommaso Casaburi
2026-06-18 22:27:30 +07:00
parent 87df18162c
commit fb1a61eace
4 changed files with 32 additions and 3 deletions
@@ -53,6 +53,7 @@ const testState = vi.hoisted(() => ({
pseudonymityMode: 'none',
replyComments: [] as Array<TestComment | undefined>,
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(),
+2 -1
View File
@@ -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) ? (
<div className={styles.stateString}>
+2 -1
View File
@@ -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) ? (
<div className={styles.stateString}>
@@ -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'));