From 1526f9b8d66ac66af36e354e92b98948342f7cdf Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Wed, 11 Mar 2026 21:20:31 -0700
Subject: [PATCH] re-add session cache for loaded images

---
 src/shared/components/image/image.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/shared/components/image/image.tsx b/src/shared/components/image/image.tsx
index f9c0ea54b..b19b65cdd 100644
--- a/src/shared/components/image/image.tsx
+++ b/src/shared/components/image/image.tsx
@@ -20,6 +20,8 @@ import { useDebouncedValue } from '/@/shared/hooks/use-debounced-value';
 import { useInViewport } from '/@/shared/hooks/use-in-viewport';
 import { ImageRequest } from '/@/shared/types/domain-types';
 
+const loadedImageCacheKeys = new Set<string>();
+
 export interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, 'src'> {
     containerClassName?: string;
     enableAnimation?: boolean;
@@ -78,10 +80,14 @@ export function BaseImage({
         () => imageRequest ?? (src ? { cacheKey: src, url: src } : undefined),
         [imageRequest, src],
     );
+    const isInSessionCache = Boolean(
+        rawImageRequest?.cacheKey && loadedImageCacheKeys.has(rawImageRequest.cacheKey),
+    );
     const [debouncedImageRequest] = useDebouncedValue(rawImageRequest, 100, {
         waitForInitial: true,
     });
-    const effectiveImageRequest = enableDebounce ? debouncedImageRequest : rawImageRequest;
+    const effectiveImageRequest =
+        isInSessionCache || !enableDebounce ? rawImageRequest : debouncedImageRequest;
 
     const [hasLoadedInInstance, setHasLoadedInInstance] = useState(false);
 
@@ -90,7 +96,8 @@ export function BaseImage({
     }, [effectiveImageRequest?.cacheKey]);
 
     const shouldLoadImage = Boolean(
-        effectiveImageRequest && (!enableViewport || inViewport || hasLoadedInInstance),
+        effectiveImageRequest &&
+            (!enableViewport || isInSessionCache || inViewport || hasLoadedInInstance),
     );
 
     const nativeImage = useNativeImage({
@@ -109,6 +116,7 @@ export function BaseImage({
             return;
         }
 
+        loadedImageCacheKeys.add(effectiveImageRequest.cacheKey);
         setHasLoadedInInstance(true);
     }, [effectiveImageRequest?.cacheKey, nativeImage.isLoaded]);