chore: misc updates and fixes

- lib/utils.ts: Add getArchetypeDisplayChar helper (duplicate of src/lib)
- globals.css: Style updates
- swarm-command-feed.tsx: Component updates
- telemetry-grid.tsx: Use getArchetypeDisplayChar
- test-watcher.ts: Test utility updates
This commit is contained in:
zenchantlive 2026-02-26 10:25:31 -08:00
parent 1ee8dc8ca2
commit 5ff4469dd5
5 changed files with 24 additions and 19 deletions

View file

@ -4,3 +4,7 @@ import { twMerge } from "tailwind-merge";
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs));
}
export function getArchetypeDisplayChar(archetype: { icon?: string; name: string }): string {
return archetype.icon || archetype.name.charAt(0) || '?';
}

View file

@ -4,16 +4,16 @@
:root {
/* ========== VISUAL-TRUTH UI TOKEN CONTRACT (bb-vt.1.1) ========== */
--ui-bg-app: #070d16;
--ui-bg-shell: #0c1420;
--ui-bg-panel: #111c2a;
--ui-bg-app: #0a0908;
--ui-bg-shell: #12100e;
--ui-bg-panel: #1a1714;
--ui-bg-card: #1a2431;
--ui-border-soft: rgba(153, 171, 190, 0.2);
--ui-border-strong: rgba(153, 171, 190, 0.34);
--ui-border-soft: rgba(185, 171, 153, 0.15);
--ui-border-strong: rgba(185, 171, 153, 0.25);
--ui-text-primary: #e8edf5;
--ui-text-muted: #8f9caf;
--ui-text-primary: #f0ece1;
--ui-text-muted: #9e9589;
--ui-accent-ready: #35d98f;
--ui-accent-blocked: #ff4c72;
@ -37,9 +37,9 @@
--color-accent-teal: var(--ui-accent-info);
--color-text-primary: var(--ui-text-primary);
--color-text-secondary: #c4cfdb;
--color-text-secondary: #c9c4be;
--color-text-muted: var(--ui-text-muted);
--color-text-on-primary: #10161d;
--color-text-on-primary: #12100e;
--color-border-default: var(--ui-border-strong);
--color-border-subtle: var(--ui-border-soft);
@ -321,19 +321,19 @@ body {
.ui-shell-topbar {
background: linear-gradient(180deg, color-mix(in srgb, var(--ui-bg-panel) 92%, black), var(--ui-bg-shell));
border-bottom: 1px solid color-mix(in srgb, var(--ui-accent-info) 22%, var(--ui-border-soft));
border-bottom: 1px solid color-mix(in srgb, var(--ui-accent-warning) 15%, var(--ui-border-soft));
box-shadow: 0 10px 24px -20px rgba(0, 0, 0, 0.9);
}
.ui-shell-middle {
background: linear-gradient(180deg, color-mix(in srgb, var(--ui-bg-app) 74%, black), color-mix(in srgb, var(--ui-bg-app) 90%, black));
border-left: 1px solid color-mix(in srgb, var(--ui-accent-info) 20%, var(--ui-border-soft));
border-right: 1px solid color-mix(in srgb, var(--ui-accent-info) 20%, var(--ui-border-soft));
border-left: 1px solid color-mix(in srgb, var(--ui-accent-warning) 12%, var(--ui-border-soft));
border-right: 1px solid color-mix(in srgb, var(--ui-accent-warning) 12%, var(--ui-border-soft));
}
.ui-shell-panel {
background: linear-gradient(180deg, color-mix(in srgb, var(--ui-bg-shell) 86%, black), color-mix(in srgb, var(--ui-bg-panel) 84%, black));
border-left: 1px solid color-mix(in srgb, var(--ui-accent-info) 30%, var(--ui-border-soft));
border-left: 1px solid color-mix(in srgb, var(--ui-accent-warning) 20%, var(--ui-border-soft));
}
.ui-tabular-nums {

View file

@ -5,7 +5,7 @@ import type { BeadIssue } from '../../lib/types';
import type { ActivityEvent } from '../../lib/activity';
import { useArchetypes } from '../../hooks/use-archetypes';
import { ScrollArea } from '@/components/ui/scroll-area';
import { cn } from '@/lib/utils';
import { cn, getArchetypeDisplayChar } from '@/lib/utils';
import { Avatar, AvatarFallback } from '@/components/ui/avatar';
import { getEventTone, formatRelativeTime, getInitials } from './activity-panel';
@ -100,8 +100,8 @@ export function SwarmCommandFeed({ epicId, issues, projectRoot }: SwarmCommandFe
<div className="relative">
<div className="absolute -inset-0.5 rounded-full blur-[2px] opacity-70 bg-emerald-500/20" />
<Avatar className="h-9 w-9 relative z-10 ring-2 ring-emerald-500/40">
<AvatarFallback className="text-[10px] font-bold" style={{ backgroundColor: agent.archetype?.color ? `\${agent.archetype.color}20` : '#252525', color: agent.archetype?.color || '#fff' }}>
{getInitials(agent.assignee)}
<AvatarFallback className="text-[10px] font-bold" style={{ backgroundColor: agent.archetype?.color ? `${agent.archetype.color}20` : '#252525', color: agent.archetype?.color || '#fff' }}>
{agent.archetype ? getArchetypeDisplayChar(agent.archetype) : getInitials(agent.assignee)}
</AvatarFallback>
</Avatar>
</div>

View file

@ -5,6 +5,7 @@ import React, { useState } from 'react';
import { Loader2, AlertCircle, Bot, Zap } from 'lucide-react';
import type { BeadIssue } from '../../lib/types';
import type { AgentArchetype } from '../../lib/types-swarm';
import { getArchetypeDisplayChar } from '../../lib/utils';
import { WorkflowGraph } from '../shared/workflow-graph';
@ -190,7 +191,7 @@ export function TelemetryGrid({ epicId, issues, archetypes }: TelemetryGridProps
className="h-8 w-8 rounded flex-shrink-0 flex items-center justify-center font-bold text-sm border"
style={{ backgroundColor: `${r.archetype?.color || '#888'}15`, color: r.archetype?.color || '#888', borderColor: `${r.archetype?.color || '#888'}30` }}
>
{r.assignee.charAt(0).toUpperCase()}
{r.archetype ? getArchetypeDisplayChar(r.archetype) : r.assignee.charAt(0).toUpperCase()}
</div>
<div className="min-w-0 flex-1">
<div className="text-xs font-bold text-[var(--ui-text-primary)] truncate">{r.assignee}</div>

View file

@ -1,5 +1,5 @@
import { readIssuesFromDisk } from './src/lib/read-issues.ts';
import { runBdCommand } from './src/lib/bridge.ts';
import { readIssuesFromDisk } from './src/lib/read-issues';
import { runBdCommand } from './src/lib/bridge';
const projectRoot = 'C:\\Users\\Zenchant\\codex\\beadboard';