Connect the storefront to Meshkee catalog, blogs, and static image slots.

Wire homepage specials, product/blog pages, instant search, and the customer portal so the live pharmacy site can be managed from the dashboard.

Co-authored-by: Cursor <cursoragent@cursor.com>

components/Placeholder.tsx

@@ -1,12 +1,34 @@
+"use client";
+
+import { useEffect, useRef, useState } from "react";
+
 type PlaceholderProps = {
   src: string;
+  fallbackSrc?: string;
   alt?: string;
   className?: string;
 };
 
-export function Placeholder({ src, alt = "", className }: PlaceholderProps) {
+export function Placeholder({ src, fallbackSrc, alt = "", className }: PlaceholderProps) {
+  const [current, setCurrent] = useState(src);
+  const failed = useRef(false);
+
+  useEffect(() => {
+    failed.current = false;
+    setCurrent(src);
+  }, [src]);
+
   return (
     // eslint-disable-next-line @next/next/no-img-element
-    <img src={src} alt={alt} className={className} />
+    <img
+      src={current}
+      alt={alt}
+      className={className}
+      onError={() => {
+        if (failed.current || !fallbackSrc || fallbackSrc === current) return;
+        failed.current = true;
+        setCurrent(fallbackSrc);
+      }}
+    />
   );
 }