Refactor frontend API calls into hooks and complete task states

frontend/src/hooks/__tests__/useJailBannedIps.test.ts

@@ -0,0 +1,29 @@
+import { describe, it, expect, vi } from "vitest";
+import { renderHook, act, waitFor } from "@testing-library/react";
+import { useJailBannedIps } from "../useJails";
+import * as api from "../../api/jails";
+
+vi.mock("../../api/jails");
+
+describe("useJailBannedIps", () => {
+  it("loads bans and allows unban", async () => {
+    const fetchMock = vi.mocked(api.fetchJailBannedIps);
+    const unbanMock = vi.mocked(api.unbanIp);
+
+    fetchMock.mockResolvedValue({ items: [{ ip: "1.2.3.4", jail: "sshd", banned_at: "2025-01-01T10:00:00+00:00", expires_at: "2025-01-01T10:10:00+00:00", ban_count: 1, country: "US" }], total: 1, page: 1, page_size: 25 });
+    unbanMock.mockResolvedValue({ message: "ok", jail: "sshd" });
+
+    const { result } = renderHook(() => useJailBannedIps("sshd"));
+    await waitFor(() => {
+      expect(result.current.loading).toBe(false);
+    });
+    expect(result.current.items.length).toBe(1);
+
+    await act(async () => {
+      await result.current.unban("1.2.3.4");
+    });
+
+    expect(unbanMock).toHaveBeenCalledWith("1.2.3.4", "sshd");
+    expect(fetchMock).toHaveBeenCalledTimes(2);
+  });
+});

frontend/src/hooks/__tests__/useMapColorThresholds.test.ts

@@ -0,0 +1,41 @@
+import { describe, it, expect, vi } from "vitest";
+import { renderHook, act, waitFor } from "@testing-library/react";
+import { useMapColorThresholds } from "../useMapColorThresholds";
+import * as api from "../../api/config";
+
+vi.mock("../../api/config");
+
+describe("useMapColorThresholds", () => {
+  it("loads thresholds and exposes values", async () => {
+    const mocked = vi.mocked(api.fetchMapColorThresholds);
+    mocked.mockResolvedValue({ threshold_low: 10, threshold_medium: 20, threshold_high: 50 });
+
+    const { result } = renderHook(() => useMapColorThresholds());
+
+    expect(result.current.loading).toBe(true);
+    await waitFor(() => {
+      expect(result.current.loading).toBe(false);
+    });
+    expect(result.current.thresholds).toEqual({ threshold_low: 10, threshold_medium: 20, threshold_high: 50 });
+    expect(result.current.error).toBeNull();
+  });
+
+  it("updates thresholds via callback", async () => {
+    const fetchMock = vi.mocked(api.fetchMapColorThresholds);
+    const updateMock = vi.mocked(api.updateMapColorThresholds);
+
+    fetchMock.mockResolvedValue({ threshold_low: 10, threshold_medium: 20, threshold_high: 50 });
+    updateMock.mockResolvedValue({ threshold_low: 15, threshold_medium: 25, threshold_high: 75 });
+
+    const { result } = renderHook(() => useMapColorThresholds());
+    await waitFor(() => {
+      expect(result.current.loading).toBe(false);
+    });
+
+    await act(async () => {
+      await result.current.updateThresholds({ threshold_low: 15, threshold_medium: 25, threshold_high: 75 });
+    });
+
+    expect(result.current.thresholds).toEqual({ threshold_low: 15, threshold_medium: 25, threshold_high: 75 });
+  });
+});