feat: switch frontend indexing to code-first identifiers

src/pages/MilestonesPage.tsx

@@ -13,7 +13,7 @@ export default function MilestonesPage() {
   const navigate = useNavigate()
 
   const fetchMilestones = () => {
-    const params = projectFilter ? `?project_id=${projectFilter}` : ''
+    const params = projectFilter ? `?project_code=${projectFilter}` : ''
     api.get<Milestone[]>(`/milestones${params}`).then(({ data }) => setMilestones(data))
   }
 
@@ -35,21 +35,21 @@ export default function MilestonesPage() {
       <div className="filters">
         <select value={projectFilter} onChange={(e) => setProjectFilter(e.target.value)}>
           <option value="">All projects</option>
-          {projects.map((p) => <option key={p.id} value={p.id}>{p.name}</option>)}
+          {projects.map((p) => <option key={p.id} value={p.project_code || ''}>{p.name}</option>)}
         </select>
       </div>
 
       <MilestoneFormModal
         isOpen={showCreate}
         onClose={() => setShowCreate(false)}
-        initialProjectId={projectFilter ? Number(projectFilter) : undefined}
+        initialProjectCode={projectFilter || undefined}
         lockProject={Boolean(projectFilter)}
         onSaved={() => fetchMilestones()}
       />
 
       <div className="milestone-grid">
         {milestones.map((ms) => (
-          <div key={ms.id} className="milestone-card" onClick={() => navigate(`/milestones/${ms.milestone_code || ms.id}`)}>
+          <div key={ms.id} className="milestone-card" onClick={() => ms.milestone_code && navigate(`/milestones/${ms.milestone_code}`)}>
             <div className="milestone-card-header">
               <span className={`badge status-${ms.status}`}>{ms.status}</span>
               <h3>{ms.title}</h3>{ms.milestone_code && <span className="badge" style={{ marginLeft: 8, fontSize: '0.75em' }}>{ms.milestone_code}</span>}