CI/CD

ui/src/components/StatusPanels.jsx

@@ -0,0 +1,44 @@
+import { KvList } from "./KvList";
+
+function formatNumber(value, digits = 3) {
+  return Number(value ?? 0).toFixed(digits);
+}
+
+export function StatusPanels({ app, performance, runtime, video }) {
+  return (
+    <section className="status-grid">
+      <div className="panel">
+        <h2>Runtime</h2>
+        <KvList
+          values={[
+            ["Layer Count", `${runtime.layerCount || 0}`],
+            ["Auto Reload", app.autoReload ? "On" : "Off"],
+            ["Temporal Cap", `${app.maxTemporalHistoryFrames ?? 0}`],
+            ["Control URL", `http://127.0.0.1:${app.serverPort}`],
+            ["Compile Status", runtime.compileSucceeded ? "Ready" : "Error"],
+            ["Render Time", `${formatNumber(performance.renderMs, 2)} ms`],
+            ["Smoothed Time", `${formatNumber(performance.smoothedRenderMs, 2)} ms`],
+            ["Frame Budget", `${formatNumber(performance.frameBudgetMs, 2)} ms`],
+            ["Budget Used", `${formatNumber(performance.budgetUsedPercent, 1)}%`],
+          ]}
+        />
+      </div>
+
+      <div className="panel">
+        <h2>Video</h2>
+        <KvList
+          values={[
+            ["Signal", video.hasSignal ? "Present" : "Missing"],
+            ["Mode", video.modeName || "Unknown"],
+            ["Resolution", `${video.width || 0} x ${video.height || 0}`],
+          ]}
+        />
+      </div>
+
+      <div className="panel panel--full">
+        <h2>Compiler</h2>
+        <pre>{runtime.compileMessage || "No compiler output."}</pre>
+      </div>
+    </section>
+  );
+}