feat(control-panel): embed H6 telemetry in goal view

packages/casan-control-panel/frontend/src/pages/Goals.tsx

@@ -203,6 +203,20 @@ export function Goals() {
     enabled: Boolean(selectedQuery.data?.trace_id),
     refetchInterval: (query) => query.state.data?.terminal ? false : 1200,
   });
+  const h6RunQuery = useQuery({
+    queryKey: ['reports', 'h6', 'goal-run', selectedQuery.data?.trace_id, selectedQuery.data?.updated_at],
+    queryFn: () => api.h6Report({ run: selectedQuery.data!.trace_id, limit: 20 }),
+    enabled: Boolean(selectedQuery.data?.trace_id),
+    retry: false,
+    refetchInterval: selectedQuery.data && !TERMINAL.has(selectedQuery.data.status) ? 2500 : false,
+  });
+  const h6ProjectQuery = useQuery({
+    queryKey: ['reports', 'h6', 'goal-project', selectedQuery.data?.project],
+    queryFn: () => api.h6Report({ project: selectedQuery.data!.project, limit: 20 }),
+    enabled: Boolean(selectedQuery.data?.project),
+    retry: false,
+    staleTime: 15_000,
+  });
   const start = useMutation({
     mutationFn: () => {
       if (!actor) throw new Error('Authenticated session is unavailable.');
@@ -353,7 +367,16 @@ export function Goals() {
             <StatusBadge value={selected.status} />
           </div>
 
-          <ModelInteractionDiagram goal={selected} localStage={localStage} cloudStage={cloudStage} trace={traceQuery.data} />
+          <ModelInteractionDiagram
+            goal={selected}
+            localStage={localStage}
+            cloudStage={cloudStage}
+            trace={traceQuery.data}
+            h6RunReport={h6RunQuery.data}
+            h6ProjectReport={h6ProjectQuery.data}
+            h6Loading={h6RunQuery.isLoading}
+            h6Error={h6RunQuery.isError}
+          />
 
           <Card className="!rounded-[1.35rem]" title="Governed outcome" right={<StatusBadge value={selected.status} />}>
             <GovernedOutcomePulse goal={selected} trace={traceQuery.data} />