mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
fix(feed): clarify loading states
This commit is contained in:
@@ -172,6 +172,30 @@ describe('use-state-string', () => {
|
||||
expect(latestValue).toBe('Downloading board via IPFS');
|
||||
});
|
||||
|
||||
it('formats single-board initializing feed states as board loading copy', () => {
|
||||
testState.community = {
|
||||
state: 'initializing',
|
||||
};
|
||||
|
||||
act(() => {
|
||||
root.render(createElement(FeedStateStringHarness, { addresses: ['music-posting.eth'] }));
|
||||
});
|
||||
|
||||
expect(latestValue).toBe('Loading board');
|
||||
});
|
||||
|
||||
it('keeps multi-board feeds on multi-board loading copy while the single community hook initializes', () => {
|
||||
testState.community = {
|
||||
state: 'initializing',
|
||||
};
|
||||
|
||||
act(() => {
|
||||
root.render(createElement(FeedStateStringHarness, { addresses: ['music-posting.eth', 'tech-posting.eth'] }));
|
||||
});
|
||||
|
||||
expect(latestValue).toBe('Downloading 2 boards (music-posting.eth, tech-posting.eth)');
|
||||
});
|
||||
|
||||
it('aggregates multi-board feed states across address resolution, threads, and pages', () => {
|
||||
testState.communitiesStates = {
|
||||
'fetching-ipfs': {
|
||||
|
||||
@@ -67,6 +67,8 @@ const sanitizeSingleFeedLoadingState = (stateString?: string): string | undefine
|
||||
}
|
||||
|
||||
return stateString
|
||||
.replace(/\bInitializing\b/g, 'Loading board')
|
||||
.replace(/\binitializing\b/g, 'loading board')
|
||||
.replace(/\bDownloading thread\b/g, 'Downloading board')
|
||||
.replace(/\bdownloading thread\b/g, 'downloading board')
|
||||
.replace(/\bLoading thread\b/g, 'Loading board')
|
||||
@@ -134,7 +136,8 @@ export const useFeedStateString = (communityAddresses?: string[]): string | unde
|
||||
const communityAddress = communityAddresses?.length === 1 ? communityAddresses[0] : undefined;
|
||||
const communityIdentifier = communityAddress ? communities[0] : undefined;
|
||||
const community = useCommunity(communityIdentifier ? { community: communityIdentifier } : undefined);
|
||||
const singleCommunityFeedStateString = sanitizeSingleFeedLoadingState(useStateString(community));
|
||||
const rawSingleCommunityFeedStateString = useStateString(communityAddress ? community : undefined);
|
||||
const singleCommunityFeedStateString = communityAddress ? sanitizeSingleFeedLoadingState(rawSingleCommunityFeedStateString) : undefined;
|
||||
|
||||
// multiple community feed state string
|
||||
const { states } = useCommunitiesStates({ communities });
|
||||
|
||||
@@ -684,6 +684,34 @@ describe('Board', () => {
|
||||
);
|
||||
});
|
||||
|
||||
it('does not show no threads while an empty all feed is still loading', async () => {
|
||||
testState.feedState = 'initializing';
|
||||
testState.feedStateString = 'Downloading 1 board (music-posting.eth)';
|
||||
testState.hasMore = true;
|
||||
|
||||
await renderBoard({
|
||||
boardProps: { viewType: 'all' },
|
||||
initialEntry: '/all',
|
||||
routePath: '/all/*',
|
||||
});
|
||||
|
||||
expect(container.textContent).not.toContain('no_threads');
|
||||
expect(container.querySelector('[data-testid="loading-ellipsis"]')?.textContent).toBe('Downloading 1 board (music-posting.eth)');
|
||||
});
|
||||
|
||||
it('shows no threads after an empty all feed finishes loading', async () => {
|
||||
testState.feedStateString = undefined;
|
||||
|
||||
await renderBoard({
|
||||
boardProps: { viewType: 'all' },
|
||||
initialEntry: '/all',
|
||||
routePath: '/all/*',
|
||||
});
|
||||
|
||||
expect(container.textContent).toContain('no_threads');
|
||||
expect(container.querySelector('[data-testid="loading-ellipsis"]')).toBeNull();
|
||||
});
|
||||
|
||||
it('shows a wider multiboard time-filter suggestion when older threads exist', async () => {
|
||||
const now = Math.floor(Date.now() / 1000);
|
||||
localStorage.setItem(LAST_VISIT_STORAGE_KEY, String((now - 3 * 24 * 60 * 60) * 1000));
|
||||
|
||||
@@ -92,8 +92,11 @@ const BoardFooter = ({
|
||||
|
||||
const loadingStateString = useFeedStateString(communityAddresses) || (combinedFeedLength === 0 ? t('downloading_board') : t('looking_for_more_posts'));
|
||||
const isLoadedCommunityState = communityState === 'succeeded' || communityState === 'ready';
|
||||
const canShowNoThreads = !isSingleCommunityBoard || (isLoadedCommunityState && feedState === 'succeeded');
|
||||
const isEmptyBoardLoading = isSingleCommunityBoard && combinedFeedLength === 0 && !canShowNoThreads && communityState !== 'failed';
|
||||
const isFeedSucceeded = feedState === 'succeeded';
|
||||
const isFeedFailed = feedState === 'failed';
|
||||
const canShowNoThreads = isSingleCommunityBoard ? isLoadedCommunityState && isFeedSucceeded : isFeedSucceeded && !hasMore;
|
||||
const isEmptyFeedLoading = combinedFeedLength === 0 && !canShowNoThreads && (isSingleCommunityBoard ? communityState !== 'failed' : !isFeedFailed);
|
||||
const showFooterLoading = showLoadingEllipsis && (hasMore || isEmptyFeedLoading);
|
||||
|
||||
let footerContent;
|
||||
if (moreThreadsSuggestion && moreThreadsSuggestionPathname) {
|
||||
@@ -140,7 +143,7 @@ const BoardFooter = ({
|
||||
) : isInModView && accountCommunityAddressesLength === 0 ? (
|
||||
<ModEmptyState />
|
||||
) : (
|
||||
showLoadingEllipsis && (hasMore || isEmptyBoardLoading) && <LoadingEllipsis string={loadingStateString} />
|
||||
showFooterLoading && <LoadingEllipsis string={loadingStateString} />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user