fix(ui): clicking app or route in exchange header clears selection and returns to table

ui/src/pages/Exchanges/ExchangeHeader.tsx

@@ -11,6 +11,7 @@ import styles from './ExchangeHeader.module.css';
 interface ExchangeHeaderProps {
   detail: ExecutionDetail;
   onCorrelatedSelect?: (executionId: string, applicationName: string, routeId: string) => void;
+  onClearSelection?: () => void;
 }
 
 type StatusVariant = 'success' | 'error' | 'running' | 'warning';
@@ -39,7 +40,7 @@ function formatDuration(ms: number): string {
   return `${ms}ms`;
 }
 
-export function ExchangeHeader({ detail, onCorrelatedSelect }: ExchangeHeaderProps) {
+export function ExchangeHeader({ detail, onCorrelatedSelect, onClearSelection }: ExchangeHeaderProps) {
   const navigate = useNavigate();
   const { data: chainResult } = useCorrelationChain(detail.correlationId ?? null);
   const chain = chainResult?.data;
@@ -69,10 +70,10 @@ export function ExchangeHeader({ detail, onCorrelatedSelect }: ExchangeHeaderPro
           </>
         )}
         <span className={styles.separator} />
-        <button className={styles.linkBtn} onClick={() => navigate(`/exchanges/${detail.applicationName}`)} title="Show all exchanges for this application">
+        <button className={styles.linkBtn} onClick={() => { onClearSelection?.(); 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">
+        <button className={styles.linkBtn} onClick={() => { onClearSelection?.(); 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>