diff --git a/src/components/Image/index.tsx b/src/components/Image/index.tsx index 2c13812..9a1344a 100644 --- a/src/components/Image/index.tsx +++ b/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() + const timeoutRef = useRef(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) } diff --git a/src/services/blossom.service.ts b/src/services/blossom.service.ts index 3717e8c..d031b31 100644 --- a/src/services/blossom.service.ts +++ b/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 tried: Set + validUrl?: string } >() @@ -23,7 +24,7 @@ class BlossomService { async getValidUrl(url: string, pubkey: string): Promise { 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(), + validUrl: successUrl + }) + return + } entry.resolve(successUrl) - if (originalUrl === successUrl) { - this.cacheMap.delete(originalUrl) - } + entry.validUrl = successUrl } }