feat(app): chart plugin registry — contract + registry primitives (#220)

app/src/app/(auth)/login/page.tsx

@@ -31,17 +31,27 @@ function LoginForm() {
     setError("");
 
     const formData = new FormData(e.currentTarget);
-    const result = await signIn("credentials", {
-      email: formData.get("email"),
-      password: formData.get("password"),
-      redirect: false,
-    });
+    try {
+      const result = await signIn("credentials", {
+        email: formData.get("email"),
+        password: formData.get("password"),
+        redirect: false,
+      });
 
-    if (result?.error) {
-      setError("Invalid email or password");
+      if (result?.error) {
+        setError("Invalid email or password");
+        setLoading(false);
+      } else if (result) {
+        router.push(callbackUrl);
+      } else {
+        // Nothing returned → server unreachable
+        setError("Unable to sign in. Please try again.");
+        setLoading(false);
+      }
+    } catch {
+      // Network error or server unreachable
+      setError("Unable to reach server. Please check your connection.");
       setLoading(false);
-    } else {
-      router.push(callbackUrl);
     }
   }
 
@@ -59,14 +69,21 @@ function LoginForm() {
           id="email"
           name="email"
           type="email"
+          autoComplete="email"
           required
           placeholder="you@example.com"
         />
       </div>
 
       <div className="space-y-2">
         <Label htmlFor="password">Password</Label>
-        <PasswordInput id="password" name="password" required minLength={6} />
+        <PasswordInput
+          id="password"
+          name="password"
+          autoComplete="current-password"
+          required
+          minLength={6}
+        />
       </div>
 
       <LoadingButton

app/src/app/api/connections/[id]/test/route.ts

@@ -6,7 +6,11 @@ import { decryptJson } from "@/lib/crypto";
 import { testConnection } from "@/lib/query-executor";
 import type { ConnectionCredentials, DbType } from "@/lib/query-executor";
 import { apiSuccess } from "@/lib/api-response";
-import { notFound, handleRouteError } from "@/lib/api-utils";
+import {
+  notFound,
+  handleRouteError,
+  sanitizeErrorMessage,
+} from "@/lib/api-utils";
 
 export async function POST(
   _request: Request,
@@ -40,10 +44,14 @@ export async function POST(
         ...(!success ? { error: "Connection check returned false" } : {}),
       });
     } catch (testError) {
-      const message =
+      const rawMessage =
         testError instanceof Error
           ? testError.message
           : "Connection test failed";
+      const message = sanitizeErrorMessage(
+        rawMessage,
+        "Connection test failed",
+      );
       return apiSuccess({ success: false, error: message });
     }
   } catch (error) {

app/src/app/api/connections/test-inline/route.ts

@@ -3,7 +3,11 @@ import { testConnection } from "@/lib/query-executor";
 import type { DbType } from "@/lib/query-executor";
 import { testInlineSchema } from "@/lib/schemas";
 import { apiSuccess } from "@/lib/api-response";
-import { handleRouteError, validateBody } from "@/lib/api-utils";
+import {
+  handleRouteError,
+  validateBody,
+  sanitizeErrorMessage,
+} from "@/lib/api-utils";
 
 export async function POST(request: Request) {
   try {
@@ -36,10 +40,14 @@ export async function POST(request: Request) {
         ...(!success ? { error: "Connection check returned false" } : {}),
       });
     } catch (testError) {
-      const message =
+      const rawMessage =
         testError instanceof Error
           ? testError.message
           : "Connection test failed";
+      const message = sanitizeErrorMessage(
+        rawMessage,
+        "Connection test failed",
+      );
       return apiSuccess({ success: false, error: message });
     }
   } catch (error) {

app/src/lib/__tests__/api-utils.test.ts

@@ -11,6 +11,7 @@ import {
   serverError,
   handleRouteError,
   validateBody,
+  sanitizeErrorMessage,
 } from "../api-utils";
 import { UnauthorizedError, ForbiddenError } from "../auth/errors";
 import { z } from "zod";
@@ -116,3 +117,43 @@ describe("validateBody", () => {
     }
   });
 });
+
+describe("sanitizeErrorMessage", () => {
+  it("returns user-readable message as-is", () => {
+    expect(sanitizeErrorMessage("Connection refused")).toBe(
+      "Connection refused",
+    );
+  });
+
+  it("strips Turbopack internal paths", () => {
+    const raw =
+      "(0 , __TURBOPACK__imported__module__$5b$project$5d2f$app$2f$src$2f$lib.ts__$5b$app$2d$route$5d$.createConnectionModule) is not a function";
+    expect(sanitizeErrorMessage(raw)).toBe(
+      "Internal server error — check server logs",
+    );
+  });
+
+  it("strips webpack internal paths", () => {
+    const raw = "__webpack_require__ is not defined";
+    expect(sanitizeErrorMessage(raw)).toBe(
+      "Internal server error — check server logs",
+    );
+  });
+
+  it("strips encoded module paths with $XX$ pattern", () => {
+    const raw = "Error at $5b$module$5d$ resolution";
+    expect(sanitizeErrorMessage(raw)).toBe(
+      "Internal server error — check server logs",
+    );
+  });
+
+  it("uses custom fallback", () => {
+    expect(sanitizeErrorMessage("__TURBOPACK__foo", "Connection failed")).toBe(
+      "Connection failed",
+    );
+  });
+
+  it("preserves short error messages", () => {
+    expect(sanitizeErrorMessage("ECONNREFUSED")).toBe("ECONNREFUSED");
+  });
+});

app/src/lib/__tests__/chart-plugin-registry.test.ts

@@ -0,0 +1,222 @@
+import { describe, it, expect, beforeEach } from "vitest";
+import {
+  defineChartPlugin,
+  createPluginRegistry,
+  type ChartPlugin,
+} from "../chart-plugin-registry";
+
+// ---------------------------------------------------------------------------
+// Fixtures
+// ---------------------------------------------------------------------------
+
+const fakeComponent = () => null;
+
+const makePlugin = (overrides: Partial<ChartPlugin> = {}): ChartPlugin =>
+  defineChartPlugin({
+    type: "bar",
+    label: "Bar Chart",
+    component: fakeComponent,
+    transform: (rows) => rows,
+    ...overrides,
+  });
+
+// ---------------------------------------------------------------------------
+// defineChartPlugin — config normalization
+// ---------------------------------------------------------------------------
+
+describe("defineChartPlugin", () => {
+  it("creates a plugin with minimal required fields", () => {
+    const plugin = defineChartPlugin({
+      type: "bar",
+      label: "Bar Chart",
+      component: fakeComponent,
+      transform: (rows) => rows,
+    });
+    expect(plugin.type).toBe("bar");
+    expect(plugin.label).toBe("Bar Chart");
+    expect(plugin.component).toBe(fakeComponent);
+  });
+
+  it("applies sensible defaults to capabilities", () => {
+    const plugin = makePlugin();
+    expect(plugin.capabilities.supportsClickAction).toBe(true);
+    expect(plugin.capabilities.supportsStyling).toBe(false);
+    expect(plugin.capabilities.requiresQuery).toBe(true);
+    expect(plugin.capabilities.isECharts).toBe(false);
+  });
+
+  it("enables supportsStyling when stylingTargets is provided", () => {
+    const plugin = makePlugin({
+      stylingTargets: [{ value: "color", label: "Color" }],
+    });
+    expect(plugin.capabilities.supportsStyling).toBe(true);
+  });
+
+  it("allows explicit capability overrides", () => {
+    const plugin = makePlugin({
+      capabilities: {
+        supportsClickAction: false,
+        requiresQuery: false,
+        supportsStyling: false,
+        isECharts: false,
+      },
+    });
+    expect(plugin.capabilities.supportsClickAction).toBe(false);
+    expect(plugin.capabilities.requiresQuery).toBe(false);
+  });
+
+  it("preserves options when provided", () => {
+    const plugin = makePlugin({
+      options: [
+        {
+          key: "stacked",
+          label: "Stacked",
+          type: "boolean",
+          default: false,
+          category: "Layout",
+        },
+      ],
+    });
+    expect(plugin.options).toHaveLength(1);
+    expect(plugin.options?.[0].key).toBe("stacked");
+  });
+
+  it("defaults options to empty array when not provided", () => {
+    const plugin = makePlugin();
+    expect(plugin.options).toEqual([]);
+  });
+
+  it("preserves compatibleWith list", () => {
+    const plugin = makePlugin({ compatibleWith: ["neo4j"] });
+    expect(plugin.compatibleWith).toEqual(["neo4j"]);
+  });
+
+  it("preserves queryHint", () => {
+    const plugin = makePlugin({ queryHint: "Return label, value" });
+    expect(plugin.queryHint).toBe("Return label, value");
+  });
+});
+
+// ---------------------------------------------------------------------------
+// Registry — register / lookup
+// ---------------------------------------------------------------------------
+
+describe("createPluginRegistry", () => {
+  let registry: ReturnType<typeof createPluginRegistry>;
+
+  beforeEach(() => {
+    registry = createPluginRegistry();
+  });
+
+  it("registers a plugin and retrieves it by type", () => {
+    const plugin = makePlugin({ type: "bar" });
+    registry.register(plugin);
+    expect(registry.get("bar")).toBe(plugin);
+  });
+
+  it("returns undefined for unknown type", () => {
+    expect(registry.get("unknown-chart")).toBeUndefined();
+  });
+
+  it("throws on duplicate registration of same type", () => {
+    registry.register(makePlugin({ type: "bar" }));
+    expect(() => registry.register(makePlugin({ type: "bar" }))).toThrow(
+      /already registered/i,
+    );
+  });
+
+  it("allows multiple distinct plugins", () => {
+    registry.register(makePlugin({ type: "bar", label: "Bar" }));
+    registry.register(makePlugin({ type: "line", label: "Line" }));
+    registry.register(makePlugin({ type: "pie", label: "Pie" }));
+    expect(registry.getAll()).toHaveLength(3);
+  });
+
+  it("lists all registered plugins in registration order", () => {
+    registry.register(makePlugin({ type: "bar" }));
+    registry.register(makePlugin({ type: "line" }));
+    const all = registry.getAll();
+    expect(all.map((p) => p.type)).toEqual(["bar", "line"]);
+  });
+
+  it("has() returns true for registered types", () => {
+    registry.register(makePlugin({ type: "bar" }));
+    expect(registry.has("bar")).toBe(true);
+    expect(registry.has("line")).toBe(false);
+  });
+
+  it("getTypes() returns all registered type names", () => {
+    registry.register(makePlugin({ type: "bar" }));
+    registry.register(makePlugin({ type: "pie" }));
+    expect(registry.getTypes()).toEqual(["bar", "pie"]);
+  });
+
+  it("unregister() removes a plugin", () => {
+    registry.register(makePlugin({ type: "bar" }));
+    registry.unregister("bar");
+    expect(registry.get("bar")).toBeUndefined();
+    expect(registry.has("bar")).toBe(false);
+  });
+
+  it("unregister() is safe on unknown types", () => {
+    expect(() => registry.unregister("nope")).not.toThrow();
+  });
+
+  it("filters plugins by compatible connector type", () => {
+    registry.register(makePlugin({ type: "graph", compatibleWith: ["neo4j"] }));
+    registry.register(
+      makePlugin({ type: "bar", compatibleWith: ["neo4j", "postgresql"] }),
+    );
+    registry.register(makePlugin({ type: "pie" })); // no compatibleWith = all
+
+    const neo4jPlugins = registry.getCompatibleWith("neo4j");
+    expect(neo4jPlugins.map((p) => p.type).sort()).toEqual([
+      "bar",
+      "graph",
+      "pie",
+    ]);
+
+    const pgPlugins = registry.getCompatibleWith("postgresql");
+    expect(pgPlugins.map((p) => p.type).sort()).toEqual(["bar", "pie"]);
+  });
+});
+
+// ---------------------------------------------------------------------------
+// Validation — defineChartPlugin guards invalid configs
+// ---------------------------------------------------------------------------
+
+describe("defineChartPlugin validation", () => {
+  it("throws when type is empty", () => {
+    expect(() =>
+      defineChartPlugin({
+        type: "",
+        label: "Empty",
+        component: fakeComponent,
+        transform: (r) => r,
+      }),
+    ).toThrow(/type.*required/i);
+  });
+
+  it("throws when label is empty", () => {
+    expect(() =>
+      defineChartPlugin({
+        type: "bar",
+        label: "",
+        component: fakeComponent,
+        transform: (r) => r,
+      }),
+    ).toThrow(/label.*required/i);
+  });
+
+  it("throws when transform is not a function", () => {
+    expect(() =>
+      defineChartPlugin({
+        type: "bar",
+        label: "Bar",
+        component: fakeComponent,
+        // @ts-expect-error -- deliberately invalid
+        transform: "not a function",
+      }),
+    ).toThrow(/transform.*function/i);
+  });
+});