feat(#119): expose route state in catalog API and sidebar/dashboard

Add routeState field to RouteSummary DTO (null for started, 'stopped'
or 'suspended' for non-default states). Sidebar shows stop/pause icons
and state badge for affected routes in both Apps and Routes sections.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

ui/src/components/LayoutShell.tsx

@@ -15,7 +15,7 @@ import {
   useStarred,
 } from '@cameleer/design-system';
 import type { SearchResult, SidebarTreeNode } from '@cameleer/design-system';
-import { Box, Cpu, GitBranch, Settings, FileText, ChevronRight } from 'lucide-react';
+import { Box, Cpu, GitBranch, Settings, FileText, ChevronRight, Square, Pause } from 'lucide-react';
 import { useRouteCatalog } from '../api/queries/catalog';
 import { useAgents } from '../api/queries/agents';
 import { useSearchExecutions, useAttributeKeys } from '../api/queries/executions';
@@ -140,6 +140,14 @@ function makeChevron() {
   return createElement(ChevronRight, { size: 14 });
 }
 
+function makeStopIcon() {
+  return createElement(Square, { size: 12, style: { color: 'var(--error)' } });
+}
+
+function makePauseIcon() {
+  return createElement(Pause, { size: 12, style: { color: 'var(--amber)' } });
+}
+
 /* ------------------------------------------------------------------ */
 /*  Section open-state keys                                           */
 /* ------------------------------------------------------------------ */
@@ -275,6 +283,7 @@ function LayoutContent() {
             id: r.routeId,
             name: r.routeId,
             exchangeCount: r.exchangeCount,
+            routeState: r.routeState ?? undefined,
           })),
         agents: [...(app.agents || [])]
           .sort((a: any, b: any) => cmp(a.name, b.name))
@@ -289,7 +298,7 @@ function LayoutContent() {
 
   // --- Tree nodes ---------------------------------------------------
   const appTreeNodes: SidebarTreeNode[] = useMemo(
-    () => buildAppTreeNodes(sidebarApps, makeStatusDot, makeChevron),
+    () => buildAppTreeNodes(sidebarApps, makeStatusDot, makeChevron, makeStopIcon, makePauseIcon),
     [sidebarApps],
   );
 
@@ -299,7 +308,7 @@ function LayoutContent() {
   );
 
   const routeTreeNodes: SidebarTreeNode[] = useMemo(
-    () => buildRouteTreeNodes(sidebarApps, makeStatusDot, makeChevron),
+    () => buildRouteTreeNodes(sidebarApps, makeStatusDot, makeChevron, makeStopIcon, makePauseIcon),
     [sidebarApps],
   );