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

fix(post): deleted or removed comments still showed display name, avatar, role and ID

Browse Source
This commit is contained in:
Tom (plebeius.eth)
2024-08-25 18:15:27 +02:00
parent 5d4d9f1bc0
commit b7e443d7d3
2 changed files with 75 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/post-desktop/post-desktop.tsx
+39 -22
View File
@@ -46,7 +46,7 @@ const useShowOmittedReplies = create<ShowOmittedRepliesState>((set) => ({
const PostInfo = ({ openReplyModal, post, postReplyCount = 0, roles, isHidden }: PostProps) => {
const { t } = useTranslation();
const { author, cid, locked, pinned, parentCid, postCid, replyCount, shortCid, state, subplebbitAddress, timestamp } = post || {};
const { author, cid, deleted, locked, pinned, parentCid, postCid, removed, replyCount, shortCid, state, subplebbitAddress, timestamp } = post || {};
const title = post?.title?.trim();
const replies = useReplies(post);
const { address, shortAddress } = author || {};
@@ -72,7 +72,8 @@ const PostInfo = ({ openReplyModal, post, postReplyCount = 0, roles, isHidden }:
const handleUserAddressClick = useAuthorAddressClick();
const numberOfPostsByAuthor = document.querySelectorAll(`[data-author-address="${shortAddress}"][data-post-cid="${postCid}"]`).length;
const userIDBackgroundColor = hashStringToColor(shortAddress || accountShortAddress);
const userID = shortAddress || accountShortAddress;
const userIDBackgroundColor = hashStringToColor(userID);
const userIDTextColor = getTextColorForBackground(userIDBackgroundColor);
return (
@@ -88,8 +89,12 @@ const PostInfo = ({ openReplyModal, post, postReplyCount = 0, roles, isHidden }:
/>
))}
<span className={styles.nameBlock}>
<span className={`${styles.name} ${(isDescription || isRules || authorRole) && styles.capcodeMod}`}>
{displayName ? (
<span className={`${styles.name} ${(isDescription || isRules || authorRole) && !(deleted || removed) && styles.capcodeMod}`}>
{deleted ? (
_.capitalize(t('deleted'))
) : removed ? (
_.capitalize(t('removed'))
) : displayName ? (
displayName.length <= 20 ? (
displayName
) : (
@@ -101,30 +106,38 @@ const PostInfo = ({ openReplyModal, post, postReplyCount = 0, roles, isHidden }:
) : (
_.capitalize(t('anonymous'))
)}
<span className='capitalize'>{authorRole && ` ## Board ${authorRole}`} </span>
{!(deleted || removed) && <span className='capitalize'>{authorRole && ` ## Board ${authorRole}`} </span>}
</span>
{!(isDescription || isRules) && (
<>
{author?.avatar && (
{author?.avatar && !(deleted || removed) ? (
<span className={styles.authorAvatar}>
<img src={avatarImageUrl} alt='' />
</span>
) : (
' '
)}
(ID:{' '}
{deleted ? (
t('deleted')
) : removed ? (
t('removed')
) : (
<Tooltip
children={
<span
title={t('highlight_posts')}
className={styles.userAddress}
onClick={() => handleUserAddressClick(userID, postCid)}
style={{ backgroundColor: userIDBackgroundColor, color: userIDTextColor }}
>
{userID}
</span>
}
content={`${numberOfPostsByAuthor === 1 ? t('1_post_by_this_id') : t('x_posts_by_this_id', { number: numberOfPostsByAuthor })}`}
showTooltip={isInPostPageView || showOmittedReplies[postCid] || (postReplyCount < 6 && !pinned)}
/>
)}
(ID: {''}
<Tooltip
children={
<span
title={t('highlight_posts')}
className={styles.userAddress}
onClick={() => handleUserAddressClick(shortAddress || accountShortAddress, postCid)}
style={{ backgroundColor: userIDBackgroundColor, color: userIDTextColor }}
>
{shortAddress || accountShortAddress}
</span>
}
content={`${numberOfPostsByAuthor === 1 ? t('1_post_by_this_id') : t('x_posts_by_this_id', { number: numberOfPostsByAuthor })}`}
showTooltip={isInPostPageView || showOmittedReplies[postCid] || (postReplyCount < 6 && !pinned)}
/>
){' '}
</>
)}
@@ -280,7 +293,11 @@ const PostMessage = ({ post }: PostProps) => {
showTooltip={!!reason}
/>
) : deleted ? (
<Tooltip children={<span className={styles.deletedContent}>{t('user_deleted_this_post')}</span>} content={reason && `${t('reason')}: ${reason}`} />
<Tooltip
children={<span className={styles.deletedContent}>{t('user_deleted_this_post')}</span>}
content={reason && `${t('reason')}: ${reason}`}
showTooltip={!!reason}
/>
) : (
<>
{!showOriginal && <Markdown content={displayContent} />}
src/components/post-mobile/post-mobile.tsx
+36 -20
View File
@@ -24,7 +24,7 @@ import _ from 'lodash';
const PostInfoAndMedia = ({ openReplyModal, post, postReplyCount = 0, roles }: PostProps) => {
const { t } = useTranslation();
const { author, cid, link, locked, parentCid, pinned, postCid, shortCid, state, subplebbitAddress, timestamp } = post || {};
const { author, cid, deleted, link, locked, parentCid, pinned, postCid, removed, shortCid, state, subplebbitAddress, timestamp } = post || {};
const title = post?.title?.trim();
const { isDescription, isRules } = post || {}; // custom properties, not from api
const { address, shortAddress } = author || {};
@@ -61,8 +61,12 @@ const PostInfoAndMedia = ({ openReplyModal, post, postReplyCount = 0, roles }: P
<div className={styles.postInfo}>
<PostMenuMobile post={post} />
<span className={styles.nameBlock}>
<span className={`${styles.name} ${(isDescription || isRules || authorRole) && styles.capcodeMod}`}>
{displayName ? (
<span className={`${styles.name} ${(isDescription || isRules || authorRole) && !(deleted || removed) && styles.capcodeMod}`}>
{removed ? (
_.capitalize(t('removed'))
) : deleted ? (
_.capitalize(t('deleted'))
) : displayName ? (
displayName.length <= 20 ? (
displayName
) : (
@@ -74,30 +78,38 @@ const PostInfoAndMedia = ({ openReplyModal, post, postReplyCount = 0, roles }: P
) : (
_.capitalize(t('anonymous'))
)}
<span className='capitalize'>{authorRole && ` ## Board ${authorRole}`} </span>
{!(deleted || removed) && <span className='capitalize'>{authorRole && ` ## Board ${authorRole}`} </span>}
</span>
{!(isDescription || isRules) && (
<>
{author?.avatar && (
{author?.avatar && !(deleted || removed) ? (
<span className={styles.authorAvatar}>
<img src={avatarImageUrl} alt='' />
</span>
) : (
' '
)}
(ID: {''}
<Tooltip
children={
<span
title={t('highlight_posts')}
className={styles.userAddress}
onClick={() => handleUserAddressClick(shortAddress || accountShortAddress, postCid)}
style={{ backgroundColor: userIDBackgroundColor, color: userIDTextColor }}
>
{shortAddress || accountShortAddress}
</span>
}
content={`${numberOfPostsByAuthor === 1 ? t('1_post_by_this_id') : t('x_posts_by_this_id', { number: numberOfPostsByAuthor })}`}
showTooltip={isInPostPageView || postReplyCount < 6}
/>
{removed ? (
_.lowerCase(t('removed'))
) : deleted ? (
_.lowerCase(t('deleted'))
) : (
<Tooltip
children={
<span
title={t('highlight_posts')}
className={styles.userAddress}
onClick={() => handleUserAddressClick(shortAddress || accountShortAddress, postCid)}
style={{ backgroundColor: userIDBackgroundColor, color: userIDTextColor }}
>
{shortAddress || accountShortAddress}
</span>
}
content={`${numberOfPostsByAuthor === 1 ? t('1_post_by_this_id') : t('x_posts_by_this_id', { number: numberOfPostsByAuthor })}`}
showTooltip={isInPostPageView || postReplyCount < 6}
/>
)}
){' '}
</>
)}
@@ -204,7 +216,11 @@ const PostMessageMobile = ({ post }: PostProps) => {
showTooltip={!!reason}
/>
) : deleted ? (
<Tooltip children={<span className={styles.deletedContent}>{t('user_deleted_this_post')}</span>} content={reason && `${t('reason')}: ${reason}`} />
<Tooltip
children={<span className={styles.deletedContent}>{t('user_deleted_this_post')}</span>}
content={reason && `${t('reason')}: ${reason}`}
showTooltip={!!reason}
/>
) : (
<>
{!showOriginal && <Markdown content={displayContent} />}