External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(popular-threads): show actual feed state string instead of generic loading

Browse Source
This commit is contained in:
plebeius
2026-03-08 16:50:27 +08:00
parent 824c14f538
commit 04b98b84a4
1 changed files with 3 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/home/popular-threads-box/popular-threads-box.tsx
+3 -1
View File
@@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
import { Comment, Subplebbit } from '@bitsocialhq/bitsocial-react-hooks'; import { Comment, Subplebbit } from '@bitsocialhq/bitsocial-react-hooks';
import styles from '../home.module.css'; import styles from '../home.module.css';
import usePopularPosts from '../../../hooks/use-popular-posts'; import usePopularPosts from '../../../hooks/use-popular-posts';
import { useFeedStateString } from '../../../hooks/use-state-string';
import usePopularThreadsOptionsStore from '../../../stores/use-popular-threads-options-store'; import usePopularThreadsOptionsStore from '../../../stores/use-popular-threads-options-store';
import { getCommentMediaInfo } from '../../../lib/utils/media-utils'; import { getCommentMediaInfo } from '../../../lib/utils/media-utils';
import { CatalogPostMedia } from '../../../components/catalog-row'; import { CatalogPostMedia } from '../../../components/catalog-row';
@@ -86,6 +87,7 @@ const PopularThreadsBox = ({
}, [directories, directoryAddresses, showNsfwContentOnly, showWorksafeContentOnly, subplebbits]); }, [directories, directoryAddresses, showNsfwContentOnly, showWorksafeContentOnly, subplebbits]);
const { popularPosts, isLoading } = usePopularPosts(filteredSubplebbits, filteredBoardAddresses); const { popularPosts, isLoading } = usePopularPosts(filteredSubplebbits, filteredBoardAddresses);
const loadingStateString = useFeedStateString(filteredBoardAddresses) || t('loading');
return ( return (
<div className={styles.box}> <div className={styles.box}>
@@ -95,7 +97,7 @@ const PopularThreadsBox = ({
</div> </div>
<div className={`${styles.boxContent} ${styles.popularThreads} ${isLoading ? styles.popularThreadsLoading : ''}`}> <div className={`${styles.boxContent} ${styles.popularThreads} ${isLoading ? styles.popularThreadsLoading : ''}`}>
{isLoading ? ( {isLoading ? (
<LoadingEllipsis string={t('loading')} /> <LoadingEllipsis string={loadingStateString} />
) : ( ) : (
popularPosts.map((post: Comment) => { popularPosts.map((post: Comment) => {
const directoryEntry = findDirectoryByAddress(directories, post.subplebbitAddress); const directoryEntry = findDirectoryByAddress(directories, post.subplebbitAddress);