fix: resolve UI glitches and improve consistency

- Sidebar: make +App button more subtle (lower opacity, brightens on hover)
- Sidebar: add filter chips to hide empty routes and offline/stale apps
- Sidebar: hide filter chips and +App button when sidebar is collapsed
- Exchange table: reorder columns to Status, Attributes, App, Route, Started, Duration; remove ExchangeId and Agent columns
- Exchange detail log tab: query by exchangeId only (no applicationId required), filter by processorId when processor selected
- KPI tooltips: styled tooltips with current/previous values, time period labels, percentage change, themed with DS variables
- KPI tooltips: fix overflow by left-aligning first two and right-aligning last two
- Exchange detail: show full datetime (YYYY-MM-DD HH:mm:ss.SSS) for start/end times
- Status labels: unify to title-case (Completed, Failed, Running) across all views
- Status filter buttons: match title-case labels (Completed, Warning, Failed, Running)
- Create app: show full external URL using routingDomain from env config or window.location.origin fallback
- Create app: add Runtime Type selector and Custom Arguments to Resources tab
- Create app: add Sensitive Keys tab with agent defaults, global keys, and app-specific keys (matching admin page design)
- Create app: add placeholder text to all Input fields for consistency
- Update design-system to 0.1.52 (sidebar collapse toggle fix)

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

ui/src/pages/Dashboard/Dashboard.tsx

@@ -54,12 +54,6 @@ function durationClass(ms: number, status: string): string {
   return styles.durBreach
 }
 
-function shortAgentName(name: string): string {
-  const parts = name.split('-')
-  if (parts.length >= 3) return parts.slice(-2).join('-')
-  return name
-}
-
 // ─── Table columns ────────────────────────────────────────────────────────────
 
 function buildColumns(hasAttributes: boolean): Column<Row>[] {
@@ -77,22 +71,6 @@ function buildColumns(hasAttributes: boolean): Column<Row>[] {
         </span>
       ),
     },
-    {
-      key: 'routeId',
-      header: 'Route',
-      sortable: true,
-      render: (_: unknown, row: Row) => (
-        <span className={styles.routeName}>{row.routeId}</span>
-      ),
-    },
-    {
-      key: 'applicationId',
-      header: 'Application',
-      sortable: true,
-      render: (_: unknown, row: Row) => (
-        <span className={styles.appName}>{row.applicationId ?? ''}</span>
-      ),
-    },
     ...(hasAttributes ? [{
       key: 'attributes' as const,
       header: 'Attributes',
@@ -115,20 +93,19 @@ function buildColumns(hasAttributes: boolean): Column<Row>[] {
       },
     }] : []),
     {
-      key: 'executionId',
-      header: 'Exchange ID',
+      key: 'applicationId',
+      header: 'App',
       sortable: true,
       render: (_: unknown, row: Row) => (
-        <span
-          title={row.executionId}
-          style={{ cursor: 'pointer' }}
-          onClick={(e: React.MouseEvent) => {
-            e.stopPropagation();
-            navigator.clipboard.writeText(row.executionId);
-          }}
-        >
-          <MonoText size="xs">...{row.executionId.slice(-8)}</MonoText>
-        </span>
+        <span className={styles.appName}>{row.applicationId ?? ''}</span>
+      ),
+    },
+    {
+      key: 'routeId',
+      header: 'Route',
+      sortable: true,
+      render: (_: unknown, row: Row) => (
+        <span className={styles.routeName}>{row.routeId}</span>
       ),
     },
     {
@@ -149,16 +126,6 @@ function buildColumns(hasAttributes: boolean): Column<Row>[] {
         </MonoText>
       ),
     },
-    {
-      key: 'instanceId',
-      header: 'Agent',
-      render: (_: unknown, row: Row) => (
-        <span className={styles.agentBadge}>
-          <span className={styles.agentDot} />
-          <span title={row.instanceId}>{shortAgentName(row.instanceId)}</span>
-        </span>
-      ),
-    },
   ]
 }