theirongolddev/amc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(dashboard): add visual feedback for spawned agents

Browse Source
This commit is contained in:
teernisse
2026-02-26 17:09:51 -05:00
parent e3e42e53f2
commit 1e21dd08b6
2 changed files with 15 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
dashboard/components/SessionCard.js
View File

@@ -6,7 +6,7 @@ import { QuestionBlock } from './QuestionBlock.js';
import { SimpleInput } from './SimpleInput.js';
import { AgentActivityIndicator } from './AgentActivityIndicator.js';
export function SessionCard({ session, onClick, conversation, onFetchConversation, onRespond, onDismiss, enlarged = false, autocompleteConfig = null }) {
export function SessionCard({ session, onClick, conversation, onFetchConversation, onRespond, onDismiss, enlarged = false, autocompleteConfig = null, isNewlySpawned = false }) {
const hasQuestions = session.pending_questions && session.pending_questions.length > 0;
const statusMeta = getStatusMeta(session.status);
const agent = session.agent === 'codex' ? 'codex' : 'claude';
@@ -84,9 +84,10 @@ export function SessionCard({ session, onClick, conversation, onFetchConversatio
};
// Container classes differ based on enlarged mode
const spawnClass = isNewlySpawned ? ' session-card-spawned' : '';
const containerClasses = enlarged
? 'glass-panel flex w-full max-w-[90vw] max-h-[90vh] flex-col overflow-hidden rounded-2xl border border-selection/80'
: 'glass-panel flex h-[850px] max-h-[850px] w-[600px] cursor-pointer flex-col overflow-hidden rounded-xl border border-selection/70 transition-[border-color,box-shadow] duration-200 hover:border-starting/35 hover:shadow-panel';
: 'glass-panel flex h-[850px] max-h-[850px] w-[600px] cursor-pointer flex-col overflow-hidden rounded-xl border border-selection/70 transition-[border-color,box-shadow] duration-200 hover:border-starting/35 hover:shadow-panel' + spawnClass;
return html`
<div

13
dashboard/styles.css
View File

@@ -153,6 +153,16 @@ body {
animation: modalPanelOut 200ms ease-in forwards;
}
/* Spawn highlight animation - visual feedback when a newly spawned agent appears */
@keyframes spawn-highlight {
0% { box-shadow: 0 0 0 3px rgba(95, 208, 164, 0.6), 0 0 16px rgba(95, 208, 164, 0.15); }
100% { box-shadow: 0 0 0 0 transparent, 0 0 0 transparent; }
}
.session-card-spawned {
animation: spawn-highlight 2.5s ease-out;
}
/* Accessibility: disable continuous animations for motion-sensitive users */
@media (prefers-reduced-motion: reduce) {
.spinner-dot::after {
@@ -171,7 +181,8 @@ body {
animation: none;
}
.animate-float,
.animate-fade-in-up {
.animate-fade-in-up,
.session-card-spawned {
animation: none !important;
}
}