claude-mpm 3.4.13__py3-none-any.whl → 3.4.16__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/dashboard/index.html +13 -0
- claude_mpm/dashboard/static/css/dashboard.css +2722 -0
- claude_mpm/dashboard/static/js/components/agent-inference.js +619 -0
- claude_mpm/dashboard/static/js/components/event-processor.js +641 -0
- claude_mpm/dashboard/static/js/components/event-viewer.js +914 -0
- claude_mpm/dashboard/static/js/components/export-manager.js +362 -0
- claude_mpm/dashboard/static/js/components/file-tool-tracker.js +611 -0
- claude_mpm/dashboard/static/js/components/hud-library-loader.js +211 -0
- claude_mpm/dashboard/static/js/components/hud-manager.js +671 -0
- claude_mpm/dashboard/static/js/components/hud-visualizer.js +1718 -0
- claude_mpm/dashboard/static/js/components/module-viewer.js +2701 -0
- claude_mpm/dashboard/static/js/components/session-manager.js +520 -0
- claude_mpm/dashboard/static/js/components/socket-manager.js +343 -0
- claude_mpm/dashboard/static/js/components/ui-state-manager.js +427 -0
- claude_mpm/dashboard/static/js/components/working-directory.js +866 -0
- claude_mpm/dashboard/static/js/dashboard-original.js +4134 -0
- claude_mpm/dashboard/static/js/dashboard.js +1978 -0
- claude_mpm/dashboard/static/js/socket-client.js +537 -0
- claude_mpm/dashboard/templates/index.html +346 -0
- claude_mpm/dashboard/test_dashboard.html +372 -0
- claude_mpm/services/socketio_server.py +111 -7
- {claude_mpm-3.4.13.dist-info → claude_mpm-3.4.16.dist-info}/METADATA +2 -1
- {claude_mpm-3.4.13.dist-info → claude_mpm-3.4.16.dist-info}/RECORD +27 -7
- {claude_mpm-3.4.13.dist-info → claude_mpm-3.4.16.dist-info}/WHEEL +0 -0
- {claude_mpm-3.4.13.dist-info → claude_mpm-3.4.16.dist-info}/entry_points.txt +0 -0
- {claude_mpm-3.4.13.dist-info → claude_mpm-3.4.16.dist-info}/licenses/LICENSE +0 -0
- {claude_mpm-3.4.13.dist-info → claude_mpm-3.4.16.dist-info}/top_level.txt +0 -0
|
@@ -0,0 +1,346 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Claude MPM Socket.IO Dashboard</title>
|
|
7
|
+
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cmVjdCB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHJ4PSI2IiBmaWxsPSIjNDI5OWUxIi8+CiAgPHRleHQgeD0iMTYiIHk9IjIxIiBmb250LWZhbWlseT0iSGVsdmV0aWNhLCBBcmlhbCwgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIxMCIgZm9udC13ZWlnaHQ9ImJvbGQiIGZpbGw9IndoaXRlIiB0ZXh0LWFuY2hvcj0ibWlkZGxlIj5NUE08L3RleHQ+Cjwvc3ZnPgo=">
|
|
8
|
+
|
|
9
|
+
<!-- External Dependencies -->
|
|
10
|
+
<script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>
|
|
11
|
+
|
|
12
|
+
<!-- Syntax Highlighting - Prism.js -->
|
|
13
|
+
<link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css" rel="stylesheet">
|
|
14
|
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-core.min.js"></script>
|
|
15
|
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>
|
|
16
|
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/line-numbers/prism-line-numbers.min.js"></script>
|
|
17
|
+
<link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/line-numbers/prism-line-numbers.min.css" rel="stylesheet">
|
|
18
|
+
|
|
19
|
+
<!-- Stylesheets -->
|
|
20
|
+
<link rel="stylesheet" href="/static/css/dashboard.css">
|
|
21
|
+
|
|
22
|
+
<!-- Additional styles for file operations -->
|
|
23
|
+
<style>
|
|
24
|
+
.file-item {
|
|
25
|
+
background: white;
|
|
26
|
+
border-radius: 6px;
|
|
27
|
+
padding: 12px;
|
|
28
|
+
margin-bottom: 8px;
|
|
29
|
+
border-left: 4px solid #4299e1;
|
|
30
|
+
cursor: pointer;
|
|
31
|
+
transition: all 0.2s;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.file-item:hover {
|
|
35
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
36
|
+
transform: translateX(2px);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.file-header {
|
|
40
|
+
display: flex;
|
|
41
|
+
align-items: center;
|
|
42
|
+
gap: 8px;
|
|
43
|
+
margin-bottom: 4px;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.file-icon {
|
|
47
|
+
font-size: 16px;
|
|
48
|
+
min-width: 20px;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.file-path {
|
|
52
|
+
flex: 1;
|
|
53
|
+
font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
|
|
54
|
+
font-size: 13px;
|
|
55
|
+
color: #2d3748;
|
|
56
|
+
word-break: break-all;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.file-timestamp {
|
|
60
|
+
font-size: 12px;
|
|
61
|
+
color: #718096;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.file-summary {
|
|
65
|
+
font-size: 12px;
|
|
66
|
+
color: #4a5568;
|
|
67
|
+
margin-left: 28px;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.operation-item {
|
|
71
|
+
background: #f8fafc;
|
|
72
|
+
border: 1px solid #e2e8f0;
|
|
73
|
+
border-radius: 6px;
|
|
74
|
+
padding: 10px;
|
|
75
|
+
margin-bottom: 8px;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.operation-header {
|
|
79
|
+
display: flex;
|
|
80
|
+
align-items: center;
|
|
81
|
+
gap: 8px;
|
|
82
|
+
margin-bottom: 6px;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.operation-icon {
|
|
86
|
+
font-size: 14px;
|
|
87
|
+
min-width: 16px;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.operation-type {
|
|
91
|
+
font-weight: 600;
|
|
92
|
+
color: #2d3748;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
.operation-timestamp {
|
|
96
|
+
margin-left: auto;
|
|
97
|
+
font-size: 11px;
|
|
98
|
+
color: #718096;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.operation-details {
|
|
102
|
+
font-size: 12px;
|
|
103
|
+
color: #4a5568;
|
|
104
|
+
line-height: 1.4;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
.file-details {
|
|
108
|
+
background: white;
|
|
109
|
+
border-radius: 6px;
|
|
110
|
+
padding: 15px;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.file-path-display {
|
|
114
|
+
font-size: 14px;
|
|
115
|
+
margin-bottom: 15px;
|
|
116
|
+
padding-bottom: 10px;
|
|
117
|
+
border-bottom: 1px solid #e2e8f0;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.operations-list {
|
|
121
|
+
max-height: 400px;
|
|
122
|
+
overflow-y: auto;
|
|
123
|
+
}
|
|
124
|
+
</style>
|
|
125
|
+
</head>
|
|
126
|
+
<body>
|
|
127
|
+
<div class="container">
|
|
128
|
+
<!-- Header Section -->
|
|
129
|
+
<div class="header">
|
|
130
|
+
<!-- Row 1: Title, Status, Metrics -->
|
|
131
|
+
<div class="header-row">
|
|
132
|
+
<div class="header-title">
|
|
133
|
+
<h1>🚀 Claude MPM Monitor</h1>
|
|
134
|
+
<div id="connection-status" class="status-badge status-disconnected">
|
|
135
|
+
<span>●</span> Disconnected
|
|
136
|
+
</div>
|
|
137
|
+
</div>
|
|
138
|
+
<div class="metrics-widget">
|
|
139
|
+
<div class="metric-mini">
|
|
140
|
+
<div class="metric-mini-value" id="total-events">0</div>
|
|
141
|
+
<div class="metric-mini-label">Events</div>
|
|
142
|
+
</div>
|
|
143
|
+
<div class="metric-mini">
|
|
144
|
+
<div class="metric-mini-value" id="events-per-minute">0</div>
|
|
145
|
+
<div class="metric-mini-label">Per Min</div>
|
|
146
|
+
</div>
|
|
147
|
+
<div class="metric-mini">
|
|
148
|
+
<div class="metric-mini-value" id="unique-types">0</div>
|
|
149
|
+
<div class="metric-mini-label">Types</div>
|
|
150
|
+
</div>
|
|
151
|
+
<div class="metric-mini">
|
|
152
|
+
<div class="metric-mini-value" id="error-count">0</div>
|
|
153
|
+
<div class="metric-mini-label">Errors</div>
|
|
154
|
+
</div>
|
|
155
|
+
</div>
|
|
156
|
+
</div>
|
|
157
|
+
|
|
158
|
+
<!-- Row 2: Main Controls (Always Visible) -->
|
|
159
|
+
<div class="header-row main-controls">
|
|
160
|
+
<div class="session-group">
|
|
161
|
+
<label>Session:</label>
|
|
162
|
+
<select id="session-select" class="session-select">
|
|
163
|
+
<option value="">All Sessions</option>
|
|
164
|
+
</select>
|
|
165
|
+
</div>
|
|
166
|
+
<div class="working-dir-group">
|
|
167
|
+
<label>Working Dir:</label>
|
|
168
|
+
<div class="working-dir-display">
|
|
169
|
+
<span id="working-dir-path" class="working-dir-path" title="Click to browse files • Shift+Click to change directory">/Users/masa/Projects/claude-mpm</span>
|
|
170
|
+
<button id="change-dir-btn" class="btn-icon" title="Change working directory">📁</button>
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
<div class="action-buttons">
|
|
174
|
+
<button id="export-btn" class="btn-success">Export</button>
|
|
175
|
+
</div>
|
|
176
|
+
<div class="connection-toggle">
|
|
177
|
+
<button id="connection-toggle-btn" class="btn-secondary">Connection Settings</button>
|
|
178
|
+
</div>
|
|
179
|
+
</div>
|
|
180
|
+
|
|
181
|
+
<!-- Row 3: Connection Controls (Hidden by Default) -->
|
|
182
|
+
<div class="header-row connection-controls-row" id="connection-controls-row" style="display: none;">
|
|
183
|
+
<div class="connection-controls">
|
|
184
|
+
<button id="connect-btn">Connect</button>
|
|
185
|
+
<button id="disconnect-btn" class="btn-secondary">Disconnect</button>
|
|
186
|
+
<input type="text" id="port-input" value="8765" placeholder="Port">
|
|
187
|
+
<label>Session:</label>
|
|
188
|
+
</div>
|
|
189
|
+
</div>
|
|
190
|
+
</div>
|
|
191
|
+
|
|
192
|
+
<!-- Main Content Area -->
|
|
193
|
+
<div class="events-wrapper">
|
|
194
|
+
<!-- Split container for module viewer and tabbed content -->
|
|
195
|
+
<div class="split-container" id="normal-view">
|
|
196
|
+
<!-- Left: Module Viewer -->
|
|
197
|
+
<div class="module-viewer">
|
|
198
|
+
<!-- Single pane layout: Structured Data with collapsible JSON -->
|
|
199
|
+
<div class="module-panes" id="module-content">
|
|
200
|
+
<!-- Data Pane -->
|
|
201
|
+
<div class="module-data-pane">
|
|
202
|
+
<div class="module-data-header">
|
|
203
|
+
<h5>📊 Structured Data</h5>
|
|
204
|
+
</div>
|
|
205
|
+
<div class="module-data-content" id="module-data-content">
|
|
206
|
+
<div class="module-empty">
|
|
207
|
+
<p>Click on an event to view structured data</p>
|
|
208
|
+
<p class="module-hint">Data is organized by event type</p>
|
|
209
|
+
</div>
|
|
210
|
+
</div>
|
|
211
|
+
</div>
|
|
212
|
+
|
|
213
|
+
</div>
|
|
214
|
+
</div>
|
|
215
|
+
|
|
216
|
+
<!-- Right: Tabbed Content -->
|
|
217
|
+
<div class="events-container">
|
|
218
|
+
<!-- Tab Navigation -->
|
|
219
|
+
<div class="tab-nav">
|
|
220
|
+
<button class="tab-button active">📊 Events</button>
|
|
221
|
+
<button class="tab-button">🤖 Agents</button>
|
|
222
|
+
<button class="tab-button">🔧 Tools</button>
|
|
223
|
+
<button class="tab-button">📁 Files</button>
|
|
224
|
+
</div>
|
|
225
|
+
|
|
226
|
+
<!-- Events Tab -->
|
|
227
|
+
<div class="tab-content active" id="events-tab">
|
|
228
|
+
<div class="tab-filters">
|
|
229
|
+
<input type="text" id="events-search-input" placeholder="Search events...">
|
|
230
|
+
<select id="events-type-filter">
|
|
231
|
+
<option value="">All Events</option>
|
|
232
|
+
<!-- Event types will be dynamically populated from actual event data -->
|
|
233
|
+
</select>
|
|
234
|
+
</div>
|
|
235
|
+
<div class="events-list" id="events-list">
|
|
236
|
+
<div class="no-events">
|
|
237
|
+
Connect to Socket.IO server to see events...
|
|
238
|
+
</div>
|
|
239
|
+
</div>
|
|
240
|
+
</div>
|
|
241
|
+
|
|
242
|
+
<!-- Agents Tab -->
|
|
243
|
+
<div class="tab-content" id="agents-tab">
|
|
244
|
+
<div class="tab-filters">
|
|
245
|
+
<input type="text" id="agents-search-input" placeholder="Search agents...">
|
|
246
|
+
<select id="agents-type-filter">
|
|
247
|
+
<option value="">All Agents</option>
|
|
248
|
+
<option value="research">Research</option>
|
|
249
|
+
<option value="engineer">Engineer</option>
|
|
250
|
+
<option value="pm">Project Manager</option>
|
|
251
|
+
<option value="ops">Operations</option>
|
|
252
|
+
</select>
|
|
253
|
+
</div>
|
|
254
|
+
<div class="events-list" id="agents-list">
|
|
255
|
+
<div class="no-events">
|
|
256
|
+
No agent events found...
|
|
257
|
+
</div>
|
|
258
|
+
</div>
|
|
259
|
+
</div>
|
|
260
|
+
|
|
261
|
+
<!-- Tools Tab -->
|
|
262
|
+
<div class="tab-content" id="tools-tab">
|
|
263
|
+
<div class="tab-filters">
|
|
264
|
+
<input type="text" id="tools-search-input" placeholder="Search tools...">
|
|
265
|
+
<select id="tools-type-filter">
|
|
266
|
+
<option value="">All Tools</option>
|
|
267
|
+
<option value="Read">Read</option>
|
|
268
|
+
<option value="Write">Write</option>
|
|
269
|
+
<option value="Edit">Edit</option>
|
|
270
|
+
<option value="Bash">Bash</option>
|
|
271
|
+
<option value="Grep">Grep</option>
|
|
272
|
+
<option value="Glob">Glob</option>
|
|
273
|
+
</select>
|
|
274
|
+
</div>
|
|
275
|
+
<div class="events-list" id="tools-list">
|
|
276
|
+
<div class="no-events">
|
|
277
|
+
No tool events found...
|
|
278
|
+
</div>
|
|
279
|
+
</div>
|
|
280
|
+
</div>
|
|
281
|
+
|
|
282
|
+
<!-- Files Tab -->
|
|
283
|
+
<div class="tab-content" id="files-tab">
|
|
284
|
+
<div class="tab-filters">
|
|
285
|
+
<input type="text" id="files-search-input" placeholder="Search files...">
|
|
286
|
+
<select id="files-type-filter">
|
|
287
|
+
<option value="">All Operations</option>
|
|
288
|
+
<option value="read">Read</option>
|
|
289
|
+
<option value="write">Write</option>
|
|
290
|
+
<option value="edit">Edit</option>
|
|
291
|
+
<option value="search">Search</option>
|
|
292
|
+
</select>
|
|
293
|
+
</div>
|
|
294
|
+
<div class="events-list" id="files-list">
|
|
295
|
+
<div class="no-events">
|
|
296
|
+
No file operations found...
|
|
297
|
+
</div>
|
|
298
|
+
</div>
|
|
299
|
+
</div>
|
|
300
|
+
</div>
|
|
301
|
+
</div>
|
|
302
|
+
</div>
|
|
303
|
+
</div>
|
|
304
|
+
|
|
305
|
+
<!-- Footer -->
|
|
306
|
+
<div class="footer">
|
|
307
|
+
<div class="footer-content">
|
|
308
|
+
<div class="footer-item">
|
|
309
|
+
<span class="footer-label">Session:</span>
|
|
310
|
+
<span class="footer-value" id="footer-session">All Sessions</span>
|
|
311
|
+
</div>
|
|
312
|
+
<span class="footer-divider">|</span>
|
|
313
|
+
<div class="footer-item">
|
|
314
|
+
<span class="footer-label">Directory:</span>
|
|
315
|
+
<span class="footer-value" id="footer-working-dir">Loading...</span>
|
|
316
|
+
</div>
|
|
317
|
+
<span class="footer-divider">|</span>
|
|
318
|
+
<div class="footer-item">
|
|
319
|
+
<span class="footer-label">Branch:</span>
|
|
320
|
+
<span class="footer-value" id="footer-git-branch">Unknown</span>
|
|
321
|
+
</div>
|
|
322
|
+
</div>
|
|
323
|
+
</div>
|
|
324
|
+
|
|
325
|
+
<!-- JavaScript Modules -->
|
|
326
|
+
<!-- Core infrastructure -->
|
|
327
|
+
<script src="/static/js/socket-client.js"></script>
|
|
328
|
+
|
|
329
|
+
<!-- Existing components -->
|
|
330
|
+
<script src="/static/js/components/event-viewer.js"></script>
|
|
331
|
+
<script src="/static/js/components/module-viewer.js"></script>
|
|
332
|
+
<script src="/static/js/components/session-manager.js"></script>
|
|
333
|
+
|
|
334
|
+
<!-- New modular components -->
|
|
335
|
+
<script src="/static/js/components/socket-manager.js"></script>
|
|
336
|
+
<script src="/static/js/components/agent-inference.js"></script>
|
|
337
|
+
<script src="/static/js/components/ui-state-manager.js"></script>
|
|
338
|
+
<script src="/static/js/components/working-directory.js"></script>
|
|
339
|
+
<script src="/static/js/components/file-tool-tracker.js"></script>
|
|
340
|
+
<script src="/static/js/components/event-processor.js"></script>
|
|
341
|
+
<script src="/static/js/components/export-manager.js"></script>
|
|
342
|
+
|
|
343
|
+
<!-- Main dashboard coordinator -->
|
|
344
|
+
<script src="/static/js/dashboard.js"></script>
|
|
345
|
+
</body>
|
|
346
|
+
</html>
|