sync: update from private repo (0dd1a8e)

ui/src/components/detail/DetailHeader.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState, type CSSProperties } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { DetailTabId } from '../../lib/urlState';
@@ -231,6 +231,10 @@ export function DetailHeader({ title, subtitle, tabs, activeTab, tabTransitionPe
         {tabs.map(tab => {
           const active = activeTab === tab.id;
           const pending = active && tabTransitionPending;
+          // Browser/SSH tabs only appear while their session is LIVE (gated in
+          // DetailPanel), so any browser/ssh tab here is running — give it the
+          // flowing-light border to signal "this is live right now".
+          const live = tab.id === 'browser' || tab.id === 'ssh';
           return (
             <button
               key={tab.id}
@@ -243,7 +247,16 @@ export function DetailHeader({ title, subtitle, tabs, activeTab, tabTransitionPe
                   : 'border-transparent text-slate-500 font-medium hover:text-slate-800'
               }`}
             >
-              {t(tab.labelKey)}
+              {live ? (
+                <span
+                  className="live-flow-border px-1.5 py-0.5"
+                  style={{ '--flow-color': tab.id === 'ssh' ? '#34d399' : '#38bdf8' } as CSSProperties}
+                >
+                  {t(tab.labelKey)}
+                </span>
+              ) : (
+                t(tab.labelKey)
+              )}
               {pending && (
                 <span
                   aria-hidden="true"