From cdd089fcf31317db6f52c23b9006d9474a0acd53 Mon Sep 17 00:00:00 2001
From: Abdullah Atta <abdullahatta@streetwriters.co>
Date: Wed, 6 Mar 2024 15:36:28 +0500
Subject: [PATCH] web: fix loading skeleton for compact items in list

---
 apps/web/src/components/list-container/index.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/apps/web/src/components/list-container/index.tsx b/apps/web/src/components/list-container/index.tsx
index 2e9dc6171..822319606 100644
--- a/apps/web/src/components/list-container/index.tsx
+++ b/apps/web/src/components/list-container/index.tsx
@@ -258,7 +258,13 @@ function ItemRenderer({
     compact
   } = context;
   const resolvedItem = useResolvedItem({ index, items });
-  if (!resolvedItem || !resolvedItem.item)
+  if (!resolvedItem || !resolvedItem.item) {
+    if (compact)
+      return (
+        <Box key="list-item-skeleton" sx={{ py: 1, px: 1 }}>
+          <Skeleton enableAnimation={false} height={12} width={`50%`} />
+        </Box>
+      );
     return (
       <Box key="list-item-skeleton" sx={{ py: 2, px: 1 }}>
         <Skeleton
@@ -289,6 +295,7 @@ function ItemRenderer({
         </Flex>
       </Box>
     );
+  }
 
   return (
     <>