chore: snapshot main sync

apps/web/src/components/control/FleetTab.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import { AnimatePresence } from 'framer-motion';
 import { Settings2 } from 'lucide-react';
-import { ControlFleetHost } from '@/hooks/useControlStream';
+import { ControlFleetHost, ControlPerfSample, ControlConnection } from '@/hooks/useControlStream';
 import { HostCard } from './HostCard';
 import { HostConfigEditor } from './HostConfigEditor';
 
@@ -15,15 +15,23 @@ export interface GpuData {
 interface FleetTabProps {
   hosts: ControlFleetHost[];
   gpuMap: Map<string, GpuData>;
+  perfSamples?: ControlPerfSample[];
+  connection?: ControlConnection;
 }
 
-export function FleetTab({ hosts, gpuMap }: FleetTabProps) {
+export function FleetTab({ hosts, gpuMap, perfSamples = [], connection = 'connecting' }: FleetTabProps) {
   const [editing, setEditing] = useState<string | null>(null);
 
   if (hosts.length === 0) {
+    // B3: distinguish "not connected" from a genuinely empty fleet.
+    const msg = connection === 'live'
+      ? 'No hosts connected'
+      : connection === 'down'
+        ? 'Control service unreachable — retrying…'
+        : 'Connecting to control service…';
     return (
       <div className="flex items-center justify-center h-full">
-        <p className="text-sm text-muted-foreground">No hosts connected</p>
+        <p className="text-sm text-muted-foreground">{msg}</p>
       </div>
     );
   }
@@ -41,7 +49,7 @@ export function FleetTab({ hosts, gpuMap }: FleetTabProps) {
             >
               <Settings2 className="size-4" />
             </button>
-            <HostCard host={host} gpuData={gpuMap.get(host.providerId) ?? null} />
+            <HostCard host={host} gpuData={gpuMap.get(host.providerId) ?? null} perfSamples={perfSamples} />
           </div>
         ))}
       </AnimatePresence>