From 109745edb06db5aaa757126f7cdcc5db1f49aa24 Mon Sep 17 00:00:00 2001 From: cesnimda Date: Sat, 15 Aug 2026 13:33:00 +0200 Subject: [PATCH] feat(jobs): add dedicated workspace page Make /jobs/:id the canonical application workspace while preserving list state and compatibility links. Replace popup and expandable-row navigation with accessible whole-row routing and richer job details. --- .../ApplicationWorkspaceTests.cs | 2 + .../Services/ApplicationWorkspaceService.cs | 22 +- docs/audits/verification-log.md | 1 + .../jobs-002-application-workspace.md | 32 ++- docs/work-programmes/decisions.md | 10 + docs/work-programmes/master-progress.md | 4 +- docs/work-programmes/master-work-plan.md | 12 +- docs/work-programmes/session-handoff.md | 14 +- job-tracker-ui/src/App.tsx | 17 +- .../application-workspace-overlay.test.tsx | 63 +++-- job-tracker-ui/src/applicationWorkspace.ts | 8 + job-tracker-ui/src/components/JobTable.tsx | 229 +++++------------- .../src/components/QuickCommandDialog.tsx | 2 +- job-tracker-ui/src/jobWorkspaceRoute.ts | 19 +- .../src/views/ApplicationWorkspacePage.tsx | 109 +++++++-- .../src/views/CorrespondenceInboxPage.tsx | 2 +- job-tracker-ui/src/views/GmailReviewPage.tsx | 4 +- .../src/workflow-trust-signals.test.tsx | 26 +- 18 files changed, 310 insertions(+), 266 deletions(-) diff --git a/JobTrackerApi.Tests/ApplicationWorkspaceTests.cs b/JobTrackerApi.Tests/ApplicationWorkspaceTests.cs index be0ce5c..735ef61 100644 --- a/JobTrackerApi.Tests/ApplicationWorkspaceTests.cs +++ b/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); diff --git a/JobTrackerApi/Services/ApplicationWorkspaceService.cs b/JobTrackerApi/Services/ApplicationWorkspaceService.cs index 8fa20e7..2c2cb0d 100644 --- a/JobTrackerApi/Services/ApplicationWorkspaceService.cs +++ b/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 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 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, diff --git a/docs/audits/verification-log.md b/docs/audits/verification-log.md index 2d48dc9..f02cf58 100644 --- a/docs/audits/verification-log.md +++ b/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 | diff --git a/docs/verification/jobs-002-application-workspace.md b/docs/verification/jobs-002-application-workspace.md index 4e97711..283c1bd 100644 --- a/docs/verification/jobs-002-application-workspace.md +++ b/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}§ion={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. diff --git a/docs/work-programmes/decisions.md b/docs/work-programmes/decisions.md index 4fee0a5..8309624 100644 --- a/docs/work-programmes/decisions.md +++ b/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. diff --git a/docs/work-programmes/master-progress.md b/docs/work-programmes/master-progress.md index 4ed6a55..5d7a69c 100644 --- a/docs/work-programmes/master-progress.md +++ b/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. diff --git a/docs/work-programmes/master-work-plan.md b/docs/work-programmes/master-work-plan.md index 607cfa7..cd90110 100644 --- a/docs/work-programmes/master-work-plan.md +++ b/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 diff --git a/docs/work-programmes/session-handoff.md b/docs/work-programmes/session-handoff.md index 996a61b..dc77be6 100644 --- a/docs/work-programmes/session-handoff.md +++ b/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. diff --git a/job-tracker-ui/src/App.tsx b/job-tracker-ui/src/App.tsx index d88b08d..4ab52c1 100644 --- a/job-tracker-ui/src/App.tsx +++ b/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 Loading...; } +function LegacyApplicationRedirect() { + const { id } = useParams(); + const location = useLocation(); + return ; +} + 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: , badgeCount: reminderCount, section: t("manage") }, { to: "/kanban", label: t("kanbanBoard"), icon: , section: t("manage") }, { to: "/companies", label: t("companies"), icon: , section: t("manage") }, - { to: "/correspondence", label: "Correspondence", icon: , section: t("manage") }, - { to: "/correspondence/review", label: "Gmail review", icon: , section: t("manage") }, { to: "/career", label: "Career Workspace", icon: , section: t("manage") }, { to: "/career/builder", label: "CV Builder", icon: , section: t("manage") }, { to: "/trash", label: t("trash"), icon: , section: t("manage") }, @@ -353,6 +359,7 @@ function Shell({ jobPageSize, setJobPageSize, jobColumns, setJobColumns, themeMo } /> } /> } /> + } /> } /> } /> } /> @@ -360,7 +367,7 @@ function Shell({ jobPageSize, setJobPageSize, jobColumns, setJobColumns, themeMo } /> } /> } /> - } /> + } /> } /> } /> } /> diff --git a/job-tracker-ui/src/application-workspace-overlay.test.tsx b/job-tracker-ui/src/application-workspace-overlay.test.tsx index ac501a0..aa54fea 100644 --- a/job-tracker-ui/src/application-workspace-overlay.test.tsx +++ b/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", () => () =>
Documents section
); jest.mock("./components/Correspondence", () => () =>
Communication section
); @@ -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 ( <> {location.pathname}{location.search} - ); } @@ -86,10 +93,11 @@ function renderTable(path = "/jobs") { - + {}} columns={{ status: true, dateApplied: true, daysSince: true, jobUrl: false }} onColumnsChange={() => {}} />} /> + } /> @@ -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§ion=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§ion=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§ion=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 () => { diff --git a/job-tracker-ui/src/applicationWorkspace.ts b/job-tracker-ui/src/applicationWorkspace.ts index 8b961b0..807d119 100644 --- a/job-tracker-ui/src/applicationWorkspace.ts +++ b/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; diff --git a/job-tracker-ui/src/components/JobTable.tsx b/job-tracker-ui/src/components/JobTable.tsx index da7209c..843a2e1 100644 --- a/job-tracker-ui/src/components/JobTable.tsx +++ b/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 { 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([]); const [total, setTotal] = useState(0); const [page, setPage] = useState(() => queryPage(location.search)); - const [expanded, setExpanded] = useState([]); const [selectedIds, setSelectedIds] = useState([]); 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(() => queryReadiness(location.search)); const { companies, error: companiesError, reload: reloadCompanies } = useCompanies(); const [companyFilterId, setCompanyFilterId] = useState(() => queryCompany(location.search)); - const [detailsJobId, setDetailsJobId] = useState(null); - const [detailsInitialTab, setDetailsInitialTab] = useState(0); - const [detailsFollowUpMode, setDetailsFollowUpMode] = useState(undefined); const [editJobId, setEditJobId] = useState(null); const [reloadToken, setReloadToken] = useState(0); const [statusAnchor, setStatusAnchor] = useState(null); const [statusJobId, setStatusJobId] = useState(null); const [sortBy, setSortBy] = useState(() => 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) => { 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(() => 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 {jobsResource.loading ? {t("loading")} : 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 ( { + 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 }, }} > @@ -778,27 +731,6 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col ) : null} - - {t("jobTableOverview")} - - {overview || t("jobTableNoSummaryYet")} - - - - {primaryAction ? ( - - - {t("editJobNextAction")} - - - - {primaryAction.detail} - - - ) : null} - - {(mode === "trash" || (includeDeleted && job.isDeleted)) ? ( - - {primaryAction.detail} - - - ) : null} - + setEditJobId(job.id)}> { setStatusJobId(job.id); setStatusAnchor(e.currentTarget); }}> - updateWorkspaceRoute(job.id)}> {(mode === "trash" || (includeDeleted && job.isDeleted)) ? void restore(job.id)}> : void softDelete(job)}>} - - - - - - {t("jobTableLocation")}{job.location ?? "-"} - {t("addJobModalSalary")}{formatSalary(job) ?? "-"} - {t("settingsColumnJobUrl")}{job.jobUrl ? {t("jobTableOpenListing")} : "-"} - {t("jobTableSkills")}{detailTags.length ? detailTags.map((tag) => ) : {t("jobTableNoTags")}} - {t("jobTableOverview")}{overview || t("jobTableNoSummaryYet")} - - - - - ); })} {filteredJobs.length === 0 && !jobsResource.loading && !jobsResource.error ? ( @@ -927,27 +845,6 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col { 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]} /> - { setDetailsJobId(null); setDetailsInitialTab(0); setDetailsFollowUpMode(undefined); }} onOpenWorkspace={(id) => { setDetailsJobId(null); updateWorkspaceRoute(id); }} /> - - - {workspaceJobId ? ( - - ) : null} - - setEditJobId(null)} onSaved={() => setReloadToken((token) => token + 1)} /> { setStatusAnchor(null); setStatusJobId(null); }}> {statusOptions.map((status) => { if (statusJobId) void setStatusQuick(statusJobId, status); setStatusAnchor(null); setStatusJobId(null); }}>{t("jobTableSetStatus", { status })})} diff --git a/job-tracker-ui/src/components/QuickCommandDialog.tsx b/job-tracker-ui/src/components/QuickCommandDialog.tsx index 3d26bc2..3a0cae0 100644 --- a/job-tracker-ui/src/components/QuickCommandDialog.tsx +++ b/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}`, diff --git a/job-tracker-ui/src/jobWorkspaceRoute.ts b/job-tracker-ui/src/jobWorkspaceRoute.ts index f8c4bf9..dd9aa84 100644 --- a/job-tracker-ui/src/jobWorkspaceRoute.ts +++ b/job-tracker-ui/src/jobWorkspaceRoute.ts @@ -16,10 +16,23 @@ export type JobWorkspaceOpenOptions = { followMode?: string; }; +const WORKSPACE_SECTION_BY_TAB: Record = { + [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()}` : ""}`; } diff --git a/job-tracker-ui/src/views/ApplicationWorkspacePage.tsx b/job-tracker-ui/src/views/ApplicationWorkspacePage.tsx index e03f86b..278445b 100644 --- a/job-tracker-ui/src/views/ApplicationWorkspacePage.tsx +++ b/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(null); const [error, setError] = useState(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({ - + setEditOpen(true)} /> {section === "overview" && } - {section === "job-details" && } + {section === "job-details" && setEditOpen(true)} />} {/* Deterministic answer first, then the AI panel below it — the page never generates on load. */} {section === "analysis" && jobId > 0 && } {section === "match" && jobId > 0 && } @@ -164,10 +177,16 @@ export function ApplicationWorkspace({ )} + 0 ? jobId : null} + onClose={() => setEditOpen(false)} + onSaved={() => { setEditOpen(false); void load(); }} + /> ); } -function WorkspaceHeader({ overview }: { overview: WorkspaceOverview | null }) { +function WorkspaceHeader({ overview, onEdit }: { overview: WorkspaceOverview | null; onEdit: () => void }) { if (!overview) return ; return ( @@ -179,8 +198,14 @@ function WorkspaceHeader({ overview }: { overview: WorkspaceOverview | null }) { + + + + + + {overview.source ? : null} {overview.jobUrl && ( @@ -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 ; 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 ( - - Job details - {!overview.hasJobDescription && ( - - No advert text saved. Analysis and matching need it — add it from the application dialog. - - )} - - {rows.map(([k, v]) => ( - - {k} - {v} - - ))} - - + + + + Application information + + + + {rows.map(([k, v]) => ( + + {k} + {v} + + ))} + + {overview.tags.length > 0 ? ( + + {overview.tags.map((tag) => )} + + ) : null} + {overview.notes ? ( + + Notes + {overview.notes} + + ) : null} + + + + Job description + {!overview.hasJobDescription ? ( + Add advert}> + No advert text saved. Analysis and matching need the job description. + + ) : ( + + {overview.translatedDescription ? ( + + Translated advert + {overview.translatedDescription} + + ) : null} + {overview.description ? ( + + {overview.translatedDescription ? Original advert{overview.descriptionLanguage ? ` · ${overview.descriptionLanguage.toUpperCase()}` : ""} : null} + {overview.description} + + ) : null} + + )} + + ); } diff --git a/job-tracker-ui/src/views/CorrespondenceInboxPage.tsx b/job-tracker-ui/src/views/CorrespondenceInboxPage.tsx index 2a61d0a..24e4fe9 100644 --- a/job-tracker-ui/src/views/CorrespondenceInboxPage.tsx +++ b/job-tracker-ui/src/views/CorrespondenceInboxPage.tsx @@ -663,7 +663,7 @@ export default function CorrespondenceInboxPage() { {item.labelCount > 0 ? : null} {item.attachmentCount > 0 ? : null} - + {item.provider === "gmail" && item.externalThreadId ? ( ) : null} diff --git a/job-tracker-ui/src/workflow-trust-signals.test.tsx b/job-tracker-ui/src/workflow-trust-signals.test.tsx index 36df808..e7944bc 100644 --- a/job-tracker-ui/src/workflow-trust-signals.test.tsx +++ b/job-tracker-ui/src/workflow-trust-signals.test.tsx @@ -93,7 +93,7 @@ function renderWithProviders(initialPath: string, routes: React.ReactNode) { - + {routes} @@ -134,32 +134,32 @@ test('follow-up workflow signals route all overview surfaces to the same follow- const dashboardRender = renderWithProviders('/dashboard', <> } /> - } /> + } /> ); 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', <> } /> - } /> + } /> ); 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', <> {}} columns={{ status: true, dateApplied: true, daysSince: true, jobUrl: false }} onColumnsChange={() => {}} mode="jobs" />} /> - } /> + } /> ); 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', <> } /> - } /> + } /> ); 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', <> } /> - } /> + } /> ); 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', <> {}} columns={{ status: true, dateApplied: true, daysSince: true, jobUrl: false }} onColumnsChange={() => {}} mode="jobs" />} /> - } /> + } /> ); 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 () => {