claude-code-templates 1.5.6 → 1.5.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-templates",
-  "version": "1.5.6",
+  "version": "1.5.8",
   "description": "CLI tool to setup Claude Code configurations with framework-specific commands, automation hooks and MCP Servers for your projects",
   "main": "src/index.js",
   "bin": {

package/src/analytics.js

@@ -137,7 +137,8 @@ class ClaudeAnalytics {
             created: stats.birthtime,
             tokens: this.estimateTokens(content),
             project: projectFromPath || this.extractProjectFromConversation(parsedMessages),
-            status: this.determineConversationStatus(parsedMessages, stats.mtime)
+            status: this.determineConversationStatus(parsedMessages, stats.mtime),
+            conversationState: this.determineConversationState(parsedMessages, stats.mtime)
           };
           
           conversations.push(conversation);
@@ -249,28 +250,57 @@ class ClaudeAnalytics {
     const lastMessageTime = new Date(lastMessage.timestamp);
     const lastMessageMinutesAgo = (now - lastMessageTime) / (1000 * 60);
     
-    // Advanced status logic
+    // Simplified status logic - typing is now part of active
+    if (lastMessage.role === 'user' && lastMessageMinutesAgo < 3) {
+      return 'active';
+    } else if (lastMessage.role === 'assistant' && lastMessageMinutesAgo < 5) {
+      return 'active';
+    }
+    
+    // Fallback to file modification time for edge cases
+    if (minutesAgo < 5) return 'active';
+    if (minutesAgo < 60) return 'recent';
+    return 'inactive';
+  }
+
+  determineConversationState(messages, lastModified) {
+    const now = new Date();
+    const timeDiff = now - lastModified;
+    const minutesAgo = timeDiff / (1000 * 60);
+    
+    if (messages.length === 0) {
+      return minutesAgo < 5 ? 'Waiting for input...' : 'Idle';
+    }
+    
+    // Sort messages by timestamp to get the actual conversation flow
+    const sortedMessages = messages.sort((a, b) => new Date(a.timestamp) - new Date(b.timestamp));
+    const lastMessage = sortedMessages[sortedMessages.length - 1];
+    const lastMessageTime = new Date(lastMessage.timestamp);
+    const lastMessageMinutesAgo = (now - lastMessageTime) / (1000 * 60);
+    
+    // Detailed conversation state logic
     if (lastMessage.role === 'user') {
       // User sent last message
       if (lastMessageMinutesAgo < 0.5) {
-        // Very recent user message, likely typing or waiting for response
-        return 'typing';
+        return 'Claude Code working...';
       } else if (lastMessageMinutesAgo < 3) {
-        // Recent user message, waiting for assistant
-        return 'active';
+        return 'Awaiting response...';
+      } else {
+        return 'User typing...';
       }
     } else if (lastMessage.role === 'assistant') {
       // Assistant sent last message
       if (lastMessageMinutesAgo < 2) {
-        // Recent assistant response, conversation is active
-        return 'active';
+        return 'Awaiting user input...';
+      } else if (lastMessageMinutesAgo < 5) {
+        return 'User may be typing...';
       }
     }
     
-    // Fallback to file modification time for edge cases
-    if (minutesAgo < 5) return 'active';
-    if (minutesAgo < 60) return 'recent';
-    return 'inactive';
+    // Fallback states
+    if (minutesAgo < 5) return 'Recently active';
+    if (minutesAgo < 60) return 'Idle';
+    return 'Inactive';
   }
 
   determineProjectStatus(lastActivity) {
@@ -733,12 +763,25 @@ async function createWebDashboard() {
             color: #7d8590;
         }
         
-        .status-typing {
+        .conversation-state {
             color: #d57455;
-            font-weight: bold;
+            font-style: italic;
+            font-size: 0.8rem;
+        }
+        
+        .conversation-state.working {
+            animation: working-pulse 1.5s infinite;
+        }
+        
+        .conversation-state.typing {
             animation: typing-pulse 1.5s infinite;
         }
         
+        @keyframes working-pulse {
+            0%, 100% { opacity: 1; }
+            50% { opacity: 0.7; }
+        }
+        
         @keyframes typing-pulse {
             0%, 100% { opacity: 1; }
             50% { opacity: 0.6; }
@@ -787,6 +830,28 @@ async function createWebDashboard() {
         .detail-actions {
             display: flex;
             gap: 12px;
+            align-items: center;
+        }
+        
+        .export-format-select {
+            background: #21262d;
+            border: 1px solid #30363d;
+            color: #c9d1d9;
+            padding: 6px 12px;
+            border-radius: 4px;
+            font-family: inherit;
+            font-size: 0.875rem;
+            cursor: pointer;
+        }
+        
+        .export-format-select:focus {
+            outline: none;
+            border-color: #d57455;
+        }
+        
+        .export-format-select option {
+            background: #21262d;
+            color: #c9d1d9;
         }
         
         .btn {
@@ -960,7 +1025,6 @@ async function createWebDashboard() {
                 <span class="filter-label">filter sessions:</span>
                 <div class="filter-buttons">
                     <button class="filter-btn active" data-filter="active">active</button>
-                    <button class="filter-btn" data-filter="typing">typing</button>
                     <button class="filter-btn" data-filter="recent">recent</button>
                     <button class="filter-btn" data-filter="inactive">inactive</button>
                     <button class="filter-btn" data-filter="all">all</button>
@@ -975,6 +1039,7 @@ async function createWebDashboard() {
                         <th>messages</th>
                         <th>tokens</th>
                         <th>last activity</th>
+                        <th>conversation state</th>
                         <th>status</th>
                     </tr>
                 </thead>
@@ -993,7 +1058,11 @@ async function createWebDashboard() {
                 <div class="detail-header">
                     <div class="detail-title" id="detailTitle">session details</div>
                     <div class="detail-actions">
-                        <button class="btn" onclick="exportSessionCSV()">export csv</button>
+                        <select id="exportFormat" class="export-format-select">
+                            <option value="csv">CSV</option>
+                            <option value="json">JSON</option>
+                        </select>
+                        <button class="btn" onclick="exportSession()">export</button>
                         <button class="btn btn-primary" onclick="refreshSessionDetail()">refresh</button>
                     </div>
                 </div>
@@ -1074,6 +1143,7 @@ async function createWebDashboard() {
                     <td class="session-messages">\${conv.messageCount}</td>
                     <td class="session-tokens">\${conv.tokens.toLocaleString()}</td>
                     <td class="session-time">\${formatTime(conv.lastModified)}</td>
+                    <td class="conversation-state \${getStateClass(conv.conversationState)}">\${conv.conversationState}</td>
                     <td class="status-\${conv.status}">\${conv.status}</td>
                 </tr>
             \`).join('');
@@ -1102,6 +1172,16 @@ async function createWebDashboard() {
             });
         }
         
+        function getStateClass(conversationState) {
+            if (conversationState.includes('working') || conversationState.includes('Working')) {
+                return 'working';
+            }
+            if (conversationState.includes('typing') || conversationState.includes('Typing')) {
+                return 'typing';
+            }
+            return '';
+        }
+        
         // Filter button handlers
         document.addEventListener('DOMContentLoaded', function() {
             const filterButtons = document.querySelectorAll('.filter-btn');
@@ -1184,6 +1264,10 @@ async function createWebDashboard() {
                     <div class="info-label">last modified</div>
                     <div class="info-value">\${new Date(session.lastModified).toLocaleString()}</div>
                 </div>
+                <div class="info-item">
+                    <div class="info-label">conversation state</div>
+                    <div class="info-value conversation-state \${getStateClass(session.conversationState)}">\${session.conversationState}</div>
+                </div>
                 <div class="info-item">
                     <div class="info-label">status</div>
                     <div class="info-value status-\${session.status}">\${session.status}</div>
@@ -1237,43 +1321,89 @@ async function createWebDashboard() {
             return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
         }
         
-        function exportSessionCSV() {
+        function exportSession() {
             if (!currentSession) return;
             
-            // Create CSV content
-            let csvContent = 'Session ID,Project,Message Count,Tokens,File Size,Created,Last Modified,Status\\n';
-            csvContent += \`"\${currentSession.id}","\${currentSession.project}",\${currentSession.messageCount},\${currentSession.tokens},\${currentSession.fileSize},"\${new Date(currentSession.created).toISOString()}","\${new Date(currentSession.lastModified).toISOString()}","\${currentSession.status}"\\n\\n\`;
-            
-            csvContent += 'Message #,Role,Content\\n';
+            const format = document.getElementById('exportFormat').value;
             
-            // Add conversation history if loaded
+            // Fetch conversation history and export
             fetch(\`/api/session/\${currentSession.id}\`)
                 .then(response => response.json())
                 .then(sessionData => {
-                    if (sessionData.messages) {
-                        sessionData.messages.forEach((message, index) => {
-                            const content = (message.content || 'no content').replace(/"/g, '""');
-                            csvContent += \`\${index + 1},"\${message.role}","\${content}"\\n\`;
-                        });
+                    if (format === 'csv') {
+                        exportSessionAsCSV(sessionData);
+                    } else if (format === 'json') {
+                        exportSessionAsJSON(sessionData);
                     }
-                    
-                    // Download CSV
-                    const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
-                    const link = document.createElement('a');
-                    const url = URL.createObjectURL(blob);
-                    link.setAttribute('href', url);
-                    link.setAttribute('download', \`claude-session-\${currentSession.id.substring(0, 8)}.csv\`);
-                    link.style.visibility = 'hidden';
-                    document.body.appendChild(link);
-                    link.click();
-                    document.body.removeChild(link);
                 })
                 .catch(error => {
-                    console.error('Failed to export CSV:', error);
-                    alert('Failed to export CSV. Please try again.');
+                    console.error(\`Failed to export \${format.toUpperCase()}:\`, error);
+                    alert(\`Failed to export \${format.toUpperCase()}. Please try again.\`);
                 });
         }
         
+        function exportSessionAsCSV(sessionData) {
+            // Create CSV content
+            let csvContent = 'Session ID,Project,Message Count,Tokens,File Size,Created,Last Modified,Conversation State,Status\\n';
+            csvContent += \`"\${currentSession.id}","\${currentSession.project}",\${currentSession.messageCount},\${currentSession.tokens},\${currentSession.fileSize},"\${new Date(currentSession.created).toISOString()}","\${new Date(currentSession.lastModified).toISOString()}","\${currentSession.conversationState}","\${currentSession.status}"\\n\\n\`;
+            
+            csvContent += 'Message #,Role,Timestamp,Content\\n';
+            
+            // Add conversation history
+            if (sessionData.messages) {
+                sessionData.messages.forEach((message, index) => {
+                    const content = (message.content || 'no content').replace(/"/g, '""');
+                    const timestamp = message.timestamp ? new Date(message.timestamp).toISOString() : 'unknown';
+                    csvContent += \`\${index + 1},"\${message.role}","\${timestamp}","\${content}"\\n\`;
+                });
+            }
+            
+            // Download CSV
+            const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
+            downloadFile(blob, \`claude-session-\${currentSession.id.substring(0, 8)}.csv\`);
+        }
+        
+        function exportSessionAsJSON(sessionData) {
+            // Create comprehensive JSON export
+            const exportData = {
+                session: {
+                    id: currentSession.id,
+                    filename: currentSession.filename,
+                    project: currentSession.project,
+                    messageCount: currentSession.messageCount,
+                    tokens: currentSession.tokens,
+                    fileSize: currentSession.fileSize,
+                    created: currentSession.created,
+                    lastModified: currentSession.lastModified,
+                    conversationState: currentSession.conversationState,
+                    status: currentSession.status
+                },
+                messages: sessionData.messages || [],
+                metadata: {
+                    exportedAt: new Date().toISOString(),
+                    exportFormat: 'json',
+                    toolVersion: '1.5.7'
+                }
+            };
+            
+            // Download JSON
+            const jsonString = JSON.stringify(exportData, null, 2);
+            const blob = new Blob([jsonString], { type: 'application/json;charset=utf-8;' });
+            downloadFile(blob, \`claude-session-\${currentSession.id.substring(0, 8)}.json\`);
+        }
+        
+        function downloadFile(blob, filename) {
+            const link = document.createElement('a');
+            const url = URL.createObjectURL(blob);
+            link.setAttribute('href', url);
+            link.setAttribute('download', filename);
+            link.style.visibility = 'hidden';
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+            URL.revokeObjectURL(url);
+        }
+        
         function refreshSessionDetail() {
             if (currentSession) {
                 loadConversationHistory(currentSession);