From 2e86b3f2afe6d94a093f4e14320ae95f1bb50332 Mon Sep 17 00:00:00 2001
From: "Tom (plebeius.eth)" <tom@plebbit.com>
Date: Thu, 12 Dec 2024 16:16:28 +0100
Subject: [PATCH] fix(feed post): gif thumbnail could break persistently

---
 src/components/post/thumbnail/thumbnail.tsx | 4 ++--
 src/hooks/use-fetch-gif-first-frame.ts      | 9 +++++++--
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/post/thumbnail/thumbnail.tsx b/src/components/post/thumbnail/thumbnail.tsx
index 2878a232..62532cbd 100644
--- a/src/components/post/thumbnail/thumbnail.tsx
+++ b/src/components/post/thumbnail/thumbnail.tsx
@@ -44,8 +44,8 @@ const Thumbnail = ({ cid, commentMediaInfo, expanded = false, isReply = false, l
     mediaComponent = <img src={commentMediaInfo.thumbnail} alt='' />;
   } else if (commentMediaInfo?.type === 'iframe') {
     mediaComponent = iframeThumbnail ? <img src={iframeThumbnail} alt='' /> : null;
-  } else if (commentMediaInfo?.type === 'gif' && gifFrameUrl) {
-    mediaComponent = <img src={gifFrameUrl} alt='' />;
+  } else if (commentMediaInfo?.type === 'gif') {
+    mediaComponent = <img src={gifFrameUrl || commentMediaInfo.url} alt='' />;
   }
 
   return (
diff --git a/src/hooks/use-fetch-gif-first-frame.ts b/src/hooks/use-fetch-gif-first-frame.ts
index a7f21054..08cb91c8 100644
--- a/src/hooks/use-fetch-gif-first-frame.ts
+++ b/src/hooks/use-fetch-gif-first-frame.ts
@@ -75,8 +75,13 @@ const useFetchGifFirstFrame = (url: string | undefined) => {
       try {
         const cachedFrame = await getCachedGifFrame(url);
         if (cachedFrame) {
-          if (isActive) setFrameUrl(cachedFrame);
-          return;
+          try {
+            const response = await fetch(cachedFrame);
+            if (response.ok) {
+              if (isActive) setFrameUrl(cachedFrame);
+              return;
+            }
+          } catch {}
         }
 
         const blob = typeof url === 'string' ? await parseGif(await fetchImage(url)) : await parseGif(await readImage(url as File));