fix: 🐛

src/components/Image/index.tsx

@@ -28,6 +28,7 @@ export default function Image({
   const [displaySkeleton, setDisplaySkeleton] = useState(true)
   const [hasError, setHasError] = useState(false)
   const [imageUrl, setImageUrl] = useState<string>()
+  const timeoutRef = useRef<NodeJS.Timeout | null>(null)
 
   useEffect(() => {
     setIsLoading(true)
@@ -37,7 +38,14 @@ export default function Image({
     if (pubkey) {
       blossomService.getValidUrl(url, pubkey).then((validUrl) => {
         setImageUrl(validUrl)
+        if (timeoutRef.current) {
+          clearTimeout(timeoutRef.current)
+          timeoutRef.current = null
+        }
       })
+      timeoutRef.current = setTimeout(() => {
+        setImageUrl(url)
+      }, 5000)
     } else {
       setImageUrl(url)
     }

src/services/blossom.service.ts

@@ -6,10 +6,11 @@ class BlossomService {
   private cacheMap = new Map<
     string,
     {
-      pubkey: string
+      pubkey?: string
       resolve: (url: string) => void
       promise: Promise<string>
       tried: Set<string>
+      validUrl?: string
     }
   >()
 
@@ -23,7 +24,7 @@ class BlossomService {
   async getValidUrl(url: string, pubkey: string): Promise<string> {
     const cache = this.cacheMap.get(url)
     if (cache) {
-      return cache.promise
+      return cache.validUrl ?? cache.promise
     }
 
     let resolveFunc: (url: string) => void
@@ -42,6 +43,10 @@ class BlossomService {
       return null
     }
 
+    if (entry.validUrl) {
+      return entry.validUrl
+    }
+
     const { pubkey, tried, resolve } = entry
     let oldImageUrl: URL | undefined
     let hash: string | null = null
@@ -82,12 +87,18 @@ class BlossomService {
 
   markAsSuccess(originalUrl: string, successUrl: string) {
     const entry = this.cacheMap.get(originalUrl)
-    if (!entry) return
+    if (!entry) {
+      this.cacheMap.set(originalUrl, {
+        resolve: () => {},
+        promise: Promise.resolve(successUrl),
+        tried: new Set<string>(),
+        validUrl: successUrl
+      })
+      return
+    }
 
     entry.resolve(successUrl)
-    if (originalUrl === successUrl) {
-      this.cacheMap.delete(originalUrl)
-    }
+    entry.validUrl = successUrl
   }
 }