JobTrackerApi.Tests/ApplicationWorkspaceTests.cs

@@ -75,6 +75,8 @@ public sealed class ApplicationWorkspaceTests
         Assert.Equal("Backend Developer", o!.JobTitle);
         Assert.Equal("Acme", o.Company);
         Assert.Equal("Oslo", o.Location);
+        Assert.Equal("Needs .NET and SQL.", o.Description);
+        Assert.Equal(job.SavedAt, o.SavedAt);
         Assert.True(o.HasJobDescription);
         Assert.Null(o.Cv.VariantId);          // no variant attached yet
         Assert.False(o.HasCoverLetter);

JobTrackerApi/Services/ApplicationWorkspaceService.cs

@@ -28,6 +28,14 @@ public sealed record WorkspaceOverviewDto(
     DateTime? FollowUpAt,
     string? NextAction,
     string? JobUrl,
+    DateTime SavedAt,
+    string? Description,
+    string? TranslatedDescription,
+    string? DescriptionLanguage,
+    IReadOnlyList<string> Tags,
+    string? Notes,
+    string? Source,
+    string? CountryCode,
     bool HasJobDescription,
     WorkspaceCvDto Cv,
     bool HasCoverLetter,
@@ -59,7 +67,9 @@ public sealed class ApplicationWorkspaceService : IApplicationWorkspaceService
 
     public async Task<WorkspaceOverviewDto?> GetOverviewAsync(string ownerUserId, int jobApplicationId, CancellationToken ct)
     {
-        var job = await _db.JobApplications.AsNoTracking().Include(j => j.Company)
+        var job = await _db.JobApplications.AsNoTracking()
+            .Include(j => j.Company)
+            .Include(j => j.Job)
             .FirstOrDefaultAsync(j => j.Id == jobApplicationId && j.OwnerUserId == ownerUserId, ct);
         if (job is null) return null;
 
@@ -116,7 +126,15 @@ public sealed class ApplicationWorkspaceService : IApplicationWorkspaceService
             job.FollowUpAt,
             job.NextAction,
             job.JobUrl,
-            !string.IsNullOrWhiteSpace(job.Description),
+            job.SavedAt,
+            job.Description,
+            job.TranslatedDescription,
+            job.DescriptionLanguage,
+            JobApplicationHelpers.SplitTags(job.Tags).Distinct(StringComparer.OrdinalIgnoreCase).ToList(),
+            job.Notes,
+            job.Job?.Source,
+            job.Job?.CountryCode,
+            !string.IsNullOrWhiteSpace(job.Description) || !string.IsNullOrWhiteSpace(job.TranslatedDescription),
             cv,
             hasCoverLetter,
             documentCount,

docs/audits/verification-log.md

@@ -193,3 +193,4 @@ Output was reduced to filenames and commit counts. The token artifact appears un
 | 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 |
 | V-161 | `UsersControllerTests`; focused theme/confirm/admin-users Jest; production frontend build; native-confirm search; `git diff --check` | Repository root / `job-tracker-ui` | Verify canonical theme persistence, semantic Alert contrast ownership, app-owned destructive dialogs and final-admin safety | PASS — backend 4/4; theme/confirm 8/8; admin UI 3/3; production build/TypeScript pass; no remaining `window.confirm` in frontend. Self-demotion cancel/confirm, other-admin warning, preserved roles and final-admin disabled/API conflict paths are covered | JSDOM/local mocks only; authenticated real-browser refresh and production remain | Repository safety increment verified |
+| V-162 | Focused workspace/table/workflow Jest; `ApplicationWorkspaceTests`; production frontend build; standalone TypeScript audit; route/native-popup search | Repository root / `job-tracker-ui` | Verify canonical dedicated job workspace, whole-row navigation, independent controls, list-state return, contextual section routes and richer owner-scoped details | PASS — frontend 8/8 and backend 9/9; optimized build passes; direct `/jobs/:id`, section route, return state, missing job and control isolation pass. Standalone TypeScript found only pre-existing test-prop/target errors, with no new application-source error | JSDOM/InMemory backend only; browser widths/themes/refresh and production remain. Legacy dialog source retained for rollback but is no longer reachable from the list | Repository increment verified |

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

@@ -1,6 +1,6 @@
 # JOBS-002 application table and workspace verification
 
-Updated: 2026-08-10
+Updated: 2026-08-15
 
 ## Confirmed baseline
 
@@ -9,25 +9,31 @@ Updated: 2026-08-10
 - “Open application workspace” navigated to `/applications/:id`; its Back control always navigated to a fresh `/jobs`.
 - The existing full-page workspace already composes the owner-scoped checklist, intelligence, CV, cover-letter, attachment, correspondence and interview components. It is reused rather than duplicated.
 
-## Increment 1 — route-backed overlay
+## Superseded overlay increment
 
-- Table row Open now creates `/jobs?workspace={id}` and renders the existing workspace inside an accessible MUI dialog.
-- Workspace sections update `section=` with replacement navigation; opening is a pushed entry, so Back closes and Forward reopens without losing the mounted list state.
-- A direct `/jobs?workspace={id}&section={section}` opens the requested application and closes by safely removing only workspace query keys.
-- MUI owns focus trap/restoration. The dialog is full-screen below 768px and links to `/applications/:id?section=...` as the full-page fallback.
-- Legacy `?open=` quick-dialog links continue to work; their workspace action enters the same overlay route.
+- The route-backed overlay was a verified intermediate design, but the user explicitly requested a dedicated page instead of a popup.
+- DEC-068 supersedes DEC-065. No new navigation emits `?open=` or `?workspace=`.
+
+## Increment 2 — canonical dedicated workspace
+
+- `/jobs/:id` is the canonical workspace route; `/applications/:id` is a query-preserving compatibility redirect.
+- The entire desktop row and mobile card navigate to the workspace. Buttons, links, checkboxes and menus remain independent controls; keyboard users can open a focused row with Enter or Space.
+- Expandable detail rows and the legacy popup are removed from the applications-list flow. The table now prioritises company, role, location, status, applied date, elapsed days, deadline and optional source URL.
+- The workspace aggregate now includes discovery date, full/translated advert text, language, tags, notes and available source/country provenance. Job Details renders these without overflowing and exposes the existing editor.
+- Workflow, quick-command, correspondence and Gmail-review links route to the appropriate dedicated workspace section.
+- Correspondence and Gmail Review are removed from primary sidebar navigation; the global inbox routes remain available for compatibility and genuinely global review work.
+- Return navigation preserves the complete URL-owned list state, including when a workspace section changes.
 
 ## Verification
 
-- Focused Jest: `src/application-workspace-overlay.test.tsx` — 2/2 pass.
-- Full frontend Jest: 51 suites and 206/206 tests pass; existing force-exit notice remains.
-- Production build and TypeScript: pass.
-- Evidence: V-158 and V-159 in `docs/audits/verification-log.md`.
+- Focused Jest: workspace/table and workflow routing — 8/8 pass.
+- Focused backend workspace aggregate: 9/9 pass.
+- Production build: pass. Standalone repository-wide `tsc --noEmit` still exposes pre-existing React Router test-prop and target errors; no new application-source error was reported.
+- Evidence: V-158–V-162 in `docs/audits/verification-log.md`.
 
 ## Remaining before completion
 
-- 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.
+- URL-owned list state is implemented for search, status, company, location, follow-up, readiness, deleted visibility, sort/direction and page. Direct hydration and dedicated-page return 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.
 - Run tenant-authorization regressions and the production smoke gate.

docs/work-programmes/decisions.md

@@ -669,3 +669,13 @@
 - **Consequences:** the final administrator cannot be removed by supported API paths. A self-demotion remains possible only when another administrator exists and the user explicitly confirms.
 - **User approval required:** No; this is requested safety hardening with no production mutation.
 - **Reversible:** Revert the controller/UI change; no stored data or schema changed.
+
+## DEC-068 — Make the job workspace a dedicated canonical page
+
+- **Date:** 2026-08-15
+- **Decision:** Supersede DEC-065. Route every job/application open action to `/jobs/:id`, keep `/applications/:id` only as a query-preserving compatibility redirect, and remove the legacy dialog/expandable-detail path from the applications table. Preserve the URL-owned list location in route state for the workspace return control.
+- **Reason/evidence:** the user explicitly rejected the popup interaction and asked for a scalable application workspace. The existing workspace already composes the authoritative checklist, CV, cover-letter, documents, intelligence, timeline and correspondence domains, so the safe change is canonical routing and richer aggregate data rather than another implementation.
+- **Alternatives considered:** retain the route-backed overlay; make a drawer; copy legacy dialog tools into a new page. These conflict with the requested dedicated-page model or duplicate domain ownership.
+- **Consequences:** rows/cards and contextual shortcuts open one responsive workspace; internal row controls remain independent; list state survives return; old application links still resolve. The former quick dialog remains in source for rollback until broader regression proves it can be safely deleted.
+- **User approval required:** No; explicitly requested.
+- **Reversible:** Restore DEC-065 routing/list presentation; no schema or stored data changed.

docs/work-programmes/master-progress.md

@@ -3,7 +3,7 @@
 Updated: 2026-08-15
 
 - **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` — dedicated application workspace and scan-friendly applications table (`IN PROGRESS`). URL-owned list state is pushed. The requested theme/admin safety increment is locally verified; dedicated `/jobs/:id` navigation is next.
+- **Current work package:** `JOBS-002` — dedicated application workspace and scan-friendly applications table (`IN PROGRESS`). Canonical `/jobs/:id`, compact whole-row navigation, sidebar cleanup and richer job details are locally verified; notification popover and browser regression 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-15
 - **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 baseline 631/631 plus admin safety 4/4; frontend baseline 51/51 suites and 207/207 plus theme/confirm/admin focused 11/11; 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 baseline 631/631 plus admin safety 4/4 and workspace 9/9; frontend baseline 51/51 suites and 207/207 plus theme/confirm/admin focused 11/11 and JOBS-002 focused 8/8; 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/master-work-plan.md

@@ -673,23 +673,23 @@ Ordering differences from the suggested list:
 - **Commit:** `511a9f6` (honest provenance/import), `3f74b23` (result states/sort), `82f4526` (duplicate/browser/contrast regression and evidence).
 - **Remaining work:** live NAV compatibility, native mobile assistive-technology and production smoke. Add source filtering only when more than one real source is available.
 
-### JOBS-002 — Applications table and embedded workspace
+### JOBS-002 — Applications table and dedicated workspace
 
 - **Source programme:** Work Phase 11.
 - **Original requirement references:** `work.md:562-634`.
 - **Related findings:** JT-003, JT-004, JT-015, JT-021.
 - **Priority:** P2.
 - **Dependencies:** CORE-001/002, MAIL-001 embedding contract, AI-003 status.
-- **Affected components:** applications table, filters/search/sort, route-backed drawer/modal/full-page fallback, workspace sections/focus/unsaved state.
-- **Acceptance criteria:** scan-friendly priority columns; list context preserved; deep-link/back-forward/direct URL; accessible focus/close; mobile full-screen; no nested modal; full-page fallback.
+- **Affected components:** applications table, filters/search/sort, canonical dedicated route, workspace sections/focus/unsaved state.
+- **Acceptance criteria:** scan-friendly priority columns; list context preserved; deep-link/back-forward/direct URL; accessible focus/return; responsive dedicated page; no job-details popup.
 - **Required tests:** route/history/filter persistence/focus/unsaved/direct link/mobile, tenant authorization.
 - **Required browser verification:** three widths/themes/keyboard/back-forward/refresh/error/long data.
 - **Required production verification:** existing application/workspace smoke.
 - **Status:** `IN PROGRESS`.
 - **Blocker:** none after dependencies.
-- **Evidence:** V-158 execution-path inventory; V-159 first route-backed overlay tests/build; `docs/verification/jobs-002-application-workspace.md`.
-- **Commit:** none.
-- **Remaining work:** first overlay increment implemented: row Open is route-backed, direct/section URLs and Back/Forward work, MUI owns focus trapping/restoration, mobile is full-screen, and full-page fallback remains. Still required: persist complete list/filter/page state in the URL; guard dirty section edits; improve scan-priority columns/states; browser widths/themes/keyboard/history/error/long-data checks; authorization regression and production smoke. Do not place every field in table or duplicate workspace data.
+- **Evidence:** V-158–V-162; `docs/verification/jobs-002-application-workspace.md`.
+- **Commit:** `bd5362c` (URL-owned list state); dedicated page commit pending.
+- **Remaining work:** canonical `/jobs/:id`, row/card navigation, compact priority columns, richer job details, contextual links and sidebar cleanup are implemented. Still required: dirty-edit navigation guard where section editors lack one; notification popover; browser widths/themes/keyboard/history/error/long-data checks; authorization regression and production smoke. Do not place every field in the table or duplicate workspace data.
 
 ### UX-003 — Kanban theme-state correction
 

docs/work-programmes/session-handoff.md

@@ -2,17 +2,17 @@
 
 Updated: 2026-08-15
 
-- **Exact current task:** continue the 2026-08-15 application UX programme; next implement dedicated `/jobs/:id` workspace/list/sidebar/notification changes after the completed theme/admin safety increment.
-- **Last completed step:** pushed `bd5362c`; then V-161 canonical theme, Alert contrast, app-owned CV confirmations and final-admin protection passed focused tests/build and awaits the next logical commit.
-- **Files currently modified:** theme/bootstrap/tests, admin API/UI/tests/translations, CV dialog use, UX verification/tracking documents.
-- **Commands already run:** V-160 focused/build and push; V-161 backend 4/4, theme/confirm 8/8, admin UI 3/3, production frontend build and patch/native-confirm review.
-- **Test results:** backend baseline 631/631 plus focused admin 4/4; frontend baseline 207/207 plus focused V-161 11/11; production build passes. Jest retains its known force-exit/open-handle notice.
+- **Exact current task:** continue JOBS-002; implement the top notification popover, then complete browser regression for the dedicated application workspace.
+- **Last completed step:** canonical `/jobs/:id`, compact whole-row navigation, richer job details, route compatibility, contextual workflow links and sidebar cleanup passed focused tests.
+- **Files currently modified:** JOBS-002 API aggregate, workspace/list/routes/tests and tracking documents.
+- **Commands already run:** workspace/table/workflow Jest 8/8; ApplicationWorkspace backend 9/9; production frontend build; standalone `tsc --noEmit` baseline audit.
+- **Test results:** focused JOBS frontend 8/8 and backend 9/9; production build passes. Repository-wide standalone TypeScript still reports pre-existing React Router test `future` props, one Testing Library option and ES target errors; application source added no error.
 - **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:** V-161 theme/admin/dialog safety and tracking; no dependency/schema/config change.
+- **Uncommitted changes:** V-162 dedicated job workspace/list/sidebar increment 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:** commit/push V-161; replace the route-backed job popup with the dedicated workspace while preserving working job actions and URL-owned list state.
+- **Exact next action:** commit/push V-162; add the bell notification popover without removing the Operations page.
 - **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/App.tsx

@@ -13,11 +13,10 @@ import AlarmIcon from "@mui/icons-material/Alarm";
 import AccountCircleIcon from "@mui/icons-material/AccountCircle";
 import ShieldIcon from "@mui/icons-material/Shield";
 import SearchIcon from "@mui/icons-material/Search";
-import MailOutlineIcon from "@mui/icons-material/MailOutline";
 import MemoryIcon from "@mui/icons-material/Memory";
 import DescriptionOutlinedIcon from "@mui/icons-material/DescriptionOutlined";
 
-import { Navigate, Route, Routes, useLocation, useNavigate, createBrowserRouter, RouterProvider } from "react-router-dom";
+import { Navigate, Route, Routes, useLocation, useNavigate, useParams, createBrowserRouter, RouterProvider } from "react-router-dom";
 
 import { ToastProvider } from "./toast";
 import { ConfirmProvider } from "./confirm";
@@ -83,6 +82,7 @@ type MeResponse = {
 function breadcrumbsFor(path: string, t: (k: any) => string): string[] {
   if (path.startsWith("/dashboard")) return [t("home"), t("analytics"), t("overview")];
   if (path.startsWith("/discover")) return [t("home"), "Discover jobs"];
+  if (/^\/jobs\/\d+/.test(path)) return [t("home"), t("jobApplications"), "Job details"];
   if (path.startsWith("/jobs")) return [t("home"), t("jobApplications")];
   if (path.startsWith("/reminders")) return [t("home"), t("reminders")];
   if (path.startsWith("/operations")) return [t("home"), "Operations"];
@@ -107,6 +107,7 @@ function titleFor(path: string, t: (k: any) => string): string {
   if (path.startsWith("/reminders")) return t("reminders");
   if (path.startsWith("/operations")) return "Operations";
   if (path.startsWith("/discover")) return "Discover jobs";
+  if (/^\/jobs\/\d+/.test(path)) return "Job details";
   if (path.startsWith("/jobs")) return t("jobApplications");
   if (path.startsWith("/kanban")) return t("kanbanBoard");
   if (path.startsWith("/companies")) return t("companies");
@@ -127,6 +128,7 @@ function titleFor(path: string, t: (k: any) => string): string {
 function subtitleFor(path: string, t: (k: any) => string): string | undefined {
   if (path === "/dashboard") return t("dashboardPageSubtitle");
   if (path.startsWith("/discover")) return "Search official job-board feeds and save opportunities to your tracker.";
+  if (/^\/jobs\/\d+/.test(path)) return "Manage this application, its documents, timeline, and correspondence.";
   if (path.startsWith("/jobs")) return t("jobsPageSubtitle");
   if (path.startsWith("/kanban")) return t("kanbanPageSubtitle");
   if (path.startsWith("/reminders")) return t("remindersPageSubtitle");
@@ -139,6 +141,12 @@ function PageLoader() {
   return <Box sx={{ p: 4 }}><Typography variant="h6">Loading...</Typography></Box>;
 }
 
+function LegacyApplicationRedirect() {
+  const { id } = useParams();
+  const location = useLocation();
+  return <Navigate to={`/jobs/${id ?? ""}${location.search}`} replace state={location.state} />;
+}
+
 function Shell({ jobPageSize, setJobPageSize, jobColumns, setJobColumns, themeMode, onThemeModeChange }: { jobPageSize: 15 | 20 | 25; setJobPageSize: (n: 15 | 20 | 25) => void; jobColumns: JobTableColumns; setJobColumns: (c: JobTableColumns) => void; themeMode: ThemeModePref; onThemeModeChange: (v: ThemeModePref) => void; }) {
   const location = useLocation();
   const navigate = useNavigate();
@@ -270,8 +278,6 @@ function Shell({ jobPageSize, setJobPageSize, jobColumns, setJobColumns, themeMo
     { to: "/reminders", label: t("reminders"), icon: <AlarmIcon fontSize="small" />, badgeCount: reminderCount, section: t("manage") },
     { to: "/kanban", label: t("kanbanBoard"), icon: <ViewKanbanIcon fontSize="small" />, section: t("manage") },
     { to: "/companies", label: t("companies"), icon: <BusinessIcon fontSize="small" />, section: t("manage") },
-    { to: "/correspondence", label: "Correspondence", icon: <MailOutlineIcon fontSize="small" />, section: t("manage") },
-    { to: "/correspondence/review", label: "Gmail review", icon: <MailOutlineIcon fontSize="small" />, section: t("manage") },
     { to: "/career", label: "Career Workspace", icon: <DescriptionOutlinedIcon fontSize="small" />, section: t("manage") },
     { to: "/career/builder", label: "CV Builder", icon: <DescriptionOutlinedIcon fontSize="small" />, section: t("manage") },
     { to: "/trash", label: t("trash"), icon: <DeleteOutlineIcon fontSize="small" />, section: t("manage") },
@@ -353,6 +359,7 @@ function Shell({ jobPageSize, setJobPageSize, jobColumns, setJobColumns, themeMo
             <Route path="/dashboard" element={<DashboardView />} />
             <Route path="/discover" element={<JobDiscoveryPage />} />
             <Route path="/jobs" element={<JobTable refreshToken={refreshToken} pageSize={jobPageSize} onPageSizeChange={setAndPersistPageSize} columns={jobColumns} onColumnsChange={setAndPersistColumns} mode="jobs" />} />
+            <Route path="/jobs/:id" element={<ApplicationWorkspacePage />} />
             <Route path="/reminders" element={<RemindersView />} />
             <Route path="/operations" element={<OperationsPage />} />
             <Route path="/kanban" element={<KanbanBoard />} />
@@ -360,7 +367,7 @@ function Shell({ jobPageSize, setJobPageSize, jobColumns, setJobColumns, themeMo
             <Route path="/correspondence" element={<CorrespondenceInboxPage />} />
             <Route path="/correspondence/review" element={<Navigate to="/correspondence?view=review" replace />} />
             <Route path="/profile" element={<ProfilePage />} />
-            <Route path="/applications/:id" element={<ApplicationWorkspacePage />} />
+            <Route path="/applications/:id" element={<LegacyApplicationRedirect />} />
             <Route path="/career" element={<CareerWorkspacePage />} />
             <Route path="/career/builder" element={<CvBuilderPage />} />
             <Route path="/career/builder/:id" element={<CvBuilderEditor />} />

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

@@ -1,7 +1,7 @@
 import React from "react";
 import "@testing-library/jest-dom";
-import { fireEvent, render, screen, waitFor } from "@testing-library/react";
-import { MemoryRouter, Route, Routes, useLocation, useNavigate } from "react-router-dom";
+import { fireEvent, render, screen, waitFor, within } from "@testing-library/react";
+import { MemoryRouter, Route, Routes, useLocation } from "react-router-dom";
 
 import { api } from "./api";
 import JobTable from "./components/JobTable";
@@ -9,6 +9,7 @@ import { ConfirmProvider } from "./confirm";
 import { I18nProvider } from "./i18n/I18nProvider";
 import { PromptProvider } from "./prompt";
 import { ToastProvider } from "./toast";
+import ApplicationWorkspacePage from "./views/ApplicationWorkspacePage";
 
 jest.mock("./components/Attachments", () => () => <div>Documents section</div>);
 jest.mock("./components/Correspondence", () => () => <div>Communication section</div>);
@@ -57,6 +58,14 @@ const overview = {
   followUpAt: null,
   nextAction: null,
   jobUrl: null,
+  savedAt: "2026-08-01T00:00:00Z",
+  description: "Build APIs",
+  translatedDescription: null,
+  descriptionLanguage: "en",
+  tags: [".NET", "SQL"],
+  notes: "Ask about the platform team.",
+  source: "nav",
+  countryCode: "NO",
   hasJobDescription: true,
   cv: { variantId: null, variantName: null, themeId: null, hasTailoredCvText: false, updatedAtUtc: null },
   hasCoverLetter: false,
@@ -71,11 +80,9 @@ const overview = {
 
 function LocationControls() {
   const location = useLocation();
-  const navigate = useNavigate();
   return (
     <>
       <output data-testid="location">{location.pathname}{location.search}</output>
-      <button onClick={() => navigate(1)}>Browser forward</button>
     </>
   );
 }
@@ -86,10 +93,11 @@ function renderTable(path = "/jobs") {
       <I18nProvider>
         <ConfirmProvider>
           <PromptProvider>
-            <MemoryRouter initialEntries={[path]} future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
+            <MemoryRouter initialEntries={[path]}>
               <LocationControls />
               <Routes>
                 <Route path="/jobs" element={<JobTable refreshToken={0} pageSize={15} onPageSizeChange={() => {}} columns={{ status: true, dateApplied: true, daysSince: true, jobUrl: false }} onColumnsChange={() => {}} />} />
+                <Route path="/jobs/:id" element={<ApplicationWorkspacePage />} />
               </Routes>
             </MemoryRouter>
           </PromptProvider>
@@ -104,46 +112,57 @@ beforeEach(() => {
     if (url === "/companies") return Promise.resolve({ data: [{ id: 1, name: "Acme" }] } as any);
     if (url === "/jobapplications") return Promise.resolve({ data: { items: [job], total: 1, page: 1, pageSize: 15 } } as any);
     if (url === "/jobapplications/42/workspace") return Promise.resolve({ data: overview } as any);
+    if (url === "/jobapplications/999/workspace") return Promise.reject({ response: { status: 404, data: { detail: "Application not found." } } });
     return Promise.resolve({ data: [] } as any);
   });
 });
 
 afterEach(() => jest.clearAllMocks());
 
-test("opens the workspace in a route-backed overlay and preserves list state through Back/Forward", async () => {
+test("opens the dedicated workspace from the whole row and preserves list state on return", async () => {
   renderTable();
 
   const search = await screen.findByRole("textbox", { name: /search/i });
   fireEvent.change(search, { target: { value: "backend" } });
-  fireEvent.click(await screen.findByRole("button", { name: /open: backend developer/i }));
+  fireEvent.click(await screen.findByRole("row", { name: /open backend developer/i }));
 
-  await screen.findByRole("dialog", { name: /application workspace/i });
-  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");
+  expect(await screen.findByText("Backend Developer")).toBeInTheDocument();
+  expect(screen.getByTestId("location")).toHaveTextContent("/jobs/42");
 
   fireEvent.click(screen.getByRole("button", { name: "Match" }));
   expect(await screen.findByText("Match section")).toBeInTheDocument();
-  expect(screen.getByTestId("location")).toHaveTextContent("/jobs?q=backend&workspace=42&section=match");
+  expect(screen.getByTestId("location")).toHaveTextContent("/jobs/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?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?q=backend&workspace=42&section=match");
+  await waitFor(() => expect(screen.getByTestId("location")).toHaveTextContent("/jobs?q=backend"));
+  expect(await screen.findByRole("textbox", { name: /search/i })).toHaveValue("backend");
 });
 
-test("opens a direct workspace URL and closes it without inventing browser history", async () => {
-  renderTable("/jobs?workspace=42&section=match");
+test("opens a direct workspace URL and returns to applications", async () => {
+  renderTable("/jobs/42?section=match");
 
-  await screen.findByRole("dialog", { name: /application workspace/i });
   expect(await screen.findByText("Match section")).toBeInTheDocument();
 
   fireEvent.click(screen.getByRole("button", { name: /back to applications/i }));
   await waitFor(() => expect(screen.getByTestId("location")).toHaveTextContent("/jobs"));
-  await waitFor(() => expect(screen.queryByRole("dialog", { name: /application workspace/i })).not.toBeInTheDocument());
+});
+
+test("row controls do not trigger navigation", async () => {
+  renderTable();
+
+  const row = await screen.findByRole("row", { name: /open backend developer/i });
+  const checkbox = within(row).getByRole("checkbox");
+  fireEvent.click(checkbox);
+
+  expect(screen.getByTestId("location")).toHaveTextContent(/^\/jobs$/);
+  expect(checkbox).toBeChecked();
+});
+
+test("handles a deleted or inaccessible job without rendering a broken workspace", async () => {
+  renderTable("/jobs/999");
+
+  expect(await screen.findByRole("alert")).toHaveTextContent("Could not open this application");
+  expect(screen.getByRole("button", { name: /back to applications/i })).toBeInTheDocument();
 });
 
 test("hydrates list filters, sort and page from a shareable URL", async () => {

job-tracker-ui/src/applicationWorkspace.ts

@@ -26,6 +26,14 @@ export type WorkspaceOverview = {
   followUpAt: string | null;
   nextAction: string | null;
   jobUrl: string | null;
+  savedAt: string;
+  description: string | null;
+  translatedDescription: string | null;
+  descriptionLanguage: string | null;
+  tags: string[];
+  notes: string | null;
+  source: string | null;
+  countryCode: string | null;
   hasJobDescription: boolean;
   cv: WorkspaceCv;
   hasCoverLetter: boolean;

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

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useMemo, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
 
 import {
@@ -6,9 +6,6 @@ import {
   Button,
   Checkbox,
   Chip,
-  Collapse,
-  Dialog,
-  DialogContent,
   FormControl,
   FormControlLabel,
   IconButton,
@@ -34,9 +31,6 @@ import useMediaQuery from "@mui/material/useMediaQuery";
 import { alpha, useTheme } from "@mui/material/styles";
 import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline";
 import EditOutlinedIcon from "@mui/icons-material/EditOutlined";
-import LaunchIcon from "@mui/icons-material/Launch";
-import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
-import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp";
 import RestoreFromTrashOutlinedIcon from "@mui/icons-material/RestoreFromTrashOutlined";
 import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
 import ViewColumnIcon from "@mui/icons-material/ViewColumn";
@@ -49,7 +43,6 @@ import { useCompanies } from "../hooks/useCompanies";
 import { useDebouncedValue } from "../hooks/useDebouncedValue";
 import { formatSalary } from "../salary";
 import { statusLabel, statusTone } from "../pipeline";
-import JobDetailsDialog from "./JobDetailsDialog";
 import EditJobDialog from "./EditJobDialog";
 import { useToast } from "../toast";
 import SavedViewsMenu, { SavedViewParams } from "./SavedViewsMenu";
@@ -58,8 +51,6 @@ import { useI18n } from "../i18n/I18nProvider";
 import { JobApplication } from "../types";
 import { useViewResource } from "../hooks/useViewResource";
 import { getWorkflowAction, needsInterviewPrep, needsWorkflowWork } from "../jobWorkflowSignals";
-import { ApplicationWorkspace } from "../views/ApplicationWorkspacePage";
-import { workspaceSection, WorkspaceSectionKey } from "../applicationWorkspace";
 
 interface PagedResult<T> {
   items: T[];
@@ -79,13 +70,10 @@ type RowActionSignal = {
 type JobRowViewModel = {
   job: JobApplication;
   toneName: string;
-  overview: string;
   tags: string[];
   actionSignals: RowActionSignal[];
-  primaryAction: RowActionSignal | null;
   appliedDateLabel: string;
   isSelected: boolean;
-  isExpanded: boolean;
 };
 
 export type JobTableColumns = {
@@ -174,11 +162,8 @@ function EmptyJobsState({ firstTime, onOpenSettings, t }: { firstTime: boolean;
   );
 }
 
-function generateOverview(job: JobApplication): string {
-  if (job.fullSummary) return job.fullSummary;
-  if (job.shortSummary) return job.shortSummary;
-  const src = (job.description || job.notes || "").replace(/<[^>]+>/g, " ").replace(/\s+/g, " ").trim();
-  return src.length > 220 ? `${src.slice(0, 220)}...` : src;
+function isInteractiveTarget(target: EventTarget | null): boolean {
+  return target instanceof Element && Boolean(target.closest("button, a, input, select, textarea, [role='button'], [role='menuitem'], [role='checkbox']"));
 }
 
 export default function JobTable({ refreshToken, pageSize, onPageSizeChange, columns, onColumnsChange, mode = "jobs" }: Props) {
@@ -189,10 +174,10 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
   const { confirmAction } = useDialogActions();
   const location = useLocation();
   const navigate = useNavigate();
+  const listRouteRef = useRef(`${location.pathname}${location.search}`);
   const [jobs, setJobs] = useState<JobApplication[]>([]);
   const [total, setTotal] = useState(0);
   const [page, setPage] = useState(() => queryPage(location.search));
-  const [expanded, setExpanded] = useState<number[]>([]);
   const [selectedIds, setSelectedIds] = useState<number[]>([]);
   const [search, setSearch] = useState(() => new URLSearchParams(location.search).get("q") ?? "");
   const debouncedSearch = useDebouncedValue(search, 250);
@@ -205,18 +190,12 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
   const [readinessFilter, setReadinessFilter] = useState<ReadinessFilter>(() => queryReadiness(location.search));
   const { companies, error: companiesError, reload: reloadCompanies } = useCompanies();
   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);
   const [editJobId, setEditJobId] = useState<number | null>(null);
   const [reloadToken, setReloadToken] = useState(0);
   const [statusAnchor, setStatusAnchor] = useState<null | HTMLElement>(null);
   const [statusJobId, setStatusJobId] = useState<number | null>(null);
   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);
@@ -224,9 +203,15 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
       if (value) next.set(key, value);
       else next.delete(key);
     });
-    navigate({ pathname: location.pathname, search: next.toString() ? `?${next.toString()}` : "" }, { replace: true, state: location.state });
+    const search = next.toString() ? `?${next.toString()}` : "";
+    listRouteRef.current = `${location.pathname}${search}`;
+    navigate({ pathname: location.pathname, search }, { replace: true, state: location.state });
   }, [location.pathname, location.search, location.state, navigate]);
 
+  useEffect(() => {
+    listRouteRef.current = `${location.pathname}${location.search}`;
+  }, [location.pathname, location.search]);
+
   useEffect(() => {
     const next = new URLSearchParams(location.search);
     setSearch(next.get("q") ?? "");
@@ -301,33 +286,9 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
     });
   };
 
-  const updateWorkspaceRoute = (jobId: number, section: WorkspaceSectionKey = "overview") => {
-    const next = new URLSearchParams(location.search);
-    next.set("workspace", String(jobId));
-    if (section === "overview") next.delete("section");
-    else next.set("section", section);
-    navigate({ pathname: location.pathname, search: `?${next.toString()}` }, { state: { workspaceOverlay: true } });
-  };
-
-  const updateWorkspaceSection = (section: WorkspaceSectionKey) => {
-    if (!workspaceJobId) return;
-    const next = new URLSearchParams(location.search);
-    next.set("workspace", String(workspaceJobId));
-    if (section === "overview") next.delete("section");
-    else next.set("section", section);
-    navigate({ pathname: location.pathname, search: `?${next.toString()}` }, { replace: true, state: location.state });
-  };
-
-  const closeWorkspace = () => {
-    if (location.state?.workspaceOverlay) {
-      navigate(-1);
-      return;
-    }
-    const next = new URLSearchParams(location.search);
-    next.delete("workspace");
-    next.delete("section");
-    navigate({ pathname: location.pathname, search: next.toString() ? `?${next.toString()}` : "" }, { replace: true });
-  };
+  const openJob = useCallback((jobId: number, path?: string) => {
+    navigate(path ?? `/jobs/${jobId}`, { state: { from: listRouteRef.current } });
+  }, [navigate]);
 
   const params = useMemo(() => ({
     page: page + 1,
@@ -363,22 +324,6 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
     }
   }, [jobsResource.data, jobsResource.error]);
 
-  useEffect(() => {
-    const paramsSearch = new URLSearchParams(location.search);
-    const openId = Number(paramsSearch.get("open") || 0);
-    const tabIndex = Number(paramsSearch.get("tab") || 0);
-    const followMode = paramsSearch.get("followMode") || undefined;
-    if (!openId || jobs.length === 0) return;
-    const job = jobs.find((j) => j.id === openId);
-    if (!job) return;
-    setDetailsJobId(openId);
-    setDetailsInitialTab(Number.isFinite(tabIndex) ? Math.max(0, Math.min(9, tabIndex)) : 0);
-    setDetailsFollowUpMode(followMode);
-    paramsSearch.delete("open");
-    paramsSearch.delete("tab");
-    navigate({ pathname: location.pathname, search: paramsSearch.toString() ? `?${paramsSearch.toString()}` : "" }, { replace: true });
-  }, [jobs, location.pathname, location.search, navigate]);
-
   const requestSort = (key: JobSortKey) => {
     const nextDirection = sortBy === key ? (sortDir === "asc" ? "desc" : "asc") : "asc";
     setSortBy(key);
@@ -387,10 +332,6 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
     updateListRoute({ sortBy: key === "dateApplied" ? null : key, sortDir: key === "dateApplied" && nextDirection === "desc" ? null : nextDirection, page: null });
   };
 
-  const toggleExpanded = (id: number) => {
-    setExpanded((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));
-  };
-
   const filteredJobs = useMemo(() => {
     if (readinessFilter === "all") return jobs;
     if (readinessFilter === "interview") return jobs.filter((job) => needsInterviewPrep(job));
@@ -485,29 +426,26 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
     return {
       label: action.label,
       detail: action.detail,
-      onClick: () => navigate(action.path),
+      onClick: () => openJob(job.id, action.path),
       variant: action.key === "follow-up" ? "contained" : "outlined",
       color: action.key === "follow-up" ? "warning" : "primary",
     };
-  }, [navigate, t]);
+  }, [openJob, t]);
 
   const rowModels = useMemo<JobRowViewModel[]>(() => filteredJobs.map((job) => {
     const actionSignal = buildWorkflowActionSignal(job);
     return {
       job,
       toneName: statusTone(job.status),
-      overview: generateOverview(job),
       tags: parseTags(job.tags),
       actionSignals: actionSignal ? [actionSignal] : [],
-      primaryAction: actionSignal,
       appliedDateLabel: job.dateApplied ? new Date(job.dateApplied).toLocaleDateString() : "—",
       isSelected: selectedIdSet.has(job.id),
-      isExpanded: expanded.includes(job.id),
     };
-  }), [buildWorkflowActionSignal, expanded, filteredJobs, selectedIdSet]);
+  }), [buildWorkflowActionSignal, filteredJobs, selectedIdSet]);
 
   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 visibleDesktopColumns = 6 + Number(columns.status) + Number(columns.dateApplied) + Number(columns.daysSince) + Number(columns.jobUrl);
   const selectedCompanyIsLoading = companyFilterId !== "All" && !companies.some((company) => company.id === companyFilterId);
 
   return (
@@ -697,17 +635,32 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
             </Box>
 
             {jobsResource.loading ? <Typography sx={{ py: 2, textAlign: "center" }}>{t("loading")}</Typography> : null}
-            {!jobsResource.loading && !jobsResource.error && rowModels.map(({ job, toneName, actionSignals, tags, overview, primaryAction, appliedDateLabel, isSelected }) => {
+            {!jobsResource.loading && !jobsResource.error && rowModels.map(({ job, toneName, actionSignals, tags, appliedDateLabel, isSelected }) => {
               const compactTags = tags.slice(0, 6);
               return (
                 <Paper
                   key={job.id}
+                  role={mode === "jobs" && !job.isDeleted ? "link" : undefined}
+                  tabIndex={mode === "jobs" && !job.isDeleted ? 0 : undefined}
+                  aria-label={mode === "jobs" && !job.isDeleted ? `Open ${job.jobTitle} at ${job.company?.name ?? "company"}` : undefined}
+                  onClick={(event) => {
+                    if (mode === "jobs" && !job.isDeleted && !isInteractiveTarget(event.target)) openJob(job.id);
+                  }}
+                  onKeyDown={(event) => {
+                    if (mode === "jobs" && !job.isDeleted && event.target === event.currentTarget && (event.key === "Enter" || event.key === " ")) {
+                      event.preventDefault();
+                      openJob(job.id);
+                    }
+                  }}
                   sx={{
                     p: 1.5,
                     borderRadius: 3.5,
+                    cursor: mode === "jobs" && !job.isDeleted ? "pointer" : "default",
                     backgroundColor: alpha(theme.palette.primary.main, 0.03),
                     borderColor: alpha(theme.palette.primary.main, 0.08),
                     boxShadow: `0 10px 24px ${alpha(theme.palette.common.black, theme.palette.mode === "dark" ? 0.18 : 0.06)}`,
+                    "&:hover": mode === "jobs" && !job.isDeleted ? { backgroundColor: "action.hover" } : undefined,
+                    "&:focus-visible": { outline: "3px solid", outlineColor: "primary.main", outlineOffset: 2 },
                   }}
                 >
                   <Stack spacing={1.25}>
@@ -778,27 +731,6 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
                       </Box>
                     ) : null}
 
-                    <Box>
-                      <Typography variant="overline" sx={{ color: "text.secondary" }}>{t("jobTableOverview")}</Typography>
-                      <Typography variant="body2" sx={{ color: "text.secondary", mt: 0.25, whiteSpace: "pre-wrap", textWrap: "pretty" }}>
-                        {overview || t("jobTableNoSummaryYet")}
-                      </Typography>
-                    </Box>
-
-                    {primaryAction ? (
-                      <Box>
-                        <Typography variant="caption" sx={{ color: "text.secondary", fontWeight: 700, display: "block", mb: 0.5 }}>
-                          {t("editJobNextAction")}
-                        </Typography>
-                        <Button variant={primaryAction.variant} color={primaryAction.color} onClick={primaryAction.onClick} fullWidth sx={{ minHeight: 42, fontWeight: 700 }}>
-                          {primaryAction.label}
-                        </Button>
-                        <Typography variant="caption" sx={{ color: "text.secondary", display: "block", mt: 0.75, textWrap: "pretty" }}>
-                          {primaryAction.detail}
-                        </Typography>
-                      </Box>
-                    ) : null}
-
                     <Box sx={{ display: "grid", gridTemplateColumns: "repeat(2, minmax(0, 1fr))", gap: 1 }}>
                       <Button variant="outlined" startIcon={<EditOutlinedIcon />} onClick={() => setEditJobId(job.id)} sx={{ minHeight: 42, fontWeight: 700 }}>
                         {t("jobTableEdit")}
@@ -806,9 +738,6 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
                       <Button variant="outlined" startIcon={<MoreHorizIcon />} onClick={(e) => { setStatusJobId(job.id); setStatusAnchor(e.currentTarget); }} sx={{ minHeight: 42, fontWeight: 700 }}>
                         {t("jobTableQuickStatus")}
                       </Button>
-                      <Button variant="outlined" startIcon={<LaunchIcon />} onClick={() => updateWorkspaceRoute(job.id)} sx={{ minHeight: 42, fontWeight: 700 }}>
-                        {t("jobTableOpen")}
-                      </Button>
                       {(mode === "trash" || (includeDeleted && job.isDeleted)) ? (
                         <Button variant="outlined" startIcon={<RestoreFromTrashOutlinedIcon />} onClick={() => void restore(job.id)} sx={{ minHeight: 42, fontWeight: 700 }}>
                           {t("jobTableRestore")}
@@ -833,30 +762,47 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
               <TableHead>
                 <TableRow>
                   <TableCell padding="checkbox"><Checkbox checked={selectedAllOnPage} indeterminate={selectedIds.length > 0 && !selectedAllOnPage} onChange={(e) => toggleSelectAll(e.target.checked)} /></TableCell>
-                  <TableCell width={1} />
                   <TableCell sortDirection={sortBy === "company" ? sortDir : false}><TableSortLabel active={sortBy === "company"} direction={sortBy === "company" ? sortDir : "asc"} onClick={() => requestSort("company")}>{t("jobTableCompany")}</TableSortLabel></TableCell>
                   <TableCell sortDirection={sortBy === "jobTitle" ? sortDir : false}><TableSortLabel active={sortBy === "jobTitle"} direction={sortBy === "jobTitle" ? sortDir : "asc"} onClick={() => requestSort("jobTitle")}>{t("jobTableRole")}</TableSortLabel></TableCell>
+                  <TableCell sortDirection={sortBy === "location" ? sortDir : false}><TableSortLabel active={sortBy === "location"} direction={sortBy === "location" ? sortDir : "asc"} onClick={() => requestSort("location")}>{t("jobTableLocation")}</TableSortLabel></TableCell>
                   {columns.status ? <TableCell sortDirection={sortBy === "status" ? sortDir : false}><TableSortLabel active={sortBy === "status"} direction={sortBy === "status" ? sortDir : "asc"} onClick={() => requestSort("status")}>{t("jobTableStatus")}</TableSortLabel></TableCell> : null}
                   {columns.dateApplied ? <TableCell sortDirection={sortBy === "dateApplied" ? sortDir : false}><TableSortLabel active={sortBy === "dateApplied"} direction={sortBy === "dateApplied" ? sortDir : "asc"} onClick={() => requestSort("dateApplied")}>{t("jobTableDateApplied")}</TableSortLabel></TableCell> : null}
                   {columns.daysSince ? <TableCell sortDirection={sortBy === "daysSince" ? sortDir : false}><TableSortLabel active={sortBy === "daysSince"} direction={sortBy === "daysSince" ? sortDir : "asc"} onClick={() => requestSort("daysSince")}>{t("jobTableDays")}</TableSortLabel></TableCell> : null}
+                  <TableCell>{t("jobDetailsDeadline")}</TableCell>
                   {columns.jobUrl ? <TableCell>{t("settingsColumnJobUrl")}</TableCell> : null}
                   <TableCell align="right">{t("jobTableActions")}</TableCell>
                 </TableRow>
               </TableHead>
               <TableBody>
                 {jobsResource.loading ? <TableRow><TableCell colSpan={visibleDesktopColumns}><Typography sx={{ py: 2, textAlign: "center" }}>{t("loading")}</Typography></TableCell></TableRow> : null}
-                {!jobsResource.loading && !jobsResource.error && rowModels.map(({ job, toneName, actionSignals, primaryAction, appliedDateLabel, overview, tags, isSelected, isExpanded }) => {
+                {!jobsResource.loading && !jobsResource.error && rowModels.map(({ job, toneName, actionSignals, appliedDateLabel, isSelected }) => {
                   const tone = toneName === "error" ? theme.palette.error.main : toneName === "warning" ? theme.palette.warning.main : toneName === "success" ? theme.palette.success.main : toneName === "info" ? theme.palette.info.main : theme.palette.primary.main;
-                  const detailTags = tags.slice(0, 8);
                   return (
-                    <React.Fragment key={job.id}>
-                      <TableRow sx={{ backgroundColor: alpha(tone, theme.palette.mode === "dark" ? 0.1 : 0.06) }}>
+                      <TableRow
+                        key={job.id}
+                        hover={mode === "jobs" && !job.isDeleted}
+                        tabIndex={mode === "jobs" && !job.isDeleted ? 0 : undefined}
+                        aria-label={mode === "jobs" && !job.isDeleted ? `Open ${job.jobTitle} at ${job.company?.name ?? "company"}` : undefined}
+                        onClick={(event) => {
+                          if (mode === "jobs" && !job.isDeleted && !isInteractiveTarget(event.target)) openJob(job.id);
+                        }}
+                        onKeyDown={(event) => {
+                          if (mode === "jobs" && !job.isDeleted && event.target === event.currentTarget && (event.key === "Enter" || event.key === " ")) {
+                            event.preventDefault();
+                            openJob(job.id);
+                          }
+                        }}
+                        sx={{
+                          cursor: mode === "jobs" && !job.isDeleted ? "pointer" : "default",
+                          backgroundColor: alpha(tone, theme.palette.mode === "dark" ? 0.1 : 0.06),
+                          "&:focus-visible": { outline: "3px solid", outlineColor: "primary.main", outlineOffset: -3 },
+                        }}
+                      >
                         <TableCell padding="checkbox"><Checkbox checked={isSelected} onChange={(e) => toggleSelected(job.id, e.target.checked)} /></TableCell>
-                        <TableCell><IconButton size="small" onClick={() => toggleExpanded(job.id)}>{isExpanded ? <KeyboardArrowUpIcon /> : <KeyboardArrowDownIcon />}</IconButton></TableCell>
-                        <TableCell>{job.company?.name ?? ""}</TableCell>
+                        <TableCell sx={{ minWidth: 140, fontWeight: 700 }}>{job.company?.name ?? ""}</TableCell>
                         <TableCell>
                           <Box sx={{ display: "flex", alignItems: "center", gap: 1, flexWrap: "wrap" }}>
-                            <span>{job.jobTitle}</span>
+                            <Typography component="span" sx={{ fontWeight: 800, overflowWrap: "anywhere" }}>{job.jobTitle}</Typography>
                             {actionSignals.map((signal) => (
                               <Chip
                                 key={`${job.id}-${signal.label}-${signal.detail}`}
@@ -873,48 +819,20 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
                             ))}
                           </Box>
                         </TableCell>
+                        <TableCell sx={{ minWidth: 130 }}>{job.location || "—"}</TableCell>
                         {columns.status ? <TableCell><Chip label={statusLabel(t, job.status)} size="small" color={toneName as any} /></TableCell> : null}
                         {columns.dateApplied ? <TableCell>{appliedDateLabel}</TableCell> : null}
-                        {columns.daysSince ? <TableCell>{job.daysSince}</TableCell> : null}
+                        {columns.daysSince ? <TableCell>{job.daysSince ?? "—"}</TableCell> : null}
+                        <TableCell>{job.deadline ? new Date(job.deadline).toLocaleDateString() : "—"}</TableCell>
                         {columns.jobUrl ? <TableCell>{job.jobUrl ? <a href={job.jobUrl} target="_blank" rel="noreferrer">{t("jobTableLink")}</a> : ""}</TableCell> : null}
                         <TableCell align="right">
-                          <Box sx={{ display: "flex", flexDirection: "column", alignItems: "flex-end", gap: 0.75 }}>
-                            {primaryAction ? (
-                              <>
-                                <Typography variant="caption" sx={{ color: "text.secondary", fontWeight: 700 }}>
-                                  {t("editJobNextAction")}
-                                </Typography>
-                                <Button size="small" variant={primaryAction.variant} color={primaryAction.color} onClick={primaryAction.onClick} aria-label={`${t("editJobNextAction")}: ${job.jobTitle} — ${primaryAction.label}`}>
-                                  {primaryAction.label}
-                                </Button>
-                                <Typography variant="caption" sx={{ color: "text.secondary", maxWidth: 220, textAlign: "right" }}>
-                                  {primaryAction.detail}
-                                </Typography>
-                              </>
-                            ) : null}
-                            <Box sx={{ display: "flex", justifyContent: "flex-end", gap: 0.5 }}>
+                            <Box sx={{ display: "flex", justifyContent: "flex-end", gap: 0.5, whiteSpace: "nowrap" }}>
                               <Tooltip title={t("jobTableEdit")}><IconButton size="small" onClick={() => setEditJobId(job.id)}><EditOutlinedIcon fontSize="small" /></IconButton></Tooltip>
                               <Tooltip title={t("jobTableQuickStatus")}><IconButton size="small" onClick={(e) => { setStatusJobId(job.id); setStatusAnchor(e.currentTarget); }}><MoreHorizIcon fontSize="small" /></IconButton></Tooltip>
-                              <Tooltip title={t("jobTableOpen")}><IconButton size="small" aria-label={`${t("jobTableOpen")}: ${job.jobTitle}`} onClick={() => updateWorkspaceRoute(job.id)}><LaunchIcon fontSize="small" /></IconButton></Tooltip>
                               {(mode === "trash" || (includeDeleted && job.isDeleted)) ? <Tooltip title={t("jobTableRestore")}><IconButton size="small" onClick={() => void restore(job.id)}><RestoreFromTrashOutlinedIcon fontSize="small" /></IconButton></Tooltip> : <Tooltip title={t("jobTableSoftDelete")}><IconButton size="small" onClick={() => void softDelete(job)}><DeleteOutlineIcon fontSize="small" /></IconButton></Tooltip>}
                             </Box>
-                          </Box>
                         </TableCell>
                       </TableRow>
-                      <TableRow>
-                        <TableCell sx={{ py: 0 }} colSpan={visibleDesktopColumns}>
-                          <Collapse in={isExpanded} timeout="auto" unmountOnExit>
-                            <Box sx={{ p: 2, display: "grid", gridTemplateColumns: { xs: "1fr", md: "1fr 1fr 1fr" }, gap: 2 }}>
-                              <Box><Typography variant="overline">{t("jobTableLocation")}</Typography><Typography>{job.location ?? "-"}</Typography></Box>
-                              <Box><Typography variant="overline">{t("addJobModalSalary")}</Typography><Typography>{formatSalary(job) ?? "-"}</Typography></Box>
-                              <Box><Typography variant="overline">{t("settingsColumnJobUrl")}</Typography><Typography>{job.jobUrl ? <a href={job.jobUrl} target="_blank" rel="noreferrer">{t("jobTableOpenListing")}</a> : "-"}</Typography></Box>
-                              <Box sx={{ gridColumn: "1 / -1" }}><Typography variant="overline">{t("jobTableSkills")}</Typography><Box sx={{ display: "flex", gap: 1, flexWrap: "wrap", mt: 0.5 }}>{detailTags.length ? detailTags.map((tag) => <Chip key={tag} label={tag} size="small" />) : <Typography sx={{ color: "text.secondary" }}>{t("jobTableNoTags")}</Typography>}</Box></Box>
-                              <Box sx={{ gridColumn: "1 / -1" }}><Typography variant="overline">{t("jobTableOverview")}</Typography><Typography sx={{ whiteSpace: "pre-wrap" }}>{overview || t("jobTableNoSummaryYet")}</Typography></Box>
-                            </Box>
-                          </Collapse>
-                        </TableCell>
-                      </TableRow>
-                    </React.Fragment>
                   );
                 })}
                 {filteredJobs.length === 0 && !jobsResource.loading && !jobsResource.error ? (
@@ -927,27 +845,6 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
         <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); }} />
-      <Dialog
-        open={workspaceJobId !== null}
-        onClose={closeWorkspace}
-        fullScreen={isMobile}
-        fullWidth
-        maxWidth="xl"
-        slotProps={{ paper: { "aria-label": "Application workspace" } }}
-      >
-        <DialogContent sx={{ p: { xs: 1.5, sm: 2.5 } }}>
-          {workspaceJobId ? (
-            <ApplicationWorkspace
-              jobIdOverride={workspaceJobId}
-              sectionOverride={workspaceSectionKey}
-              onSectionChange={updateWorkspaceSection}
-              onClose={closeWorkspace}
-              fullPageHref={`/applications/${workspaceJobId}?section=${workspaceSectionKey}`}
-            />
-          ) : null}
-        </DialogContent>
-      </Dialog>
       <EditJobDialog open={editJobId !== null} jobId={editJobId} onClose={() => setEditJobId(null)} onSaved={() => setReloadToken((token) => token + 1)} />
       <Menu anchorEl={statusAnchor} open={Boolean(statusAnchor)} onClose={() => { setStatusAnchor(null); setStatusJobId(null); }}>
         {statusOptions.map((status) => <MenuItem key={status} onClick={() => { if (statusJobId) void setStatusQuick(statusJobId, status); setStatusAnchor(null); setStatusJobId(null); }}>{t("jobTableSetStatus", { status })}</MenuItem>)}

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

@@ -103,7 +103,7 @@ export default function QuickCommandDialog({ open, onClose, onNavigate, onOpenAd
       id: `job-${job.id}`,
       label: `${job.company?.name ?? t("company")} - ${job.jobTitle}`,
       hint: t("openJobListAndSearchResult"),
-      action: () => onNavigate(`/jobs?open=${job.id}`),
+      action: () => onNavigate(`/jobs/${job.id}`),
     })),
     ...companies.slice(0, 6).map((company) => ({
       id: `company-${company.id}`,

job-tracker-ui/src/jobWorkspaceRoute.ts

@@ -16,10 +16,23 @@ export type JobWorkspaceOpenOptions = {
   followMode?: string;
 };
 
+const WORKSPACE_SECTION_BY_TAB: Record<number, string> = {
+  [JOB_DETAILS_TABS.overview]: "overview",
+  [JOB_DETAILS_TABS.correspondence]: "communication",
+  [JOB_DETAILS_TABS.attachments]: "documents",
+  [JOB_DETAILS_TABS.tailoredCv]: "cv",
+  [JOB_DETAILS_TABS.followUp]: "communication",
+  [JOB_DETAILS_TABS.candidateFit]: "match",
+  [JOB_DETAILS_TABS.focusPlan]: "analysis",
+  [JOB_DETAILS_TABS.interviewPrep]: "interview",
+  [JOB_DETAILS_TABS.readiness]: "checklist",
+  [JOB_DETAILS_TABS.history]: "timeline",
+};
+
 export function buildJobWorkspacePath(jobId: number, options: JobWorkspaceOpenOptions = {}) {
   const params = new URLSearchParams();
-  params.set('open', String(jobId));
-  if (typeof options.tab === 'number') params.set('tab', String(options.tab));
+  const section = typeof options.tab === "number" ? WORKSPACE_SECTION_BY_TAB[options.tab] : undefined;
+  if (section && section !== "overview") params.set("section", section);
   if (options.followMode) params.set('followMode', options.followMode);
-  return `/jobs?${params.toString()}`;
+  return `/jobs/${jobId}${params.size ? `?${params.toString()}` : ""}`;
 }

job-tracker-ui/src/views/ApplicationWorkspacePage.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useMemo, useState } from "react";
-import { useNavigate, useParams, useSearchParams } from "react-router-dom";
+import { useLocation, useNavigate, useParams, useSearchParams } from "react-router-dom";
 
 import {
   Alert, Box, Button, Chip, Divider, IconButton, List, ListItemButton, ListItemText, Paper,
@@ -13,6 +13,7 @@ import MailOutlineIcon from "@mui/icons-material/MailOutline";
 import FolderOutlinedIcon from "@mui/icons-material/FolderOutlined";
 import AutoFixHighIcon from "@mui/icons-material/AutoFixHigh";
 import ChecklistIcon from "@mui/icons-material/Checklist";
+import EditOutlinedIcon from "@mui/icons-material/EditOutlined";
 
 import { getApiErrorMessage } from "../api";
 import Attachments from "../components/Attachments";
@@ -26,6 +27,7 @@ import {
   ApplicationCoverLetterSection, ApplicationCvSection,
 } from "../components/ApplicationAssets";
 import { ApplicationInterviewPrep } from "../components/InterviewPrep";
+import EditJobDialog from "../components/EditJobDialog";
 import {
   WORKSPACE_SECTIONS, WorkspaceOverview, WorkspaceSectionKey, applicationWorkspaceApi, workspaceSection,
 } from "../applicationWorkspace";
@@ -56,15 +58,23 @@ export function ApplicationWorkspace({
 }: ApplicationWorkspaceProps) {
   const { id } = useParams();
   const jobId = jobIdOverride ?? Number(id);
+  const location = useLocation();
   const navigate = useNavigate();
   const [params, setParams] = useSearchParams();
   const section = sectionOverride ?? workspaceSection(params.get("section"));
 
   const [overview, setOverview] = useState<WorkspaceOverview | null>(null);
   const [error, setError] = useState<string | null>(null);
+  const [editOpen, setEditOpen] = useState(false);
 
   const load = useCallback(async () => {
+    if (!Number.isInteger(jobId) || jobId <= 0) {
+      setOverview(null);
+      setError("This application link is invalid.");
+      return;
+    }
     try {
+      setError(null);
       setOverview(await applicationWorkspaceApi.overview(jobId));
     } catch (err) {
       setError(getApiErrorMessage(err, "Could not open this application."));
@@ -77,9 +87,12 @@ export function ApplicationWorkspace({
 
   const go = (next: WorkspaceSectionKey) => {
     if (onSectionChange) onSectionChange(next);
-    else setParams({ section: next }, { replace: true });
+    else setParams({ section: next }, { replace: true, state: location.state });
   };
-  const close = onClose ?? (() => navigate("/jobs"));
+  const close = onClose ?? (() => {
+    const from = (location.state as { from?: unknown } | null)?.from;
+    navigate(typeof from === "string" && from.startsWith("/") && !from.startsWith("//") ? from : "/jobs", { replace: true });
+  });
 
   if (error) {
     return (
@@ -131,9 +144,9 @@ export function ApplicationWorkspace({
       </Paper>
 
       <Box sx={{ display: "grid", gap: 2 }}>
-        <WorkspaceHeader overview={overview} />
+        <WorkspaceHeader overview={overview} onEdit={() => setEditOpen(true)} />
         {section === "overview" && <OverviewSection overview={overview} onGo={go} onReload={load} />}
-        {section === "job-details" && <JobDetailsSection overview={overview} />}
+        {section === "job-details" && <JobDetailsSection overview={overview} onEdit={() => setEditOpen(true)} />}
         {/* Deterministic answer first, then the AI panel below it — the page never generates on load. */}
         {section === "analysis" && jobId > 0 && <ApplicationAnalysis jobId={jobId} />}
         {section === "match" && jobId > 0 && <ApplicationMatch jobId={jobId} />}
@@ -164,10 +177,16 @@ export function ApplicationWorkspace({
           </>
         )}
       </Box>
+      <EditJobDialog
+        open={editOpen}
+        jobId={jobId > 0 ? jobId : null}
+        onClose={() => setEditOpen(false)}
+        onSaved={() => { setEditOpen(false); void load(); }}
+      />
     </Box>
   );
 }
-function WorkspaceHeader({ overview }: { overview: WorkspaceOverview | null }) {
+function WorkspaceHeader({ overview, onEdit }: { overview: WorkspaceOverview | null; onEdit: () => void }) {
   if (!overview) return <Paper sx={{ p: 2.5, borderRadius: 3 }}><Skeleton width="45%" height={34} /><Skeleton width="30%" /></Paper>;
   return (
     <Paper sx={{ p: 2.5, borderRadius: 3 }}>
@@ -179,8 +198,14 @@ function WorkspaceHeader({ overview }: { overview: WorkspaceOverview | null }) {
           </Typography>
         </Box>
         <Stack direction="row" spacing={1} alignItems="center">
+          <Tooltip title="Edit application">
+            <IconButton size="small" aria-label="Edit application" onClick={onEdit}>
+              <EditOutlinedIcon fontSize="small" />
+            </IconButton>
+          </Tooltip>
           <Chip size="small" label={overview.status} color="primary" variant="outlined" />
           <Chip size="small" label={overview.stageGroup} />
+          {overview.source ? <Chip size="small" label={overview.source.toUpperCase()} variant="outlined" /> : null}
           {overview.jobUrl && (
             <Tooltip title="Open original advert">
               <IconButton size="small" aria-label="Open original advert" href={overview.jobUrl} target="_blank" rel="noopener noreferrer">
@@ -267,34 +292,72 @@ function OverviewSection({ overview, onGo, onReload }: {
   );
 }
 
-function JobDetailsSection({ overview }: { overview: WorkspaceOverview | null }) {
+function JobDetailsSection({ overview, onEdit }: { overview: WorkspaceOverview | null; onEdit: () => void }) {
   if (!overview) return <Skeleton variant="rounded" height={200} />;
   const rows: [string, string][] = [
     ["Company", overview.company ?? "—"],
     ["Location", overview.location ?? "—"],
+    ["Country", overview.countryCode ?? "—"],
+    ["Source", overview.source ?? "—"],
     ["Salary", overview.salary ?? "—"],
     ["Status", overview.status],
+    ["Discovered", overview.savedAt ? new Date(overview.savedAt).toLocaleDateString() : "—"],
     ["Applied", overview.dateApplied ? new Date(overview.dateApplied).toLocaleDateString() : "—"],
     ["Deadline", overview.deadline ? new Date(overview.deadline).toLocaleDateString() : "—"],
     ["Follow-up", overview.followUpAt ? new Date(overview.followUpAt).toLocaleDateString() : "Not scheduled"],
     ["Next action", overview.nextAction ?? "—"],
   ];
   return (
-    <Paper sx={{ p: 2, borderRadius: 3 }}>
-      <Typography variant="subtitle2" sx={{ fontWeight: 800, mb: 1 }}>Job details</Typography>
-      {!overview.hasJobDescription && (
-        <Alert severity="warning" sx={{ mb: 1.5, borderRadius: 2 }}>
-          No advert text saved. Analysis and matching need it — add it from the application dialog.
-        </Alert>
-      )}
-      <Box sx={{ display: "grid", gridTemplateColumns: { xs: "1fr", sm: "160px 1fr" }, rowGap: 0.75, columnGap: 2 }}>
+    <Stack spacing={2}>
+      <Paper sx={{ p: 2.5, borderRadius: 3 }}>
+        <Stack direction="row" alignItems="center" justifyContent="space-between" gap={1} sx={{ mb: 1.5 }}>
+          <Typography variant="subtitle1" sx={{ fontWeight: 800 }}>Application information</Typography>
+          <Button size="small" startIcon={<EditOutlinedIcon />} onClick={onEdit}>Edit</Button>
+        </Stack>
+        <Box sx={{ display: "grid", gridTemplateColumns: { xs: "1fr", sm: "repeat(2, minmax(0, 1fr))", lg: "repeat(4, minmax(0, 1fr))" }, gap: 1.5 }}>
           {rows.map(([k, v]) => (
-          <React.Fragment key={k}>
-            <Typography variant="body2" color="text.secondary">{k}</Typography>
-            <Typography variant="body2">{v}</Typography>
-          </React.Fragment>
+            <Box key={k} sx={{ minWidth: 0 }}>
+              <Typography variant="caption" color="text.secondary" sx={{ fontWeight: 700 }}>{k}</Typography>
+              <Typography variant="body2" sx={{ overflowWrap: "anywhere" }}>{v}</Typography>
+            </Box>
           ))}
         </Box>
+        {overview.tags.length > 0 ? (
+          <Box sx={{ display: "flex", flexWrap: "wrap", gap: 0.75, mt: 2 }}>
+            {overview.tags.map((tag) => <Chip key={tag} size="small" label={tag} />)}
+          </Box>
+        ) : null}
+        {overview.notes ? (
+          <Box sx={{ mt: 2 }}>
+            <Typography variant="caption" color="text.secondary" sx={{ fontWeight: 700 }}>Notes</Typography>
+            <Typography variant="body2" sx={{ mt: 0.5, whiteSpace: "pre-wrap", overflowWrap: "anywhere" }}>{overview.notes}</Typography>
+          </Box>
+        ) : null}
       </Paper>
+
+      <Paper sx={{ p: { xs: 2, sm: 2.5 }, borderRadius: 3 }}>
+        <Typography variant="subtitle1" sx={{ fontWeight: 800, mb: 1.5 }}>Job description</Typography>
+        {!overview.hasJobDescription ? (
+          <Alert severity="warning" sx={{ borderRadius: 2 }} action={<Button color="inherit" size="small" onClick={onEdit}>Add advert</Button>}>
+            No advert text saved. Analysis and matching need the job description.
+          </Alert>
+        ) : (
+          <Stack spacing={2.5}>
+            {overview.translatedDescription ? (
+              <Box>
+                <Typography variant="overline" color="text.secondary">Translated advert</Typography>
+                <Typography sx={{ mt: 0.5, whiteSpace: "pre-wrap", overflowWrap: "anywhere", lineHeight: 1.7 }}>{overview.translatedDescription}</Typography>
+              </Box>
+            ) : null}
+            {overview.description ? (
+              <Box>
+                {overview.translatedDescription ? <Typography variant="overline" color="text.secondary">Original advert{overview.descriptionLanguage ? ` · ${overview.descriptionLanguage.toUpperCase()}` : ""}</Typography> : null}
+                <Typography sx={{ mt: 0.5, whiteSpace: "pre-wrap", overflowWrap: "anywhere", lineHeight: 1.7 }}>{overview.description}</Typography>
+              </Box>
+            ) : null}
+          </Stack>
+        )}
+      </Paper>
+    </Stack>
   );
 }

job-tracker-ui/src/views/CorrespondenceInboxPage.tsx

@@ -663,7 +663,7 @@ export default function CorrespondenceInboxPage() {
                 {item.labelCount > 0 ? <Chip size="small" label={`${item.labelCount} labels`} variant="outlined" /> : null}
                 {item.attachmentCount > 0 ? <Chip size="small" label={`${item.attachmentCount} attachments`} variant="outlined" /> : null}
                 <Button size="small" variant="text" onClick={() => void showMessage(item)}>{selectedMessageId === item.id ? "Hide message" : "View message"}</Button>
-                <Button size="small" variant="text" onClick={() => navigate(`/jobs?open=${item.jobApplicationId}`)}>Open job</Button>
+                <Button size="small" variant="text" onClick={() => navigate(`/jobs/${item.jobApplicationId}?section=communication`)}>Open job</Button>
                 {item.provider === "gmail" && item.externalThreadId ? (
                   <Button size="small" color="warning" variant="text" disabled={unlinkingThreadId === item.externalThreadId} onClick={() => void unlinkGmailThread(item)}>
                     {unlinkingThreadId === item.externalThreadId ? "Unlinking…" : "Unlink thread"}

job-tracker-ui/src/views/GmailReviewPage.tsx

@@ -109,7 +109,7 @@ export default function GmailReviewPage({ embedded = false }: { embedded?: boole
       });
       await load();
       toast(`Created suggested job and imported ${res.data.imported} message${res.data.imported === 1 ? "" : "s"}.`, "success");
-      navigate(`/jobs?open=${res.data.jobApplicationId}`);
+      navigate(`/jobs/${res.data.jobApplicationId}?section=communication`);
     } catch (error) {
       toast(getApiErrorMessage(error, "Failed to create the suggested job."), "error");
     } finally {
@@ -216,7 +216,7 @@ export default function GmailReviewPage({ embedded = false }: { embedded?: boole
                     />
                   ))}
                   {thread.jobCandidates[0] ? (
-                    <Button size="small" variant="text" onClick={() => navigate(`/jobs?open=${thread.jobCandidates[0].jobApplicationId}`)}>
+                    <Button size="small" variant="text" onClick={() => navigate(`/jobs/${thread.jobCandidates[0].jobApplicationId}?section=communication`)}>
                       Open top job
                     </Button>
                   ) : null}

job-tracker-ui/src/workflow-trust-signals.test.tsx

@@ -93,7 +93,7 @@ function renderWithProviders(initialPath: string, routes: React.ReactNode) {
       <I18nProvider>
         <ConfirmProvider>
           <PromptProvider>
-            <MemoryRouter initialEntries={[initialPath]} future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
+            <MemoryRouter initialEntries={[initialPath]}>
               <Routes>{routes}</Routes>
             </MemoryRouter>
           </PromptProvider>
@@ -134,32 +134,32 @@ test('follow-up workflow signals route all overview surfaces to the same follow-
 
   const dashboardRender = renderWithProviders('/dashboard', <>
     <Route path="/dashboard" element={<><LocationIndicator /><DashboardView /></>} />
-    <Route path="/jobs" element={<LocationIndicator />} />
+    <Route path="/jobs/:id" element={<LocationIndicator />} />
   </>);
 
   await screen.findByText(/follow-up is due for this role/i);
   fireEvent.click(await screen.findByRole('button', { name: /follow up/i }));
-  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs?open=42&tab=4&followMode=waiting-update'));
+  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs/42?section=communication&followMode=waiting-update'));
   dashboardRender.unmount();
 
   setupApiMocks({ reminders: [job], jobs: [job] });
   const remindersRender = renderWithProviders('/reminders', <>
     <Route path="/reminders" element={<><LocationIndicator /><RemindersView /></>} />
-    <Route path="/jobs" element={<LocationIndicator />} />
+    <Route path="/jobs/:id" element={<LocationIndicator />} />
   </>);
 
   fireEvent.click(await screen.findByRole('button', { name: /follow up/i }));
-  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs?open=42&tab=4&followMode=waiting-update'));
+  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs/42?section=communication&followMode=waiting-update'));
   remindersRender.unmount();
 
   setupApiMocks({ reminders: [job], jobs: [job] });
   renderWithProviders('/table', <>
     <Route path="/table" element={<><LocationIndicator /><JobTable refreshToken={0} pageSize={15} onPageSizeChange={() => {}} columns={{ status: true, dateApplied: true, daysSince: true, jobUrl: false }} onColumnsChange={() => {}} mode="jobs" /></>} />
-    <Route path="/jobs" element={<LocationIndicator />} />
+    <Route path="/jobs/:id" element={<LocationIndicator />} />
   </>);
 
   fireEvent.click(await screen.findByRole('button', { name: /backend developer — follow up signal/i }));
-  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs?open=42&tab=4&followMode=waiting-update'));
+  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs/42?section=communication&followMode=waiting-update'));
 });
 
 test('package-work workflow signals route all overview surfaces to the shared tailored-cv workspace', async () => {
@@ -186,31 +186,31 @@ test('package-work workflow signals route all overview surfaces to the shared ta
 
   const dashboardRender = renderWithProviders('/dashboard', <>
     <Route path="/dashboard" element={<><LocationIndicator /><DashboardView /></>} />
-    <Route path="/jobs" element={<LocationIndicator />} />
+    <Route path="/jobs/:id" element={<LocationIndicator />} />
   </>);
 
   fireEvent.click(await screen.findByRole('button', { name: /build package/i }));
-  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs?open=43&tab=3'));
+  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs/43?section=cv'));
   dashboardRender.unmount();
 
   setupApiMocks({ reminders: [job], jobs: [job] });
   const remindersRender = renderWithProviders('/reminders', <>
     <Route path="/reminders" element={<><LocationIndicator /><RemindersView /></>} />
-    <Route path="/jobs" element={<LocationIndicator />} />
+    <Route path="/jobs/:id" element={<LocationIndicator />} />
   </>);
 
   fireEvent.click(await screen.findByRole('button', { name: /build package/i }));
-  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs?open=43&tab=3'));
+  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs/43?section=cv'));
   remindersRender.unmount();
 
   setupApiMocks({ reminders: [job], jobs: [job] });
   renderWithProviders('/table', <>
     <Route path="/table" element={<><LocationIndicator /><JobTable refreshToken={0} pageSize={15} onPageSizeChange={() => {}} columns={{ status: true, dateApplied: true, daysSince: true, jobUrl: false }} onColumnsChange={() => {}} mode="jobs" /></>} />
-    <Route path="/jobs" element={<LocationIndicator />} />
+    <Route path="/jobs/:id" element={<LocationIndicator />} />
   </>);
 
   fireEvent.click(await screen.findByRole('button', { name: /platform engineer — build package signal/i }));
-  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs?open=43&tab=3'));
+  await waitFor(() => expect(screen.getByTestId('location-indicator')).toHaveTextContent('/jobs/43?section=cv'));
 });
 
 test('job table readiness filter follows workflow signals instead of raw notes or cv text heuristics', async () => {