From b2cbacc3b4d08f27ae94ff0e3fe992fd61bc09ca Mon Sep 17 00:00:00 2001
From: "plebeius.eth" <mottoes_recap0u@icloud.com>
Date: Mon, 8 Jan 2024 14:56:41 +0100
Subject: [PATCH] fix(post): fix virtuoso zero-sized element error

---
 src/components/post/post.module.css | 8 ++++++++
 src/components/post/post.tsx        | 2 +-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/post/post.module.css b/src/components/post/post.module.css
index b6858d90..c6468bd6 100644
--- a/src/components/post/post.module.css
+++ b/src/components/post/post.module.css
@@ -213,4 +213,12 @@
   font-weight: bold;
   font-size: 10px;
   cursor: pointer;
+}
+
+/* 1px compromise to hide removed posts immediately, before the feed updates, while avoiding virtuoso's zero-sized element error */
+.minimalHeight {
+  visibility: hidden;
+  padding: 0;
+  margin: 0;
+  height: 1px;
 }
\ No newline at end of file
diff --git a/src/components/post/post.tsx b/src/components/post/post.tsx
index d196811f..9f777fad 100644
--- a/src/components/post/post.tsx
+++ b/src/components/post/post.tsx
@@ -123,7 +123,7 @@ const Post = ({ post = {}, index }: PostProps) => {
   const { blocked, unblock } = useBlock({ address: cid });
 
   return (
-    <div className={`${styles.content} ${removed ? styles.hidden : styles.visible}`} key={index}>
+    <div className={`${styles.content} ${removed ? styles.minimalHeight : ''}`} key={index}>
       <div className={`${styles.hiddenPost} ${blocked ? styles.visible : styles.hidden}`}>
         <div className={styles.hiddenPostText}>{t('post_hidden').charAt(0).toUpperCase() + t('post_hidden').slice(1)}</div>
         <div className={styles.undoHiddenPost} onClick={unblock}>