fix(catalog): don't show description or rules if they are defined but empty

This commit is contained in:
plebeius.eth
2024-04-16 10:58:49 +02:00
parent 0f07e1eede
commit e191e403db
+20 -26
View File
@@ -12,60 +12,54 @@ import styles from './catalog.module.css';
const lastVirtuosoStates: { [key: string]: StateSnapshot } = {}; const lastVirtuosoStates: { [key: string]: StateSnapshot } = {};
const useFeedRows = (columnCount: number, feed: any, isFeedLoaded: boolean, subplebbit: Subplebbit) => { const useFeedRows = (columnCount: number, feed: any, isFeedLoaded: boolean, subplebbit: Subplebbit) => {
const modifiedFeed = useMemo(() => { const { t } = useTranslation();
const { address, createdAt, description, rules, shortAddress, suggested, title } = subplebbit || {};
const { avatarUrl } = suggested || {};
const feedWithDescriptionAndRules = useMemo(() => {
if (!isFeedLoaded) { if (!isFeedLoaded) {
return []; // prevent rules and description from appearing while feed is loading return []; // prevent rules and description from appearing while feed is loading
} }
if (!subplebbit?.description && !subplebbit?.rules) { if (!description && !rules) {
return feed; return feed;
} }
const _feed = [...feed]; const _feed = [...feed];
if (subplebbit?.description) { if (subplebbit?.description && subplebbit?.description.length > 0) {
_feed.unshift({ _feed.unshift({
isDescription: true, isDescription: true,
subplebbitAddress: subplebbit?.address, subplebbitAddress: address,
timestamp: subplebbit?.createdAt, timestamp: createdAt,
author: { displayName: '## Board Mods' }, author: { displayName: '## Board Mods' },
content: subplebbit?.description, content: description,
link: subplebbit?.suggested?.avatarUrl, link: avatarUrl,
title: 'Welcome to ' + (subplebbit?.title || `p/${subplebbit?.shortAddress}`), title: 'Welcome to ' + (title || `p/${shortAddress}`),
pinned: true, pinned: true,
locked: true, locked: true,
}); });
} }
if (subplebbit?.rules) { if (rules && rules.length > 0) {
_feed.unshift({ _feed.unshift({
isRules: true, isRules: true,
subplebbitAddress: subplebbit?.address, subplebbitAddress: address,
timestamp: subplebbit?.createdAt, timestamp: createdAt,
author: { displayName: '## Board Mods' }, author: { displayName: '## Board Mods' },
content: subplebbit?.rules.map((rule: string, index: number) => `${index + 1}. ${rule}`).join('\n'), content: rules.map((rule: string, index: number) => `${index + 1}. ${rule}`).join('\n'),
title: 'Rules', title: 'Rules',
pinned: true, pinned: true,
locked: true, locked: true,
}); });
} }
return _feed; return _feed;
}, [ }, [feed, description, rules, address, isFeedLoaded, createdAt, title, shortAddress, avatarUrl]);
feed,
subplebbit?.description,
subplebbit?.rules,
subplebbit?.address,
isFeedLoaded,
subplebbit?.createdAt,
subplebbit?.title,
subplebbit?.shortAddress,
subplebbit?.suggested?.avatarUrl,
]);
// Memoize rows calculation, ensuring it updates on changes to the modified feed or column count // Memoize rows calculation, ensuring it updates on changes to the modified feed or column count
const rows = useMemo(() => { const rows = useMemo(() => {
const rows = []; const rows = [];
for (let i = 0; i < modifiedFeed.length; i += columnCount) { for (let i = 0; i < feedWithDescriptionAndRules.length; i += columnCount) {
rows.push(modifiedFeed.slice(i, i + columnCount)); rows.push(feedWithDescriptionAndRules.slice(i, i + columnCount));
} }
return rows; return rows;
}, [modifiedFeed, columnCount]); }, [feedWithDescriptionAndRules, columnCount]);
return rows; return rows;
}; };