claude-mpm 4.2.43__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.
- claude_mpm/VERSION +1 -1
- claude_mpm/agents/BASE_PM.md +117 -12
- claude_mpm/agents/INSTRUCTIONS.md +154 -10
- claude_mpm/agents/WORKFLOW.md +46 -1
- claude_mpm/agents/frontmatter_validator.py +20 -12
- claude_mpm/agents/templates/nextjs_engineer.json +277 -0
- claude_mpm/agents/templates/python_engineer.json +289 -0
- claude_mpm/agents/templates/react_engineer.json +11 -3
- claude_mpm/agents/templates/security.json +50 -9
- claude_mpm/cli/commands/agents.py +2 -2
- claude_mpm/cli/commands/uninstall.py +1 -2
- claude_mpm/cli/interactive/agent_wizard.py +3 -3
- claude_mpm/cli/parsers/agent_manager_parser.py +3 -3
- claude_mpm/cli/parsers/agents_parser.py +1 -1
- claude_mpm/constants.py +1 -1
- claude_mpm/core/api_validator.py +330 -0
- claude_mpm/core/error_handler.py +2 -4
- claude_mpm/core/file_utils.py +4 -12
- claude_mpm/core/framework_loader.py +22 -0
- claude_mpm/core/log_manager.py +8 -5
- claude_mpm/core/logger.py +1 -1
- claude_mpm/core/logging_utils.py +6 -6
- claude_mpm/core/unified_agent_registry.py +18 -4
- claude_mpm/dashboard/react/components/DataInspector/DataInspector.module.css +188 -0
- claude_mpm/dashboard/react/components/EventViewer/EventViewer.module.css +156 -0
- claude_mpm/dashboard/react/components/shared/ConnectionStatus.module.css +38 -0
- claude_mpm/dashboard/react/components/shared/FilterBar.module.css +92 -0
- claude_mpm/dashboard/static/archive/activity_dashboard_fixed.html +248 -0
- claude_mpm/dashboard/static/archive/activity_dashboard_test.html +61 -0
- claude_mpm/dashboard/static/archive/test_activity_connection.html +179 -0
- claude_mpm/dashboard/static/archive/test_claude_tree_tab.html +68 -0
- claude_mpm/dashboard/static/archive/test_dashboard.html +409 -0
- claude_mpm/dashboard/static/archive/test_dashboard_fixed.html +519 -0
- claude_mpm/dashboard/static/archive/test_dashboard_verification.html +181 -0
- claude_mpm/dashboard/static/archive/test_file_data.html +315 -0
- claude_mpm/dashboard/static/archive/test_file_tree_empty_state.html +243 -0
- claude_mpm/dashboard/static/archive/test_file_tree_fix.html +234 -0
- claude_mpm/dashboard/static/archive/test_file_tree_rename.html +117 -0
- claude_mpm/dashboard/static/archive/test_file_tree_tab.html +115 -0
- claude_mpm/dashboard/static/archive/test_file_viewer.html +224 -0
- claude_mpm/dashboard/static/archive/test_final_activity.html +220 -0
- claude_mpm/dashboard/static/archive/test_tab_fix.html +139 -0
- claude_mpm/dashboard/static/built/assets/events.DjpNxWNo.css +1 -0
- claude_mpm/dashboard/static/built/components/activity-tree.js +1 -1
- claude_mpm/dashboard/static/built/components/agent-hierarchy.js +777 -0
- claude_mpm/dashboard/static/built/components/agent-inference.js +1 -1
- claude_mpm/dashboard/static/built/components/build-tracker.js +333 -0
- claude_mpm/dashboard/static/built/components/code-simple.js +857 -0
- claude_mpm/dashboard/static/built/components/code-tree/tree-breadcrumb.js +353 -0
- claude_mpm/dashboard/static/built/components/code-tree/tree-constants.js +235 -0
- claude_mpm/dashboard/static/built/components/code-tree/tree-search.js +409 -0
- claude_mpm/dashboard/static/built/components/code-tree/tree-utils.js +435 -0
- claude_mpm/dashboard/static/built/components/code-viewer.js +2 -1076
- claude_mpm/dashboard/static/built/components/connection-debug.js +654 -0
- claude_mpm/dashboard/static/built/components/diff-viewer.js +891 -0
- claude_mpm/dashboard/static/built/components/event-processor.js +1 -1
- claude_mpm/dashboard/static/built/components/event-viewer.js +1 -1
- claude_mpm/dashboard/static/built/components/export-manager.js +1 -1
- claude_mpm/dashboard/static/built/components/file-change-tracker.js +443 -0
- claude_mpm/dashboard/static/built/components/file-change-viewer.js +690 -0
- claude_mpm/dashboard/static/built/components/file-tool-tracker.js +1 -1
- claude_mpm/dashboard/static/built/components/module-viewer.js +1 -1
- claude_mpm/dashboard/static/built/components/nav-bar.js +145 -0
- claude_mpm/dashboard/static/built/components/page-structure.js +429 -0
- claude_mpm/dashboard/static/built/components/session-manager.js +1 -1
- claude_mpm/dashboard/static/built/components/ui-state-manager.js +2 -465
- claude_mpm/dashboard/static/built/components/working-directory.js +1 -1
- claude_mpm/dashboard/static/built/connection-manager.js +536 -0
- claude_mpm/dashboard/static/built/dashboard.js +1 -1
- claude_mpm/dashboard/static/built/extension-error-handler.js +164 -0
- claude_mpm/dashboard/static/built/react/events.js +30 -0
- claude_mpm/dashboard/static/built/shared/dom-helpers.js +396 -0
- claude_mpm/dashboard/static/built/shared/event-bus.js +330 -0
- claude_mpm/dashboard/static/built/shared/event-filter-service.js +540 -0
- claude_mpm/dashboard/static/built/shared/logger.js +385 -0
- claude_mpm/dashboard/static/built/shared/page-structure.js +251 -0
- claude_mpm/dashboard/static/built/shared/tooltip-service.js +253 -0
- claude_mpm/dashboard/static/built/socket-client.js +1 -1
- claude_mpm/dashboard/static/built/tab-isolation-fix.js +185 -0
- claude_mpm/dashboard/static/css/dashboard.css +28 -5
- claude_mpm/dashboard/static/dist/assets/events.DjpNxWNo.css +1 -0
- claude_mpm/dashboard/static/dist/components/activity-tree.js +1 -1
- claude_mpm/dashboard/static/dist/components/agent-inference.js +1 -1
- claude_mpm/dashboard/static/dist/components/code-viewer.js +2 -0
- claude_mpm/dashboard/static/dist/components/event-processor.js +1 -1
- claude_mpm/dashboard/static/dist/components/event-viewer.js +1 -1
- claude_mpm/dashboard/static/dist/components/export-manager.js +1 -1
- claude_mpm/dashboard/static/dist/components/file-tool-tracker.js +1 -1
- claude_mpm/dashboard/static/dist/components/module-viewer.js +1 -1
- claude_mpm/dashboard/static/dist/components/session-manager.js +1 -1
- claude_mpm/dashboard/static/dist/components/working-directory.js +1 -1
- claude_mpm/dashboard/static/dist/dashboard.js +1 -1
- claude_mpm/dashboard/static/dist/react/events.js +30 -0
- claude_mpm/dashboard/static/dist/socket-client.js +1 -1
- claude_mpm/dashboard/static/events.html +607 -0
- claude_mpm/dashboard/static/index.html +713 -0
- claude_mpm/dashboard/static/js/components/activity-tree.js +3 -17
- claude_mpm/dashboard/static/js/components/agent-hierarchy.js +4 -1
- claude_mpm/dashboard/static/js/components/agent-inference.js +3 -0
- claude_mpm/dashboard/static/js/components/build-tracker.js +8 -0
- claude_mpm/dashboard/static/js/components/code-viewer.js +387 -72
- claude_mpm/dashboard/static/js/components/event-processor.js +3 -0
- claude_mpm/dashboard/static/js/components/event-viewer.js +39 -2
- claude_mpm/dashboard/static/js/components/export-manager.js +3 -0
- claude_mpm/dashboard/static/js/components/file-tool-tracker.js +30 -10
- claude_mpm/dashboard/static/js/components/socket-manager.js +4 -0
- claude_mpm/dashboard/static/js/components/ui-state-manager.js +286 -108
- claude_mpm/dashboard/static/js/components/working-directory.js +3 -0
- claude_mpm/dashboard/static/js/dashboard.js +61 -49
- claude_mpm/dashboard/static/js/socket-client.js +12 -8
- claude_mpm/dashboard/static/js/stores/dashboard-store.js +562 -0
- claude_mpm/dashboard/static/js/tab-isolation-fix.js +185 -0
- claude_mpm/dashboard/static/legacy/activity.html +736 -0
- claude_mpm/dashboard/static/legacy/agents.html +786 -0
- claude_mpm/dashboard/static/legacy/files.html +747 -0
- claude_mpm/dashboard/static/legacy/tools.html +831 -0
- claude_mpm/dashboard/static/monitors-index.html +218 -0
- claude_mpm/dashboard/static/monitors.html +431 -0
- claude_mpm/dashboard/static/production/events.html +659 -0
- claude_mpm/dashboard/static/production/main.html +715 -0
- claude_mpm/dashboard/static/production/monitors.html +483 -0
- claude_mpm/dashboard/static/socket.io.min.js +7 -0
- claude_mpm/dashboard/static/socket.io.v4.8.1.backup.js +7 -0
- claude_mpm/dashboard/static/test-archive/dashboard.html +635 -0
- claude_mpm/dashboard/static/test-archive/debug-events.html +147 -0
- claude_mpm/dashboard/static/test-archive/test-navigation.html +256 -0
- claude_mpm/dashboard/static/test-archive/test-react-exports.html +180 -0
- claude_mpm/dashboard/templates/index.html +82 -38
- claude_mpm/hooks/claude_hooks/services/connection_manager_http.py +1 -1
- claude_mpm/services/agents/deployment/agent_discovery_service.py +3 -0
- claude_mpm/services/agents/deployment/agent_template_builder.py +25 -8
- claude_mpm/services/agents/deployment/agent_validator.py +3 -0
- claude_mpm/services/agents/deployment/validation/template_validator.py +13 -4
- claude_mpm/services/agents/local_template_manager.py +2 -6
- claude_mpm/services/monitor/daemon.py +1 -2
- claude_mpm/services/monitor/daemon_manager.py +2 -5
- claude_mpm/services/monitor/event_emitter.py +2 -2
- claude_mpm/services/monitor/handlers/code_analysis.py +4 -6
- claude_mpm/services/monitor/handlers/hooks.py +2 -4
- claude_mpm/services/monitor/server.py +23 -226
- claude_mpm/tools/code_tree_analyzer.py +2 -2
- {claude_mpm-4.2.43.dist-info → claude_mpm-4.2.51.dist-info}/METADATA +1 -1
- {claude_mpm-4.2.43.dist-info → claude_mpm-4.2.51.dist-info}/RECORD +148 -87
- claude_mpm/commands/mpm-browser-monitor.md +0 -370
- claude_mpm/commands/mpm-monitor.md +0 -177
- claude_mpm/dashboard/static/js/browser-console-monitor.js +0 -495
- claude_mpm/dashboard/static/js/components/browser-log-viewer.js +0 -763
- claude_mpm/dashboard/static/test-browser-monitor.html +0 -470
- claude_mpm/dashboard/static/test-simple.html +0 -97
- claude_mpm/services/monitor/handlers/browser.py +0 -451
- /claude_mpm/dashboard/static/{test_debug.html → test-archive/test_debug.html} +0 -0
- {claude_mpm-4.2.43.dist-info → claude_mpm-4.2.51.dist-info}/WHEEL +0 -0
- {claude_mpm-4.2.43.dist-info → claude_mpm-4.2.51.dist-info}/entry_points.txt +0 -0
- {claude_mpm-4.2.43.dist-info → claude_mpm-4.2.51.dist-info}/licenses/LICENSE +0 -0
- {claude_mpm-4.2.43.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 ? '▼' : '▶') : ' ';
|
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;
|