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> </span>
)} )}
{post?.replyCount === undefined && ( {post?.replyCount === undefined && !isInPendingPostView && (
<span className={styles.loadingString}> <span className={styles.loadingString}>
<LoadingEllipsis string={t('loading_comments')} /> <LoadingEllipsis string={t('loading_comments')} />
</span> </span>
@@ -452,14 +452,15 @@ const PostDesktop = ({ openReplyModal, post, roles, showAllReplies, showReplies
</div> </div>
))} ))}
</div> </div>
{stateString && stateString !== 'Failed' ? ( {!isInPendingPostView &&
<div className={styles.stateString}> (stateString && stateString !== 'Failed' ? (
<br /> <div className={styles.stateString}>
<LoadingEllipsis string={stateString} /> <br />
</div> <LoadingEllipsis string={stateString} />
) : ( </div>
state === 'failed' && <span className={styles.error}>{t('failed')}</span> ) : (
)} state === 'failed' && <span className={styles.error}>{t('failed')}</span>
))}
</div> </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>
)} )}
</div> </div>
{post?.replyCount === undefined && ( {post?.replyCount === undefined && !isInPendingPostView && (
<span className={styles.loadingString}> <span className={styles.loadingString}>
<LoadingEllipsis string={t('loading_comments')} /> <LoadingEllipsis string={t('loading_comments')} />
</span> </span>
@@ -365,13 +365,14 @@ const PostMobile = ({ openReplyModal, post, roles, showAllReplies, showReplies =
</div> </div>
))} ))}
</div> </div>
{stateString && stateString !== 'Failed' ? ( {!isInPendingPostView &&
<div className={styles.stateString}> (stateString && stateString !== 'Failed' ? (
<LoadingEllipsis string={stateString} /> <div className={styles.stateString}>
</div> <LoadingEllipsis string={stateString} />
) : ( </div>
state === 'failed' && <span className={styles.error}>{t('failed')}</span> ) : (
)} state === 'failed' && <span className={styles.error}>{t('failed')}</span>
))}
</div> </div>
)} )}
</> </>
src/views/post/post.module.css
-10
View File
@@ -519,8 +519,6 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
width: calc(100vw - 28px);
width: 100vw;
} }
@media (max-width: 640px) { @media (max-width: 640px) {
@@ -544,10 +542,6 @@
.authorAvatar { .authorAvatar {
vertical-align: middle; vertical-align: middle;
} }
.stateString {
padding-left: 5px;
}
} }
@media (min-width: 640px) { @media (min-width: 640px) {
@@ -568,8 +562,4 @@
.replyMobile { .replyMobile {
display: none; display: none;
} }
.stateString {
padding-top: 10px;
}
} }