feat(frontend): RemitDrawer component with CAS adjustments + parties + claim payments

src/components/RemitDrawer/RemitDrawerError.test.tsx

@@ -0,0 +1,108 @@
+// @vitest-environment happy-dom
+(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
+
+import React, { act } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { describe, expect, it, vi } from "vitest";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { RemitDrawerError } from "./RemitDrawerError";
+
+function renderIntoContainer(element: React.ReactElement): {
+  container: HTMLDivElement;
+  unmount: () => void;
+} {
+  const container = document.createElement("div");
+  document.body.appendChild(container);
+  const qc = new QueryClient({ defaultOptions: { queries: { retry: false } } });
+  const root: Root = createRoot(container);
+  act(() => {
+    root.render(
+      React.createElement(QueryClientProvider, { client: qc }, element)
+    );
+  });
+  return {
+    container,
+    unmount: () => {
+      act(() => root.unmount());
+      container.remove();
+    },
+  };
+}
+
+describe("RemitDrawerError", () => {
+  it("renders_not_found_message_and_close_button", () => {
+    const onClose = vi.fn();
+    const { container, unmount } = renderIntoContainer(
+      <RemitDrawerError kind="not_found" onClose={onClose} />
+    );
+
+    const root = container.firstElementChild as HTMLElement;
+    expect(root.getAttribute("role")).toBe("alert");
+    expect(
+      root.getAttribute("data-testid")?.includes("not_found")
+    ).toBe(true);
+
+    const text = (container.textContent ?? "").toLowerCase();
+    expect(text).toContain("not found");
+
+    const closeBtn = container.querySelector(
+      '[data-testid="error-close"]'
+    ) as HTMLButtonElement | null;
+    expect(closeBtn).not.toBeNull();
+    expect(closeBtn?.textContent?.toLowerCase()).toContain("close");
+    expect(onClose).not.toHaveBeenCalled();
+    act(() => {
+      closeBtn?.click();
+    });
+    expect(onClose).toHaveBeenCalledTimes(1);
+
+    unmount();
+  });
+
+  it("renders_network_message_and_retry_button", () => {
+    const onRetry = vi.fn();
+    const onClose = vi.fn();
+    const { container, unmount } = renderIntoContainer(
+      <RemitDrawerError kind="network" onRetry={onRetry} onClose={onClose} />
+    );
+
+    const text = (container.textContent ?? "").toLowerCase();
+    expect(
+      text.includes("network") ||
+        text.includes("connection") ||
+        text.includes("try again")
+    ).toBe(true);
+
+    const retryBtn = container.querySelector(
+      '[data-testid="error-retry"]'
+    ) as HTMLButtonElement | null;
+    expect(retryBtn).not.toBeNull();
+    act(() => {
+      retryBtn?.click();
+    });
+    expect(onRetry).toHaveBeenCalledTimes(1);
+
+    const closeBtn = container.querySelector(
+      '[data-testid="error-close"]'
+    ) as HTMLButtonElement | null;
+    expect(closeBtn).not.toBeNull();
+    act(() => {
+      closeBtn?.click();
+    });
+    expect(onClose).toHaveBeenCalledTimes(1);
+
+    unmount();
+  });
+
+  it("omits_retry_button_when_onRetry_not_provided", () => {
+    const onClose = vi.fn();
+    const { container, unmount } = renderIntoContainer(
+      <RemitDrawerError kind="network" onClose={onClose} />
+    );
+
+    const retryBtn = container.querySelector('[data-testid="error-retry"]');
+    expect(retryBtn).toBeNull();
+
+    unmount();
+  });
+});