feat: add measured detection review loop

frontend/src/components/map/MapWorkspace.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useState } from 'react'
 import GeoMap from '../GeoMap'
-import type { AreaRead, DatasetCreateResponse, MapViewportState, ProjectRead, QaComparisonResult, VectorSelectionBBox, VectorSelectionResponse } from '../../types'
+import type { AreaRead, DatasetCreateResponse, DetectionQaResult, MapViewportState, ProjectRead, QaComparisonResult, VectorSelectionBBox, VectorSelectionResponse } from '../../types'
 import { featureCollectionBounds } from '../../lib/geojsonBounds'
 import { useMapThemeSelectionInsights } from '../../hooks/useMapThemeSelectionInsights'
 import { useTemporalComparison } from '../../hooks/useTemporalComparison'
@@ -327,6 +327,12 @@ function formatBboxLabel(bbox: VectorSelectionBBox | null): string {
   return `${formatCoordinate(bbox.min_x)}, ${formatCoordinate(bbox.min_y)} -> ${formatCoordinate(bbox.max_x)}, ${formatCoordinate(bbox.max_y)}`
 }
 
+function formatPercentage(value: number | null | undefined): string {
+  return typeof value === 'number' && Number.isFinite(value)
+    ? `${(value * 100).toLocaleString('nl-BE', { maximumFractionDigits: 1 })}%`
+    : 'n.v.t.'
+}
+
 function bboxToInputState(bbox: VectorSelectionBBox | null) {
   return {
     min_x: bbox ? String(bbox.min_x) : '',
@@ -445,6 +451,8 @@ interface MapWorkspaceProps {
   orthophotoAnalysisStatus: string
   orthophotoAnalysisError: string | null
   orthophotoAnalysisRunning: boolean
+  orthophotoAnalysisQuality: DetectionQaResult | null
+  orthophotoAnalysisDetectionCount: number | null
   availableMapDatasets: DatasetCreateResponse[]
   selectedMapDatasetId: string
   onSelectMapArea: (areaId: string) => void
@@ -518,6 +526,8 @@ export function MapWorkspace({
   orthophotoAnalysisStatus,
   orthophotoAnalysisError,
   orthophotoAnalysisRunning,
+  orthophotoAnalysisQuality,
+  orthophotoAnalysisDetectionCount,
   availableMapDatasets,
   selectedMapDatasetId,
   onSelectMapArea,
@@ -1194,6 +1204,16 @@ export function MapWorkspace({
                 </button>
                 {orthophotoAnalysisStatus ? <p role="status">{orthophotoAnalysisStatus}</p> : null}
                 {orthophotoAnalysisError ? <p className="error" role="alert">{orthophotoAnalysisError}</p> : null}
+                {orthophotoAnalysisQuality ? (
+                  <div className="geo-image-quality-metrics" aria-label="Gemeten kwaliteit van de beeldanalyse">
+                    <div><span>Kandidaten</span><strong>{orthophotoAnalysisDetectionCount?.toLocaleString('nl-BE') ?? 'n.v.t.'}</strong></div>
+                    <div><span>Precision</span><strong>{formatPercentage(orthophotoAnalysisQuality.precision)}</strong></div>
+                    <div><span>Recall</span><strong>{formatPercentage(orthophotoAnalysisQuality.recall)}</strong></div>
+                    <div><span>F1</span><strong>{formatPercentage(orthophotoAnalysisQuality.f1_score)}</strong></div>
+                    <div><span>Fout</span><strong>{orthophotoAnalysisQuality.false_positives.toLocaleString('nl-BE')}</strong></div>
+                    <div><span>Gemist</span><strong>{orthophotoAnalysisQuality.false_negatives.toLocaleString('nl-BE')}</strong></div>
+                  </div>
+                ) : null}
               </div>
             ) : null}