fix(post): image marked as spoiler was visible

This commit is contained in:
Tom (plebeius.eth)
2025-02-21 12:43:14 +01:00
parent c25058969d
commit 6e60360033
+11 -2
View File
@@ -135,7 +135,7 @@ interface ImageProps {
const Image = ({ commentMediaInfo, displayHeight, displayWidth, isOutOfFeed, post }: ImageProps) => {
const { t } = useTranslation();
const { parentCid } = post || {};
const { parentCid, spoiler } = post || {};
const { type, url } = commentMediaInfo || {};
const isReply = parentCid;
const isMobile = useIsMobile();
@@ -151,6 +151,15 @@ const Image = ({ commentMediaInfo, displayHeight, displayWidth, isOutOfFeed, pos
const [hasError, setHasError] = useState(false);
const handleError = () => setHasError(true);
if (spoiler && !isImageExpanded) {
const spoilerDimensions = { '--width': '150px', '--height': '150px' } as React.CSSProperties;
return (
<span className={`${isOutOfFeed ? styles.subplebbitAvatar : styles.thumbnailBig} ${styles.thumbnail}`} style={spoilerDimensions}>
<img className={styles.spoiler} src='assets/spoiler.png' alt='' onClick={() => setIsImageExpanded(true)} />
</span>
);
}
return isMobile ? (
<span className={styles.thumbnail}>
<span
@@ -227,7 +236,7 @@ const CommentMedia = ({ commentMediaInfo, isFloatingEmbed, post, showThumbnail,
displayHeight = '100%';
}
const { isDescription, isRules } = post || {}; // custom properties, not from api
const isOutOfFeed = isDescription || isRules || isFloatingEmbed; // virtuoso wrapper unneeded
const isOutOfFeed = isDescription || isRules || isFloatingEmbed || spoiler; // virtuoso wrapper unneeded
return (
<span className={styles.content}>