From 0404f7aa31774b11f6eabaef7b88d57a4318f461 Mon Sep 17 00:00:00 2001
From: director-agent <director-agent@dragonchain.com>
Date: Tue, 7 Apr 2026 15:19:00 -0500
Subject: [PATCH] plan/7: Add active-agent count badge to AgentStatus panel

Adds a count badge next to the Agents section title showing the number
of agents currently in idle or working state (excludes offline).
Badge style matches existing PlanBoard and DirectorQueue badges:
font-mono text-[10px] uppercase tracking-wider text-gray-400.

Build verified clean (tsc + vite, 0 errors).
---
 ui/src/components/AgentStatus.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/AgentStatus.tsx b/ui/src/components/AgentStatus.tsx
index 1539687..e1ea743 100644
--- a/ui/src/components/AgentStatus.tsx
+++ b/ui/src/components/AgentStatus.tsx
@@ -17,8 +17,11 @@ export function AgentStatus({ agents }: { agents: Agent[] }) {
   return (
     <div className="rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 p-4">
       <div className="flex items-center gap-2 mb-3">
-        <h2 className="text-lg font-semibold text-gray-900 dark:text-gray-100">Agents</h2>
-      </div>
+    <h2 className="text-lg font-semibold text-gray-900 dark:text-gray-100">Agents</h2>
+    <span className="font-mono text-[10px] uppercase tracking-wider text-gray-400">
+      {agents.filter(a => a.status === 'idle' || a.status === 'working').length} active
+    </span>
+  </div>
       <div className="space-y-2">
         {agents.map((agent) => (
           <div key={agent.id} className="flex items-center justify-between p-2 rounded bg-gray-50 dark:bg-gray-750">