diff --git a/apps/desktop/layer/renderer/src/modules/entry-column/Items/picture-item.tsx b/apps/desktop/layer/renderer/src/modules/entry-column/Items/picture-item.tsx
index 6093eb90a..0cd863d32 100644
--- a/apps/desktop/layer/renderer/src/modules/entry-column/Items/picture-item.tsx
+++ b/apps/desktop/layer/renderer/src/modules/entry-column/Items/picture-item.tsx
@@ -149,25 +149,29 @@ const MasonryItemFixedDimensionWrapper = (
   const dim = useImageDimensions(url)
   const itemWidth = useMasonryItemWidth()
 
-  const itemHeight = dim ? itemWidth / dim.ratio : itemWidth
-  const stableRadio = useState(() => itemWidth / itemHeight || 1)[0]
+  const stableRadio = useMemo(() => {
+    return dim ? dim.ratio : 1
+  }, [dim])
   const setItemStableRatio = useSetStableMasonryItemRatio()
 
   const stableRadioCtx = useMasonryItemRatio(url)
 
   useEffect(() => {
-    setItemStableRatio(url, stableRadio)
-  }, [setItemStableRatio, stableRadio, url])
+    if (dim) {
+      setItemStableRatio(url, stableRadio)
+    }
+  }, [setItemStableRatio, stableRadio, url, dim])
 
+  const finalRatio = stableRadioCtx || stableRadio
   const style = useMemo(
     () => ({
       width: itemWidth,
-      height: itemWidth / stableRadioCtx! + 60,
+      height: itemWidth / finalRatio + 60,
     }),
-    [itemWidth, stableRadioCtx],
+    [itemWidth, finalRatio],
   )
 
-  if (!style.height) return null
+  if (!style.height || style.height === Infinity) return null
 
   return (
     <div className="relative flex h-full flex-col overflow-x-auto overflow-y-hidden" style={style}>