feat(ui): make app/route/agent clickable in exchange header for navigation

ui/src/pages/Exchanges/ExchangeHeader.module.css

@@ -41,6 +41,29 @@
   flex-shrink: 0;
 }
 
+.linkBtn {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  background: none;
+  border: none;
+  padding: 2px 4px;
+  margin: -2px 0;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  font: inherit;
+  font-size: 0.75rem;
+  transition: background 0.1s, color 0.1s;
+}
+
+.linkBtn:hover {
+  background: var(--bg-hover);
+}
+
+.linkBtn:hover .icon {
+  color: var(--amber);
+}
+
 .agentLabel {
   font-size: 0.625rem;
   font-weight: 600;

ui/src/pages/Exchanges/ExchangeHeader.tsx

@@ -57,15 +57,21 @@ export function ExchangeHeader({ detail }: ExchangeHeaderProps) {
           </>
         )}
         <span className={styles.separator} />
-        <span className={styles.app}>{detail.applicationName}</span>
-        <GitBranch size={12} className={styles.icon} />
-        <span className={styles.route}>{detail.routeId}</span>
+        <button className={styles.linkBtn} onClick={() => navigate(`/exchanges/${detail.applicationName}`)} title="Show all exchanges for this application">
+          <span className={styles.app}>{detail.applicationName}</span>
+        </button>
+        <button className={styles.linkBtn} onClick={() => navigate(`/exchanges/${detail.applicationName}/${detail.routeId}`)} title="Show all exchanges for this route">
+          <span className={styles.route}>{detail.routeId}</span>
+          <GitBranch size={12} className={styles.icon} />
+        </button>
         {detail.agentId && (
           <>
             <span className={styles.separator} />
-            <Server size={12} className={styles.icon} />
-            <span className={styles.app}>{detail.applicationName}</span>
-            <MonoText size="xs">{detail.agentId}</MonoText>
+            <button className={styles.linkBtn} onClick={() => navigate(`/runtime/${detail.applicationName}/${detail.agentId}`)} title="Go to agent details">
+              <span className={styles.app}>{detail.applicationName}</span>
+              <MonoText size="xs">{detail.agentId}</MonoText>
+              <Server size={12} className={styles.icon} />
+            </button>
           </>
         )}
         <span className={styles.duration}>{formatDuration(detail.durationMs)}</span>