Remove query params from search

src/components/Image.jsx

@@ -2,6 +2,20 @@ import React, { useState, useEffect, useRef } from "react";
 import { decode } from "blurhash";
 import { useImageContext } from "../contexts/ImageContext";
 
+// Helper function to remove query parameters from a URL
+const removeQueryParams = (url) => {
+  if (!url) return url;
+  try {
+    const urlObj = new URL(url);
+    urlObj.search = "";
+    return urlObj.toString();
+  } catch {
+    // If it's not a valid URL, just remove query params manually
+    const index = url.indexOf("?");
+    return index !== -1 ? url.substring(0, index) : url;
+  }
+};
+
 const Image = ({ src, alt, className, loading = "lazy", ...props }) => {
   const { imageObjects } = useImageContext();
 
@@ -13,11 +27,14 @@ const Image = ({ src, alt, className, loading = "lazy", ...props }) => {
   // Find the image object that matches the src
   useEffect(() => {
     if (src) {
-      const imageObj = imageObjects.find((img) => img.src === src);
+      const normalizedSrc = removeQueryParams(src);
+      const imageObj = imageObjects.find(
+        (img) => removeQueryParams(img.src) === normalizedSrc
+      );
       setCurrentImageObj(imageObj || null);
       // Reset processed state when src changes
-      if (processedSrcRef.current !== src) {
+      if (processedSrcRef.current !== normalizedSrc) {
-        processedSrcRef.current = src;
+        processedSrcRef.current = normalizedSrc;
         setImageLoaded(false);
       }
     } else {
@@ -32,7 +49,7 @@ const Image = ({ src, alt, className, loading = "lazy", ...props }) => {
     if (
       currentImageObj?.blurHash &&
       !blurhashCanvas &&
-      processedSrcRef.current === src
+      processedSrcRef.current === removeQueryParams(src)
     ) {
       try {
         const pixels = decode(currentImageObj.blurHash, 32, 32);