feat(post): add loading state string

This commit is contained in:
Tom (plebeius.eth)
2024-07-21 12:17:40 +02:00
parent c27cd8aa26
commit 954b158704
3 changed files with 38 additions and 2 deletions
+11 -1
View File
@@ -364,7 +364,7 @@ const Reply = ({ openReplyModal, postReplyCount, reply, roles }: PostProps) => {
const PostDesktop = ({ openReplyModal, post, roles, showAllReplies, showReplies = true }: PostProps) => {
const { t } = useTranslation();
const { author, cid, content, link, pinned, postCid, subplebbitAddress } = post || {};
const { author, cid, content, link, pinned, postCid, state, subplebbitAddress } = post || {};
const { isDescription, isRules } = post || {}; // custom properties, not from api
const params = useParams();
const location = useLocation();
@@ -391,6 +391,8 @@ const PostDesktop = ({ openReplyModal, post, roles, showAllReplies, showReplies
}
}, [location.pathname, replies, subplebbitAddress]);
const stateString = useStateString(post);
return (
<div className={styles.postDesktop}>
{showReplies ? (
@@ -450,6 +452,14 @@ const PostDesktop = ({ openReplyModal, post, roles, showAllReplies, showReplies
</div>
))}
</div>
{stateString && stateString !== 'Failed' ? (
<div className={styles.stateString}>
<br />
<LoadingEllipsis string={stateString} />
</div>
) : (
state === 'failed' && <span className={styles.error}>{t('failed')}</span>
)}
</div>
);
};
+10 -1
View File
@@ -285,7 +285,7 @@ const Reply = ({ openReplyModal, postReplyCount, reply, roles }: PostProps) => {
const PostMobile = ({ openReplyModal, post, roles, showAllReplies, showReplies = true }: PostProps) => {
const { t } = useTranslation();
const { author, cid, content, pinned, postCid, replyCount, subplebbitAddress } = post || {};
const { author, cid, content, pinned, postCid, replyCount, state, subplebbitAddress } = post || {};
const { isDescription, isRules } = post || {}; // custom properties, not from api
const params = useParams();
const location = useLocation();
@@ -307,6 +307,8 @@ const PostMobile = ({ openReplyModal, post, roles, showAllReplies, showReplies =
}
}, [location.pathname, replies, subplebbitAddress]);
const stateString = useStateString(post);
return (
<>
{hidden && !isInPostPageView ? (
@@ -363,6 +365,13 @@ const PostMobile = ({ openReplyModal, post, roles, showAllReplies, showReplies =
</div>
))}
</div>
{stateString && stateString !== 'Failed' ? (
<div className={styles.stateString}>
<LoadingEllipsis string={stateString} />
</div>
) : (
state === 'failed' && <span className={styles.error}>{t('failed')}</span>
)}
</div>
)}
</>