From e9aca179d79f1ceb0f0db6257ecf0375281bf40c Mon Sep 17 00:00:00 2001
From: mptyl <mp@tylconsulting.it>
Date: Sun, 28 Jun 2026 12:22:37 +0200
Subject: [PATCH] feat(frontend): widget registry + universal fallback

---
 frontend/src/widgets/FallbackWidget.tsx | 14 ++++++++++++++
 frontend/src/widgets/registry.test.tsx  | 15 +++++++++++++++
 frontend/src/widgets/registry.ts        | 13 +++++++++++++
 frontend/src/widgets/types.ts           |  3 +++
 4 files changed, 45 insertions(+)
 create mode 100644 frontend/src/widgets/FallbackWidget.tsx
 create mode 100644 frontend/src/widgets/registry.test.tsx
 create mode 100644 frontend/src/widgets/registry.ts
 create mode 100644 frontend/src/widgets/types.ts

diff --git a/frontend/src/widgets/FallbackWidget.tsx b/frontend/src/widgets/FallbackWidget.tsx
new file mode 100644
index 00000000..bc937334
--- /dev/null
+++ b/frontend/src/widgets/FallbackWidget.tsx
@@ -0,0 +1,14 @@
+import { useState } from "react";
+import type { WidgetProps } from "./types";
+
+export function FallbackWidget({ descriptor, onRespond }: WidgetProps) {
+  const [text, setText] = useState("");
+  return (
+    <div className="border rounded p-3 space-y-2">
+      <p className="text-sm text-amber-600">Widget non supportato (kind: {descriptor.widget}) — rispondi manualmente</p>
+      <pre className="text-xs overflow-auto max-h-48 bg-muted p-2">{JSON.stringify(descriptor, null, 2)}</pre>
+      <textarea className="w-full border rounded p-1" value={text} onChange={(e) => setText(e.target.value)} />
+      <button className="border rounded px-2 py-1" onClick={() => onRespond({ id: descriptor.id, control: "freetext", text })}>Invia</button>
+    </div>
+  );
+}
diff --git a/frontend/src/widgets/registry.test.tsx b/frontend/src/widgets/registry.test.tsx
new file mode 100644
index 00000000..e1591e0a
--- /dev/null
+++ b/frontend/src/widgets/registry.test.tsx
@@ -0,0 +1,15 @@
+import { render, screen } from "@testing-library/react";
+import { register, resolve } from "./registry";
+import type { WidgetProps } from "./types";
+
+test("resolve returns the registered renderer", () => {
+  const Dummy = (_: WidgetProps) => <div>dummy</div>;
+  register("dummy", Dummy);
+  expect(resolve("dummy")).toBe(Dummy);
+});
+
+test("resolve falls back for unknown kind and shows the JSON", () => {
+  const Comp = resolve("totally-unknown");
+  render(<Comp descriptor={{ id: "u1", widget: "totally-unknown", title: "X" } as any} onRespond={() => {}} />);
+  expect(screen.getByText(/Widget non supportato/i)).toBeInTheDocument();
+});
diff --git a/frontend/src/widgets/registry.ts b/frontend/src/widgets/registry.ts
new file mode 100644
index 00000000..9a36910d
--- /dev/null
+++ b/frontend/src/widgets/registry.ts
@@ -0,0 +1,13 @@
+import type React from "react";
+import type { WidgetProps } from "./types";
+import { FallbackWidget } from "./FallbackWidget";
+
+const registry = new Map<string, React.FC<WidgetProps>>();
+
+export function register(kind: string, comp: React.FC<WidgetProps>) {
+  registry.set(kind, comp);
+}
+
+export function resolve(kind: string): React.FC<WidgetProps> {
+  return registry.get(kind) ?? FallbackWidget;
+}
diff --git a/frontend/src/widgets/types.ts b/frontend/src/widgets/types.ts
new file mode 100644
index 00000000..ccf6c382
--- /dev/null
+++ b/frontend/src/widgets/types.ts
@@ -0,0 +1,3 @@
+import type { WidgetDescriptor, UiResponse } from "../api/types";
+
+export type WidgetProps = { descriptor: WidgetDescriptor; onRespond: (r: UiResponse) => void };