claude-mpm 4.2.44__py3-none-any.whl → 4.2.51__py3-none-any.whl

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (148) hide show
  1. claude_mpm/VERSION +1 -1
  2. claude_mpm/agents/BASE_PM.md +43 -1
  3. claude_mpm/agents/INSTRUCTIONS.md +75 -1
  4. claude_mpm/agents/WORKFLOW.md +46 -1
  5. claude_mpm/agents/frontmatter_validator.py +20 -12
  6. claude_mpm/agents/templates/nextjs_engineer.json +277 -0
  7. claude_mpm/agents/templates/python_engineer.json +289 -0
  8. claude_mpm/agents/templates/react_engineer.json +11 -3
  9. claude_mpm/agents/templates/security.json +50 -9
  10. claude_mpm/cli/commands/agents.py +2 -2
  11. claude_mpm/cli/commands/uninstall.py +1 -2
  12. claude_mpm/cli/interactive/agent_wizard.py +3 -3
  13. claude_mpm/cli/parsers/agent_manager_parser.py +3 -3
  14. claude_mpm/cli/parsers/agents_parser.py +1 -1
  15. claude_mpm/constants.py +1 -1
  16. claude_mpm/core/error_handler.py +2 -4
  17. claude_mpm/core/file_utils.py +4 -12
  18. claude_mpm/core/log_manager.py +8 -5
  19. claude_mpm/core/logger.py +1 -1
  20. claude_mpm/core/logging_utils.py +6 -6
  21. claude_mpm/core/unified_agent_registry.py +18 -4
  22. claude_mpm/dashboard/react/components/DataInspector/DataInspector.module.css +188 -0
  23. claude_mpm/dashboard/react/components/EventViewer/EventViewer.module.css +156 -0
  24. claude_mpm/dashboard/react/components/shared/ConnectionStatus.module.css +38 -0
  25. claude_mpm/dashboard/react/components/shared/FilterBar.module.css +92 -0
  26. claude_mpm/dashboard/static/archive/activity_dashboard_fixed.html +248 -0
  27. claude_mpm/dashboard/static/archive/activity_dashboard_test.html +61 -0
  28. claude_mpm/dashboard/static/archive/test_activity_connection.html +179 -0
  29. claude_mpm/dashboard/static/archive/test_claude_tree_tab.html +68 -0
  30. claude_mpm/dashboard/static/archive/test_dashboard.html +409 -0
  31. claude_mpm/dashboard/static/archive/test_dashboard_fixed.html +519 -0
  32. claude_mpm/dashboard/static/archive/test_dashboard_verification.html +181 -0
  33. claude_mpm/dashboard/static/archive/test_file_data.html +315 -0
  34. claude_mpm/dashboard/static/archive/test_file_tree_empty_state.html +243 -0
  35. claude_mpm/dashboard/static/archive/test_file_tree_fix.html +234 -0
  36. claude_mpm/dashboard/static/archive/test_file_tree_rename.html +117 -0
  37. claude_mpm/dashboard/static/archive/test_file_tree_tab.html +115 -0
  38. claude_mpm/dashboard/static/archive/test_file_viewer.html +224 -0
  39. claude_mpm/dashboard/static/archive/test_final_activity.html +220 -0
  40. claude_mpm/dashboard/static/archive/test_tab_fix.html +139 -0
  41. claude_mpm/dashboard/static/built/assets/events.DjpNxWNo.css +1 -0
  42. claude_mpm/dashboard/static/built/components/activity-tree.js +1 -1
  43. claude_mpm/dashboard/static/built/components/agent-hierarchy.js +777 -0
  44. claude_mpm/dashboard/static/built/components/agent-inference.js +1 -1
  45. claude_mpm/dashboard/static/built/components/build-tracker.js +333 -0
  46. claude_mpm/dashboard/static/built/components/code-simple.js +857 -0
  47. claude_mpm/dashboard/static/built/components/code-tree/tree-breadcrumb.js +353 -0
  48. claude_mpm/dashboard/static/built/components/code-tree/tree-constants.js +235 -0
  49. claude_mpm/dashboard/static/built/components/code-tree/tree-search.js +409 -0
  50. claude_mpm/dashboard/static/built/components/code-tree/tree-utils.js +435 -0
  51. claude_mpm/dashboard/static/built/components/code-viewer.js +2 -1076
  52. claude_mpm/dashboard/static/built/components/connection-debug.js +654 -0
  53. claude_mpm/dashboard/static/built/components/diff-viewer.js +891 -0
  54. claude_mpm/dashboard/static/built/components/event-processor.js +1 -1
  55. claude_mpm/dashboard/static/built/components/event-viewer.js +1 -1
  56. claude_mpm/dashboard/static/built/components/export-manager.js +1 -1
  57. claude_mpm/dashboard/static/built/components/file-change-tracker.js +443 -0
  58. claude_mpm/dashboard/static/built/components/file-change-viewer.js +690 -0
  59. claude_mpm/dashboard/static/built/components/file-tool-tracker.js +1 -1
  60. claude_mpm/dashboard/static/built/components/module-viewer.js +1 -1
  61. claude_mpm/dashboard/static/built/components/nav-bar.js +145 -0
  62. claude_mpm/dashboard/static/built/components/page-structure.js +429 -0
  63. claude_mpm/dashboard/static/built/components/session-manager.js +1 -1
  64. claude_mpm/dashboard/static/built/components/ui-state-manager.js +2 -465
  65. claude_mpm/dashboard/static/built/components/working-directory.js +1 -1
  66. claude_mpm/dashboard/static/built/connection-manager.js +536 -0
  67. claude_mpm/dashboard/static/built/dashboard.js +1 -1
  68. claude_mpm/dashboard/static/built/extension-error-handler.js +164 -0
  69. claude_mpm/dashboard/static/built/react/events.js +30 -0
  70. claude_mpm/dashboard/static/built/shared/dom-helpers.js +396 -0
  71. claude_mpm/dashboard/static/built/shared/event-bus.js +330 -0
  72. claude_mpm/dashboard/static/built/shared/event-filter-service.js +540 -0
  73. claude_mpm/dashboard/static/built/shared/logger.js +385 -0
  74. claude_mpm/dashboard/static/built/shared/page-structure.js +251 -0
  75. claude_mpm/dashboard/static/built/shared/tooltip-service.js +253 -0
  76. claude_mpm/dashboard/static/built/socket-client.js +1 -1
  77. claude_mpm/dashboard/static/built/tab-isolation-fix.js +185 -0
  78. claude_mpm/dashboard/static/css/dashboard.css +28 -5
  79. claude_mpm/dashboard/static/dist/assets/events.DjpNxWNo.css +1 -0
  80. claude_mpm/dashboard/static/dist/components/activity-tree.js +1 -1
  81. claude_mpm/dashboard/static/dist/components/agent-inference.js +1 -1
  82. claude_mpm/dashboard/static/dist/components/code-viewer.js +2 -0
  83. claude_mpm/dashboard/static/dist/components/event-processor.js +1 -1
  84. claude_mpm/dashboard/static/dist/components/event-viewer.js +1 -1
  85. claude_mpm/dashboard/static/dist/components/export-manager.js +1 -1
  86. claude_mpm/dashboard/static/dist/components/file-tool-tracker.js +1 -1
  87. claude_mpm/dashboard/static/dist/components/module-viewer.js +1 -1
  88. claude_mpm/dashboard/static/dist/components/session-manager.js +1 -1
  89. claude_mpm/dashboard/static/dist/components/working-directory.js +1 -1
  90. claude_mpm/dashboard/static/dist/dashboard.js +1 -1
  91. claude_mpm/dashboard/static/dist/react/events.js +30 -0
  92. claude_mpm/dashboard/static/dist/socket-client.js +1 -1
  93. claude_mpm/dashboard/static/events.html +607 -0
  94. claude_mpm/dashboard/static/index.html +713 -0
  95. claude_mpm/dashboard/static/js/components/activity-tree.js +3 -17
  96. claude_mpm/dashboard/static/js/components/agent-hierarchy.js +4 -1
  97. claude_mpm/dashboard/static/js/components/agent-inference.js +3 -0
  98. claude_mpm/dashboard/static/js/components/build-tracker.js +8 -0
  99. claude_mpm/dashboard/static/js/components/code-viewer.js +306 -66
  100. claude_mpm/dashboard/static/js/components/event-processor.js +3 -0
  101. claude_mpm/dashboard/static/js/components/event-viewer.js +39 -2
  102. claude_mpm/dashboard/static/js/components/export-manager.js +3 -0
  103. claude_mpm/dashboard/static/js/components/file-tool-tracker.js +30 -10
  104. claude_mpm/dashboard/static/js/components/socket-manager.js +4 -0
  105. claude_mpm/dashboard/static/js/components/ui-state-manager.js +285 -85
  106. claude_mpm/dashboard/static/js/components/working-directory.js +3 -0
  107. claude_mpm/dashboard/static/js/dashboard.js +61 -33
  108. claude_mpm/dashboard/static/js/socket-client.js +12 -8
  109. claude_mpm/dashboard/static/js/stores/dashboard-store.js +562 -0
  110. claude_mpm/dashboard/static/js/tab-isolation-fix.js +185 -0
  111. claude_mpm/dashboard/static/legacy/activity.html +736 -0
  112. claude_mpm/dashboard/static/legacy/agents.html +786 -0
  113. claude_mpm/dashboard/static/legacy/files.html +747 -0
  114. claude_mpm/dashboard/static/legacy/tools.html +831 -0
  115. claude_mpm/dashboard/static/monitors-index.html +218 -0
  116. claude_mpm/dashboard/static/monitors.html +431 -0
  117. claude_mpm/dashboard/static/production/events.html +659 -0
  118. claude_mpm/dashboard/static/production/main.html +715 -0
  119. claude_mpm/dashboard/static/production/monitors.html +483 -0
  120. claude_mpm/dashboard/static/socket.io.min.js +7 -0
  121. claude_mpm/dashboard/static/socket.io.v4.8.1.backup.js +7 -0
  122. claude_mpm/dashboard/static/test-archive/dashboard.html +635 -0
  123. claude_mpm/dashboard/static/test-archive/debug-events.html +147 -0
  124. claude_mpm/dashboard/static/test-archive/test-navigation.html +256 -0
  125. claude_mpm/dashboard/static/test-archive/test-react-exports.html +180 -0
  126. claude_mpm/dashboard/templates/index.html +79 -9
  127. claude_mpm/hooks/claude_hooks/services/connection_manager_http.py +1 -1
  128. claude_mpm/services/agents/deployment/agent_discovery_service.py +3 -0
  129. claude_mpm/services/agents/deployment/agent_template_builder.py +25 -8
  130. claude_mpm/services/agents/deployment/agent_validator.py +3 -0
  131. claude_mpm/services/agents/deployment/validation/template_validator.py +13 -4
  132. claude_mpm/services/agents/local_template_manager.py +2 -6
  133. claude_mpm/services/monitor/daemon.py +1 -2
  134. claude_mpm/services/monitor/daemon_manager.py +2 -5
  135. claude_mpm/services/monitor/event_emitter.py +2 -2
  136. claude_mpm/services/monitor/handlers/code_analysis.py +4 -6
  137. claude_mpm/services/monitor/handlers/hooks.py +2 -4
  138. claude_mpm/services/monitor/server.py +27 -4
  139. claude_mpm/tools/code_tree_analyzer.py +2 -2
  140. {claude_mpm-4.2.44.dist-info → claude_mpm-4.2.51.dist-info}/METADATA +1 -1
  141. {claude_mpm-4.2.44.dist-info → claude_mpm-4.2.51.dist-info}/RECORD +146 -81
  142. claude_mpm/dashboard/static/test-browser-monitor.html +0 -470
  143. claude_mpm/dashboard/static/test-simple.html +0 -97
  144. /claude_mpm/dashboard/static/{test_debug.html → test-archive/test_debug.html} +0 -0
  145. {claude_mpm-4.2.44.dist-info → claude_mpm-4.2.51.dist-info}/WHEEL +0 -0
  146. {claude_mpm-4.2.44.dist-info → claude_mpm-4.2.51.dist-info}/entry_points.txt +0 -0
  147. {claude_mpm-4.2.44.dist-info → claude_mpm-4.2.51.dist-info}/licenses/LICENSE +0 -0
  148. {claude_mpm-4.2.44.dist-info → claude_mpm-4.2.51.dist-info}/top_level.txt +0 -0
@@ -0,0 +1,777 @@
1
+ /**
2
+ * Agent Hierarchy Component
3
+ *
4
+ * Displays agents in a hierarchical tree structure with PM at the top level.
5
+ * Shows subagents as children of the PM that spawned them, tracking delegation
6
+ * relationships from Task tool calls.
7
+ *
8
+ * WHY: Provides clear visualization of agent delegation relationships, making it
9
+ * easier to understand the flow of work through PM and subagent delegations.
10
+ *
11
+ * DESIGN DECISION: Uses tree-based visualization with expand/collapse functionality
12
+ * to handle complex delegation chains while maintaining performance with large
13
+ * event streams. Separates hierarchy building from rendering for flexibility.
14
+ */
15
+
16
+ class AgentHierarchy {
17
+ constructor(agentInference, eventViewer) {
18
+ this.agentInference = agentInference;
19
+ this.eventViewer = eventViewer;
20
+
21
+ // Hierarchy state
22
+ this.state = {
23
+ // Tree structure with PM nodes at root
24
+ hierarchyTree: null,
25
+ // Map of agent ID to node for quick lookups
26
+ nodeMap: new Map(),
27
+ // Expanded state for tree nodes
28
+ expandedNodes: new Set(),
29
+ // Currently selected node
30
+ selectedNode: null
31
+ };
32
+
33
+ // Default expand all nodes initially
34
+ this.expandAll = true;
35
+
36
+ // Set up event listeners
37
+ this.setupEventListeners();
38
+
39
+ console.log('Agent hierarchy component initialized');
40
+ }
41
+
42
+ /**
43
+ * Set up event listeners for safe interaction
44
+ */
45
+ setupEventListeners() {
46
+ // Use event delegation for toggle node clicks to avoid undefined dashboard errors
47
+ document.addEventListener('click', (event) => {
48
+ const toggleTarget = event.target.closest('[data-toggle-node]');
49
+ if (toggleTarget && window.dashboard && window.dashboard.agentHierarchy) {
50
+ const nodeId = toggleTarget.dataset.toggleNode;
51
+ window.dashboard.agentHierarchy.toggleNode(nodeId);
52
+ }
53
+ });
54
+ }
55
+
56
+ /**
57
+ * Build hierarchical structure from events
58
+ * @returns {Object} Tree structure with PM at root
59
+ */
60
+ buildHierarchy() {
61
+ // Process agent inference first
62
+ this.agentInference.processAgentInference();
63
+
64
+ // Get PM delegations and events
65
+ const pmDelegations = this.agentInference.getPMDelegations();
66
+ const events = this.eventViewer.events;
67
+ const eventAgentMap = this.agentInference.getEventAgentMap();
68
+
69
+ // Create root PM nodes
70
+ const mainPM = {
71
+ id: 'pm_main',
72
+ type: 'pm',
73
+ name: 'PM (Main Session)',
74
+ children: [],
75
+ events: [],
76
+ eventCount: 0,
77
+ status: 'active',
78
+ startTime: null,
79
+ endTime: null,
80
+ expanded: true
81
+ };
82
+
83
+ // Map to store multiple implied PM groups
84
+ const impliedPMGroups = new Map();
85
+
86
+ // Clear node map
87
+ this.state.nodeMap.clear();
88
+ this.state.nodeMap.set(mainPM.id, mainPM);
89
+
90
+ // Track which agents have been added
91
+ const processedAgents = new Set();
92
+
93
+ // Process explicit PM delegations
94
+ for (const [delegationId, delegation] of pmDelegations) {
95
+ const agentNode = {
96
+ id: delegationId,
97
+ type: 'subagent',
98
+ name: delegation.agentName,
99
+ delegationContext: this.extractDelegationContext(delegation.pmCall),
100
+ children: [], // Subagents could theoretically delegate to others
101
+ events: delegation.agentEvents,
102
+ eventCount: delegation.agentEvents.length,
103
+ status: delegation.endIndex ? 'completed' : 'active',
104
+ startTime: delegation.timestamp,
105
+ endTime: delegation.endIndex ? events[delegation.endIndex]?.timestamp : null,
106
+ startIndex: delegation.startIndex,
107
+ endIndex: delegation.endIndex,
108
+ expanded: this.expandAll || this.state.expandedNodes.has(delegationId)
109
+ };
110
+
111
+ mainPM.children.push(agentNode);
112
+ this.state.nodeMap.set(delegationId, agentNode);
113
+ processedAgents.add(delegation.agentName);
114
+
115
+ // Update main PM stats
116
+ mainPM.eventCount++;
117
+ if (!mainPM.startTime || new Date(delegation.timestamp) < new Date(mainPM.startTime)) {
118
+ mainPM.startTime = delegation.timestamp;
119
+ }
120
+ if (delegation.endIndex && events[delegation.endIndex]) {
121
+ const endTime = events[delegation.endIndex].timestamp;
122
+ if (!mainPM.endTime || new Date(endTime) > new Date(mainPM.endTime)) {
123
+ mainPM.endTime = endTime;
124
+ }
125
+ }
126
+ }
127
+
128
+ // Get orphan subagent groups from agent inference
129
+ const orphanGroups = this.agentInference.getOrphanGroups();
130
+
131
+ // Create implied PM nodes for each orphan group
132
+ let impliedPMCounter = 1;
133
+ for (const [groupingKey, orphans] of orphanGroups) {
134
+ // Create an implied PM node for this group
135
+ const impliedPM = {
136
+ id: `pm_implied_${groupingKey}`,
137
+ type: 'pm',
138
+ name: `PM (Implied #${impliedPMCounter})`,
139
+ children: [],
140
+ events: [],
141
+ eventCount: 0,
142
+ status: 'inferred',
143
+ startTime: null,
144
+ endTime: null,
145
+ expanded: true,
146
+ isImplied: true,
147
+ tooltip: 'Inferred PM - Subagents started without explicit PM delegation'
148
+ };
149
+
150
+ impliedPMGroups.set(groupingKey, impliedPM);
151
+ this.state.nodeMap.set(impliedPM.id, impliedPM);
152
+ impliedPMCounter++;
153
+
154
+ // Group orphan events by agent name within this implied PM
155
+ const agentEventGroups = new Map();
156
+
157
+ for (const orphan of orphans) {
158
+ // Find all events for this orphan agent
159
+ const agentEvents = [];
160
+ events.forEach((event, index) => {
161
+ const inference = eventAgentMap.get(index);
162
+ if (inference && inference.agentName === orphan.agentName) {
163
+ // Check if this event is orphaned (not in any PM delegation)
164
+ let isOrphan = true;
165
+ for (const [_, delegation] of pmDelegations) {
166
+ if (delegation.agentEvents.some(e => e.eventIndex === index)) {
167
+ isOrphan = false;
168
+ break;
169
+ }
170
+ }
171
+
172
+ if (isOrphan) {
173
+ agentEvents.push({
174
+ eventIndex: index,
175
+ event: event,
176
+ inference: inference
177
+ });
178
+ }
179
+ }
180
+ });
181
+
182
+ if (agentEvents.length > 0) {
183
+ if (!agentEventGroups.has(orphan.agentName)) {
184
+ agentEventGroups.set(orphan.agentName, []);
185
+ }
186
+ agentEventGroups.get(orphan.agentName).push(...agentEvents);
187
+ }
188
+ }
189
+
190
+ // Create subagent nodes for each agent in this implied PM group
191
+ for (const [agentName, agentEvents] of agentEventGroups) {
192
+ if (agentEvents.length === 0) continue;
193
+
194
+ const firstEvent = agentEvents[0].event;
195
+ const lastEvent = agentEvents[agentEvents.length - 1].event;
196
+
197
+ const agentNode = {
198
+ id: `implied_agent_${groupingKey}_${agentName}`,
199
+ type: 'subagent',
200
+ name: agentName,
201
+ delegationContext: 'Orphan agent - no explicit PM delegation found',
202
+ children: [],
203
+ events: agentEvents,
204
+ eventCount: agentEvents.length,
205
+ status: 'inferred',
206
+ startTime: firstEvent.timestamp,
207
+ endTime: lastEvent.timestamp,
208
+ startIndex: agentEvents[0].eventIndex,
209
+ endIndex: agentEvents[agentEvents.length - 1].eventIndex,
210
+ expanded: this.expandAll,
211
+ isImplied: true,
212
+ tooltip: 'This agent was spawned without an explicit PM Task delegation'
213
+ };
214
+
215
+ impliedPM.children.push(agentNode);
216
+ this.state.nodeMap.set(agentNode.id, agentNode);
217
+
218
+ // Update implied PM stats
219
+ impliedPM.eventCount += agentEvents.length;
220
+ if (!impliedPM.startTime || new Date(firstEvent.timestamp) < new Date(impliedPM.startTime)) {
221
+ impliedPM.startTime = firstEvent.timestamp;
222
+ }
223
+ if (!impliedPM.endTime || new Date(lastEvent.timestamp) > new Date(impliedPM.endTime)) {
224
+ impliedPM.endTime = lastEvent.timestamp;
225
+ }
226
+ }
227
+ }
228
+
229
+ // Also find completely orphaned subagent events (not caught by SubagentStart)
230
+ const uncategorizedOrphans = [];
231
+ events.forEach((event, index) => {
232
+ const inference = eventAgentMap.get(index);
233
+ if (inference && inference.type === 'subagent') {
234
+ // Check if this agent is already in a PM delegation or implied PM
235
+ let isOrphan = true;
236
+
237
+ // Check explicit delegations
238
+ for (const [_, delegation] of pmDelegations) {
239
+ if (delegation.agentEvents.some(e => e.eventIndex === index)) {
240
+ isOrphan = false;
241
+ break;
242
+ }
243
+ }
244
+
245
+ // Check implied PMs
246
+ if (isOrphan) {
247
+ for (const [_, impliedPM] of impliedPMGroups) {
248
+ for (const child of impliedPM.children) {
249
+ if (child.events.some(e => e.eventIndex === index)) {
250
+ isOrphan = false;
251
+ break;
252
+ }
253
+ }
254
+ if (!isOrphan) break;
255
+ }
256
+ }
257
+
258
+ if (isOrphan) {
259
+ uncategorizedOrphans.push({
260
+ eventIndex: index,
261
+ event: event,
262
+ inference: inference
263
+ });
264
+ }
265
+ }
266
+ });
267
+
268
+ // If there are uncategorized orphans, create a generic implied PM for them
269
+ if (uncategorizedOrphans.length > 0) {
270
+ const genericImpliedPM = {
271
+ id: 'pm_implied_generic',
272
+ type: 'pm',
273
+ name: 'PM (Implied - Uncategorized)',
274
+ children: [],
275
+ events: [],
276
+ eventCount: 0,
277
+ status: 'inferred',
278
+ startTime: null,
279
+ endTime: null,
280
+ expanded: true,
281
+ isImplied: true,
282
+ tooltip: 'Orphan agents without clear grouping'
283
+ };
284
+
285
+ // Group by agent name
286
+ const agentGroups = new Map();
287
+ for (const orphan of uncategorizedOrphans) {
288
+ const agentName = orphan.inference.agentName;
289
+ if (!agentGroups.has(agentName)) {
290
+ agentGroups.set(agentName, []);
291
+ }
292
+ agentGroups.get(agentName).push(orphan);
293
+ }
294
+
295
+ // Create nodes for each agent
296
+ for (const [agentName, agentEvents] of agentGroups) {
297
+ const firstEvent = agentEvents[0].event;
298
+ const lastEvent = agentEvents[agentEvents.length - 1].event;
299
+
300
+ const agentNode = {
301
+ id: `implied_generic_${agentName}`,
302
+ type: 'subagent',
303
+ name: agentName,
304
+ delegationContext: 'Uncategorized orphan agent',
305
+ children: [],
306
+ events: agentEvents,
307
+ eventCount: agentEvents.length,
308
+ status: 'inferred',
309
+ startTime: firstEvent.timestamp,
310
+ endTime: lastEvent.timestamp,
311
+ startIndex: agentEvents[0].eventIndex,
312
+ endIndex: agentEvents[agentEvents.length - 1].eventIndex,
313
+ expanded: this.expandAll,
314
+ isImplied: true
315
+ };
316
+
317
+ genericImpliedPM.children.push(agentNode);
318
+ this.state.nodeMap.set(agentNode.id, agentNode);
319
+ genericImpliedPM.eventCount += agentEvents.length;
320
+
321
+ if (!genericImpliedPM.startTime || new Date(firstEvent.timestamp) < new Date(genericImpliedPM.startTime)) {
322
+ genericImpliedPM.startTime = firstEvent.timestamp;
323
+ }
324
+ if (!genericImpliedPM.endTime || new Date(lastEvent.timestamp) > new Date(genericImpliedPM.endTime)) {
325
+ genericImpliedPM.endTime = lastEvent.timestamp;
326
+ }
327
+ }
328
+
329
+ if (genericImpliedPM.children.length > 0) {
330
+ impliedPMGroups.set('generic', genericImpliedPM);
331
+ this.state.nodeMap.set(genericImpliedPM.id, genericImpliedPM);
332
+ }
333
+ }
334
+
335
+ // Count PM's own events (not delegated)
336
+ let pmOwnEvents = 0;
337
+ events.forEach((event, index) => {
338
+ const inference = eventAgentMap.get(index);
339
+ if (inference && inference.type === 'main_agent') {
340
+ pmOwnEvents++;
341
+ mainPM.events.push({
342
+ eventIndex: index,
343
+ event: event,
344
+ inference: inference
345
+ });
346
+ }
347
+ });
348
+ mainPM.eventCount += pmOwnEvents;
349
+
350
+ // Update PM status based on children
351
+ if (mainPM.children.length > 0) {
352
+ const hasActive = mainPM.children.some(child => child.status === 'active');
353
+ mainPM.status = hasActive ? 'active' : 'completed';
354
+ }
355
+
356
+ // Build final tree structure
357
+ const tree = {
358
+ roots: []
359
+ };
360
+
361
+ // Only add PMs that have content
362
+ if (mainPM.eventCount > 0 || mainPM.children.length > 0) {
363
+ tree.roots.push(mainPM);
364
+ }
365
+
366
+ // Add all implied PM groups that have content
367
+ for (const [_, impliedPM] of impliedPMGroups) {
368
+ if (impliedPM.children.length > 0) {
369
+ tree.roots.push(impliedPM);
370
+ }
371
+ }
372
+
373
+ this.state.hierarchyTree = tree;
374
+
375
+ console.log('Hierarchy built:', {
376
+ mainPM: {
377
+ children: mainPM.children.length,
378
+ events: mainPM.eventCount,
379
+ ownEvents: pmOwnEvents
380
+ },
381
+ impliedPMGroups: impliedPMGroups.size,
382
+ totalImpliedAgents: Array.from(impliedPMGroups.values())
383
+ .reduce((sum, pm) => sum + pm.children.length, 0)
384
+ });
385
+
386
+ return tree;
387
+ }
388
+
389
+ /**
390
+ * Extract delegation context from PM Task call
391
+ * @param {Object} pmCall - The PM's Task tool call event
392
+ * @returns {string} Description of what was delegated
393
+ */
394
+ extractDelegationContext(pmCall) {
395
+ if (!pmCall) return 'Unknown delegation';
396
+
397
+ // Try to extract task description from tool parameters
398
+ const params = pmCall.tool_parameters || pmCall.data?.tool_parameters || {};
399
+ const task = params.task || params.request || params.description;
400
+
401
+ if (task) {
402
+ // Truncate long tasks
403
+ const maxLength = 100;
404
+ if (task.length > maxLength) {
405
+ return task.substring(0, maxLength) + '...';
406
+ }
407
+ return task;
408
+ }
409
+
410
+ // Fallback to tool input
411
+ const toolInput = pmCall.tool_input || pmCall.data?.tool_input;
412
+ if (toolInput && typeof toolInput === 'string') {
413
+ const maxLength = 100;
414
+ if (toolInput.length > maxLength) {
415
+ return toolInput.substring(0, maxLength) + '...';
416
+ }
417
+ return toolInput;
418
+ }
419
+
420
+ return 'Task delegation';
421
+ }
422
+
423
+ /**
424
+ * Render the hierarchy tree to HTML
425
+ * @param {Object} filters - Optional filters for display
426
+ * @returns {string} HTML string for the hierarchy
427
+ */
428
+ render(filters = {}) {
429
+ const tree = this.state.hierarchyTree || this.buildHierarchy();
430
+
431
+ if (!tree.roots || tree.roots.length === 0) {
432
+ return '<div class="agent-hierarchy-empty">No agent activity detected</div>';
433
+ }
434
+
435
+ // Apply filters if provided
436
+ const filteredTree = this.applyFilters(tree, filters);
437
+
438
+ // Generate HTML
439
+ const html = filteredTree.roots.map(root => this.renderNode(root, 0)).join('');
440
+
441
+ return `<div class="agent-hierarchy">${html}</div>`;
442
+ }
443
+
444
+ /**
445
+ * Render a single node and its children
446
+ * @param {Object} node - Node to render
447
+ * @param {number} level - Indentation level
448
+ * @returns {string} HTML string for the node
449
+ */
450
+ renderNode(node, level) {
451
+ const isExpanded = node.expanded || this.state.expandedNodes.has(node.id);
452
+ const hasChildren = node.children && node.children.length > 0;
453
+ const isSelected = this.state.selectedNode === node.id;
454
+
455
+ // Icon based on node type and status
456
+ const icon = this.getNodeIcon(node);
457
+ const expandIcon = hasChildren ? (isExpanded ? '▼' : '▶') : '&nbsp;&nbsp;';
458
+
459
+ // Status color
460
+ const statusClass = this.getStatusClass(node.status);
461
+
462
+ // Add special styling for implied nodes
463
+ const impliedClass = node.isImplied ? 'agent-node-implied' : '';
464
+ const tooltipAttr = node.tooltip ? `title="${this.escapeHtml(node.tooltip)}"` : '';
465
+
466
+ // Build node HTML
467
+ let html = `
468
+ <div class="agent-node agent-node-level-${level} ${isSelected ? 'agent-node-selected' : ''} ${impliedClass}"
469
+ data-node-id="${node.id}" ${tooltipAttr}>
470
+ <div class="agent-node-header ${statusClass}"
471
+ data-toggle-node="${node.id}" style="cursor: pointer">
472
+ <span class="agent-node-expand">${expandIcon}</span>
473
+ <span class="agent-node-icon">${icon}</span>
474
+ <span class="agent-node-name">${this.escapeHtml(node.name)}</span>
475
+ <span class="agent-node-stats">
476
+ <span class="agent-event-count">${node.eventCount} events</span>
477
+ ${node.status ? `<span class="agent-status">${node.status}</span>` : ''}
478
+ </span>
479
+ </div>
480
+ `;
481
+
482
+ // Add details if expanded
483
+ if (isExpanded && (node.delegationContext || node.startTime)) {
484
+ html += '<div class="agent-node-details">';
485
+
486
+ if (node.delegationContext && node.delegationContext !== 'Unknown delegation') {
487
+ html += `
488
+ <div class="agent-delegation-context">
489
+ <strong>Task:</strong> ${this.escapeHtml(node.delegationContext)}
490
+ </div>
491
+ `;
492
+ }
493
+
494
+ if (node.startTime) {
495
+ const duration = this.calculateDuration(node.startTime, node.endTime);
496
+ html += `
497
+ <div class="agent-timing">
498
+ <span class="agent-time-start">${this.formatTime(node.startTime)}</span>
499
+ ${duration ? `<span class="agent-duration">(${duration})</span>` : ''}
500
+ </div>
501
+ `;
502
+ }
503
+
504
+ html += '</div>';
505
+ }
506
+
507
+ // Render children if expanded
508
+ if (isExpanded && hasChildren) {
509
+ html += '<div class="agent-node-children">';
510
+ html += node.children.map(child => this.renderNode(child, level + 1)).join('');
511
+ html += '</div>';
512
+ }
513
+
514
+ html += '</div>';
515
+
516
+ return html;
517
+ }
518
+
519
+ /**
520
+ * Get icon for node based on type and status
521
+ * @param {Object} node - Node to get icon for
522
+ * @returns {string} Icon HTML/emoji
523
+ */
524
+ getNodeIcon(node) {
525
+ if (node.type === 'pm') {
526
+ return node.isImplied ? '🔍' : '👔';
527
+ }
528
+
529
+ // Map agent names to icons
530
+ const agentIcons = {
531
+ 'Engineer Agent': '🔧',
532
+ 'Research Agent': '🔍',
533
+ 'QA Agent': '✅',
534
+ 'Documentation Agent': '📝',
535
+ 'Security Agent': '🔒',
536
+ 'Ops Agent': '⚙️',
537
+ 'Version Control Agent': '📦',
538
+ 'Data Engineer Agent': '💾',
539
+ 'Test Integration Agent': '🧪'
540
+ };
541
+
542
+ return agentIcons[node.name] || '🤖';
543
+ }
544
+
545
+ /**
546
+ * Get status class for styling
547
+ * @param {string} status - Node status
548
+ * @returns {string} CSS class name
549
+ */
550
+ getStatusClass(status) {
551
+ switch (status) {
552
+ case 'active':
553
+ return 'agent-status-active';
554
+ case 'completed':
555
+ return 'agent-status-completed';
556
+ case 'pending':
557
+ return 'agent-status-pending';
558
+ case 'inferred':
559
+ return 'agent-status-inferred';
560
+ default:
561
+ return 'agent-status-unknown';
562
+ }
563
+ }
564
+
565
+ /**
566
+ * Toggle node expansion
567
+ * @param {string} nodeId - ID of node to toggle
568
+ */
569
+ toggleNode(nodeId) {
570
+ const node = this.state.nodeMap.get(nodeId);
571
+ if (!node) return;
572
+
573
+ if (this.state.expandedNodes.has(nodeId)) {
574
+ this.state.expandedNodes.delete(nodeId);
575
+ node.expanded = false;
576
+ } else {
577
+ this.state.expandedNodes.add(nodeId);
578
+ node.expanded = true;
579
+ }
580
+
581
+ // Trigger re-render
582
+ if (window.dashboard) {
583
+ window.dashboard.renderCurrentTab();
584
+ }
585
+ }
586
+
587
+ /**
588
+ * Select a node
589
+ * @param {string} nodeId - ID of node to select
590
+ */
591
+ selectNode(nodeId) {
592
+ this.state.selectedNode = nodeId;
593
+ const node = this.state.nodeMap.get(nodeId);
594
+
595
+ if (node) {
596
+ // Dispatch event for other components to react
597
+ const event = new CustomEvent('agentNodeSelected', {
598
+ detail: { node: node }
599
+ });
600
+ document.dispatchEvent(event);
601
+ }
602
+ }
603
+
604
+ /**
605
+ * Apply filters to the tree
606
+ * @param {Object} tree - Tree to filter
607
+ * @param {Object} filters - Filter criteria
608
+ * @returns {Object} Filtered tree
609
+ */
610
+ applyFilters(tree, filters) {
611
+ if (!filters || Object.keys(filters).length === 0) {
612
+ return tree;
613
+ }
614
+
615
+ // Clone tree structure for filtering
616
+ const filteredTree = {
617
+ roots: []
618
+ };
619
+
620
+ for (const root of tree.roots) {
621
+ const filteredRoot = this.filterNode(root, filters);
622
+ if (filteredRoot) {
623
+ filteredTree.roots.push(filteredRoot);
624
+ }
625
+ }
626
+
627
+ return filteredTree;
628
+ }
629
+
630
+ /**
631
+ * Filter a single node and its children
632
+ * @param {Object} node - Node to filter
633
+ * @param {Object} filters - Filter criteria
634
+ * @returns {Object|null} Filtered node or null if filtered out
635
+ */
636
+ filterNode(node, filters) {
637
+ // Check if node matches filters
638
+ let matches = true;
639
+
640
+ if (filters.searchText) {
641
+ const searchLower = filters.searchText.toLowerCase();
642
+ matches = matches && (
643
+ node.name.toLowerCase().includes(searchLower) ||
644
+ (node.delegationContext && node.delegationContext.toLowerCase().includes(searchLower))
645
+ );
646
+ }
647
+
648
+ if (filters.agentType) {
649
+ matches = matches && node.name.includes(filters.agentType);
650
+ }
651
+
652
+ if (filters.status) {
653
+ matches = matches && node.status === filters.status;
654
+ }
655
+
656
+ // Filter children recursively
657
+ let filteredChildren = [];
658
+ if (node.children) {
659
+ for (const child of node.children) {
660
+ const filteredChild = this.filterNode(child, filters);
661
+ if (filteredChild) {
662
+ filteredChildren.push(filteredChild);
663
+ }
664
+ }
665
+ }
666
+
667
+ // Include node if it matches or has matching children
668
+ if (matches || filteredChildren.length > 0) {
669
+ return {
670
+ ...node,
671
+ children: filteredChildren
672
+ };
673
+ }
674
+
675
+ return null;
676
+ }
677
+
678
+ /**
679
+ * Format timestamp for display
680
+ * @param {string} timestamp - ISO timestamp
681
+ * @returns {string} Formatted time
682
+ */
683
+ formatTime(timestamp) {
684
+ if (!timestamp) return '';
685
+ const date = new Date(timestamp);
686
+ return date.toLocaleTimeString('en-US', {
687
+ hour: '2-digit',
688
+ minute: '2-digit',
689
+ second: '2-digit',
690
+ hour12: false
691
+ });
692
+ }
693
+
694
+ /**
695
+ * Calculate duration between timestamps
696
+ * @param {string} start - Start timestamp
697
+ * @param {string} end - End timestamp
698
+ * @returns {string} Formatted duration
699
+ */
700
+ calculateDuration(start, end) {
701
+ if (!start || !end) return '';
702
+
703
+ const startTime = new Date(start).getTime();
704
+ const endTime = new Date(end).getTime();
705
+ const duration = endTime - startTime;
706
+
707
+ if (duration < 1000) {
708
+ return `${duration}ms`;
709
+ } else if (duration < 60000) {
710
+ return `${(duration / 1000).toFixed(1)}s`;
711
+ } else {
712
+ const minutes = Math.floor(duration / 60000);
713
+ const seconds = Math.floor((duration % 60000) / 1000);
714
+ return `${minutes}m ${seconds}s`;
715
+ }
716
+ }
717
+
718
+ /**
719
+ * Escape HTML for safe rendering
720
+ * @param {string} text - Text to escape
721
+ * @returns {string} Escaped text
722
+ */
723
+ escapeHtml(text) {
724
+ if (!text) return '';
725
+ const div = document.createElement('div');
726
+ div.textContent = text;
727
+ return div.innerHTML;
728
+ }
729
+
730
+ /**
731
+ * Update hierarchy when new events arrive
732
+ * @param {Array} events - New events
733
+ */
734
+ updateWithNewEvents(events) {
735
+ // Rebuild hierarchy with new events
736
+ this.buildHierarchy();
737
+ }
738
+
739
+ /**
740
+ * Clear the hierarchy
741
+ */
742
+ clear() {
743
+ this.state.hierarchyTree = null;
744
+ this.state.nodeMap.clear();
745
+ this.state.expandedNodes.clear();
746
+ this.state.selectedNode = null;
747
+ }
748
+
749
+ /**
750
+ * Expand all nodes
751
+ */
752
+ expandAllNodes() {
753
+ for (const [nodeId, node] of this.state.nodeMap) {
754
+ this.state.expandedNodes.add(nodeId);
755
+ node.expanded = true;
756
+ }
757
+ this.expandAll = true;
758
+ }
759
+
760
+ /**
761
+ * Collapse all nodes
762
+ */
763
+ collapseAllNodes() {
764
+ this.state.expandedNodes.clear();
765
+ for (const [nodeId, node] of this.state.nodeMap) {
766
+ node.expanded = false;
767
+ }
768
+ this.expandAll = false;
769
+ }
770
+ }
771
+
772
+ // ES6 Module export
773
+ export { AgentHierarchy };
774
+ export default AgentHierarchy;
775
+
776
+ // Make AgentHierarchy globally available for dist/dashboard.js
777
+ window.AgentHierarchy = AgentHierarchy;