Add new gallery variant

src/components/artworks/ArtworkGalleryVariantProcessor.tsx

@@ -0,0 +1,62 @@
+"use client";
+
+import { generateGalleryVariantsMissing } from "@/actions/artworks/generateGalleryVariant";
+import { getGalleryVariantStats } from "@/actions/artworks/getGalleryVariantStats";
+import { Button } from "@/components/ui/button";
+import * as React from "react";
+
+export function ArtworkGalleryVariantProcessor() {
+  const [stats, setStats] = React.useState<Awaited<
+    ReturnType<typeof getGalleryVariantStats>
+  > | null>(null);
+  const [loading, setLoading] = React.useState(false);
+  const [msg, setMsg] = React.useState<string | null>(null);
+
+  const refreshStats = React.useCallback(async () => {
+    const s = await getGalleryVariantStats();
+    setStats(s);
+  }, []);
+
+  React.useEffect(() => {
+    void refreshStats();
+  }, [refreshStats]);
+
+  const run = async () => {
+    setLoading(true);
+    setMsg(null);
+    try {
+      const res = await generateGalleryVariantsMissing({ limit: 50 });
+      setMsg(`Processed ${res.processed}: ${res.ok} ok, ${res.failed} failed`);
+      await refreshStats();
+    } catch (e) {
+      setMsg(e instanceof Error ? e.message : "Failed");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const done = !!stats && stats.missing === 0;
+
+  return (
+    <div className="flex flex-col gap-2">
+      <div className="flex items-center gap-4">
+        <Button onClick={run} disabled={loading || done}>
+          {done
+            ? "All gallery variants present"
+            : loading
+              ? "Generating…"
+              : "Generate missing gallery variants"}
+        </Button>
+
+        {stats && (
+          <span className="text-sm text-muted-foreground">
+            Ready {stats.withGallery}/{stats.total}
+            {stats.missing > 0 && ` · Missing ${stats.missing}`}
+          </span>
+        )}
+      </div>
+
+      {msg && <p className="text-sm text-muted-foreground">{msg}</p>}
+    </div>
+  );
+}