docs/audits/verification-log.md

@@ -191,3 +191,4 @@ Output was reduced to filenames and commit counts. The token artifact appears un
 | V-157 | Phase 10 source trace; failing computed-color browser reproduction; focused Kanban component tests; production build; mocked 1440/768/375 dark/light pointer/keyboard Playwright; screenshot inspection; full frontend and complete E2E; staged diff review | `job-tracker-ui` / repository root | Correct Kanban theme/state/accessibility/mobile behavior using shared tokens | PASS — pre-fix dark column was `rgb(245, 242, 250)`; after uses dark variable surface. Component 7/7, frontend 204/204, build and Playwright 6/6 pass; browser native hover/drag and keyboard drop each reach the mocked API; mobile owns horizontal board scroll; `fb6f17e`/`4e5ce0c` pushed | Iteration exposed CSS-variable `alpha()` incompatibility, test-theme fallback, stale locators and a one-pixel live region expressed as MUI width `1` (100%), all corrected. Mocked data/API only; GSI repeated-initialize and Jest open-handle warnings remain | Repository/browser scope verified; production/native-device gates remain |
 | V-158 | Phase 11 requirement, route, `JobTable`, `JobDetailsDialog`, `ApplicationWorkspacePage`, workspace architecture and test inventory | Repository root | Reproduce JOBS-002 list-context, deep-link and presentation behavior before editing | PASS — filters/page were component-local; `?open=` was consumed and removed; row Open launched the legacy quick dialog; workspace navigation left `/jobs`, and workspace Back always returned to a fresh `/jobs`. The full-page workspace already composes the owned domain sections and remains the safe reuse boundary | Source execution-path inspection; no browser behavior relabelled as tested | Confirmed product/navigation gap |
 | V-159 | Focused overlay Jest; full `npm test -- --runInBand --forceExit`; `npm run build`; `git diff --check` | `job-tracker-ui` / repository root | Verify first JOBS-002 route-backed embedded-workspace increment | PASS — focused 2/2, full frontend 51 suites and 206/206 tests, and optimized production build/TypeScript pass. Row Open creates `/jobs?workspace={id}`, direct URLs and section URLs render, close/Forward preserve history and in-memory search, the dialog has an accessible name/focus trap, mobile uses full screen, and the full-page route remains linked | JSDOM/mocked API only. Existing Jest force-exit notice remains. URL persistence of complete filter/page state, dirty-edit guards, table redesign and real browser/production checks remain | First cohesive increment verified |
+| V-160 | Focused overlay/workflow Jest; direct URL query hydration; full `npm test -- --runInBand --forceExit`; production build; diff review | `job-tracker-ui` | Verify JOBS-002 URL-owned list state without breaking workspace routes or workflow links | PASS — focused 2 suites and 6/6, full frontend 51 suites and 207/207, and optimized production build/TypeScript pass. Search survives overlay Back/Forward; direct URLs hydrate status/company/location/follow-up/readiness/deleted/sort/direction/page into the API request; company loading no longer produces a MUI out-of-range state | Existing Jest force-exit notice remains; browser refresh/history still to be exercised in Playwright | Local increment verified |

docs/verification/jobs-002-application-workspace.md

@@ -26,7 +26,7 @@ Updated: 2026-08-10
 
 ## Remaining before completion
 
-- Persist search, filters, sort and page in the URL and verify refresh/Back/Forward.
+- URL-owned list state is implemented for search, status, company, location, follow-up, readiness, deleted visibility, sort/direction and page. Direct hydration and overlay Back/Forward pass focused tests; real-browser refresh/history remains.
 - Add a shared dirty-edit close/navigation guard for workspace sections that own unsaved content.
 - Improve the table's scan-priority data without adding every available field.
 - Add real-browser 375/768/1440, light/dark, keyboard/focus restoration, refresh/history, error and long-content evidence.

docs/work-programmes/master-progress.md

@@ -3,7 +3,7 @@
 Updated: 2026-08-10
 
 - **Overall programme status:** Active. Seven packages are locally verified; twenty-two packages through UX-003 are implemented with automated/runtime evidence but blocked from applicable live/provider/production gates; JOBS-002 is now in progress. Gitea run 609 passes the prior complete pull-request CI; DEP-001 awaits approved merge-to-main and production verification.
-- **Current work package:** `JOBS-002` — applications table and embedded workspace (`IN PROGRESS`); route-backed overlay increment passes focused tests/build. URL-backed filters/page and dirty-edit protection are next.
+- **Current work package:** `JOBS-002` — applications table and embedded workspace (`IN PROGRESS`); route-backed overlay is pushed, and URL-owned filters/sort/page pass full regression/build. Commit/push, then dirty-edit protection are next.
 - **Completed work packages:** None are `DONE`; all repository security/AI packages still have applicable browser, provider and/or production gates.
 - **Locally verified work:** SEC-001, SEC-002, SEC-003, SEC-005A, CORE-001, PROD-002 and DEP-001 (`VERIFIED LOCALLY`).
 - **Implemented, verification incomplete:** SEC-004, SEC-005B, SEC-008, CORE-002, BG-001, OPS-001A/B/C, POL-001/002, AI-001/002/003/004, UX-001/002/003, QA-001, CAREER-001/002, MAIL-001 and JOBS-001 (`IMPLEMENTED — NOT VERIFIED`). UX-003 safe local/browser scope is implemented; production/native-device gates remain.
@@ -12,7 +12,7 @@ Updated: 2026-08-10
 - **Deferred work:** None. Conditional multi-replica coordination, model deletion, realtime operation delivery and unrelated production changes remain outside current packages.
 - **Next five work packages:** JOBS-002 applications/workspace; PRODUCT-001 homepage/Pro claims; VER-001 action matrix; production-blocked SEC-006/007 when package-index permission is available; REL-001 after prerequisites.
 - **Status counts:** 7 `VERIFIED LOCALLY`; 22 `IMPLEMENTED — NOT VERIFIED`; 1 `IN PROGRESS`; 5 `NOT STARTED`; 5 `BLOCKED`; 0 `DONE`; 0 `DEFERRED`.
-- **Test status:** backend 631/631; frontend 51/51 suites and 206/206 tests; JOBS-002 overlay focused 2/2; Playwright 6/6; npm audit 0 vulnerabilities; production build passes. Historical JT-019 and Jest force-exit/open-handle behavior remain recorded.
+- **Test status:** backend 631/631; frontend 51/51 suites and 207/207 tests; JOBS-002 URL-state focused 2 suites and 6/6; Playwright 6/6; npm audit 0 vulnerabilities; production build passes. Historical JT-019 and Jest force-exit/open-handle behavior remain recorded.
 - **Deployment status:** Gitea pull-request run 609 passed the complete CI job in 4m20s. Deploy was intentionally skipped because the workflow deploys only a `push` to `main`; live remains unchanged. No merge/deployment was performed directly, no production migrations were run and the AI operation worker remains disabled by default.
 - **Production status:** Unchanged and unverified. No provider/model call, model pull, external request or paid API occurred.
 - **Known regressions:** None found by automated/local browser checks. Jest still needs `--forceExit` and reports its existing open-handle notice. Email-provider/send tests are fake/local only; real delivery is not claimed. Current MAIL browser evidence is 1280×720 only because the browser surface could not resize or perform native Tab traversal. Interrupted attempts are aged after 15 minutes and notified without retry; the five-minute scan is unmeasured on a large ledger. Direct clean EF-only SQLite migration still hits the pre-existing historical blank-chain defect before later migrations; normal startup owns reconciliation. Cross-feature monthly AI usage accounting remains a rollout gap.

docs/work-programmes/session-handoff.md

@@ -2,17 +2,17 @@
 
 Updated: 2026-08-10
 
-- **Exact current task:** JOBS-002 — finish and commit the first route-backed embedded-workspace increment, then make filters/page URL-owned without breaking direct workspace URLs.
-- **Last completed step:** V-158 traced the confirmed list-context loss; V-159 focused 2/2 and production build pass for the route-backed overlay, direct/section URLs, close/Forward behavior, accessible dialog and full-page fallback.
-- **Files currently modified:** `JobTable.tsx`, `ApplicationWorkspacePage.tsx`, new `application-workspace-overlay.test.tsx`, JOBS-002 verification/tracking/decision documents.
-- **Commands already run:** bounded Phase 11 route/workspace/test trace; focused overlay Jest; production frontend build; diff check. See V-158/V-159.
-- **Test results:** backend 631/631 unchanged; frontend 51 suites and 206/206; JOBS-002 overlay focused 2/2; production build passes. Jest retains its known force-exit/open-handle notice.
+- **Exact current task:** JOBS-002 — finish URL-owned list filters/sort/page, run full regression, commit/push, then trace and protect unsaved workspace edits.
+- **Last completed step:** pushed `b67a531`; V-160 direct query hydration, full frontend 207/207 and production build pass without new console warnings.
+- **Files currently modified:** `JobTable.tsx`, `application-workspace-overlay.test.tsx`, JOBS-002 verification/tracking documents.
+- **Commands already run:** V-158/V-159 trace/focused/full/build; V-160 focused overlay/workflow, full frontend and production build/diff check.
+- **Test results:** backend 631/631 unchanged; frontend 51 suites and 207/207; JOBS-002 URL-state focused 6/6; production build passes. Jest retains its known force-exit/open-handle notice.
 - **Services currently running:** none on task-owned ports 3000/5202. Playwright stopped its disposable API/Next servers. Pre-existing Docker services were not changed.
 - **Temporary files or processes:** no task-owned process is running and the failed disposable migration database was removed. Existing synthetic browser evidence/account and startup-created local backup remain documented. No provider account, real email, private content, paid service or production service was accessed.
 - **Production changes currently active:** none. No deployment, migration, provider connection/sync/send or production payload occurred.
 - **Rollback status:** downgrade `20260810080858_AddEmailDraftClientRequestId`, then `20260810075206_AddEmailDrafts`, before reverting draft commits; then follow the existing MAIL rollback order (`ee5ef7e`, `449faeb`, `123fc55`/`e9937ac`, ledger downgrade before `653f011`). No production migration/deploy/provider grant occurred.
-- **Uncommitted changes:** first JOBS-002 route-backed overlay implementation, focused tests and tracking; no dependency/schema/config change.
+- **Uncommitted changes:** JOBS-002 URL-owned search/status/company/location/follow-up/readiness/deleted/sort/page state, tests and tracking; no dependency/schema/config change.
 - **Known failures:** live deployment is not verified because PR deploy is intentionally skipped and the active branch is not approved for merge. Draft export/API/UI, full thread/category actions and non-Gmail review remain; existing accounts need re-consent and IMAP stays read-only. A clean full-chain SQLite apply fails in the pre-existing JT-019 migration before the new draft migration. Browser/provider/MariaDB/production unavailable or unverified; recovery scan performance is unmeasured at large ledger scale; Jest open handles; SEC-006 parser dependency work is still separately gated; parser isolation remains SEC-007.
-- **Exact next action:** review/stage/commit/push the overlay increment, then implement URL-backed search/status/company/location/follow-up/readiness/sort/page state with Back/Forward tests.
+- **Exact next action:** review/stage/commit/push V-160; then inspect dirty state in cover letter/correspondence/AI section editors and add the smallest shared close/navigation guard.
 - **Work that can continue independently:** JOBS-002, PRODUCT-001 and VER-001. UX/JOBS production, MAIL provider mutations, SEC-006/007 and PROD packages retain their recorded external gates.
 - **Decisions still required from the user:** none for synthetic/code-inspected repository work. Any provider connection or send test, internet/package upgrades, private data, external/paid providers and production actions retain explicit approval/safety gates; SEC-009 retention/legal policy remains unresolved.

job-tracker-ui/src/application-workspace-overlay.test.tsx

@@ -118,21 +118,21 @@ test("opens the workspace in a route-backed overlay and preserves list state thr
   fireEvent.click(await screen.findByRole("button", { name: /open: backend developer/i }));
 
   await screen.findByRole("dialog", { name: /application workspace/i });
-  expect(screen.getByTestId("location")).toHaveTextContent("/jobs?workspace=42");
+  expect(screen.getByTestId("location")).toHaveTextContent("/jobs?q=backend&workspace=42");
   expect(screen.getByRole("link", { name: /open full-page workspace/i })).toHaveAttribute("href", "/applications/42?section=overview");
 
   fireEvent.click(screen.getByRole("button", { name: "Match" }));
   expect(await screen.findByText("Match section")).toBeInTheDocument();
-  expect(screen.getByTestId("location")).toHaveTextContent("/jobs?workspace=42&section=match");
+  expect(screen.getByTestId("location")).toHaveTextContent("/jobs?q=backend&workspace=42&section=match");
 
   fireEvent.click(screen.getByRole("button", { name: /back to applications/i }));
   await waitFor(() => expect(screen.queryByRole("dialog", { name: /application workspace/i })).not.toBeInTheDocument());
-  expect(screen.getByTestId("location")).toHaveTextContent("/jobs");
+  expect(screen.getByTestId("location")).toHaveTextContent("/jobs?q=backend");
   expect(screen.getByRole("textbox", { name: /search/i })).toHaveValue("backend");
 
   fireEvent.click(screen.getByRole("button", { name: /browser forward/i }));
   await screen.findByRole("dialog", { name: /application workspace/i });
-  expect(screen.getByTestId("location")).toHaveTextContent("/jobs?workspace=42&section=match");
+  expect(screen.getByTestId("location")).toHaveTextContent("/jobs?q=backend&workspace=42&section=match");
 });
 
 test("opens a direct workspace URL and closes it without inventing browser history", async () => {
@@ -145,3 +145,22 @@ test("opens a direct workspace URL and closes it without inventing browser histo
   await waitFor(() => expect(screen.getByTestId("location")).toHaveTextContent("/jobs"));
   await waitFor(() => expect(screen.queryByRole("dialog", { name: /application workspace/i })).not.toBeInTheDocument());
 });
+
+test("hydrates list filters, sort and page from a shareable URL", async () => {
+  renderTable("/jobs?q=backend&status=Interview&companyId=1&location=Oslo&needsFollowUp=1&readiness=interview&includeDeleted=1&sortBy=company&sortDir=asc&page=2");
+
+  expect(await screen.findByRole("textbox", { name: /search/i })).toHaveValue("backend");
+  await waitFor(() => expect(mockedApi.get).toHaveBeenCalledWith("/jobapplications", {
+    params: expect.objectContaining({
+      page: 2,
+      q: "backend",
+      status: "Interview",
+      companyId: 1,
+      location: "Oslo",
+      needsFollowUp: true,
+      includeDeleted: true,
+      sortBy: "company",
+      sortDir: "asc",
+    }),
+  }));
+});

job-tracker-ui/src/components/JobTable.tsx

@@ -104,6 +104,37 @@ interface Props {
   mode?: "jobs" | "trash";
 }
 
+type JobSortKey = "dateApplied" | "company" | "jobTitle" | "status" | "daysSince" | "location";
+type ReadinessFilter = "all" | "needs-work" | "interview";
+
+const JOB_SORT_KEYS: JobSortKey[] = ["dateApplied", "company", "jobTitle", "status", "daysSince", "location"];
+const JOB_STATUS_FILTERS = ["Applied", "Waiting", "Interview", "Offer", "Rejected", "Ghosted"];
+
+function queryPage(search: string): number {
+  const value = Number(new URLSearchParams(search).get("page"));
+  return Number.isInteger(value) && value > 1 ? value - 1 : 0;
+}
+
+function queryCompany(search: string): number | "All" {
+  const value = Number(new URLSearchParams(search).get("companyId"));
+  return Number.isInteger(value) && value > 0 ? value : "All";
+}
+
+function queryStatus(search: string): string {
+  const value = new URLSearchParams(search).get("status");
+  return value && JOB_STATUS_FILTERS.includes(value) ? value : "All";
+}
+
+function queryReadiness(search: string): ReadinessFilter {
+  const value = new URLSearchParams(search).get("readiness");
+  return value === "needs-work" || value === "interview" ? value : "all";
+}
+
+function querySort(search: string): JobSortKey {
+  const value = new URLSearchParams(search).get("sortBy") as JobSortKey | null;
+  return value && JOB_SORT_KEYS.includes(value) ? value : "dateApplied";
+}
+
 function parseTags(raw?: string | null): string[] {
   if (!raw) return [];
   try {
@@ -160,20 +191,20 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
   const navigate = useNavigate();
   const [jobs, setJobs] = useState<JobApplication[]>([]);
   const [total, setTotal] = useState(0);
-  const [page, setPage] = useState(0);
+  const [page, setPage] = useState(() => queryPage(location.search));
   const [expanded, setExpanded] = useState<number[]>([]);
   const [selectedIds, setSelectedIds] = useState<number[]>([]);
-  const [search, setSearch] = useState("");
+  const [search, setSearch] = useState(() => new URLSearchParams(location.search).get("q") ?? "");
   const debouncedSearch = useDebouncedValue(search, 250);
-  const [includeDeleted, setIncludeDeleted] = useState(mode === "trash");
+  const [includeDeleted, setIncludeDeleted] = useState(() => mode === "trash" || new URLSearchParams(location.search).get("includeDeleted") === "1");
   const [columnsAnchor, setColumnsAnchor] = useState<null | HTMLElement>(null);
-  const [statusFilter, setStatusFilter] = useState("All");
-  const [locationFilter, setLocationFilter] = useState("");
+  const [statusFilter, setStatusFilter] = useState(() => queryStatus(location.search));
+  const [locationFilter, setLocationFilter] = useState(() => new URLSearchParams(location.search).get("location") ?? "");
   const debouncedLocation = useDebouncedValue(locationFilter, 250);
-  const [needsFollowUpOnly, setNeedsFollowUpOnly] = useState(false);
-  const [readinessFilter, setReadinessFilter] = useState<"all" | "needs-work" | "interview">("all");
+  const [needsFollowUpOnly, setNeedsFollowUpOnly] = useState(() => new URLSearchParams(location.search).get("needsFollowUp") === "1");
+  const [readinessFilter, setReadinessFilter] = useState<ReadinessFilter>(() => queryReadiness(location.search));
   const { companies, error: companiesError, reload: reloadCompanies } = useCompanies();
-  const [companyFilterId, setCompanyFilterId] = useState<number | "All">("All");
+  const [companyFilterId, setCompanyFilterId] = useState<number | "All">(() => queryCompany(location.search));
   const [detailsJobId, setDetailsJobId] = useState<number | null>(null);
   const [detailsInitialTab, setDetailsInitialTab] = useState(0);
   const [detailsFollowUpMode, setDetailsFollowUpMode] = useState<string | undefined>(undefined);
@@ -181,12 +212,95 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
   const [reloadToken, setReloadToken] = useState(0);
   const [statusAnchor, setStatusAnchor] = useState<null | HTMLElement>(null);
   const [statusJobId, setStatusJobId] = useState<number | null>(null);
-  const [sortBy, setSortBy] = useState<"dateApplied" | "company" | "jobTitle" | "status" | "daysSince" | "location">("dateApplied");
-  const [sortDir, setSortDir] = useState<"asc" | "desc">("desc");
+  const [sortBy, setSortBy] = useState<JobSortKey>(() => querySort(location.search));
+  const [sortDir, setSortDir] = useState<"asc" | "desc">(() => new URLSearchParams(location.search).get("sortDir") === "asc" ? "asc" : "desc");
   const searchParams = useMemo(() => new URLSearchParams(location.search), [location.search]);
   const workspaceJobId = Number(searchParams.get("workspace")) || null;
   const workspaceSectionKey = workspaceSection(searchParams.get("section"));
 
+  const updateListRoute = useCallback((updates: Record<string, string | null>) => {
+    const next = new URLSearchParams(location.search);
+    Object.entries(updates).forEach(([key, value]) => {
+      if (value) next.set(key, value);
+      else next.delete(key);
+    });
+    navigate({ pathname: location.pathname, search: next.toString() ? `?${next.toString()}` : "" }, { replace: true, state: location.state });
+  }, [location.pathname, location.search, location.state, navigate]);
+
+  useEffect(() => {
+    const next = new URLSearchParams(location.search);
+    setSearch(next.get("q") ?? "");
+    setStatusFilter(queryStatus(location.search));
+    setCompanyFilterId(queryCompany(location.search));
+    setLocationFilter(next.get("location") ?? "");
+    setNeedsFollowUpOnly(next.get("needsFollowUp") === "1");
+    setReadinessFilter(queryReadiness(location.search));
+    setIncludeDeleted(mode === "trash" || next.get("includeDeleted") === "1");
+    setSortBy(querySort(location.search));
+    setSortDir(next.get("sortDir") === "asc" ? "asc" : "desc");
+    setPage(queryPage(location.search));
+  }, [location.search, mode]);
+
+  const changeSearch = (value: string) => {
+    setSearch(value);
+    setPage(0);
+    updateListRoute({ q: value || null, page: null });
+  };
+
+  const changeStatus = (value: string) => {
+    setStatusFilter(value);
+    setPage(0);
+    updateListRoute({ status: value === "All" ? null : value, page: null });
+  };
+
+  const changeCompany = (value: number | "All") => {
+    setCompanyFilterId(value);
+    setPage(0);
+    updateListRoute({ companyId: value === "All" ? null : String(value), page: null });
+  };
+
+  const changeLocation = (value: string) => {
+    setLocationFilter(value);
+    setPage(0);
+    updateListRoute({ location: value || null, page: null });
+  };
+
+  const changeNeedsFollowUp = (value: boolean) => {
+    setNeedsFollowUpOnly(value);
+    setPage(0);
+    updateListRoute({ needsFollowUp: value ? "1" : null, page: null });
+  };
+
+  const changeReadiness = (value: ReadinessFilter) => {
+    setReadinessFilter(value);
+    setPage(0);
+    updateListRoute({ readiness: value === "all" ? null : value, page: null });
+  };
+
+  const changeIncludeDeleted = (value: boolean) => {
+    setIncludeDeleted(value);
+    setPage(0);
+    updateListRoute({ includeDeleted: value && mode !== "trash" ? "1" : null, page: null });
+  };
+
+  const applySavedView = (view: SavedViewParams) => {
+    const nextCompany = view.companyId ?? "All";
+    setSearch(view.q ?? "");
+    setStatusFilter(view.status ?? "All");
+    setCompanyFilterId(nextCompany);
+    setLocationFilter(view.location ?? "");
+    setNeedsFollowUpOnly(Boolean(view.needsFollowUp));
+    setPage(0);
+    updateListRoute({
+      q: view.q || null,
+      status: view.status || null,
+      companyId: nextCompany === "All" ? null : String(nextCompany),
+      location: view.location || null,
+      needsFollowUp: view.needsFollowUp ? "1" : null,
+      page: null,
+    });
+  };
+
   const updateWorkspaceRoute = (jobId: number, section: WorkspaceSectionKey = "overview") => {
     const next = new URLSearchParams(location.search);
     next.set("workspace", String(jobId));
@@ -265,13 +379,12 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
     navigate({ pathname: location.pathname, search: paramsSearch.toString() ? `?${paramsSearch.toString()}` : "" }, { replace: true });
   }, [jobs, location.pathname, location.search, navigate]);
 
-  const requestSort = (key: typeof sortBy) => {
-    if (sortBy === key) setSortDir((d) => (d === "asc" ? "desc" : "asc"));
-    else {
-      setSortBy(key);
-      setSortDir("asc");
-    }
+  const requestSort = (key: JobSortKey) => {
+    const nextDirection = sortBy === key ? (sortDir === "asc" ? "desc" : "asc") : "asc";
+    setSortBy(key);
+    setSortDir(nextDirection);
     setPage(0);
+    updateListRoute({ sortBy: key === "dateApplied" ? null : key, sortDir: key === "dateApplied" && nextDirection === "desc" ? null : nextDirection, page: null });
   };
 
   const toggleExpanded = (id: number) => {
@@ -395,6 +508,7 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
 
   const statusOptions = ["Waiting", "Interview", "Offer", "Rejected", "Ghosted"] as const;
   const visibleDesktopColumns = 4 + Number(columns.status) + Number(columns.dateApplied) + Number(columns.daysSince) + Number(columns.jobUrl);
+  const selectedCompanyIsLoading = companyFilterId !== "All" && !companies.some((company) => company.id === companyFilterId);
 
   return (
     <Box>
@@ -404,7 +518,7 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
             <TextField
               label={t("jobTableSearch")}
               value={search}
-              onChange={(e) => { setSearch(e.target.value); setPage(0); }}
+              onChange={(e) => changeSearch(e.target.value)}
               placeholder={t("jobTableSearchPlaceholder")}
               size="small"
               InputProps={{ startAdornment: <InputAdornment position="start"><SearchIcon fontSize="small" /></InputAdornment> }}
@@ -414,15 +528,16 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
             <Box sx={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 1 }}>
               <FormControl fullWidth size="small">
                 <InputLabel>{t("jobTableStatus")}</InputLabel>
-                <Select value={statusFilter} label={t("jobTableStatus")} onChange={(e) => { setStatusFilter(e.target.value); setPage(0); }}>
+                <Select value={statusFilter} label={t("jobTableStatus")} onChange={(e) => changeStatus(e.target.value)}>
                   {[t("jobTableAll"), t("statusApplied"), t("statusWaiting"), t("statusInterview"), t("statusOffer"), t("statusRejected"), t("statusGhosted")].map((s) => <MenuItem key={s} value={s === t("jobTableAll") ? "All" : s === t("statusApplied") ? "Applied" : s === t("statusWaiting") ? "Waiting" : s === t("statusInterview") ? "Interview" : s === t("statusOffer") ? "Offer" : s === t("statusRejected") ? "Rejected" : "Ghosted"}>{s}</MenuItem>)}
                 </Select>
               </FormControl>
 
               <FormControl fullWidth size="small">
                 <InputLabel>{t("jobTableCompany")}</InputLabel>
-                <Select value={companyFilterId} label={t("jobTableCompany")} onChange={(e) => { setCompanyFilterId(e.target.value as any); setPage(0); }}>
+                <Select value={companyFilterId} label={t("jobTableCompany")} onChange={(e) => changeCompany(e.target.value as number | "All")}>
                   <MenuItem value="All">{t("jobTableAll")}</MenuItem>
+                  {selectedCompanyIsLoading ? <MenuItem value={companyFilterId}>Company {companyFilterId}</MenuItem> : null}
                   {companies.map((c) => <MenuItem key={c.id} value={c.id}>{c.name}</MenuItem>)}
                 </Select>
               </FormControl>
@@ -432,14 +547,14 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
               <TextField
                 label={t("jobTableLocation")}
                 value={locationFilter}
-                onChange={(e) => { setLocationFilter(e.target.value); setPage(0); }}
+                onChange={(e) => changeLocation(e.target.value)}
                 fullWidth
               />
 
               {mode === "jobs" ? (
                 <FormControl fullWidth size="small">
                   <InputLabel>{t("jobTableReadiness")}</InputLabel>
-                  <Select value={readinessFilter} label={t("jobTableReadiness")} onChange={(e) => setReadinessFilter(e.target.value as any)}>
+                  <Select value={readinessFilter} label={t("jobTableReadiness")} onChange={(e) => changeReadiness(e.target.value as ReadinessFilter)}>
                     <MenuItem value="all">{t("jobTableAllReadiness")}</MenuItem>
                     <MenuItem value="needs-work">{t("jobTableNeedsWork")}</MenuItem>
                     <MenuItem value="interview">{t("jobTableInterviewStage")}</MenuItem>
@@ -462,14 +577,14 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
                   borderColor: alpha(theme.palette.primary.main, 0.1),
                 }}
               >
-                <FormControlLabel control={<Checkbox checked={needsFollowUpOnly} onChange={(e) => { setNeedsFollowUpOnly(e.target.checked); setPage(0); }} />} label={t("jobTableNeedsFollowUp")} sx={{ mr: 0, ml: -0.5 }} />
-                <FormControlLabel control={<Checkbox checked={includeDeleted} onChange={(e) => { setIncludeDeleted(e.target.checked); setPage(0); }} />} label={t("jobTableShowDeleted")} sx={{ mr: 0, ml: -0.5 }} />
+                <FormControlLabel control={<Checkbox checked={needsFollowUpOnly} onChange={(e) => changeNeedsFollowUp(e.target.checked)} />} label={t("jobTableNeedsFollowUp")} sx={{ mr: 0, ml: -0.5 }} />
+                <FormControlLabel control={<Checkbox checked={includeDeleted} onChange={(e) => changeIncludeDeleted(e.target.checked)} />} label={t("jobTableShowDeleted")} sx={{ mr: 0, ml: -0.5 }} />
               </Box>
             ) : null}
 
             <Box sx={{ display: "grid", gridTemplateColumns: "minmax(0, 1fr) auto", gap: 0.75, alignItems: "center", pt: 0.25 }}>
               <Box sx={{ minWidth: 0 }}>
-                <SavedViewsMenu current={{ q: search.trim() || undefined, status: statusFilter !== "All" ? statusFilter : undefined, companyId: companyFilterId === "All" ? undefined : (companyFilterId as number), location: locationFilter.trim() || undefined, needsFollowUp: needsFollowUpOnly ? true : undefined }} onApply={(p: SavedViewParams) => { setSearch(p.q ?? ""); setStatusFilter(p.status ?? "All"); setCompanyFilterId(p.companyId ?? "All"); setLocationFilter(p.location ?? ""); setNeedsFollowUpOnly(Boolean(p.needsFollowUp)); setPage(0); }} />
+                <SavedViewsMenu current={{ q: search.trim() || undefined, status: statusFilter !== "All" ? statusFilter : undefined, companyId: companyFilterId === "All" ? undefined : (companyFilterId as number), location: locationFilter.trim() || undefined, needsFollowUp: needsFollowUpOnly ? true : undefined }} onApply={applySavedView} />
               </Box>
               <Button variant="text" size="small" startIcon={<ViewColumnIcon />} onClick={(e) => setColumnsAnchor(e.currentTarget)} sx={{ justifySelf: "end", minHeight: 40, px: 1 }}>
                 {t("jobTableColumns")}
@@ -482,7 +597,7 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
           <TextField
             label={t("jobTableSearch")}
             value={search}
-            onChange={(e) => { setSearch(e.target.value); setPage(0); }}
+            onChange={(e) => changeSearch(e.target.value)}
             placeholder={t("jobTableSearchPlaceholder")}
             size="small"
             InputProps={{ startAdornment: <InputAdornment position="start"><SearchIcon fontSize="small" /></InputAdornment> }}
@@ -491,15 +606,16 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
 
           <FormControl sx={{ width: { xs: "100%", sm: 180 } }} size="small">
             <InputLabel>{t("jobTableStatus")}</InputLabel>
-            <Select value={statusFilter} label={t("jobTableStatus")} onChange={(e) => { setStatusFilter(e.target.value); setPage(0); }}>
+            <Select value={statusFilter} label={t("jobTableStatus")} onChange={(e) => changeStatus(e.target.value)}>
               {[t("jobTableAll"), t("statusApplied"), t("statusWaiting"), t("statusInterview"), t("statusOffer"), t("statusRejected"), t("statusGhosted")].map((s) => <MenuItem key={s} value={s === t("jobTableAll") ? "All" : s === t("statusApplied") ? "Applied" : s === t("statusWaiting") ? "Waiting" : s === t("statusInterview") ? "Interview" : s === t("statusOffer") ? "Offer" : s === t("statusRejected") ? "Rejected" : "Ghosted"}>{s}</MenuItem>)}
             </Select>
           </FormControl>
 
           <FormControl sx={{ width: { xs: "100%", sm: 220 } }} size="small">
             <InputLabel>{t("jobTableCompany")}</InputLabel>
-            <Select value={companyFilterId} label={t("jobTableCompany")} onChange={(e) => { setCompanyFilterId(e.target.value as any); setPage(0); }}>
+            <Select value={companyFilterId} label={t("jobTableCompany")} onChange={(e) => changeCompany(e.target.value as number | "All")}>
               <MenuItem value="All">{t("jobTableAll")}</MenuItem>
+              {selectedCompanyIsLoading ? <MenuItem value={companyFilterId}>Company {companyFilterId}</MenuItem> : null}
               {companies.map((c) => <MenuItem key={c.id} value={c.id}>{c.name}</MenuItem>)}
             </Select>
           </FormControl>
@@ -507,24 +623,24 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
           <TextField
             label={t("jobTableLocation")}
             value={locationFilter}
-            onChange={(e) => { setLocationFilter(e.target.value); setPage(0); }}
+            onChange={(e) => changeLocation(e.target.value)}
             sx={{ width: { xs: "100%", sm: 220 }, flex: { xs: "1 1 100%", md: "1 1 200px" } }}
           />
 
           <Box sx={{ display: "flex", alignItems: "center", gap: 1, flexWrap: "wrap", width: { xs: "100%", xl: "auto" } }}>
-            {mode === "jobs" ? <FormControlLabel control={<Checkbox checked={needsFollowUpOnly} onChange={(e) => { setNeedsFollowUpOnly(e.target.checked); setPage(0); }} />} label={t("jobTableNeedsFollowUp")} sx={{ mr: 0 }} /> : null}
+            {mode === "jobs" ? <FormControlLabel control={<Checkbox checked={needsFollowUpOnly} onChange={(e) => changeNeedsFollowUp(e.target.checked)} />} label={t("jobTableNeedsFollowUp")} sx={{ mr: 0 }} /> : null}
             {mode === "jobs" ? (
               <FormControl size="small" sx={{ width: { xs: "100%", sm: 180 } }}>
                 <InputLabel>{t("jobTableReadiness")}</InputLabel>
-                <Select value={readinessFilter} label={t("jobTableReadiness")} onChange={(e) => setReadinessFilter(e.target.value as any)}>
+                <Select value={readinessFilter} label={t("jobTableReadiness")} onChange={(e) => changeReadiness(e.target.value as ReadinessFilter)}>
                   <MenuItem value="all">{t("jobTableAllReadiness")}</MenuItem>
                   <MenuItem value="needs-work">{t("jobTableNeedsWork")}</MenuItem>
                   <MenuItem value="interview">{t("jobTableInterviewStage")}</MenuItem>
                 </Select>
               </FormControl>
             ) : null}
-            {mode === "jobs" ? <FormControlLabel control={<Checkbox checked={includeDeleted} onChange={(e) => { setIncludeDeleted(e.target.checked); setPage(0); }} />} label={t("jobTableShowDeleted")} sx={{ mr: 0 }} /> : null}
-            <SavedViewsMenu current={{ q: search.trim() || undefined, status: statusFilter !== "All" ? statusFilter : undefined, companyId: companyFilterId === "All" ? undefined : (companyFilterId as number), location: locationFilter.trim() || undefined, needsFollowUp: needsFollowUpOnly ? true : undefined }} onApply={(p: SavedViewParams) => { setSearch(p.q ?? ""); setStatusFilter(p.status ?? "All"); setCompanyFilterId(p.companyId ?? "All"); setLocationFilter(p.location ?? ""); setNeedsFollowUpOnly(Boolean(p.needsFollowUp)); setPage(0); }} />
+            {mode === "jobs" ? <FormControlLabel control={<Checkbox checked={includeDeleted} onChange={(e) => changeIncludeDeleted(e.target.checked)} />} label={t("jobTableShowDeleted")} sx={{ mr: 0 }} /> : null}
+            <SavedViewsMenu current={{ q: search.trim() || undefined, status: statusFilter !== "All" ? statusFilter : undefined, companyId: companyFilterId === "All" ? undefined : (companyFilterId as number), location: locationFilter.trim() || undefined, needsFollowUp: needsFollowUpOnly ? true : undefined }} onApply={applySavedView} />
             {!isMobile ? <Tooltip title={t("jobTableColumns")}><IconButton onClick={(e) => setColumnsAnchor(e.currentTarget)}><ViewColumnIcon /></IconButton></Tooltip> : null}
           </Box>
         </Box>
@@ -808,7 +924,7 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
             </Table>
           </Box>
         )}
-        <TablePagination component="div" count={total} page={page} onPageChange={(_, next) => setPage(next)} rowsPerPage={pageSize} onRowsPerPageChange={(e) => { onPageSizeChange(Number(e.target.value) as 15 | 20 | 25); setPage(0); }} rowsPerPageOptions={[15, 20, 25]} />
+        <TablePagination component="div" count={total} page={page} onPageChange={(_, next) => { setPage(next); updateListRoute({ page: next > 0 ? String(next + 1) : null }); }} rowsPerPage={pageSize} onRowsPerPageChange={(e) => { onPageSizeChange(Number(e.target.value) as 15 | 20 | 25); setPage(0); updateListRoute({ page: null }); }} rowsPerPageOptions={[15, 20, 25]} />
       </Paper>
 
       <JobDetailsDialog open={detailsJobId !== null} jobId={detailsJobId} initialTab={detailsInitialTab} initialFollowUpMode={detailsFollowUpMode} onClose={() => { setDetailsJobId(null); setDetailsInitialTab(0); setDetailsFollowUpMode(undefined); }} onOpenWorkspace={(id) => { setDetailsJobId(null); updateWorkspaceRoute(id); }} />