diff --git a/src/components/catalog-row/catalog-row.module.css b/src/components/catalog-row/catalog-row.module.css
index 3ba350b4..cf14769c 100644
--- a/src/components/catalog-row/catalog-row.module.css
+++ b/src/components/catalog-row/catalog-row.module.css
@@ -27,6 +27,19 @@
display: inline-block;
}
+.spoilerThumbnail {
+ width: 150px;
+ height: 150px;
+ display: inline-block;
+ margin: 3px 20px 5px 20px;
+ background-color: black;
+ color: white !important;
+ display: flex;
+ cursor: pointer;
+ justify-content: center;
+ align-items: center;
+}
+
.mediaPaddingWrapper {
padding-bottom: 5px;
display: inline-flex;
diff --git a/src/components/catalog-row/catalog-row.tsx b/src/components/catalog-row/catalog-row.tsx
index 890b40f3..a27e565f 100644
--- a/src/components/catalog-row/catalog-row.tsx
+++ b/src/components/catalog-row/catalog-row.tsx
@@ -13,6 +13,7 @@ import useFetchGifFirstFrame from '../../hooks/use-fetch-gif-first-frame';
import useHide from '../../hooks/use-hide';
import PostMenuDesktop from '../post-desktop/post-menu-desktop';
import styles from './catalog-row.module.css';
+import Markdown from '../markdown';
import _ from 'lodash';
interface CatalogPostMediaProps {
@@ -80,10 +81,35 @@ export const CatalogPostMedia = ({ commentMediaInfo, isOutOfFeed, linkWidth, lin
);
};
+const SpoilerImage = ({ postLink }: { postLink: string }) => {
+ const { t } = useTranslation();
+ return (
+
+ {t('spoiler')}
+
+ );
+};
+
const CatalogPost = ({ post }: { post: Comment }) => {
const { t } = useTranslation();
- const { author, cid, content, isDescription, isRules, lastChildCid, link, linkHeight, linkWidth, locked, pinned, replyCount, subplebbitAddress, timestamp, title } =
- post || {};
+ const {
+ author,
+ cid,
+ content,
+ isDescription,
+ isRules,
+ lastChildCid,
+ link,
+ linkHeight,
+ linkWidth,
+ locked,
+ pinned,
+ replyCount,
+ spoiler,
+ subplebbitAddress,
+ timestamp,
+ title,
+ } = post || {};
const commentMediaInfo = getCommentMediaInfo(post);
const hasThumbnail = getHasThumbnail(commentMediaInfo, link);
const { hidden } = useHide({ cid });
@@ -163,7 +189,7 @@ const CatalogPost = ({ post }: { post: Comment }) => {
) : (
<>
{title && `${title}${content ? ': ' : ''}`}
- {content}
+