Surface YOLO preflight in Detection Lab

frontend/src/components/detection/DetectionLab.tsx

@@ -5,6 +5,7 @@ import type {
   DetectionRead,
   DetectionRunRead,
   DetectionRunResponse,
+  YoloPreflightResponse,
 } from '../../types'
 
 interface DetectionLabProps {
@@ -28,10 +29,14 @@ interface DetectionLabProps {
   detectionQaResult: DetectionQaResult | null
   detectionQaError: string | null
   runningDetectionQa: boolean
+  yoloPreflight: YoloPreflightResponse | null
+  loadingYoloPreflight: boolean
+  yoloPreflightError: string | null
   selectedProjectId: string | null
   rasterDatasets: DatasetCreateResponse[]
   referenceDatasets: DatasetCreateResponse[]
   onLoadModels: () => void
+  onRefreshYoloPreflight: () => void
   onSelectDataset: (datasetId: string) => void
   onSelectModel: (modelId: string) => void
   onSetConfidenceThreshold: (value: number) => void
@@ -67,10 +72,14 @@ export function DetectionLab({
   detectionQaResult,
   detectionQaError,
   runningDetectionQa,
+  yoloPreflight,
+  loadingYoloPreflight,
+  yoloPreflightError,
   selectedProjectId,
   rasterDatasets,
   referenceDatasets,
   onLoadModels,
+  onRefreshYoloPreflight,
   onSelectDataset,
   onSelectModel,
   onSetConfidenceThreshold,
@@ -164,6 +173,76 @@ export function DetectionLab({
         </ul>
       </div>
 
+      <div className="ai-lab-model-surface" aria-label="YOLO runtime preflight">
+        <div className="ai-lab-section-header">
+          <div>
+            <h3>YOLO runtime preflight</h3>
+            <p>Read-only runtime status. This does not load a model, run inference or download weights.</p>
+          </div>
+          <button className="secondary-action" type="button" onClick={onRefreshYoloPreflight} disabled={loadingYoloPreflight}>
+            Refresh preflight
+          </button>
+        </div>
+        <div className="ai-lab-state-stack">
+          {loadingYoloPreflight ? (
+            <div className="result-state result-state-loading">
+              <strong>Loading YOLO preflight.</strong>
+              <p>Checking backend runtime configuration and optional dependency visibility.</p>
+            </div>
+          ) : null}
+          {yoloPreflightError ? (
+            <div className="result-state result-state-error">
+              <strong>YOLO preflight unavailable.</strong>
+              <p>{yoloPreflightError}</p>
+            </div>
+          ) : null}
+          {!yoloPreflight && !loadingYoloPreflight && !yoloPreflightError ? (
+            <div className="result-state result-state-empty">
+              <strong>No YOLO preflight loaded.</strong>
+              <p>Refresh preflight to inspect the live backend AI runtime before running configured YOLO.</p>
+            </div>
+          ) : null}
+        </div>
+        {yoloPreflight ? (
+          <div className={yoloPreflight.status === 'ready' ? 'lab-readiness-panel lab-readiness-panel-ready' : 'lab-readiness-panel'}>
+            <div className="ai-lab-section-header">
+              <div>
+                <h3>Status: {yoloPreflight.status}</h3>
+                <p>{yoloPreflight.message}</p>
+              </div>
+              <span className={yoloPreflight.status === 'ready' ? 'status-badge status-badge-ready' : 'status-badge'}>
+                {yoloPreflight.checks.dependencies_available ? 'dependencies visible' : 'not ready'}
+              </span>
+            </div>
+            <div className="lab-readiness-grid">
+              <div className={yoloPreflight.checks.enabled ? 'lab-readiness-item lab-readiness-item-ready' : 'lab-readiness-item'}>
+                <span>YOLO enabled</span>
+                <strong>{yoloPreflight.checks.enabled ? 'true' : 'false'}</strong>
+              </div>
+              <div className={yoloPreflight.checks.dependencies_available ? 'lab-readiness-item lab-readiness-item-ready' : 'lab-readiness-item'}>
+                <span>Dependencies</span>
+                <strong>{yoloPreflight.checks.dependencies_available === true ? 'available' : yoloPreflight.checks.dependencies_available === false ? 'unavailable' : 'not checked'}</strong>
+              </div>
+              <div className={yoloPreflight.checks.model_file_exists ? 'lab-readiness-item lab-readiness-item-ready' : 'lab-readiness-item'}>
+                <span>Local model file</span>
+                <strong>{yoloPreflight.checks.model_file_exists === true ? 'found' : yoloPreflight.checks.model_path_set ? 'missing' : 'not configured'}</strong>
+              </div>
+              <div className={yoloPreflight.runtime.cuda_available ? 'lab-readiness-item lab-readiness-item-ready' : 'lab-readiness-item'}>
+                <span>CUDA</span>
+                <strong>{yoloPreflight.runtime.cuda_available === true ? 'available' : yoloPreflight.runtime.cuda_available === false ? 'not available' : 'not checked'}</strong>
+              </div>
+            </div>
+            <div className="entity-meta">
+              <span>torch_version: {yoloPreflight.runtime.torch_version ?? 'n/a'}</span>
+              <span>ultralytics_version: {yoloPreflight.runtime.ultralytics_version ?? 'n/a'}</span>
+              <span>cuda_available: {String(yoloPreflight.runtime.cuda_available ?? 'unknown')}</span>
+              <span>YOLO_CONFIG_DIR: {yoloPreflight.runtime.yolo_config_dir ?? 'n/a'}</span>
+              <span>model directory: {yoloPreflight.runtime.model_directory ?? 'n/a'}</span>
+            </div>
+          </div>
+        ) : null}
+      </div>
+
       <div className="lab-block">
         <div className="ai-lab-run-surface" aria-label="Detection run controls">
           <h3>Run detection</h3>