diff --git a/components/ui/resilient-image.tsx b/components/ui/resilient-image.tsx index a6c3ae9..c38025c 100644 --- a/components/ui/resilient-image.tsx +++ b/components/ui/resilient-image.tsx @@ -6,26 +6,17 @@ import { useState } from "react"; const CDN_ORIGIN = "https://buzz-cdn.astrxl.dev"; export default function ResilientImage({ src, unoptimized, onError, ...props }: ImageProps) { - const [fallback, setFallback] = useState<{ source: string; url: string } | null>(null); - const fallbackUrl = typeof src === "string" && fallback?.source === src ? fallback.url : null; + const [failedSource, setFailedSource] = useState(null); + const useOriginal = typeof src === "string" && failedSource === src; return ( { - if (!fallbackUrl && typeof src === "string" && src.startsWith(`${CDN_ORIGIN}/`)) { - const source = new URL(src); - if (!source.pathname.startsWith("/cdn-cgi/image/")) { - const optimized = new URL(event.currentTarget.currentSrc); - const width = Number(optimized.searchParams.get("w")) || 1080; - const quality = Number(optimized.searchParams.get("q")) || 75; - setFallback({ - source: src, - url: `${CDN_ORIGIN}/cdn-cgi/image/width=${width},quality=${quality},format=auto${source.pathname}${source.search}`, - }); - } + if (!useOriginal && typeof src === "string" && src.startsWith(`${CDN_ORIGIN}/`)) { + setFailedSource(src); } onError?.(event); }}