[a2a9f601] Panel test gate, baseline vitest tests, and CI enforcement (#237) (#239)

* [05d580eb] test(panel): add baseline vitest tests for 5 source units and widen coverage include (#235)

- panel/src/lib/__tests__/agent-definitions.test.ts: all 7 filter functions covered
  (getBoardAgents, getMainPm, getBackend/Frontend/Ux/Marketing/OnDemandAgents)
  including null/undefined input and CEO/MAIN_PM exclusion logic

- panel/src/lib/__tests__/client.test.ts: getErrorMessage fully covered
  (ECONNABORTED, ERR_NETWORK, string/array/object detail formats,
   HTTP 401/403/404/422/500+, plain Error fallback, unknown input fallback)

- panel/src/store/__tests__/notifications-store.test.ts: useNotificationStore
  (addNotification counter+dedup, markAsRead, markAsAcknowledged, setCounts, clearAll)

- panel/src/store/__tests__/rate-limit-store.test.ts: useRateLimitStore
  (hitRateLimit entry+resumeAt, liftRateLimit deletion, syncFromApi replacement)

- panel/src/lib/__tests__/websocket.test.ts: getWebSocketUrl
  (absolute ws://, absolute wss://, http→ws: relative, https→wss: relative, SSR fallback)

- panel/vitest.config.ts: coverage include widened to src/lib/**, src/store/**,
  src/components/** and global thresholds removed (baseline tests cover only 5 units
  of hundreds; thresholds will be re-added per-file as coverage grows)

pnpm test: 7 test files, 111 tests, 0 failures
pnpm lint: clean
pnpm typecheck: clean



* [1bc8195e] feat(ci): add panel-gate and panel-quality Makefile targets and CI test step (#236)

Add two new .PHONY Makefile targets (panel-gate, panel-quality) that run
pnpm lint, pnpm exec tsc --noEmit, and pnpm test inside the panel directory.
panel-quality depends on panel-gate so a single target drives the full gate.

Add a 'Test (vitest + coverage)' step to the panel job in ci.yml, placed
after the existing Type-check step. The job's default working-directory is
already panel so no override is needed; vitest.config.ts text reporter
prints coverage to stdout automatically.



---------

Co-authored-by: Frontend Developer 1 <fe-dev-1@agents.roboco.dev>
Co-authored-by: Frontend Developer 2 <fe-dev-2@agents.roboco.dev>

panel/src/lib/__tests__/client.test.ts

@@ -0,0 +1,215 @@
+/**
+ * Tests for getErrorMessage() from @/lib/api/client.
+ *
+ * Strategy: We construct minimal objects that satisfy the AxiosError contract.
+ * The real `axios.isAxiosError` implementation checks:
+ *   isObject(payload) && payload.isAxiosError === true
+ * so plain objects with { isAxiosError: true } are recognised correctly,
+ * and we need not fully mock the axios module.
+ *
+ * We still mock the modules that client.ts imports for side effects so the
+ * axios instance creation and interceptor registration don't produce
+ * unwanted network calls or store mutations during the test run.
+ */
+
+import { describe, it, expect, vi, beforeEach } from "vitest";
+
+// ---------------------------------------------------------------------------
+// Mock heavy side-effect imports consumed by client.ts at module level
+// ---------------------------------------------------------------------------
+vi.mock("sonner", () => ({
+  toast: { warning: vi.fn(), error: vi.fn() },
+}));
+
+vi.mock("@/store/rate-limit-store", () => ({
+  useRateLimitStore: {
+    getState: vi.fn(() => ({ hitRateLimit: vi.fn() })),
+  },
+}));
+
+// ---------------------------------------------------------------------------
+// Import the function under test AFTER mocks are in place
+// ---------------------------------------------------------------------------
+import { getErrorMessage } from "@/lib/api/client";
+
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+
+/**
+ * Build a minimal AxiosError-like object accepted by `axios.isAxiosError`.
+ *
+ * The real axios checks: isObject(payload) && payload.isAxiosError === true
+ */
+function makeAxiosError(opts: {
+  code?: string;
+  status?: number;
+  detail?: unknown;
+  message?: string;
+}) {
+  return {
+    isAxiosError: true as const,
+    code: opts.code,
+    message: opts.message ?? "axios error",
+    response: opts.status !== undefined
+      ? {
+          status: opts.status,
+          data: { detail: opts.detail } as { detail?: unknown },
+          headers: {} as Record<string, string>,
+          config: {} as never,
+          statusText: "",
+        }
+      : undefined,
+    config: {} as never,
+    name: "AxiosError" as const,
+    toJSON: () => ({}),
+  };
+}
+
+beforeEach(() => {
+  vi.clearAllMocks();
+});
+
+// ---------------------------------------------------------------------------
+// Error-code tests
+// ---------------------------------------------------------------------------
+
+describe("getErrorMessage — error codes", () => {
+  it("returns timeout message for ECONNABORTED", () => {
+    const err = makeAxiosError({ code: "ECONNABORTED" });
+    expect(getErrorMessage(err)).toBe(
+      "Request timed out. The server may be busy."
+    );
+  });
+
+  it("returns network message for ERR_NETWORK", () => {
+    const err = makeAxiosError({ code: "ERR_NETWORK" });
+    expect(getErrorMessage(err)).toBe(
+      "Cannot connect to server. Check if the backend is running."
+    );
+  });
+});
+
+// ---------------------------------------------------------------------------
+// `detail` payload format tests (formatErrorDetail branches)
+// ---------------------------------------------------------------------------
+
+describe("getErrorMessage — detail string format", () => {
+  it("returns the string detail directly", () => {
+    const err = makeAxiosError({ status: 400, detail: "Some error string" });
+    expect(getErrorMessage(err)).toBe("Some error string");
+  });
+});
+
+describe("getErrorMessage — detail array format", () => {
+  it("formats a FastAPI validation array into a readable string", () => {
+    const err = makeAxiosError({
+      status: 422,
+      detail: [
+        { loc: ["body", "name"], msg: "field required" },
+        { loc: ["body", "email"], msg: "invalid email" },
+      ],
+    });
+    const result = getErrorMessage(err);
+    // Both validation errors should appear
+    expect(result).toContain("name");
+    expect(result).toContain("field required");
+    expect(result).toContain("email");
+    expect(result).toContain("invalid email");
+  });
+
+  it("returns a plain string item inside the array as-is", () => {
+    const err = makeAxiosError({
+      status: 400,
+      detail: ["plain error"],
+    });
+    expect(getErrorMessage(err)).toBe("plain error");
+  });
+});
+
+describe("getErrorMessage — detail object format", () => {
+  it("extracts `message` field from a structured error object", () => {
+    const err = makeAxiosError({
+      status: 400,
+      detail: { message: "Structured message" },
+    });
+    expect(getErrorMessage(err)).toBe("Structured message");
+  });
+
+  it("extracts `error` field when `message` is absent", () => {
+    const err = makeAxiosError({
+      status: 400,
+      detail: { error: "Error field content" },
+    });
+    expect(getErrorMessage(err)).toBe("Error field content");
+  });
+});
+
+// ---------------------------------------------------------------------------
+// HTTP status code tests (no usable detail)
+// ---------------------------------------------------------------------------
+
+describe("getErrorMessage — HTTP status codes", () => {
+  it("returns auth message for 401", () => {
+    const err = makeAxiosError({ status: 401 });
+    expect(getErrorMessage(err)).toBe(
+      "Authentication required. Please refresh the page."
+    );
+  });
+
+  it("returns permission message for 403", () => {
+    const err = makeAxiosError({ status: 403 });
+    expect(getErrorMessage(err)).toBe("Permission denied for this action.");
+  });
+
+  it("returns not-found message for 404", () => {
+    const err = makeAxiosError({ status: 404 });
+    expect(getErrorMessage(err)).toBe(
+      "The requested resource was not found."
+    );
+  });
+
+  it("returns validation message for 422 without detail", () => {
+    const err = makeAxiosError({ status: 422 });
+    expect(getErrorMessage(err)).toBe("Invalid request data.");
+  });
+
+  it("returns server-error message for 500", () => {
+    const err = makeAxiosError({ status: 500 });
+    expect(getErrorMessage(err)).toBe("Server error. Please try again later.");
+  });
+
+  it("returns server-error message for 502 (>= 500)", () => {
+    const err = makeAxiosError({ status: 502 });
+    expect(getErrorMessage(err)).toBe("Server error. Please try again later.");
+  });
+});
+
+// ---------------------------------------------------------------------------
+// Fallback tests (non-Axios errors)
+// ---------------------------------------------------------------------------
+
+describe("getErrorMessage — non-Axios fallbacks", () => {
+  it("returns Error.message for a plain Error instance", () => {
+    const err = new Error("plain JS error");
+    expect(getErrorMessage(err)).toBe("plain JS error");
+  });
+
+  it("returns generic message for a string input", () => {
+    expect(getErrorMessage("some string")).toBe("An unexpected error occurred");
+  });
+
+  it("returns generic message for null input", () => {
+    expect(getErrorMessage(null)).toBe("An unexpected error occurred");
+  });
+
+  it("returns generic message for undefined input", () => {
+    expect(getErrorMessage(undefined)).toBe("An unexpected error occurred");
+  });
+
+  it("returns generic message for a plain object without isAxiosError", () => {
+    expect(getErrorMessage({ code: "SOME_CODE" })).toBe(
+      "An unexpected error occurred"
+    );
+  });
+});