App/app/(portal)/history/history-filters.tsx

@@ -36,6 +36,8 @@ export function HistoryFilters({ vessels, accounts, perPageOptions, defaultPerPa
 
   const [dateFrom, setDateFrom] = useState(sp.get("dateFrom") ?? "");
   const [dateTo, setDateTo] = useState(sp.get("dateTo") ?? "");
+  const [approvedFrom, setApprovedFrom] = useState(sp.get("approvedFrom") ?? "");
+  const [approvedTo, setApprovedTo] = useState(sp.get("approvedTo") ?? "");
   const [vesselId, setVesselId] = useState(sp.get("vesselId") ?? "");
   const [accountId, setAccountId] = useState(sp.get("accountId") ?? "");
   const [statuses, setStatuses] = useState<string[]>(sp.getAll("status"));
@@ -63,6 +65,8 @@ export function HistoryFilters({ vessels, accounts, perPageOptions, defaultPerPa
     const params = new URLSearchParams();
     if (dateFrom) params.set("dateFrom", dateFrom);
     if (dateTo) params.set("dateTo", dateTo);
+    if (approvedFrom) params.set("approvedFrom", approvedFrom);
+    if (approvedTo) params.set("approvedTo", approvedTo);
     if (vesselId) params.set("vesselId", vesselId);
     if (accountId) params.set("accountId", accountId);
     for (const s of statuses) params.append("status", s);
@@ -79,14 +83,14 @@ export function HistoryFilters({ vessels, accounts, perPageOptions, defaultPerPa
   }
 
   function clear() {
-    setDateFrom(""); setDateTo(""); setVesselId(""); setAccountId(""); setStatuses([]);
+    setDateFrom(""); setDateTo(""); setApprovedFrom(""); setApprovedTo(""); setVesselId(""); setAccountId(""); setStatuses([]);
     const params = new URLSearchParams();
     if (perPage !== defaultPerPage) params.set("perPage", String(perPage));
     const qs = params.toString();
     router.push(qs ? `/history?${qs}` : "/history");
   }
 
-  const hasFilters = dateFrom || dateTo || vesselId || accountId || statuses.length > 0;
+  const hasFilters = dateFrom || dateTo || approvedFrom || approvedTo || vesselId || accountId || statuses.length > 0;
 
   const statusLabel =
     statuses.length === 0
@@ -108,6 +112,16 @@ export function HistoryFilters({ vessels, accounts, perPageOptions, defaultPerPa
           <input type="date" value={dateTo} onChange={(e) => setDateTo(e.target.value)}
             className="w-full rounded-lg border border-neutral-300 px-3 py-2 text-sm focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-primary-500/20" />
         </div>
+        <div>
+          <label className="block text-xs font-medium text-neutral-600 mb-1">Approved From</label>
+          <input type="date" value={approvedFrom} onChange={(e) => setApprovedFrom(e.target.value)}
+            className="w-full rounded-lg border border-neutral-300 px-3 py-2 text-sm focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-primary-500/20" />
+        </div>
+        <div>
+          <label className="block text-xs font-medium text-neutral-600 mb-1">Approved To</label>
+          <input type="date" value={approvedTo} onChange={(e) => setApprovedTo(e.target.value)}
+            className="w-full rounded-lg border border-neutral-300 px-3 py-2 text-sm focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-primary-500/20" />
+        </div>
         <div>
           <label className="block text-xs font-medium text-neutral-600 mb-1">Cost Centre</label>
           <select value={vesselId} onChange={(e) => setVesselId(e.target.value)}

App/tests/unit/history-filters.test.tsx

@@ -1,36 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-import { render, screen } from "@testing-library/react";
-
-// HistoryFilters reads the URL via next/navigation; mock both hooks it uses.
-vi.mock("next/navigation", () => ({
-  useRouter: () => ({ push: vi.fn(), refresh: vi.fn() }),
-  useSearchParams: () => new URLSearchParams(""),
-}));
-
-import { HistoryFilters } from "@/app/(portal)/history/history-filters";
-
-const props = {
-  vessels: [{ id: "v1", name: "Vessel One" }],
-  accounts: [],
-  perPageOptions: [25, 50, 100],
-  defaultPerPage: 25,
-};
-
-describe("HistoryFilters", () => {
-  // Regression guard for issue #136: the "Approved From" / "Approved To" date
-  // filters were removed from PO History. They must not reappear.
-  it("does not render the Approved From / Approved To filters", () => {
-    render(<HistoryFilters {...props} />);
-    expect(screen.queryByText("Approved From")).toBeNull();
-    expect(screen.queryByText("Approved To")).toBeNull();
-  });
-
-  it("still renders the remaining filters (created-date range, cost centre, accounting code, status)", () => {
-    render(<HistoryFilters {...props} />);
-    expect(screen.getByText("From")).toBeInTheDocument();
-    expect(screen.getByText("To")).toBeInTheDocument();
-    expect(screen.getByText("Cost Centre")).toBeInTheDocument();
-    expect(screen.getByText("Accounting Code")).toBeInTheDocument();
-    expect(screen.getByText("Status")).toBeInTheDocument();
-  });
-});