vg-coder-cli 2.0.42 → 2.0.43

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vg-coder-cli",
-  "version": "2.0.42",
+  "version": "2.0.43",
   "description": "🚀 CLI tool to analyze projects, concatenate source files, count tokens, and export HTML with syntax highlighting and copy functionality",
   "main": "src/index.js",
   "bin": {

package/src/server/views/css/agent-panel.css

@@ -37,7 +37,7 @@
     justify-content: center;
     height: 100%;
     color: #52525b;
-    gap: 10px;
+    gap: 16px;
 }
 
 .agent-chat-empty svg {
@@ -49,6 +49,34 @@
     font-size: 13px;
 }
 
+.agent-reload-btn {
+    margin-top: 8px;
+    padding: 10px 20px;
+    background: #3b82f6;
+    color: white;
+    border: none;
+    border-radius: 6px;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s;
+}
+
+.agent-reload-btn:hover {
+    background: #2563eb;
+    transform: translateY(-1px);
+}
+
+.agent-reload-btn:active {
+    transform: translateY(0);
+}
+
+.agent-reload-btn:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+    transform: none;
+}
+
 /* Message Container */
 .agent-message {
     display: flex;
@@ -258,6 +286,41 @@
     cursor: not-allowed;
 }
 
+/* Code Block Wrapper for Run Bash Button */
+.agent-code-block-wrapper {
+    position: relative;
+    margin: 8px 0;
+}
+
+.agent-run-bash-btn {
+    position: absolute;
+    top: 8px;
+    right: 8px;
+    background: #3b82f6;
+    color: white;
+    border: none;
+    padding: 4px 12px;
+    border-radius: 4px;
+    font-size: 11px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s;
+    z-index: 10;
+    display: flex;
+    align-items: center;
+    gap: 4px;
+}
+
+.agent-run-bash-btn:hover {
+    background: #2563eb;
+    transform: translateY(-1px);
+    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
+}
+
+.agent-run-bash-btn:active {
+    transform: translateY(0);
+}
+
 /* Mermaid Diagrams */
 .agent-mermaid {
     margin: 16px 0;

package/src/server/views/js/features/agent-panel.js

@@ -4,7 +4,6 @@
  */
 
 import { getById } from '../utils.js';
-import * as ChatHistory from '../utils/chat-history-manager.js';
 // Import markdown-it and mermaid from npm packages (bundled by webpack)
 import markdownit from 'markdown-it';
 import mermaid from 'mermaid';
@@ -122,10 +121,10 @@ async function renderAgentPanel() {
     // Attach event listeners
     attachEventListeners();
     
-    // Load last chat or start fresh
-    await initializeChatSession();
+    // Don't auto-load - let user click reload
+    console.log('[AgentPanel] Panel ready, waiting for user action');
     
-    // Render messages
+    // Render empty state
     renderMessages();
 
     console.log('[AgentPanel] Rendered successfully');
@@ -209,24 +208,44 @@ function attachEventListeners() {
  * Initialize chat session
  */
 async function initializeChatSession() {
-    // Try to load last chat
-    const lastChatId = ChatHistory.getLastChatId();
-    
-    if (lastChatId) {
-        console.log(`[AgentPanel] Loading last chat: ${lastChatId}`);
-        currentChatId = lastChatId;
+    // Check if AIChat is available
+    if (!window.AIChat) {
+        console.warn('[AgentPanel] AIChat not available yet');
+        return;
+    }
+
+    try {
+        // Load from adapter cache (single source of truth)
+        console.log('[AgentPanel] Loading conversation history from adapter...');
+        const historyMessages = await window.AIChat.getCurrentMessages();
         
-        const chatData = ChatHistory.loadChat(currentChatId);
-        if (chatData && chatData.messages) {
-            messages = chatData.messages;
-            console.log(`[AgentPanel] Loaded ${messages.length} messages`);
+        if (historyMessages && historyMessages.length > 0) {
+            console.log(`[AgentPanel] Loaded ${historyMessages.length} messages from adapter cache`);
+            
+            // Convert history format to agent panel format
+            messages = historyMessages.map(msg => ({
+                role: msg.role,
+                content: msg.content,
+                timestamp: new Date(msg.timestamp).toLocaleTimeString(),
+                status: 'done'
+            }));
+            
+            // Get chat ID from URL
+            const chatId = window.AIChat.getChatIdFromUrl?.();
+            if (chatId) {
+                currentChatId = chatId;
+            }
+            
+            renderMessages();
         } else {
+            console.log('[AgentPanel] No conversation history found');
             messages = [];
+            renderMessages();
         }
-    } else {
-        console.log('[AgentPanel] Starting fresh chat');
+    } catch (error) {
+        console.error('[AgentPanel] Failed to load history:', error);
         messages = [];
-        currentChatId = null;
+        renderMessages();
     }
 }
 
@@ -243,9 +262,25 @@ function renderMessages() {
                 <svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                     <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"></path>
                 </svg>
-                <span>Kéo thả file hoặc nhập tin nhắn</span>
+                <span>No conversation loaded</span>
+                <button class="agent-reload-btn" id="agent-reload-btn">
+                    🔄 Load Conversation History
+                </button>
             </div>
         `;
+        
+        // Attach reload button listener
+        const reloadBtn = getById('agent-reload-btn');
+        if (reloadBtn) {
+            reloadBtn.addEventListener('click', async () => {
+                reloadBtn.disabled = true;
+                reloadBtn.textContent = '⏳ Loading...';
+                await initializeChatSession();
+                reloadBtn.disabled = false;
+                reloadBtn.textContent = '🔄 Load Conversation History';
+            });
+        }
+        
         return;
     }
 
@@ -269,10 +304,111 @@ function renderMessages() {
     // Process mermaid diagrams
     processMermaidDiagrams(container);
     
+    // Add run bash buttons
+    addRunBashButtons(container);
+    
     // Scroll to bottom
     container.scrollTop = container.scrollHeight;
 }
 
+/**
+ * Add "Run Bash" buttons to bash code blocks
+ */
+function addRunBashButtons(container) {
+    const bashCodeBlocks = container.querySelectorAll('code.language-bash');
+    if (bashCodeBlocks.length === 0) return;
+
+    console.log(`[AgentPanel] Found ${bashCodeBlocks.length} bash code block(s)`);
+
+    bashCodeBlocks.forEach((codeBlock, index) => {
+        const preElement = codeBlock.parentElement;
+        if (!preElement || preElement.tagName !== 'PRE') return;
+
+        // Check if button already exists
+        if (preElement.querySelector('.agent-run-bash-btn')) return;
+
+        // Create button
+        const button = document.createElement('button');
+        button.className = 'agent-run-bash-btn';
+        button.innerHTML = '▶ Run Bash';
+        button.title = 'Run bash command in terminal';
+
+        // Click handler
+        button.addEventListener('click', async (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+
+            const code = codeBlock.textContent || '';
+            if (!code.trim()) {
+                console.warn('[AgentPanel] No bash code found');
+                return;
+            }
+
+            console.log('[AgentPanel] Run bash triggered');
+
+            // Copy to clipboard
+            try {
+                await navigator.clipboard.writeText(code);
+            } catch (err) {
+                console.error('[AgentPanel] Clipboard copy failed:', err);
+                return;
+            }
+
+            // Dispatch event
+            dispatchPasteRun(code);
+        });
+
+        // Wrap pre in container if not already
+        if (!preElement.parentElement.classList.contains('agent-code-block-wrapper')) {
+            const wrapper = document.createElement('div');
+            wrapper.className = 'agent-code-block-wrapper';
+            preElement.parentNode.insertBefore(wrapper, preElement);
+            wrapper.appendChild(preElement);
+            wrapper.appendChild(button);
+        } else {
+            preElement.parentElement.appendChild(button);
+        }
+
+        console.log(`[AgentPanel] Run bash button added (${index + 1})`);
+    });
+}
+
+/**
+ * Dispatch paste-run event for bash execution
+ */
+function dispatchPasteRun(code) {
+    const EVENT_TYPE = 'vg:paste-run';
+    
+    // Use global dispatcher if available
+    const dispatcher = window.__VG_EVENT_DISPATCHER__ || window.globalDispatcher || null;
+
+    const eventPayload = {
+        type: EVENT_TYPE,
+        source: 'agent-panel',
+        target: 'bubble-runner',
+        payload: {
+            code,
+            from: 'run-bash-button',
+        },
+        context: 'window',
+    };
+
+    if (dispatcher?.dispatchCrossContext) {
+        dispatcher.dispatchCrossContext(eventPayload);
+        console.log('[AgentPanel] Dispatched via globalDispatcher:', EVENT_TYPE);
+        return;
+    }
+
+    // Fallback: CustomEvent
+    window.dispatchEvent(
+        new CustomEvent(EVENT_TYPE, {
+            detail: eventPayload,
+        })
+    );
+
+    console.log('[AgentPanel] Dispatched via CustomEvent:', EVENT_TYPE);
+}
+
 /**
  * Process mermaid diagrams
  * Uses mermaid.render() which is more compatible with shadow DOM
@@ -364,10 +500,13 @@ async function sendMessage() {
         const aiResponse = await window.AIChat.copyLastTurnAsMarkdown();
         updateLastMessage({ content: aiResponse || '(AI không trả về nội dung)', status: 'done' });
 
-        // Create chat ID after first message
+        // Get chat ID from URL (adapter manages chat ID)
         if (isFirstMessage && !currentChatId) {
-            currentChatId = ChatHistory.generateChatId();
-            console.log(`[AgentPanel] Created new chat: ${currentChatId}`);
+            const chatId = window.AIChat?.getChatIdFromUrl?.();
+            if (chatId) {
+                currentChatId = chatId;
+                console.log(`[AgentPanel] Using chat ID from URL: ${currentChatId}`);
+            }
         }
     } catch (error) {
         console.error('[AgentPanel] Error sending message:', error);
@@ -434,7 +573,7 @@ function addMessage(role, content, status = 'done') {
         timestamp: new Date().toLocaleTimeString('vi-VN')
     });
     renderMessages();
-    autoSaveChat();
+    // Adapter auto-saves, no manual save needed
 }
 
 /**
@@ -444,41 +583,26 @@ function updateLastMessage(updates) {
     if (messages.length === 0) return;
     Object.assign(messages[messages.length - 1], updates);
     renderMessages();
-    autoSaveChat();
+    // Adapter handles storage
 }
 
 /**
- * Auto-save chat
+ * Auto-save is handled by adapter
+ * No manual save needed
  */
-function autoSaveChat() {
-    if (!currentChatId) return;
-
-    if (autoSaveTimeout) {
-        clearTimeout(autoSaveTimeout);
-    }
-
-    autoSaveTimeout = setTimeout(() => {
-        const success = ChatHistory.saveChat(currentChatId, messages);
-        if (success) {
-            console.log(`[AgentPanel] Auto-saved chat ${currentChatId}`);
-        }
-    }, 500);
-}
 
 /**
- * Clear chat
+ * Handle clear chat
  */
 function handleClearChat() {
-    if (!confirm('Xóa toàn bộ lịch sử chat?')) return;
-
-    if (currentChatId) {
-        ChatHistory.deleteChat(currentChatId);
+    if (messages.length === 0) return;
+    
+    if (confirm('Clear chat history?')) {
         console.log(`[AgentPanel] Deleted chat ${currentChatId}`);
     }
 
     messages = [];
     selectedFiles = [];
-    currentChatId = null;
     renderFileList();
     renderMessages();
 }

package/src/server/views/js/utils/chat-history-manager.js

@@ -1,237 +0,0 @@
-/**
- * Chat History Manager
- * Manages chat sessions in localStorage
- */
-
-const STORAGE_PREFIX = 'vg-dashboard-chat-';
-const METADATA_KEY = 'vg-dashboard-chat-metadata';
-const MAX_CHAT_AGE_DAYS = 30;
-const MAX_TITLE_LENGTH = 50;
-
-/**
- * Generate unique chat ID
- * @returns {string} Chat ID
- */
-export function generateChatId() {
-  const timestamp = Date.now().toString(36);
-  const random = Math.random().toString(36).substring(2, 15) + 
-                 Math.random().toString(36).substring(2, 15);
-  return `${timestamp}${random}`;
-}
-
-/**
- * Generate chat title from messages
- * @param {Array} messages - Chat messages
- * @returns {string} Chat title
- */
-function generateTitle(messages) {
-  if (!messages || messages.length === 0) return 'New Chat';
-  const firstUserMsg = messages.find(m => m.role === 'user');
-  if (!firstUserMsg) return 'New Chat';
-  
-  let title = firstUserMsg.content.trim();
-  if (title.length > MAX_TITLE_LENGTH) {
-    title = title.substring(0, MAX_TITLE_LENGTH) + '...';
-  }
-  return title;
-}
-
-/**
- * Get metadata
- * @returns {object} Metadata object
- */
-function getMetadata() {
-  try {
-    const data = localStorage.getItem(METADATA_KEY);
-    return data ? JSON.parse(data) : { allChatIds: [], lastAccessedChatId: null };
-  } catch (error) {
-    console.error('[ChatHistory] Failed to get metadata:', error);
-    return { allChatIds: [], lastAccessedChatId: null };
-  }
-}
-
-/**
- * Update metadata
- * @param {object} updates - Updates to apply
- */
-function updateMetadata(updates) {
-  const metadata = getMetadata();
-  Object.assign(metadata, updates);
-  try {
-    localStorage.setItem(METADATA_KEY, JSON.stringify(metadata));
-  } catch (error) {
-    console.error('[ChatHistory] Failed to update metadata:', error);
-    handleStorageError(error);
-  }
-}
-
-/**
- * Handle storage errors
- * @param {Error} error - Error object
- */
-function handleStorageError(error) {
-  if (error.name === 'QuotaExceededError') {
-    console.warn('[ChatHistory] Storage quota exceeded, cleaning up...');
-    const deletedCount = cleanupOldChats(7);
-    if (deletedCount > 0) {
-      console.log(`[ChatHistory] Cleaned up ${deletedCount} old chats`);
-    } else {
-      console.error('[ChatHistory] Storage full and no old chats to cleanup!');
-      alert('⚠️ Bộ nhớ đã đầy! Vui lòng xóa bớt lịch sử chat cũ.');
-    }
-  }
-}
-
-/**
- * Save chat to localStorage
- * @param {string} chatId - Chat ID
- * @param {Array} messages - Messages array
- * @param {object} options - Additional options
- * @returns {boolean} Success status
- */
-export function saveChat(chatId, messages, options = {}) {
-  if (!chatId) {
-    console.error('[ChatHistory] Cannot save chat without ID');
-    return false;
-  }
-
-  const now = Date.now();
-  const key = STORAGE_PREFIX + chatId;
-
-  let chatData;
-  try {
-    const existing = localStorage.getItem(key);
-    chatData = existing ? JSON.parse(existing) : { id: chatId, createdAt: now };
-  } catch (error) {
-    console.error('[ChatHistory] Failed to load existing chat:', error);
-    chatData = { id: chatId, createdAt: now };
-  }
-
-  chatData.messages = messages;
-  chatData.updatedAt = now;
-  chatData.title = options.title || generateTitle(messages);
-
-  try {
-    localStorage.setItem(key, JSON.stringify(chatData));
-    const metadata = getMetadata();
-    if (!metadata.allChatIds.includes(chatId)) {
-      metadata.allChatIds.push(chatId);
-    }
-    metadata.lastAccessedChatId = chatId;
-    updateMetadata(metadata);
-    return true;
-  } catch (error) {
-    console.error('[ChatHistory] Failed to save chat:', error);
-    handleStorageError(error);
-    return false;
-  }
-}
-
-/**
- * Load chat from localStorage
- * @param {string} chatId - Chat ID
- * @returns {object|null} Chat data
- */
-export function loadChat(chatId) {
-  if (!chatId) return null;
-
-  const key = STORAGE_PREFIX + chatId;
-  try {
-    const data = localStorage.getItem(key);
-    if (!data) {
-      console.warn(`[ChatHistory] Chat not found: ${chatId}`);
-      return null;
-    }
-
-    const chatData = JSON.parse(data);
-    if (!chatData.messages || !Array.isArray(chatData.messages)) {
-      console.error('[ChatHistory] Invalid chat data structure');
-      return null;
-    }
-
-    updateMetadata({ lastAccessedChatId: chatId });
-
-    return {
-      messages: chatData.messages,
-      metadata: {
-        title: chatData.title,
-        createdAt: chatData.createdAt,
-        updatedAt: chatData.updatedAt,
-      }
-    };
-  } catch (error) {
-    console.error('[ChatHistory] Failed to load chat:', error);
-    return null;
-  }
-}
-
-/**
- * Delete chat from localStorage
- * @param {string} chatId - Chat ID
- * @returns {boolean} Success status
- */
-export function deleteChat(chatId) {
-  if (!chatId) return false;
-
-  const key = STORAGE_PREFIX + chatId;
-  try {
-    localStorage.removeItem(key);
-    const metadata = getMetadata();
-    metadata.allChatIds = metadata.allChatIds.filter(id => id !== chatId);
-    if (metadata.lastAccessedChatId === chatId) {
-      metadata.lastAccessedChatId = null;
-    }
-    updateMetadata(metadata);
-    return true;
-  } catch (error) {
-    console.error('[ChatHistory] Failed to delete chat:', error);
-    return false;
-  }
-}
-
-/**
- * Cleanup old chats
- * @param {number} maxAgeDays - Max age in days
- * @returns {number} Number of chats deleted
- */
-export function cleanupOldChats(maxAgeDays = MAX_CHAT_AGE_DAYS) {
-  const cutoffTime = Date.now() - (maxAgeDays * 24 * 60 * 60 * 1000);
-  const metadata = getMetadata();
-  let deletedCount = 0;
-
-  for (const chatId of [...metadata.allChatIds]) {
-    const key = STORAGE_PREFIX + chatId;
-    try {
-      const data = localStorage.getItem(key);
-      if (data) {
-        const chatData = JSON.parse(data);
-        if (chatData.updatedAt < cutoffTime) {
-          deleteChat(chatId);
-          deletedCount++;
-        }
-      }
-    } catch (error) {
-      console.error(`[ChatHistory] Failed to check chat ${chatId}:`, error);
-    }
-  }
-
-  return deletedCount;
-}
-
-/**
- * Get all chat IDs
- * @returns {Array<string>} Array of chat IDs
- */
-export function getAllChatIds() {
-  const metadata = getMetadata();
-  return metadata.allChatIds;
-}
-
-/**
- * Get last accessed chat ID
- * @returns {string|null} Last chat ID
- */
-export function getLastChatId() {
-  const metadata = getMetadata();
-  return metadata.lastAccessedChatId;
-}