fix: remove <source> elements on error for correct picture fallback

When responsive variants don't exist (404), the browser picks from
<source> srcset but doesn't fall through on failure. Fix: strip
<source> elements in onError so img.src = plot.png actually works.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: MarkusNeusinger

app/src/components/ImageCard.tsx

@@ -181,9 +181,11 @@ export const ImageCard = memo(function ImageCard({
             }}
             onError={(e: React.SyntheticEvent<HTMLImageElement>) => {
               const target = e.target as HTMLImageElement;
-              // Fallback to original plot.png if responsive variant not available
+              // Remove <source> elements so browser uses img.src fallback
               if (!target.dataset.fallback) {
                 target.dataset.fallback = '1';
+                const picture = target.closest('picture');
+                picture?.querySelectorAll('source').forEach(s => s.remove());
                 target.src = image.url;
               } else {
                 target.style.display = 'none';

app/src/components/SpecDetailView.tsx

@@ -118,6 +118,8 @@ export function SpecDetailView({
                 const target = e.target as HTMLImageElement;
                 if (!target.dataset.fallback) {
                   target.dataset.fallback = '1';
+                  const picture = target.closest('picture');
+                  picture?.querySelectorAll('source').forEach(s => s.remove());
                   target.src = currentImpl.preview_url!;
                 }
               }}

app/src/components/SpecOverview.tsx

@@ -177,6 +177,8 @@ function ImplementationCard({
                 const target = e.target as HTMLImageElement;
                 if (!target.dataset.fallback) {
                   target.dataset.fallback = '1';
+                  const picture = target.closest('picture');
+                  picture?.querySelectorAll('source').forEach(s => s.remove());
                   target.src = impl.preview_url!;
                 }
               }}

app/src/pages/CatalogPage.tsx

@@ -275,6 +275,8 @@ export function CatalogPage() {
                           const target = e.target as HTMLImageElement;
                           if (!target.dataset.fallback) {
                             target.dataset.fallback = '1';
+                            const picture = target.closest('picture');
+                            picture?.querySelectorAll('source').forEach(s => s.remove());
                             target.src = currentImage.url;
                           }
                         }}