vg-coder-cli 1.0.17 → 2.0.1

package/SYSTEM_PROMPT.md

@@ -0,0 +1,157 @@
+# 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/init-nx-monorepo.sh

@@ -0,0 +1,107 @@
+#!/bin/bash
+
+# Dừng script ngay lập tức nếu có lỗi
+set -e
+
+echo "🚀 Bắt đầu khởi tạo template Nx (Angular + NestJS)..."
+echo "---------------------------------------------------------"
+
+# Bước 1: Lấy tên workspace từ người dùng
+read -p "Tên workspace của bạn là gì? (ví dụ: my-monorepo): " WORKSPACE_NAME
+
+# Kiểm tra nếu tên workspace bị trống
+if [ -z "$WORKSPACE_NAME" ]; then
+  echo "❌ Tên workspace không được để trống! Đã hủy."
+  exit 1
+fi
+
+echo "---------------------------------------------------------"
+echo "🔧 Đang tạo workspace: $WORKSPACE_NAME"
+echo "(Sử dụng preset=ts và --workspaces=false để tương thích với Angular)"
+
+# Bước 2: Tạo Nx Workspace
+npx create-nx-workspace@latest "$WORKSPACE_NAME" --preset=ts --workspaces=false --skip-nx-cloud --no-interactive
+
+# Di chuyển vào thư mục workspace vừa tạo
+cd "$WORKSPACE_NAME"
+
+echo "✅ Workspace $WORKSPACE_NAME đã được tạo."
+echo "---------------------------------------------------------"
+
+# Bước 3: Thêm NestJS
+echo "📦 Đang cài đặt và cấu hình NestJS..."
+npm install --save-dev @nx/nest
+nx g @nx/nest:app --name=api --directory=apps/api --tags="scope:server,type:app" --no-interactive
+
+echo "---------------------------------------------------------"
+
+# Bước 4: Thêm Angular
+echo "📦 Đang cài đặt và cấu hình Angular..."
+npm install --save-dev @nx/angular
+nx g @nx/angular:app --name=ng-app --directory=apps/ng-app --tags="scope:client,type:app" --e2eTestRunner=none --style=scss --no-interactive
+
+echo "---------------------------------------------------------"
+
+# Bước 5: Tạo Thư viện Chung (JS/TS)
+echo "📚 Đang tạo thư viện chung 'data-types'..."
+npm install --save-dev @nx/js
+nx g @nx/js:library --name=data-types --directory=packages/shared/data-types --tags="scope:shared,type:lib" --no-interactive
+
+echo "---------------------------------------------------------"
+
+# Bước 6: Tạo Thư viện Data Access (Angular)
+echo "📚 Đang tạo thư viện 'data-access' cho Angular..."
+nx g @nx/angular:library --name=data-access --directory=packages/client/data-access --tags="scope:client,type:lib" --style=scss  --no-interactive
+
+echo "---------------------------------------------------------"
+
+# Bước 7: TỰ ĐỘNG TẠO FILE PROXY.CONF.JSON (ĐÃ SỬA)
+echo "🔗 Đang tạo file 'apps/ng-app/proxy.conf.json'..."
+
+cat <<EOF > apps/ng-app/proxy.conf.json
+{
+  "/api": {
+    "target": "http://localhost:3000",
+    "secure": false,
+    "logLevel": "debug"
+  }
+}
+EOF
+
+echo "✅ File 'proxy.conf.json' đã được tạo."
+echo "---------------------------------------------------------"
+echo "🎉 HOÀN TẤT (với 2 bước thủ công)!"
+echo "---------------------------------------------------------"
+echo ""
+echo "‼️ YÊU CẦU HÀNH ĐỘNG THỦ CÔNG (2 BƯỚC) ‼️"
+echo "Script đã tạo file 'proxy.conf.json', nhưng bạn cần kết nối nó với 'ng-app'."
+echo ""
+echo "👉 Mở file: ./$WORKSPACE_NAME/apps/ng-app/project.json"
+echo ""
+echo "1. Thêm 'proxyConfig' vào target 'serve' (trong 'options'):"
+echo '
+  "serve": {
+    "executor": "@nx/angular:dev-server",
+    "options": {
+      "proxyConfig": "apps/ng-app/proxy.conf.json" <-- THÊM DÒNG NÀY
+    },
+'
+echo ""
+echo "2. Thêm 'dependsOn' vào target 'serve' (để tự động chạy API):"
+echo '
+  "serve": {
+    ...
+    "defaultConfiguration": "development",
+    "dependsOn": [  <-- THÊM KHỐI NÀY
+      {
+        "target": "serve",
+        "projects": "api"
+      }
+    ]
+  },
+'
+echo ""
+echo "Sau khi hoàn tất 2 bước trên, bạn có thể chạy:"
+echo "nx serve ng-app"
+
+# ulimit -n 10240 &&  ./init-nx-monorepo.sh

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "vg-coder-cli",
-  "version": "1.0.17",
-  "description": "🚀 CLI tool to analyze projects, concatenate source files, count tokens, and export HTML with syntax highlighting and copy functionality",
+  "version": "2.0.1",
+  "description": "🚀 CLI tool to analyze projects, concatenate source files, count tokens, and export HTML with syntax highlighting. Now with modern NestJS API and Angular dashboard!",
   "main": "src/index.js",
   "bin": {
     "vg": "./bin/vg.js",
@@ -12,7 +12,9 @@
     "test": "jest",
     "test:watch": "jest --watch",
     "dev": "nodemon src/index.js",
-    "push": "npm pack && npm publish"
+    "push": "npm pack && npm publish",
+    "build:vg": "cd vg && nx run-many --target=build --all --configuration=production",
+    "start:vg": "cd vg && ./start-dev.sh"
   },
   "keywords": [
     "cli",
@@ -31,7 +33,12 @@
     "vue",
     "java",
     "javascript",
-    "typescript"
+    "typescript",
+    "nestjs",
+    "nx-monorepo",
+    "modern-stack",
+    "api-server",
+    "dashboard"
   ],
   "author": "VG Coder",
   "license": "MIT",

package/src/index.js

@@ -66,6 +66,7 @@ class VGCoderCLI {
       .alias('s')
       .description('Khởi động API server')
       .option('-p, --port <port>', 'Port cho server', '6868')
+      .option('--new', 'Khởi động NestJS/Angular stack (modern)')
       .action(this.handleStart.bind(this));
   }
 
@@ -372,6 +373,61 @@ class VGCoderCLI {
    */
   async handleStart(options) {
     try {
+      // Check if --new flag is set
+      if (options.new) {
+        console.log(chalk.blue('🚀 Starting NestJS/Angular stack...'));
+        console.log(chalk.yellow('This will start both API (port 3000) and Angular (port 4200)'));
+        console.log('');
+        
+        // Check if vg directory exists
+        const vgPath = path.join(__dirname, '..', 'vg');
+        if (!await fs.pathExists(vgPath)) {
+          throw new Error('VG workspace not found. Make sure you have the complete package installed.');
+        }
+        
+        // Check if start-dev.sh exists
+        const startScript = path.join(vgPath, 'start-dev.sh');
+        if (!await fs.pathExists(startScript)) {
+          throw new Error('start-dev.sh not found in vg directory.');
+        }
+        
+        // Execute start-dev.sh
+        const { spawn } = require('child_process');
+        const child = spawn('bash', [startScript], {
+          cwd: vgPath,
+          stdio: 'inherit'
+        });
+        
+        child.on('error', (error) => {
+          console.error(chalk.red('Failed to start:'), error.message);
+          process.exit(1);
+        });
+        
+        child.on('exit', (code) => {
+          if (code !== 0) {
+            console.error(chalk.red(`Process exited with code ${code}`));
+            process.exit(code);
+          }
+        });
+        
+        // Handle graceful shutdown
+        const shutdown = () => {
+          console.log(chalk.yellow('\n\nShutting down...'));
+          child.kill('SIGTERM');
+          process.exit(0);
+        };
+        
+        process.on('SIGINT', shutdown);
+        process.on('SIGTERM', shutdown);
+        
+        return;
+      }
+      
+      // Legacy Express server
+      console.log(chalk.blue('🚀 Starting Express server (legacy)...'));
+      console.log(chalk.yellow('💡 Tip: Use --new flag to start the modern NestJS/Angular stack'));
+      console.log('');
+      
       const port = parseInt(options.port);
       const server = new ApiServer(port);
       

package/vg/.vscode/extensions.json

@@ -0,0 +1,8 @@
+{
+  "recommendations": [
+    "nrwl.angular-console",
+    "esbenp.prettier-vscode",
+    "dbaeumer.vscode-eslint",
+    "firsttris.vscode-jest-runner"
+  ]
+}

package/vg/.vscode/launch.json

@@ -0,0 +1,23 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "Debug api with Nx",
+      "runtimeExecutable": "npx",
+      "runtimeArgs": ["nx", "serve", "api"],
+      "env": {
+        "NODE_OPTIONS": "--inspect=9229"
+      },
+      "console": "integratedTerminal",
+      "internalConsoleOptions": "neverOpen",
+      "skipFiles": ["<node_internals>/**"],
+      "sourceMaps": true,
+      "outFiles": [
+        "${workspaceFolder}/apps/api/dist/**/*.(m|c|)js",
+        "!**/node_modules/**"
+      ]
+    }
+  ]
+}

package/vg/README.md

@@ -0,0 +1,85 @@
+# VG Coder - NestJS/Angular Upgrade
+
+## Quick Start
+
+### Start Both Applications
+```bash
+cd vg
+nx run-many --target=serve --projects=api,ng-app
+```
+
+This will start:
+- **API Backend** on `http://localhost:3000`
+- **Angular Dashboard** on `http://localhost:4200`
+
+### Start Individually
+
+**Backend only:**
+```bash
+cd vg
+nx serve api
+```
+
+**Frontend only:**
+```bash
+cd vg
+nx serve ng-app
+```
+
+## Project Structure
+
+```
+vg/
+├── apps/
+│   ├── api/              # NestJS backend
+│   └── ng-app/           # Angular frontend
+└── packages/
+    └── core/             # Shared TypeScript library
+```
+
+## Available Endpoints
+
+| Endpoint | Method | Description |
+|----------|--------|-------------|
+| `/api/analyze` | POST | Analyze project and return source code |
+| `/api/execute` | POST | Execute bash scripts with validation |
+| `/api/info` | GET | Get project information and statistics |
+| `/api/clean` | DELETE | Clean output directories |
+
+## Development
+
+### Build All
+```bash
+nx run-many --target=build --all
+```
+
+### Build Specific Project
+```bash
+nx build core
+nx build api
+nx build ng-app
+```
+
+### Test
+```bash
+nx test core
+nx test api
+nx test ng-app
+```
+
+## Architecture
+
+- **Core Library** (`@vg/core`): Shared business logic
+  - ProjectDetector
+  - FileScanner
+  - TokenManager
+  - BashExecutor
+  - IgnoreManager
+
+- **API Backend**: NestJS REST API with controllers and services
+- **Frontend**: Angular standalone components with reactive forms
+
+## Configuration
+
+- **Proxy**: Angular dev server proxies `/api` requests to `http://localhost:3000`
+- **CORS**: NestJS allows requests from `http://localhost:4200`

package/vg/apps/api/project.json

@@ -0,0 +1,83 @@
+{
+  "name": "api",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "apps/api/src",
+  "projectType": "application",
+  "targets": {
+    "build": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "npx webpack-cli build",
+        "args": [
+          "--node-env=production"
+        ],
+        "cwd": "apps/api"
+      },
+      "configurations": {
+        "development": {
+          "args": [
+            "--node-env=development"
+          ]
+        }
+      }
+    },
+    "prune-lockfile": {
+      "dependsOn": [
+        "build"
+      ],
+      "cache": true,
+      "executor": "@nx/js:prune-lockfile",
+      "outputs": [
+        "{workspaceRoot}/dist/apps/api/package.json",
+        "{workspaceRoot}/dist/apps/api/package-lock.json"
+      ],
+      "options": {
+        "buildTarget": "build"
+      }
+    },
+    "copy-workspace-modules": {
+      "dependsOn": [
+        "build"
+      ],
+      "cache": true,
+      "outputs": [
+        "{workspaceRoot}/dist/apps/api/workspace_modules"
+      ],
+      "executor": "@nx/js:copy-workspace-modules",
+      "options": {
+        "buildTarget": "build"
+      }
+    },
+    "prune": {
+      "dependsOn": [
+        "prune-lockfile",
+        "copy-workspace-modules"
+      ],
+      "executor": "nx:noop"
+    },
+    "serve": {
+      "continuous": true,
+      "executor": "@nx/js:node",
+      "defaultConfiguration": "development",
+      "dependsOn": [
+        "build"
+      ],
+      "options": {
+        "buildTarget": "api:build",
+        "runBuildTargetDependencies": false
+      },
+      "configurations": {
+        "development": {
+          "buildTarget": "api:build:development"
+        },
+        "production": {
+          "buildTarget": "api:build:production"
+        }
+      }
+    }
+  },
+  "tags": [
+    "scope:server",
+    "type:app"
+  ]
+}

package/vg/apps/api/src/app/analyze.controller.ts

@@ -0,0 +1,17 @@
+import { Controller, Post, Body, Res } from '@nestjs/common';
+import { Response } from 'express';
+import { AnalyzeService } from './analyze.service';
+
+@Controller('analyze')
+export class AnalyzeController {
+    constructor(private readonly analyzeService: AnalyzeService) { }
+
+    @Post()
+    async analyze(@Body() body: { path: string; options?: any }, @Res() res: Response) {
+        const content = await this.analyzeService.analyzeProject(body.path, body.options);
+
+        res.setHeader('Content-Type', 'text/plain; charset=utf-8');
+        res.setHeader('Content-Disposition', 'attachment; filename="project.txt"');
+        res.send(content);
+    }
+}

package/vg/apps/api/src/app/analyze.service.ts

@@ -0,0 +1,57 @@
+import { Injectable, BadRequestException, NotFoundException, InternalServerErrorException, Logger } from '@nestjs/common';
+import { ProjectDetector, FileScanner } from '@vg/core';
+import * as path from 'path';
+import * as fs from 'fs-extra';
+
+@Injectable()
+export class AnalyzeService {
+    private readonly logger = new Logger(AnalyzeService.name);
+
+    async analyzeProject(projectPath: string, options: any = {}) {
+        try {
+            if (!projectPath) {
+                throw new BadRequestException('Missing required field: path');
+            }
+
+            const resolvedPath = path.resolve(projectPath);
+
+            // Validate project path
+            if (!await fs.pathExists(resolvedPath)) {
+                throw new NotFoundException(`Project path does not exist: ${projectPath}`);
+            }
+
+            this.logger.log(`Analyzing project: ${resolvedPath}`);
+
+            // Detect project type (optional, but good for logging)
+            const detector = new ProjectDetector(resolvedPath);
+            await detector.detectAll();
+
+            // Scan files
+            const scannerOptions = {
+                extensions: options.extensions ? options.extensions.split(',').map((ext: string) => ext.trim()) : undefined,
+                includeHidden: options.includeHidden || false
+            };
+
+            const scanner = new FileScanner(resolvedPath, scannerOptions);
+            const scanResult = await scanner.scanProject();
+
+            // Create AI-friendly content
+            const aiContent = await scanner.createCombinedContentForAI(scanResult.files, {
+                includeStats: true,
+                includeTree: true,
+                preserveLineNumbers: true
+            });
+
+            this.logger.log(`✓ Analysis completed: ${scanResult.files.length} files`);
+
+            return aiContent;
+
+        } catch (error: any) {
+            this.logger.error('Error during analysis:', error);
+            if (error instanceof BadRequestException || error instanceof NotFoundException) {
+                throw error;
+            }
+            throw new InternalServerErrorException(error.message || 'Analysis failed');
+        }
+    }
+}

package/vg/apps/api/src/app/app.controller.ts

@@ -0,0 +1,12 @@
+import { Controller, Get } from '@nestjs/common';
+import { AppService } from './app.service';
+
+@Controller()
+export class AppController {
+  constructor(private readonly appService: AppService) {}
+
+  @Get()
+  getData() {
+    return this.appService.getData();
+  }
+}

package/vg/apps/api/src/app/app.module.ts

@@ -0,0 +1,29 @@
+import { Module } from '@nestjs/common';
+
+import { AppController } from './app.controller';
+import { AppService } from './app.service';
+import { AnalyzeController } from './analyze.controller';
+import { AnalyzeService } from './analyze.service';
+import { ExecuteController } from './execute.controller';
+import { ExecuteService } from './execute.service';
+import { InfoController } from './info.controller';
+import { InfoService } from './info.service';
+import { CleanController } from './clean.controller';
+
+@Module({
+  imports: [],
+  controllers: [
+    AppController,
+    AnalyzeController,
+    ExecuteController,
+    InfoController,
+    CleanController
+  ],
+  providers: [
+    AppService,
+    AnalyzeService,
+    ExecuteService,
+    InfoService
+  ],
+})
+export class AppModule { }