Complete GeoIntel visual system and portfolio case study

frontend/src/components/overview/OverviewWorkspace.tsx

@@ -116,6 +116,9 @@ export function OverviewWorkspace({
       target: 'exports',
     },
   ]
+  const readyStepCount = steps.filter((step) => step.ready).length
+  const latestQualityCheck = qualityChecks[0] ?? null
+  const latestExport = exports[0] ?? null
 
   return (
     <div className="workspace-stack">
@@ -128,6 +131,40 @@ export function OverviewWorkspace({
         exportCount={exports.length}
         onOpenWorkspace={onOpenWorkspace}
       />
+      <section className="overview-command-center" aria-labelledby="overview-command-title">
+        <div className="overview-command-heading">
+          <div>
+            <p className="eyebrow">Projectbriefing</p>
+            <h2 id="overview-command-title">Wat vraagt nu aandacht?</h2>
+          </div>
+          <button type="button" className="secondary-action" onClick={() => onOpenWorkspace(recommendedTarget)}>
+            Volgende stap openen
+          </button>
+        </div>
+        <div className="overview-command-grid">
+          <article className="overview-command-card overview-command-card-progress">
+            <span>Voortgang</span>
+            <strong>{readyStepCount} / {steps.length}</strong>
+            <p>{workflowComplete ? 'De volledige keten is afgerond.' : steps.find((step) => !step.ready)?.detail}</p>
+            <div aria-hidden="true"><i style={{ width: `${(readyStepCount / steps.length) * 100}%` }} /></div>
+          </article>
+          <button type="button" className="overview-command-card" onClick={() => onOpenWorkspace('analysis')}>
+            <span>Laatste kwaliteitsbewijs</span>
+            <strong>{latestQualityCheck?.score != null ? latestQualityCheck.score.toFixed(3) : 'Nog geen score'}</strong>
+            <p>{latestQualityCheck ? `${latestQualityCheck.check_type.replace(/_/g, ' ')} · ${latestQualityCheck.status}` : 'Voer een controle uit wanneer kandidaat- en referentiedata klaarstaan.'}</p>
+          </button>
+          <button type="button" className="overview-command-card" onClick={() => onOpenWorkspace('data')}>
+            <span>Brondekking</span>
+            <strong>{datasets.length} bronnen</strong>
+            <p>{areas.length > 0 ? `Beschikbaar voor ${areas.length} ${areas.length === 1 ? 'gebied' : 'gebieden'}.` : 'Definieer eerst een werkgebied.'}</p>
+          </button>
+          <button type="button" className="overview-command-card" onClick={() => onOpenWorkspace('exports')}>
+            <span>Laatste resultaat</span>
+            <strong>{latestExport ? latestExport.status : 'Nog niet bewaard'}</strong>
+            <p>{latestExport ? latestExport.export_type.replace(/_/g, ' ') : 'Een gecontroleerde export verschijnt hier als volgende overdraagbare versie.'}</p>
+          </button>
+        </div>
+      </section>
       <WorkbenchStatusStrip
         selectedProject={selectedProject}
         areas={areas}