vg-coder-cli 2.0.28 → 2.0.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vg-coder-cli",
-  "version": "2.0.28",
+  "version": "2.0.30",
   "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": {
@@ -8,6 +8,7 @@
     "vg-coder": "./bin/vg-coder.js"
   },
   "scripts": {
+    "postinstall": "node scripts/postinstall.js",
     "install:local": "npm install -g .",
     "start": "node src/index.js",
     "test": "jest",
@@ -42,7 +43,7 @@
     "fs-extra": "^11.2.0",
     "highlight.js": "^11.9.0",
     "ignore": "^5.3.0",
-    "node-pty": "^1.0.0",
+    "node-pty": "^1.1.0",
     "ora": "^5.4.1",
     "path": "^0.12.7",
     "socket.io": "^4.7.2",

package/scripts/postinstall.js

@@ -0,0 +1,30 @@
+#!/usr/bin/env node
+
+const { execSync } = require('child_process');
+const path = require('path');
+const fs = require('fs');
+
+// Path to node-pty module
+const nodePtyPath = path.join(__dirname, '..', 'node_modules', 'node-pty');
+
+// Check if node-pty exists
+if (!fs.existsSync(nodePtyPath)) {
+  console.log('⚠️  node-pty not found, skipping rebuild');
+  process.exit(0);
+}
+
+console.log('🔨 Building node-pty native binaries...');
+
+try {
+  // Run npm install in node-pty directory (which triggers its install scripts)
+  execSync('npm run install', {
+    cwd: nodePtyPath,
+    stdio: 'inherit'
+  });
+  console.log('✅ node-pty built successfully!');
+} catch (error) {
+  console.warn('⚠️  node-pty rebuild failed. Terminal functionality may not work.');
+  console.warn('   Run manually: cd node_modules/node-pty && npm run install');
+  // Don't fail the installation
+  process.exit(0);
+}

package/src/server/terminal-manager.js

@@ -24,12 +24,40 @@ class TerminalManager {
 
     createTerminal(socket, termId, cols = 80, rows = 24, cwd, projectId = null) {
         try {
+            const fs = require('fs');
+            const targetCwd = cwd || process.cwd();
+            
+            console.log('[Terminal] Creating terminal with shell:', this.shell);
+            console.log('[Terminal] CWD:', targetCwd);
+            console.log('[Terminal] SHELL env var:', process.env.SHELL);
+            console.log('[Terminal] Platform:', os.platform());
+            
+            // Verify shell exists and is executable
+            if (!fs.existsSync(this.shell)) {
+                throw new Error(`Shell not found at path: ${this.shell}`);
+            }
+            
+            // Verify CWD exists
+            if (!fs.existsSync(targetCwd)) {
+                throw new Error(`Working directory not found: ${targetCwd}`);
+            }
+            
+            // Ensure PATH includes common binary directories
+            const env = {
+                ...process.env,
+                PATH: process.env.PATH || '/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin',
+                TERM: 'xterm-256color'
+            };
+            
+            console.log('[Terminal] Environment PATH:', env.PATH);
+            console.log('[Terminal] Spawning with args:', { shell: this.shell, cwd: targetCwd });
+            
             const term = pty.spawn(this.shell, [], {
                 name: 'xterm-256color',
                 cols: cols,
                 rows: rows,
-                cwd: cwd || process.cwd(),
-                env: process.env
+                cwd: targetCwd,
+                env: env
             });
 
             this.sessions.set(termId, {

package/.vg/tree-state.json

@@ -1,3 +0,0 @@
-{
-  "excludedPaths": []
-}

package/DEVELOPMENT.md

@@ -1,95 +0,0 @@
-# VG Coder - Development & Architecture Guide
-
-Tài liệu này quy định kiến trúc Frontend (Dashboard) để đảm bảo tính dễ bảo trì, mở rộng và code sạch (Clean Code).
-
-## 1. Directory Structure (Cấu trúc thư mục)
-
-Frontend nằm trong `src/server/views/`.
-
-```text
-src/server/views/
-├── dashboard.html          # File HTML chính (Layout & Markup)
-├── dashboard.css           # CSS Global (Variables, Reset, Layout khung sườn)
-├── css/                    # 📁 MODULE CSS (Chứa style riêng biệt cho từng feature)
-│   ├── structure.css       # Style cho cây thư mục
-│   ├── iframe.css          # Style cho Iframe/AI Panel
-│   └── [feature].css       # -> Style cho tính năng mới đặt tại đây
-├── js/                     # 📁 JAVASCRIPT
-│   ├── main.js             # Entry Point (Khởi tạo, Import các feature)
-│   ├── config.js           # Constants & Config
-│   ├── api.js              # API Layer (Fetch requests)
-│   ├── utils.js            # Helper functions
-│   ├── handlers.js         # Global event handlers (để bind vào window)
-│   └── features/           # 📁 MODULE JS (Logic riêng biệt cho từng feature)
-│       ├── structure.js    # Logic cây thư mục
-│       ├── iframe-manager.js # Logic Iframe AI
-│       └── [feature].js    # -> Logic tính năng mới đặt tại đây
-```
-
----
-
-## 2. Quy trình thêm tính năng mới (Workflow)
-
-Khi thêm một tính năng mới (ví dụ: `Settings`), tuân thủ 4 bước sau:
-
-### Bước 1: Tạo CSS Module
-Tạo file `src/server/views/css/settings.css`.
-*   **Quy tắc:** Chỉ viết style liên quan đến settings.
-*   **Import:** Thêm thẻ `<link>` vào `dashboard.html`.
-
-### Bước 2: Tạo JS Module
-Tạo file `src/server/views/js/features/settings.js`.
-*   **Quy tắc:** Export hàm khởi tạo (`initSettings`) hoặc các hàm xử lý logic.
-*   **Không** viết code chạy ngay lập tức (IIFE) trừ khi cần thiết.
-
-```javascript
-// Example: src/server/views/js/features/settings.js
-export function initSettings() {
-    console.log('Settings initialized');
-    // Logic here
-}
-```
-
-### Bước 3: Cập nhật HTML
-Thêm Markup vào `src/server/views/dashboard.html`.
-*   Thêm ID cụ thể để JS dễ query (ví dụ: `id="settings-panel"`).
-*   Thêm link CSS mới vào `<head>`.
-
-### Bước 4: Đăng ký (Register) trong `main.js`
-Import và gọi hàm khởi tạo trong `src/server/views/js/main.js`.
-
-```javascript
-// src/server/views/js/main.js
-import { initSettings } from './features/settings.js';
-
-document.addEventListener('DOMContentLoaded', async () => {
-    // ... các init khác
-    initSettings();
-});
-```
-
----
-
-## 3. Coding Standards (Quy chuẩn Code)
-
-### CSS
-*   Sử dụng **CSS Variables** (`var(--ios-bg)`) định nghĩa trong `dashboard.css` để đồng bộ Dark/Light mode.
-*   Tránh sửa trực tiếp `dashboard.css` trừ khi thay đổi Layout toàn cục.
-
-### JavaScript
-*   **ES Modules:** Sử dụng `import/export`.
-*   **Global Scope:** Hạn chế gán biến vào `window`. Nếu cần dùng cho `onclick=""` trong HTML, hãy gán thông qua file `handlers.js` hoặc gán explicit trong `main.js`.
-*   **API Calls:** Mọi lệnh `fetch` gọi về server nên được viết trong `js/api.js`, sau đó feature import về dùng.
-
----
-
-## 4. Prompt mẫu cho AI
-
-Khi yêu cầu AI code tính năng mới, hãy dùng prompt sau để đảm bảo AI tuân thủ kiến trúc:
-
-> "Hãy thêm tính năng [TÊN_TÍNH_NĂNG].
-> Tuân thủ kiến trúc trong `DEVELOPMENT.md`:
-> 1. Tạo file CSS riêng trong `views/css/`.
-> 2. Tạo file JS logic riêng trong `views/js/features/`.
-> 3. Cập nhật `dashboard.html` và `main.js`.
-> 4. Sử dụng style từ biến CSS có sẵn."

package/SYSTEM_PROMPT.md

@@ -1,157 +0,0 @@
-# VG Coder AI System Prompt
-
-## Command Prefixes
-
-### `/ask` - Question & Answer Mode
-Khi người dùng hỏi với prefix `/ask`, họ đang muốn tìm hiểu hoặc được giải thích về một vấn đề.
-
-**Response Format:** Markdown
-- Trả lời chi tiết, rõ ràng
-- Sử dụng code blocks, lists, tables khi cần
-- Cung cấp ví dụ minh họa
-
-**Example:**
-```
-/ask Làm sao để tối ưu React component?
-```
-
----
-
-### `/plan` - Planning Mode
-Khi người dùng muốn lên kế hoạch với prefix `/plan`, tạo một implementation plan chi tiết.
-
-**Response Format:** Markdown checklist với bash commands
-- Chia nhỏ thành các bước cụ thể
-- Mỗi bước có bash command tương ứng
-- Sắp xếp theo thứ tự logic
-
-**Example:**
-```markdown
-## Implementation Plan
-
-- [ ] **Step 1:** Create component structure
-  ```bash
-  mkdir -p src/components/UserProfile
-  ```
-
-- [ ] **Step 2:** Create component files
-  ```bash
-  touch src/components/UserProfile/index.tsx
-  touch src/components/UserProfile/styles.css
-  ```
-
-- [ ] **Step 3:** Implement component logic
-  ...
-```
-
----
-
-### `/fix` - Bug Fix Mode
-Khi người dùng cần fix bug với prefix `/fix`, phân tích lỗi và đưa ra giải pháp.
-
-**Response Format:** Markdown + Bash script
-1. **Phân tích lỗi:** Giải thích nguyên nhân
-2. **Giải pháp:** Mô tả cách fix
-3. **Bash script:** Code để fix (nếu cần)
-
-**Example:**
-```markdown
-## Bug Analysis
-Lỗi xảy ra do missing dependency...
-
-## Solution
-Cần cài đặt package và cập nhật import...
-
-## Fix Script
-\`\`\`bash
-mkdir -p $(dirname "src/utils/helper.ts")
-cat <<'EOF' > src/utils/helper.ts
-// Fixed code here
-EOF
-\`\`\`
-```
-
----
-
-### `/code` - Code Generation Mode
-Khi người dùng hỏi với prefix `/code`, trả về **BASH SCRIPT DUY NHẤT** để tạo/cập nhật files.
-
-## ⚠️ QUY TẮC BẮT BUỘC
-
-### 1. Chỉ bao gồm files có thay đổi
-- ❌ **KHÔNG** bao gồm files không có sự thay đổi nội dung
-- ✅ Nếu nội dung file sau chỉnh sửa giống 100% bản cũ → **BỎ QUA**
-
-### 2. Format Script Chuẩn
-
-**Mỗi file PHẢI theo cú pháp:**
-```bash
-mkdir -p $(dirname "path/to/file.ext")
-cat <<'EOF' > path/to/file.ext
-... toàn bộ nội dung file sau khi chỉnh sửa ...
-EOF
-```
-
-### 3. Chi tiết quan trọng
-- ✅ **LUÔN** có `mkdir -p $(dirname "...")` trước mỗi file
-- ✅ Sử dụng `<<'EOF'` (có dấu nháy đơn) để tránh bash expansion
-- ✅ Ghi đè hoàn toàn file bằng nội dung mới
-- ✅ Tự động tạo file và thư mục cha nếu chưa tồn tại
-- ✅ Đường dẫn giống với file mẫu đính kèm
-
-### 4. Example Output
-
-```bash
-# Create/Update component file
-mkdir -p $(dirname "src/components/Button/index.tsx")
-cat <<'EOF' > src/components/Button/index.tsx
-import React from 'react';
-
-export const Button = () => {
-  return <button>Click me</button>;
-};
-EOF
-
-# Create/Update styles
-mkdir -p $(dirname "src/components/Button/styles.css")
-cat <<'EOF' > src/components/Button/styles.css
-.button {
-  padding: 10px 20px;
-  background: blue;
-}
-EOF
-```
-
----
-
-## Integration với VG Coder CLI
-
-Bash scripts được generate sẽ được thực thi qua:
-```bash
-POST http://localhost:6868/api/execute
-{
-  "bash": "mkdir -p $(dirname \"src/...\")\\ncat <<'EOF' > ..."
-}
-```
-
-API sẽ:
-1. ✅ Validate bash syntax trong `.vg/temp-execute`
-2. ✅ Execute tại working directory nếu syntax OK
-3. ✅ Trả về stdout/stderr/exitCode
-4. ✅ Auto cleanup temp directory
-
----
-
-## Best Practices
-
-### DO ✅
-- Luôn dùng `mkdir -p $(dirname "...")` trước mỗi file
-- Sử dụng `<<'EOF'` để tránh variable expansion
-- Ghi đè toàn bộ nội dung file
-- Chỉ include files có thay đổi thực sự
-
-### DON'T ❌
-- Không tạo file mà không tạo thư mục cha
-- Không dùng `<<EOF` (thiếu quotes) nếu có `$` trong content
-- Không include files không thay đổi
-- Không dùng relative paths phức tạp

package/coverage/base.css

@@ -1,224 +0,0 @@
-body, html {
-  margin:0; padding: 0;
-  height: 100%;
-}
-body {
-    font-family: Helvetica Neue, Helvetica, Arial;
-    font-size: 14px;
-    color:#333;
-}
-.small { font-size: 12px; }
-*, *:after, *:before {
-  -webkit-box-sizing:border-box;
-     -moz-box-sizing:border-box;
-          box-sizing:border-box;
-  }
-h1 { font-size: 20px; margin: 0;}
-h2 { font-size: 14px; }
-pre {
-    font: 12px/1.4 Consolas, "Liberation Mono", Menlo, Courier, monospace;
-    margin: 0;
-    padding: 0;
-    -moz-tab-size: 2;
-    -o-tab-size:  2;
-    tab-size: 2;
-}
-a { color:#0074D9; text-decoration:none; }
-a:hover { text-decoration:underline; }
-.strong { font-weight: bold; }
-.space-top1 { padding: 10px 0 0 0; }
-.pad2y { padding: 20px 0; }
-.pad1y { padding: 10px 0; }
-.pad2x { padding: 0 20px; }
-.pad2 { padding: 20px; }
-.pad1 { padding: 10px; }
-.space-left2 { padding-left:55px; }
-.space-right2 { padding-right:20px; }
-.center { text-align:center; }
-.clearfix { display:block; }
-.clearfix:after {
-  content:'';
-  display:block;
-  height:0;
-  clear:both;
-  visibility:hidden;
-  }
-.fl { float: left; }
-@media only screen and (max-width:640px) {
-  .col3 { width:100%; max-width:100%; }
-  .hide-mobile { display:none!important; }
-}
-
-.quiet {
-  color: #7f7f7f;
-  color: rgba(0,0,0,0.5);
-}
-.quiet a { opacity: 0.7; }
-
-.fraction {
-  font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
-  font-size: 10px;
-  color: #555;
-  background: #E8E8E8;
-  padding: 4px 5px;
-  border-radius: 3px;
-  vertical-align: middle;
-}
-
-div.path a:link, div.path a:visited { color: #333; }
-table.coverage {
-  border-collapse: collapse;
-  margin: 10px 0 0 0;
-  padding: 0;
-}
-
-table.coverage td {
-  margin: 0;
-  padding: 0;
-  vertical-align: top;
-}
-table.coverage td.line-count {
-    text-align: right;
-    padding: 0 5px 0 20px;
-}
-table.coverage td.line-coverage {
-    text-align: right;
-    padding-right: 10px;
-    min-width:20px;
-}
-
-table.coverage td span.cline-any {
-    display: inline-block;
-    padding: 0 5px;
-    width: 100%;
-}
-.missing-if-branch {
-    display: inline-block;
-    margin-right: 5px;
-    border-radius: 3px;
-    position: relative;
-    padding: 0 4px;
-    background: #333;
-    color: yellow;
-}
-
-.skip-if-branch {
-    display: none;
-    margin-right: 10px;
-    position: relative;
-    padding: 0 4px;
-    background: #ccc;
-    color: white;
-}
-.missing-if-branch .typ, .skip-if-branch .typ {
-    color: inherit !important;
-}
-.coverage-summary {
-  border-collapse: collapse;
-  width: 100%;
-}
-.coverage-summary tr { border-bottom: 1px solid #bbb; }
-.keyline-all { border: 1px solid #ddd; }
-.coverage-summary td, .coverage-summary th { padding: 10px; }
-.coverage-summary tbody { border: 1px solid #bbb; }
-.coverage-summary td { border-right: 1px solid #bbb; }
-.coverage-summary td:last-child { border-right: none; }
-.coverage-summary th {
-  text-align: left;
-  font-weight: normal;
-  white-space: nowrap;
-}
-.coverage-summary th.file { border-right: none !important; }
-.coverage-summary th.pct { }
-.coverage-summary th.pic,
-.coverage-summary th.abs,
-.coverage-summary td.pct,
-.coverage-summary td.abs { text-align: right; }
-.coverage-summary td.file { white-space: nowrap;  }
-.coverage-summary td.pic { min-width: 120px !important;  }
-.coverage-summary tfoot td { }
-
-.coverage-summary .sorter {
-    height: 10px;
-    width: 7px;
-    display: inline-block;
-    margin-left: 0.5em;
-    background: url(sort-arrow-sprite.png) no-repeat scroll 0 0 transparent;
-}
-.coverage-summary .sorted .sorter {
-    background-position: 0 -20px;
-}
-.coverage-summary .sorted-desc .sorter {
-    background-position: 0 -10px;
-}
-.status-line {  height: 10px; }
-/* yellow */
-.cbranch-no { background: yellow !important; color: #111; }
-/* dark red */
-.red.solid, .status-line.low, .low .cover-fill { background:#C21F39 }
-.low .chart { border:1px solid #C21F39 }
-.highlighted,
-.highlighted .cstat-no, .highlighted .fstat-no, .highlighted .cbranch-no{
-  background: #C21F39 !important;
-}
-/* medium red */
-.cstat-no, .fstat-no, .cbranch-no, .cbranch-no { background:#F6C6CE }
-/* light red */
-.low, .cline-no { background:#FCE1E5 }
-/* light green */
-.high, .cline-yes { background:rgb(230,245,208) }
-/* medium green */
-.cstat-yes { background:rgb(161,215,106) }
-/* dark green */
-.status-line.high, .high .cover-fill { background:rgb(77,146,33) }
-.high .chart { border:1px solid rgb(77,146,33) }
-/* dark yellow (gold) */
-.status-line.medium, .medium .cover-fill { background: #f9cd0b; }
-.medium .chart { border:1px solid #f9cd0b; }
-/* light yellow */
-.medium { background: #fff4c2; }
-
-.cstat-skip { background: #ddd; color: #111; }
-.fstat-skip { background: #ddd; color: #111 !important; }
-.cbranch-skip { background: #ddd !important; color: #111; }
-
-span.cline-neutral { background: #eaeaea; }
-
-.coverage-summary td.empty {
-    opacity: .5;
-    padding-top: 4px;
-    padding-bottom: 4px;
-    line-height: 1;
-    color: #888;
-}
-
-.cover-fill, .cover-empty {
-  display:inline-block;
-  height: 12px;
-}
-.chart {
-  line-height: 0;
-}
-.cover-empty {
-    background: white;
-}
-.cover-full {
-    border-right: none !important;
-}
-pre.prettyprint {
-    border: none !important;
-    padding: 0 !important;
-    margin: 0 !important;
-}
-.com { color: #999 !important; }
-.ignore-none { color: #999; font-weight: normal; }
-
-.wrapper {
-  min-height: 100%;
-  height: auto !important;
-  height: 100%;
-  margin: 0 auto -48px;
-}
-.footer, .push {
-  height: 48px;
-}

package/coverage/block-navigation.js

@@ -1,87 +0,0 @@
-/* eslint-disable */
-var jumpToCode = (function init() {
-    // Classes of code we would like to highlight in the file view
-    var missingCoverageClasses = ['.cbranch-no', '.cstat-no', '.fstat-no'];
-
-    // Elements to highlight in the file listing view
-    var fileListingElements = ['td.pct.low'];
-
-    // We don't want to select elements that are direct descendants of another match
-    var notSelector = ':not(' + missingCoverageClasses.join('):not(') + ') > '; // becomes `:not(a):not(b) > `
-
-    // Selector that finds elements on the page to which we can jump
-    var selector =
-        fileListingElements.join(', ') +
-        ', ' +
-        notSelector +
-        missingCoverageClasses.join(', ' + notSelector); // becomes `:not(a):not(b) > a, :not(a):not(b) > b`
-
-    // The NodeList of matching elements
-    var missingCoverageElements = document.querySelectorAll(selector);
-
-    var currentIndex;
-
-    function toggleClass(index) {
-        missingCoverageElements
-            .item(currentIndex)
-            .classList.remove('highlighted');
-        missingCoverageElements.item(index).classList.add('highlighted');
-    }
-
-    function makeCurrent(index) {
-        toggleClass(index);
-        currentIndex = index;
-        missingCoverageElements.item(index).scrollIntoView({
-            behavior: 'smooth',
-            block: 'center',
-            inline: 'center'
-        });
-    }
-
-    function goToPrevious() {
-        var nextIndex = 0;
-        if (typeof currentIndex !== 'number' || currentIndex === 0) {
-            nextIndex = missingCoverageElements.length - 1;
-        } else if (missingCoverageElements.length > 1) {
-            nextIndex = currentIndex - 1;
-        }
-
-        makeCurrent(nextIndex);
-    }
-
-    function goToNext() {
-        var nextIndex = 0;
-
-        if (
-            typeof currentIndex === 'number' &&
-            currentIndex < missingCoverageElements.length - 1
-        ) {
-            nextIndex = currentIndex + 1;
-        }
-
-        makeCurrent(nextIndex);
-    }
-
-    return function jump(event) {
-        if (
-            document.getElementById('fileSearch') === document.activeElement &&
-            document.activeElement != null
-        ) {
-            // if we're currently focused on the search input, we don't want to navigate
-            return;
-        }
-
-        switch (event.which) {
-            case 78: // n
-            case 74: // j
-                goToNext();
-                break;
-            case 66: // b
-            case 75: // k
-            case 80: // p
-                goToPrevious();
-                break;
-        }
-    };
-})();
-window.addEventListener('keydown', jumpToCode);