diff --git a/frontend/src/app/pages/AgentChat/AgentChat.tsx b/frontend/src/app/pages/AgentChat/AgentChat.tsx index f27c5a37..f5378152 100644 --- a/frontend/src/app/pages/AgentChat/AgentChat.tsx +++ b/frontend/src/app/pages/AgentChat/AgentChat.tsx @@ -473,7 +473,7 @@ const AgentChat: React.FC = ({ sessionId: sessionIdProp, onClose if (wasActive && isTerminal) { if (id) { dispatch(fadeGlowingBrowserCards(id)); - setTimeout(() => dispatch(clearGlowingBrowserCards(id)), 2800); + setTimeout(() => dispatch(clearGlowingBrowserCards(id)), 600); } const nextQueued = messageQueueRef.current.shift(); diff --git a/frontend/src/app/pages/Dashboard/canvas/TetherLayer.tsx b/frontend/src/app/pages/Dashboard/canvas/TetherLayer.tsx index f22fd450..b57481bc 100644 --- a/frontend/src/app/pages/Dashboard/canvas/TetherLayer.tsx +++ b/frontend/src/app/pages/Dashboard/canvas/TetherLayer.tsx @@ -2,7 +2,7 @@ import React from 'react'; import type { ClaudeTokens } from '@/shared/styles/claudeTokens'; import type { Tether } from '../geometry/dashboardTethers'; -const TETHER_FADE_MS = 2500; +const TETHER_FADE_MS = 500; interface TetherLayerProps { tethers: Tether[]; diff --git a/frontend/src/app/pages/Dashboard/cards/BrowserCard.tsx b/frontend/src/app/pages/Dashboard/cards/BrowserCard.tsx index ae40d12e..f6542331 100644 --- a/frontend/src/app/pages/Dashboard/cards/BrowserCard.tsx +++ b/frontend/src/app/pages/Dashboard/cards/BrowserCard.tsx @@ -716,9 +716,10 @@ const BrowserCard: React.FC = ({ const accentColor = c.accent.primary; const glowingBrowserCards = useAppSelector((s) => s.dashboardLayout.glowingBrowserCards); - const isGlowingFromRedux = !!glowingBrowserCards[browserId]; + const browserGlow = glowingBrowserCards[browserId]; - const showGlow = isGlowingFromRedux; + // Drop the glow the moment the agent's done (fading) so it eases off via the 0.4s box-shadow transition, instead of holding full until the entry clears. The tether arrow already keyed off `fading`; the card never did. + const showGlow = !!browserGlow && !browserGlow.fading; const agentBorder = isHighlighted ? `2px solid ${c.accent.primary}`