progress

frontend/src/screens/Dashboard.jsx

@@ -426,11 +426,11 @@ function DashboardHome() {
                     className="jobapp-row"
                     role="button"
                     tabIndex={0}
-                    onClick={() => navigate('/jobs', { state: { openJob: j.job_post_id } })}
+                    onClick={() => navigate(`/progress?job=${encodeURIComponent(j.job_post_id)}`)}
                     onKeyDown={(e) => {
                       if (e.key === 'Enter' || e.key === ' ') {
                         e.preventDefault()
-                        navigate('/jobs', { state: { openJob: j.job_post_id } })
+                        navigate(`/progress?job=${encodeURIComponent(j.job_post_id)}`)
                       }
                     }}
                   >

frontend/src/screens/Progress.jsx

@@ -7,6 +7,7 @@
    ============================================================ */
 
 import { useEffect, useMemo, useState } from 'react'
+import { useSearchParams } from 'react-router-dom'
 import { useQuery } from '@tanstack/react-query'
 
 import PageHeader from '../ui/PageHeader'
@@ -75,8 +76,11 @@ function StageBar({ job }) {
 }
 
 export default function Progress() {
+  const [searchParams, setSearchParams] = useSearchParams()
+  const deepLinkJobId = searchParams.get('job') || ''
+
   const [tab, setTab] = useState('overview')
-  const [selectedId, setSelectedId] = useState('')
+  const [selectedId, setSelectedId] = useState(deepLinkJobId)
   const [query, setQuery] = useState('')
 
   const statsQuery = useQuery({
@@ -95,12 +99,30 @@ export default function Progress() {
       setSelectedId('')
       return
     }
-    if (!selectedId || !jobs.some((j) => j.id === selectedId)) {
-      setSelectedId(jobs[0].id)
+    const matchId = (id) => jobs.some((j) => String(j.id) === String(id))
+    if (deepLinkJobId && matchId(deepLinkJobId)) {
+      setSelectedId(String(deepLinkJobId))
+      setTab('overview')
+      return
     }
-  }, [jobs, selectedId])
+    if (!selectedId || !matchId(selectedId)) {
+      setSelectedId(String(jobs[0].id))
+    }
+  }, [jobs, selectedId, deepLinkJobId])
 
-  const selected = jobs.find((j) => j.id === selectedId) || jobs[0] || null
+  const selectJob = (id) => {
+    const next = String(id || '')
+    setSelectedId(next)
+    setTab('overview')
+    setSearchParams((prev) => {
+      const nextParams = new URLSearchParams(prev)
+      if (next) nextParams.set('job', next)
+      else nextParams.delete('job')
+      return nextParams
+    }, { replace: true })
+  }
+
+  const selected = jobs.find((j) => String(j.id) === String(selectedId)) || jobs[0] || null
 
   const visibleJobs = useMemo(() => {
     const q = query.trim().toLowerCase()
@@ -257,11 +279,11 @@ export default function Progress() {
               <select
                 className="select"
                 value={selectedId}
-                onChange={(e) => setSelectedId(e.target.value)}
+                onChange={(e) => selectJob(e.target.value)}
                 aria-label="Select job post"
               >
                 {jobs.map((job) => (
-                  <option key={job.id} value={job.id}>{job.title}</option>
+                  <option key={job.id} value={String(job.id)}>{job.title}</option>
                 ))}
               </select>
             </div>