From bd468727a63341c6c7030b6d1e65d43e4ecdd72f Mon Sep 17 00:00:00 2001
From: Jaret Burkett <jaretburkett@gmail.com>
Date: Mon, 1 Jun 2026 03:36:32 -0600
Subject: [PATCH] Fixed issue where some image cards in samples and datasets
 would show gray instead of the image until you scroll.

---
 ui/src/components/DatasetImageCard.tsx | 5 +----
 ui/src/components/SampleImageCard.tsx  | 9 +--------
 2 files changed, 2 insertions(+), 12 deletions(-)

diff --git a/ui/src/components/DatasetImageCard.tsx b/ui/src/components/DatasetImageCard.tsx
index 678f8a7..3ff42de 100644
--- a/ui/src/components/DatasetImageCard.tsx
+++ b/ui/src/components/DatasetImageCard.tsx
@@ -221,11 +221,8 @@ const DatasetImageCard: React.FC<DatasetImageCardProps> = ({
             <img
               src={blobUrl}
               alt={alt}
-              decoding="async"
               onClick={onImageClick}
-              className={classNames('w-full h-full object-contain transition-opacity duration-300', {
-                'opacity-100': loaded,
-                'opacity-0': !loaded,
+              className={classNames('w-full h-full object-contain', {
                 'cursor-zoom-in': !!onImageClick,
               })}
             />
diff --git a/ui/src/components/SampleImageCard.tsx b/ui/src/components/SampleImageCard.tsx
index 2da2f29..0973e38 100644
--- a/ui/src/components/SampleImageCard.tsx
+++ b/ui/src/components/SampleImageCard.tsx
@@ -133,14 +133,7 @@ const SampleImageCard: React.FC<SampleImageCardProps> = ({
                 controls={false}
               />
             ) : blobUrl ? (
-              <img
-                src={blobUrl}
-                alt={alt}
-                decoding="async"
-                className={`w-full h-full object-cover transition-opacity duration-300 ${
-                  loaded ? 'opacity-100' : 'opacity-0'
-                }`}
-              />
+              <img src={blobUrl} alt={alt} className="w-full h-full object-cover" />
             ) : null
           ) : null}