From 5f0309d12b940707685d6cd474eaf1c40238fd1a Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Sat, 1 Nov 2025 01:28:33 -0700
Subject: [PATCH] prevent render null items in grid

---
 .../item-grid-list/item-grid-list.tsx         | 22 +++++++++++--------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/renderer/components/item-list/item-grid-list/item-grid-list.tsx b/src/renderer/components/item-list/item-grid-list/item-grid-list.tsx
index 2f8794d66..c08f8bd29 100644
--- a/src/renderer/components/item-list/item-grid-list/item-grid-list.tsx
+++ b/src/renderer/components/item-list/item-grid-list/item-grid-list.tsx
@@ -404,15 +404,19 @@ const ListComponent = memo((props: ListChildComponentProps<GridItemProps>) => {
     }
 
     for (let i = startIndex; i <= stopIndex + columnCountToAdd; i += 1) {
-        items.push(
-            <div
-                className={clsx(styles.itemRow, styles[`gap-${gap}`])}
-                key={`card-${i}-${index}`}
-                style={{ '--columns': columns } as CSSProperties}
-            >
-                <ItemCard controls={controls} data={data[i]} itemType={itemType} withControls />
-            </div>,
-        );
+        if (i < data.length) {
+            items.push(
+                <div
+                    className={clsx(styles.itemRow, styles[`gap-${gap}`])}
+                    key={`card-${i}-${index}`}
+                    style={{ '--columns': columns } as CSSProperties}
+                >
+                    <ItemCard controls={controls} data={data[i]} itemType={itemType} withControls />
+                </div>,
+            );
+        } else {
+            items.push(null);
+        }
     }
 
     return (