claude-mpm 4.20.3__py3-none-any.whl → 4.25.10__py3-none-any.whl

claude_mpm/dashboard/static/navigation-test-results.md

@@ -0,0 +1,118 @@
+# Navigation Standardization Test Results
+
+## Summary
+Successfully standardized navigation across all 5 dashboard views using a shared navigation component.
+
+## Implementation Details
+
+### 1. Created Shared Navigation Component
+- **File**: `/src/claude_mpm/dashboard/static/built/components/nav-bar.js`
+- **Features**:
+  - Consistent navigation tabs across all pages
+  - Automatic active page detection
+  - Unified styling with dark theme gradients
+  - Responsive design support
+
+### 2. Updated All Dashboard Views
+
+#### Activity Dashboard (`activity.html`)
+- ✅ Updated to use shared navigation component
+- ✅ Removed duplicate navigation CSS
+- ✅ Added navigation container div
+- ✅ Imported and initialized NavBar component
+
+#### Events Monitor (`events.html`)
+- ✅ Updated to use shared navigation component
+- ✅ Removed duplicate navigation CSS
+- ✅ Added navigation container div
+- ✅ Imported and initialized NavBar component
+
+#### Agents Monitor (`agents.html`)
+- ✅ Updated to use shared navigation component
+- ✅ Removed duplicate navigation CSS
+- ✅ Added navigation container div
+- ✅ Imported and initialized NavBar component
+
+#### Tools Monitor (`tools.html`)
+- ✅ Updated to use shared navigation component
+- ✅ Removed duplicate navigation CSS
+- ✅ Added navigation container div
+- ✅ Imported and initialized NavBar component
+
+#### Files Monitor (`files.html`)
+- ✅ Updated to use shared navigation component
+- ✅ Removed duplicate navigation CSS
+- ✅ Added navigation container div
+- ✅ Imported and initialized NavBar component
+
+## Navigation Features
+
+### Consistent Tab Order
+All pages now display the same navigation tabs in the same order:
+1. 🎯 Activity
+2. 📡 Events
+3. 🤖 Agents
+4. 🔧 Tools
+5. 📁 Files
+
+### Visual Consistency
+- **Background**: Semi-transparent with backdrop blur
+- **Tab Style**: Rounded corners with subtle borders
+- **Hover Effect**: Lift animation with shadow
+- **Active Tab**: Gradient background (green to cyan) with white text
+- **Responsive**: Wraps on smaller screens
+
+### Active Page Highlighting
+Each page correctly highlights its corresponding tab:
+- `activity.html` → Activity tab highlighted
+- `events.html` → Events tab highlighted
+- `agents.html` → Agents tab highlighted
+- `tools.html` → Tools tab highlighted
+- `files.html` → Files tab highlighted
+
+## Testing
+
+### Test Page Created
+- **File**: `/src/claude_mpm/dashboard/static/test-navigation.html`
+- **Purpose**: Visual verification of navigation consistency
+- **Features**:
+  - Shows navigation component in isolation
+  - Displays all 5 dashboard pages in iframes
+  - Verifies navigation loads on each page
+  - Provides pass/fail status for each page
+
+## Code Changes Summary
+
+### Files Modified
+1. `/src/claude_mpm/dashboard/static/activity.html`
+2. `/src/claude_mpm/dashboard/static/events.html`
+3. `/src/claude_mpm/dashboard/static/agents.html`
+4. `/src/claude_mpm/dashboard/static/tools.html`
+5. `/src/claude_mpm/dashboard/static/files.html`
+
+### Files Created
+1. `/src/claude_mpm/dashboard/static/built/components/nav-bar.js`
+2. `/src/claude_mpm/dashboard/static/test-navigation.html`
+3. `/src/claude_mpm/dashboard/static/navigation-test-results.md` (this file)
+
+## Benefits
+
+1. **Maintainability**: Single source of truth for navigation
+2. **Consistency**: Identical navigation across all views
+3. **Extensibility**: Easy to add new pages or modify navigation
+4. **Performance**: Styles injected once, reused across pages
+5. **User Experience**: Predictable navigation behavior
+
+## Verification Steps
+
+To verify the implementation:
+
+1. Open each dashboard view in a browser
+2. Check that navigation appears identically on all pages
+3. Click through tabs to ensure they work
+4. Verify active tab highlighting is correct on each page
+5. Test hover effects are consistent
+
+## Conclusion
+
+The navigation has been successfully standardized across all dashboard views. All pages now use the same shared navigation component, ensuring consistency in appearance, behavior, and user experience.

claude_mpm/dashboard/static/production/main.html

@@ -15,10 +15,10 @@
 
     <!-- External Dependencies -->
     <script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>
-    
+
     <!-- D3.js for Activity Tree Visualization -->
     <script src="https://d3js.org/d3.v7.min.js"></script>
-    
+
     <!-- Font Awesome for icons -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
 
@@ -500,19 +500,19 @@
         // Set up working directory environment variables
         // These will be used by the working-directory component
         // The server will inject these values through a separate API call
-        
+
         // Get the current working directory from the server
         fetch('/api/working-directory')
             .then(response => response.json())
             .then(data => {
                 window.processWorkingDirectory = data.working_directory || '/Users/masa/Projects/claude-mpm';
                 window.homeDirectory = data.home_directory || '/Users/masa';
-                
+
                 // Store in session storage for persistence
                 if (window.processWorkingDirectory && window.processWorkingDirectory !== '/') {
                     sessionStorage.setItem('currentWorkingDirectory', window.processWorkingDirectory);
                 }
-                
+
                 // Dispatch event to notify components that working directory is ready
                 window.dispatchEvent(new CustomEvent('workingDirectoryInitialized', {
                     detail: {
@@ -527,10 +527,10 @@
                 window.processWorkingDirectory = '/Users/masa/Projects/claude-mpm';
                 window.homeDirectory = '/Users/masa';
             });
-        
+
         // Add timestamp-based cache busting and ensure proper loading order
         const timestamp = Date.now();
-        
+
         // Load modules sequentially to ensure dashboard.js loads first
         const loadModule = (src) => {
             return new Promise((resolve, reject) => {
@@ -542,7 +542,7 @@
                 document.body.appendChild(script);
             });
         };
-        
+
         // Load shared services first, then tree modules, then components
         // Load services sequentially to ensure dependencies are available
         loadModule('/static/js/shared/tooltip-service.js')
@@ -594,19 +594,19 @@
             })
             .then(() => {
             console.log('All dashboard modules loaded successfully');
-            
+
             // Debug: Check if CodeViewer loaded
             if (window.CodeViewer) {
                 console.log('[DEBUG] CodeViewer is available on window object');
             } else {
                 console.error('[ERROR] CodeViewer NOT FOUND on window object!');
             }
-            
+
             // CodeViewer will auto-initialize and handle tab switching internally
-            
+
             // Browser Log Viewer initialization is now handled by UIStateManager
             // This prevents duplicate event handlers and tab selection conflicts
-            
+
             // Load bulletproof tab isolation fix
             loadModule('/static/js/tab-isolation-fix.js')
                 .then(() => {
@@ -632,21 +632,21 @@
                 console.error('[CRITICAL] Error loading dashboard modules:', error);
                 console.error('Stack trace:', error.stack);
             });
-            
+
             // Give modules time to execute and initialize dashboard
             setTimeout(() => {
                 console.log('Checking dashboard initialization...');
-                
+
                 if (window.dashboard) {
                     console.log('Dashboard found, checking auto-connect status...');
-                    
+
                     // Force auto-connect if not already connected
                     if (window.dashboard.socketManager) {
                         const socketManager = window.dashboard.socketManager;
-                        
+
                         if (!socketManager.isConnected() && !socketManager.isConnecting()) {
                             console.log('Dashboard loaded but not connected, forcing auto-connect...');
-                            
+
                             // Try to trigger auto-connect manually
                             const params = new URLSearchParams(window.location.search);
                             socketManager.initializeFromURL(params);
@@ -658,23 +658,23 @@
                     }
                 } else {
                     console.warn('Dashboard still not initialized after module loading');
-                    
+
                     // Try to manually trigger initialization
                     if (document.readyState === 'complete' || document.readyState === 'interactive') {
                         console.log('Document ready, attempting to trigger dashboard initialization...');
                         document.dispatchEvent(new Event('DOMContentLoaded'));
                     }
                 }
-                
+
                 // Debug: Test connection settings button
                 const connectionToggleBtn = document.getElementById('connection-toggle-btn');
                 if (connectionToggleBtn) {
                     console.log('Connection toggle button found, testing functionality...');
-                    
+
                     // Add a debug click handler to ensure the button works
                     connectionToggleBtn.addEventListener('click', () => {
                         console.log('Connection toggle button clicked (debug handler)');
-                        
+
                         if (window.dashboard && window.dashboard.socketManager) {
                             console.log('Calling socketManager.toggleConnectionControls()');
                             window.dashboard.socketManager.toggleConnectionControls();

claude_mpm/dashboard/static/test-archive/dashboard.html

@@ -15,10 +15,10 @@
 
     <!-- External Dependencies -->
     <script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>
-    
+
     <!-- D3.js for Activity Tree Visualization -->
     <script src="https://d3js.org/d3.v7.min.js"></script>
-    
+
     <!-- Font Awesome for icons -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
 
@@ -142,7 +142,7 @@
 <body>
     <!-- Connection Notifications Area -->
     <div id="connection-notifications" class="connection-notifications"></div>
-    
+
     <div class="container">
         <!-- Header Section -->
         <div class="header">
@@ -437,19 +437,19 @@
         // Set up working directory environment variables
         // These will be used by the working-directory component
         // The server will inject these values through a separate API call
-        
+
         // Get the current working directory from the server
         fetch('/api/working-directory')
             .then(response => response.json())
             .then(data => {
                 window.processWorkingDirectory = data.working_directory || '/Users/masa/Projects/claude-mpm';
                 window.homeDirectory = data.home_directory || '/Users/masa';
-                
+
                 // Store in session storage for persistence
                 if (window.processWorkingDirectory && window.processWorkingDirectory !== '/') {
                     sessionStorage.setItem('currentWorkingDirectory', window.processWorkingDirectory);
                 }
-                
+
                 // Dispatch event to notify components that working directory is ready
                 window.dispatchEvent(new CustomEvent('workingDirectoryInitialized', {
                     detail: {
@@ -464,10 +464,10 @@
                 window.processWorkingDirectory = '/Users/masa/Projects/claude-mpm';
                 window.homeDirectory = '/Users/masa';
             });
-        
+
         // Add timestamp-based cache busting and ensure proper loading order
         const timestamp = Date.now();
-        
+
         // Load modules sequentially to ensure dashboard.js loads first
         const loadModule = (src) => {
             return new Promise((resolve, reject) => {
@@ -479,7 +479,7 @@
                 document.body.appendChild(script);
             });
         };
-        
+
         // Load shared services first, then tree modules, then components
         // Load services sequentially to ensure dependencies are available
         loadModule('/static/js/shared/tooltip-service.js')
@@ -531,19 +531,19 @@
             })
             .then(() => {
             console.log('All dashboard modules loaded successfully');
-            
+
             // Debug: Check if CodeViewer loaded
             if (window.CodeViewer) {
                 console.log('[DEBUG] CodeViewer is available on window object');
             } else {
                 console.error('[ERROR] CodeViewer NOT FOUND on window object!');
             }
-            
+
             // CodeViewer will auto-initialize and handle tab switching internally
-            
+
             // Browser Log Viewer initialization is now handled by UIStateManager
             // This prevents duplicate event handlers and tab selection conflicts
-            
+
             // Load bulletproof tab isolation fix
             loadModule('/static/js/tab-isolation-fix.js')
                 .then(() => {
@@ -569,21 +569,21 @@
                 console.error('[CRITICAL] Error loading dashboard modules:', error);
                 console.error('Stack trace:', error.stack);
             });
-            
+
             // Give modules time to execute and initialize dashboard
             setTimeout(() => {
                 console.log('Checking dashboard initialization...');
-                
+
                 if (window.dashboard) {
                     console.log('Dashboard found, checking auto-connect status...');
-                    
+
                     // Force auto-connect if not already connected
                     if (window.dashboard.socketManager) {
                         const socketManager = window.dashboard.socketManager;
-                        
+
                         if (!socketManager.isConnected() && !socketManager.isConnecting()) {
                             console.log('Dashboard loaded but not connected, forcing auto-connect...');
-                            
+
                             // Try to trigger auto-connect manually
                             const params = new URLSearchParams(window.location.search);
                             socketManager.initializeFromURL(params);
@@ -595,23 +595,23 @@
                     }
                 } else {
                     console.warn('Dashboard still not initialized after module loading');
-                    
+
                     // Try to manually trigger initialization
                     if (document.readyState === 'complete' || document.readyState === 'interactive') {
                         console.log('Document ready, attempting to trigger dashboard initialization...');
                         document.dispatchEvent(new Event('DOMContentLoaded'));
                     }
                 }
-                
+
                 // Debug: Test connection settings button
                 const connectionToggleBtn = document.getElementById('connection-toggle-btn');
                 if (connectionToggleBtn) {
                     console.log('Connection toggle button found, testing functionality...');
-                    
+
                     // Add a debug click handler to ensure the button works
                     connectionToggleBtn.addEventListener('click', () => {
                         console.log('Connection toggle button clicked (debug handler)');
-                        
+
                         if (window.dashboard && window.dashboard.socketManager) {
                             console.log('Calling socketManager.toggleConnectionControls()');
                             window.dashboard.socketManager.toggleConnectionControls();

claude_mpm/dashboard/templates/.claude-mpm/memories/README.md

@@ -0,0 +1,36 @@
+# Agent Memory System
+
+## Purpose
+Each agent maintains project-specific knowledge in these files. Agents read their memory file before tasks and update it when they learn something new.
+
+## Manual Editing
+Feel free to edit these files to:
+- Add project-specific guidelines
+- Remove outdated information  
+- Reorganize for better clarity
+- Add domain-specific knowledge
+
+## Memory Limits
+- Max file size: 8KB (~2000 tokens)
+- Max sections: 10
+- Max items per section: 15
+- Files auto-truncate when limits exceeded
+
+## File Format
+Standard markdown with structured sections. Agents expect:
+- Project Architecture
+- Implementation Guidelines
+- Common Mistakes to Avoid
+- Current Technical Context
+
+## How It Works
+1. Agents read their memory file before starting tasks
+2. Agents add learnings during or after task completion
+3. Files automatically enforce size limits
+4. Developers can manually edit for accuracy
+
+## Memory File Lifecycle
+- Created automatically when agent first runs
+- Updated through hook system after delegations
+- Manually editable by developers
+- Version controlled with project

claude_mpm/dashboard/templates/.claude-mpm/memories/engineer_agent.md

@@ -0,0 +1,39 @@
+# Engineer Agent Memory - templates
+
+<!-- MEMORY LIMITS: 8KB max | 10 sections max | 15 items per section -->
+<!-- Last Updated: 2025-08-07 18:26:34 | Auto-updated by: engineer -->
+
+## Project Context
+templates: mixed standard application
+
+## Project Architecture
+- Standard Application with mixed implementation
+
+## Coding Patterns Learned
+<!-- Items will be added as knowledge accumulates -->
+
+## Implementation Guidelines
+<!-- Items will be added as knowledge accumulates -->
+
+## Domain-Specific Knowledge
+<!-- Agent-specific knowledge for templates domain -->
+- Key project terms: templates
+- Focus on implementation patterns, coding standards, and best practices
+
+## Effective Strategies
+<!-- Successful approaches discovered through experience -->
+
+## Common Mistakes to Avoid
+<!-- Items will be added as knowledge accumulates -->
+
+## Integration Points
+<!-- Items will be added as knowledge accumulates -->
+
+## Performance Considerations
+<!-- Items will be added as knowledge accumulates -->
+
+## Current Technical Context
+<!-- Items will be added as knowledge accumulates -->
+
+## Recent Learnings
+<!-- Most recent discoveries and insights -->

claude_mpm/dashboard/templates/.claude-mpm/memories/version_control_agent.md

@@ -0,0 +1,38 @@
+# Version Control Agent Memory - templates
+
+<!-- MEMORY LIMITS: 8KB max | 10 sections max | 15 items per section -->
+<!-- Last Updated: 2025-08-07 18:28:51 | Auto-updated by: version_control -->
+
+## Project Context
+templates: mixed standard application
+
+## Project Architecture
+- Standard Application with mixed implementation
+
+## Coding Patterns Learned
+<!-- Items will be added as knowledge accumulates -->
+
+## Implementation Guidelines
+<!-- Items will be added as knowledge accumulates -->
+
+## Domain-Specific Knowledge
+<!-- Agent-specific knowledge for templates domain -->
+- Key project terms: templates
+
+## Effective Strategies
+<!-- Successful approaches discovered through experience -->
+
+## Common Mistakes to Avoid
+<!-- Items will be added as knowledge accumulates -->
+
+## Integration Points
+<!-- Items will be added as knowledge accumulates -->
+
+## Performance Considerations
+<!-- Items will be added as knowledge accumulates -->
+
+## Current Technical Context
+<!-- Items will be added as knowledge accumulates -->
+
+## Recent Learnings
+<!-- Most recent discoveries and insights -->

claude_mpm/dashboard/templates/code_simple.html

@@ -24,50 +24,50 @@
             border-radius: 4px;
             margin-bottom: 20px;
         }
-        
+
         /* Tree visualization styles */
         .tree-node {
             cursor: pointer;
         }
-        
+
         .tree-node circle {
             fill: #fff;
             stroke: steelblue;
             stroke-width: 2px;
             transition: all 0.3s ease;
         }
-        
+
         .tree-node:hover circle {
             fill: #e6f3ff;
             stroke-width: 3px;
         }
-        
+
         .tree-node text {
             font: 12px sans-serif;
             pointer-events: none;
         }
-        
+
         .tree-link {
             fill: none;
             stroke: #ccc;
             stroke-width: 2px;
         }
-        
+
         .view-toggle button {
             transition: all 0.3s ease;
         }
-        
+
         .view-toggle button:hover {
             transform: translateY(-1px);
             box-shadow: 0 2px 4px rgba(0,0,0,0.2);
         }
-        
+
         .file-selector input:focus {
             outline: none;
             border-color: #007cba;
             box-shadow: 0 0 0 2px rgba(0, 124, 186, 0.2);
         }
-        
+
         .tree-legend {
             position: absolute;
             top: 10px;
@@ -79,13 +79,13 @@
             font-size: 12px;
             z-index: 1000;
         }
-        
+
         .tree-legend-item {
             margin: 2px 0;
             display: flex;
             align-items: center;
         }
-        
+
         .tree-legend-color {
             width: 12px;
             height: 12px;
@@ -103,15 +103,15 @@
                 <div>⏳ Page loaded...</div>
             </div>
         </div>
-        
+
         <div id="code-container">
             <!-- SimpleCodeView will render here -->
         </div>
     </div>
-    
+
     <script>
         console.log('[HTML] Page script starting');
-        
+
         function addStatus(message) {
             const statusDiv = document.getElementById('status-messages');
             if (statusDiv) {
@@ -119,27 +119,27 @@
             }
             console.log('[HTML Status]', message);
         }
-        
+
         addStatus('⏳ Loading code-simple.js...');
     </script>
-    
+
     <!-- D3.js for tree visualization -->
-    <script src="https://d3js.org/d3.v7.min.js" 
+    <script src="https://d3js.org/d3.v7.min.js"
             onload="addStatus('✅ D3.js loaded successfully')"
             onerror="addStatus('❌ Failed to load D3.js')"></script>
-    
+
     <!-- Socket.IO for real-time communication -->
-    <script src="https://cdn.socket.io/4.7.2/socket.io.min.js" 
+    <script src="https://cdn.socket.io/4.7.2/socket.io.min.js"
             onload="addStatus('✅ Socket.IO loaded successfully')"
             onerror="addStatus('❌ Failed to load Socket.IO')"></script>
-    
-    <script src="/static/js/components/code-simple.js" 
+
+    <script src="/static/js/components/code-simple.js"
             onload="addStatus('✅ code-simple.js loaded successfully')"
             onerror="addStatus('❌ Failed to load code-simple.js')"></script>
-    
+
     <script>
         addStatus('⏳ Waiting for initialization...');
-        
+
         // Check initialization after a delay
         setTimeout(() => {
             if (window.simpleCodeView) {