feat(web): add overview system module foundation

apps/web/src/app-shell.tsx

@@ -7,6 +7,7 @@ import { createEventStreamClient, type EventStreamClient } from './events/event-
 import { FleetPage, type FleetDataSource, type FleetSnapshot } from './fleet/fleet-page.js';
 import { createFleetApiDataSource } from './fleet/fleet-api-data-source.js';
 import { InstanceEditor, type InstanceDataSource } from './instances/instance-crud.js';
+import { OverviewSystemPage, type OverviewDataSource } from './instances/overview-system.js';
 import {
   InstanceDetail,
   INSTANCE_MODULE_LABELS,
@@ -61,6 +62,7 @@ export interface AppShellProps {
   instanceDataSource?: InstanceDataSource;
   capabilities?: InstanceCapabilityMap;
   capabilityDataSource?: CapabilityDataSource;
+  overviewDataSource?: OverviewDataSource;
   eventStreamClient?: EventStreamClient;
 }
 
@@ -128,7 +130,9 @@ function Page({
   instanceDataSource,
   capabilities,
   capabilityDataSource,
+  overviewDataSource,
   fleetRefreshSignal,
+  detailRefreshSignal,
 }: {
   route: ResolvedRoute;
   fleetDataSource: FleetDataSource | undefined;
@@ -137,7 +141,9 @@ function Page({
   instanceDataSource: InstanceDataSource | undefined;
   capabilities: InstanceCapabilityMap | undefined;
   capabilityDataSource: CapabilityDataSource | undefined;
+  overviewDataSource: OverviewDataSource | undefined;
   fleetRefreshSignal: number;
+  detailRefreshSignal: number;
 }): ReactNode {
   if (route.kind === 'fleet')
     return (
@@ -179,6 +185,17 @@ function Page({
         {...(instance ? { instance } : {})}
         {...(capabilities ? { capabilities } : {})}
         {...(capabilityDataSource ? { capabilityDataSource } : {})}
+        {...(module === 'overview' && instance
+          ? {
+              moduleContent: (
+                <OverviewSystemPage
+                  instance={instance}
+                  {...(overviewDataSource ? { dataSource: overviewDataSource } : {})}
+                  refreshSignal={detailRefreshSignal}
+                />
+              ),
+            }
+          : {})}
       />
     );
   }
@@ -209,6 +226,7 @@ export function AppShell({
   instanceDataSource,
   capabilities,
   capabilityDataSource,
+  overviewDataSource,
   eventStreamClient,
 }: AppShellProps) {
   const defaultEventStreamClient = useMemo(() => createEventStreamClient(), []);
@@ -261,7 +279,9 @@ export function AppShell({
             instanceDataSource={instanceDataSource}
             capabilities={capabilities}
             capabilityDataSource={capabilityDataSource}
+            overviewDataSource={overviewDataSource}
             fleetRefreshSignal={refresh.fleet}
+            detailRefreshSignal={refresh.detail}
           />
         </main>
       </div>