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(post): show loading state info

Browse Source
This commit is contained in:
Tom (plebeius.eth)
2024-07-22 12:29:32 +02:00
parent 6430607363
commit 7ff8af7fcd
3 changed files with 19 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/post-desktop/post-desktop.tsx
+10 -9
View File
@@ -434,7 +434,7 @@ const PostDesktop = ({ openReplyModal, post, roles, showAllReplies, showReplies
)}
</span>
)}
{post?.replyCount === undefined && (
{post?.replyCount === undefined && !isInPendingPostView && (
<span className={styles.loadingString}>
<LoadingEllipsis string={t('loading_comments')} />
</span>
@@ -452,14 +452,15 @@ 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>
)}
{!isInPendingPostView &&
(stateString && stateString !== 'Failed' ? (
<div className={styles.stateString}>
<br />
<LoadingEllipsis string={stateString} />
</div>
) : (
state === 'failed' && <span className={styles.error}>{t('failed')}</span>
))}
</div>
);
};
src/components/post-mobile/post-mobile.tsx
+9 -8
View File
@@ -348,7 +348,7 @@ const PostMobile = ({ openReplyModal, post, roles, showAllReplies, showReplies =
</div>
)}
</div>
{post?.replyCount === undefined && (
{post?.replyCount === undefined && !isInPendingPostView && (
<span className={styles.loadingString}>
<LoadingEllipsis string={t('loading_comments')} />
</span>
@@ -365,13 +365,14 @@ 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>
)}
{!isInPendingPostView &&
(stateString && stateString !== 'Failed' ? (
<div className={styles.stateString}>
<LoadingEllipsis string={stateString} />
</div>
) : (
state === 'failed' && <span className={styles.error}>{t('failed')}</span>
))}
</div>
)}
</>
src/views/post/post.module.css
-10
View File
@@ -519,8 +519,6 @@
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: calc(100vw - 28px);
width: 100vw;
}
@media (max-width: 640px) {
@@ -544,10 +542,6 @@
.authorAvatar {
vertical-align: middle;
}
.stateString {
padding-left: 5px;
}
}
@media (min-width: 640px) {
@@ -568,8 +562,4 @@
.replyMobile {
display: none;
}
.stateString {
padding-top: 10px;
}
}