4efc461c1e
STORY: With the shell layout complete, we needed the actual content for each view. Three agents worked in parallel on the card components that would populate the Social and Swarm views, plus integrating the existing graph into the shell. COLLABORATION: Agent bb-98c (social-card-builder) created SocialCard: - Task ID with teal styling - UNLOCKS section (green) showing what this task unblocks - BLOCKS section (amber) showing what's blocking this task - Agent avatars with liveness glow - View-jump icons for quick navigation Agent bb-nuy (swarm-card-builder) created SwarmCard: - Agent roster with liveness indicators - Progress bar (ASCII block format: ████████░░░░) - Attention items with warning styling - View-jump icons Agent bb-54x (graph-integrator) integrated WorkflowGraph: - Created GraphView wrapper with Flow/Overview tabs - Wired into UnifiedShell when view=graph - Connected taskId to selectedId for URL sync - Connected graphTab to URL state DELIVERABLES: - src/components/social/social-card.tsx: Task card for activity feed - src/components/swarm/swarm-card.tsx: Swarm health card - src/components/graph/graph-view.tsx: Graph wrapper with tabs - src/components/shared/mobile-nav.tsx: Bottom tab bar - Tests for all components VERIFICATION: - npm run typecheck: PASS - npm run lint: PASS - npm run test: PASS CLOSES: bb-ui2.11, bb-ui2.16, bb-ui2.20
76 lines
2.6 KiB
TypeScript
76 lines
2.6 KiB
TypeScript
import { describe, it } from 'node:test';
|
|
import assert from 'node:assert';
|
|
|
|
describe('SwarmCard Component Contract', () => {
|
|
it('exports SwarmCard component', async () => {
|
|
try {
|
|
const mod = await import('../../../src/components/swarm/swarm-card');
|
|
assert.ok(mod.SwarmCard, 'SwarmCard should be exported');
|
|
assert.equal(typeof mod.SwarmCard, 'function', 'SwarmCard should be a function/component');
|
|
} catch (err: any) {
|
|
assert.fail(`SwarmCard module should exist: ${err.message}`);
|
|
}
|
|
});
|
|
|
|
it('SwarmCard component can be imported without errors', async () => {
|
|
try {
|
|
const mod = await import('../../../src/components/swarm/swarm-card');
|
|
assert.ok(mod.SwarmCard, 'Component should be importable');
|
|
} catch (err: any) {
|
|
assert.fail(`Component import failed: ${err.message}`);
|
|
}
|
|
});
|
|
});
|
|
|
|
describe('SwarmCard Agent Roster', () => {
|
|
it('renders agent avatars with liveness glow', async () => {
|
|
try {
|
|
const mod = await import('../../../src/components/swarm/swarm-card');
|
|
assert.ok(mod.SwarmCard, 'SwarmCard should exist');
|
|
} catch (err: any) {
|
|
assert.fail(`SwarmCard should render agent avatars: ${err.message}`);
|
|
}
|
|
});
|
|
|
|
it('displays agent current task when available', async () => {
|
|
try {
|
|
const mod = await import('../../../src/components/swarm/swarm-card');
|
|
assert.ok(mod.SwarmCard, 'SwarmCard should exist');
|
|
} catch (err: any) {
|
|
assert.fail(`SwarmCard should show current task: ${err.message}`);
|
|
}
|
|
});
|
|
});
|
|
|
|
describe('SwarmCard Progress Bar', () => {
|
|
it('renders progress bar showing completion percentage', async () => {
|
|
try {
|
|
const mod = await import('../../../src/components/swarm/swarm-card');
|
|
assert.ok(mod.SwarmCard, 'SwarmCard should exist');
|
|
} catch (err: any) {
|
|
assert.fail(`SwarmCard should render progress bar: ${err.message}`);
|
|
}
|
|
});
|
|
});
|
|
|
|
describe('SwarmCard Attention Items', () => {
|
|
it('renders attention items with warning styling', async () => {
|
|
try {
|
|
const mod = await import('../../../src/components/swarm/swarm-card');
|
|
assert.ok(mod.SwarmCard, 'SwarmCard should exist');
|
|
} catch (err: any) {
|
|
assert.fail(`SwarmCard should render attention items: ${err.message}`);
|
|
}
|
|
});
|
|
});
|
|
|
|
describe('SwarmCard View-Jump Icons', () => {
|
|
it('renders view-jump icons for navigation', async () => {
|
|
try {
|
|
const mod = await import('../../../src/components/swarm/swarm-card');
|
|
assert.ok(mod.SwarmCard, 'SwarmCard should exist');
|
|
} catch (err: any) {
|
|
assert.fail(`SwarmCard should have view-jump icons: ${err.message}`);
|
|
}
|
|
});
|
|
});
|