fix popular posts

This commit is contained in:
Tom (plebeius.eth)
2024-10-12 17:09:23 +02:00
parent ba9496ca42
commit 088ec8428b
2 changed files with 53 additions and 33 deletions
+50 -30
View File
@@ -4,48 +4,68 @@ import { getCommentMediaInfo, getHasThumbnail } from '../lib/utils/media-utils';
const usePopularPosts = (subplebbits: Subplebbit[]) => { const usePopularPosts = (subplebbits: Subplebbit[]) => {
const [popularPosts, setPopularPosts] = useState<Comment[]>([]); const [popularPosts, setPopularPosts] = useState<Comment[]>([]);
const [isLoading, setIsLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
useEffect(() => { useEffect(() => {
const uniqueLinks: Set<string> = new Set(); const fetchPopularPosts = () => {
const allPosts: Comment[] = []; try {
setIsLoading(true);
setError(null);
const uniqueLinks: Set<string> = new Set();
const allPosts: Comment[] = [];
const postsPerSub = [0, 8, 4, 3, 2, 2, 2, 2, 1][Math.min(subplebbits.length, 8)]; const postsPerSub = [0, 8, 4, 3, 2, 2, 2, 2, 1][Math.min(subplebbits.length, 8)];
subplebbits.forEach((subplebbit: any) => { subplebbits.forEach((subplebbit: any) => {
let subplebbitPosts: Comment[] = []; let subplebbitPosts: Comment[] = [];
if (subplebbit?.posts?.pages?.hot?.comments) { if (subplebbit?.posts?.pages?.hot?.comments) {
for (const post of Object.values(subplebbit.posts.pages.hot.comments as Comment)) { for (const post of Object.values(subplebbit.posts.pages.hot.comments as Comment)) {
const { deleted, link, locked, pinned, removed, replyCount, timestamp } = post; const { deleted, link, locked, pinned, removed, replyCount, timestamp } = post;
const commentMediaInfo = getCommentMediaInfo(post);
const isMediaShowed = getHasThumbnail(commentMediaInfo, link);
if ( try {
isMediaShowed && const commentMediaInfo = getCommentMediaInfo(post);
(replyCount > 0 || postsPerSub > 1) && const hasThumbnail = getHasThumbnail(commentMediaInfo, link);
!deleted &&
!removed && if (
!locked && hasThumbnail &&
!pinned && (replyCount > 0 || postsPerSub > 1) &&
timestamp > Date.now() / 1000 - 60 * 60 * 24 * 30 && !deleted &&
!uniqueLinks.has(link) !removed &&
) { !locked &&
subplebbitPosts.push(post); !pinned &&
uniqueLinks.add(link); timestamp > Date.now() / 1000 - 60 * 60 * 24 * 30 &&
!uniqueLinks.has(link)
) {
subplebbitPosts.push(post);
uniqueLinks.add(link);
}
} catch (err) {
console.error('Error processing post:', err);
}
}
subplebbitPosts.sort((a: any, b: any) => b.timestamp - a.timestamp);
allPosts.push(...subplebbitPosts.slice(0, postsPerSub));
} }
} });
subplebbitPosts.sort((a: any, b: any) => b.timestamp - a.timestamp); const sortedPosts = allPosts.sort((a: any, b: any) => b.timestamp - a.timestamp).slice(0, 8);
allPosts.push(...subplebbitPosts.slice(0, postsPerSub));
setPopularPosts(sortedPosts);
} catch (err) {
console.error('Error in usePopularPosts:', err);
setError('Failed to fetch popular posts');
} finally {
setIsLoading(false);
} }
}); };
const sortedPosts = allPosts.sort((a: any, b: any) => b.timestamp - a.timestamp).slice(0, 8); fetchPopularPosts();
setPopularPosts(sortedPosts);
}, [subplebbits]); }, [subplebbits]);
return popularPosts; return { popularPosts, isLoading, error };
}; };
export default usePopularPosts; export default usePopularPosts;
@@ -71,7 +71,7 @@ const PopularThreadsBox = ({ multisub, subplebbits }: { multisub: Subplebbit[];
}; };
const filteredSubplebbits = useMemo(getFilteredSubplebbits, [subplebbits, showWorksafeContentOnly, showNsfwContentOnly, multisub]); const filteredSubplebbits = useMemo(getFilteredSubplebbits, [subplebbits, showWorksafeContentOnly, showNsfwContentOnly, multisub]);
const popularPosts = usePopularPosts(filteredSubplebbits); const { popularPosts } = usePopularPosts(filteredSubplebbits);
return ( return (
<div className={styles.box}> <div className={styles.box}>
@@ -79,8 +79,8 @@ const PopularThreadsBox = ({ multisub, subplebbits }: { multisub: Subplebbit[];
<h2 className='capitalize'>{t('popular_threads')}</h2> <h2 className='capitalize'>{t('popular_threads')}</h2>
<BoxModal isBoardsBoxModal={false} /> <BoxModal isBoardsBoxModal={false} />
</div> </div>
<div className={`${styles.boxContent} ${popularPosts.length === 8 ? styles.popularThreads : ''}`}> <div className={`${styles.boxContent} ${popularPosts.length !== 0 ? styles.popularThreads : ''}`}>
{popularPosts.length < 8 ? ( {popularPosts.length === 0 ? (
<LoadingEllipsis string={t('loading')} /> <LoadingEllipsis string={t('loading')} />
) : ( ) : (
popularPosts.map((post: any) => ( popularPosts.map((post: any) => (