thatgfsj-code 0.5.0 → 0.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "thatgfsj-code",
-  "version": "0.5.0",
+  "version": "0.7.0",
   "description": "Thatgfsj Code - AI Coding Assistant",
   "main": "dist/cmd/index.js",
   "type": "module",
@@ -25,12 +25,20 @@
   "dependencies": {
     "chalk": "^5.3.0",
     "commander": "^11.1.0",
+    "ink": "^7.1.0",
+    "ink-spinner": "^5.0.0",
+    "ink-text-input": "^6.0.0",
     "inquirer": "^13.3.2",
+    "marked": "^15.0.12",
+    "marked-terminal": "^7.3.0",
     "ora": "^7.0.1",
+    "react": "^19.2.7",
     "readline": "^1.3.0"
   },
   "devDependencies": {
+    "@types/marked-terminal": "^6.1.1",
     "@types/node": "^20.10.0",
+    "@types/react": "^19.2.17",
     "typescript": "^5.3.0"
   }
 }

package/src/app/index.ts

@@ -9,6 +9,7 @@ import { SessionManager } from '../session/index.js';
 import { ToolRegistry } from '../tools/index.js';
 import { HookManager } from '../hooks/index.js';
 import { SystemPromptBuilder } from '../prompts/index.js';
+import { SkillRegistry } from '../skills/index.js';
 import type { ChatMessage, ChatResponse } from '../types.js';
 
 export class App {
@@ -18,6 +19,7 @@ export class App {
   tools: ToolRegistry;
   hooks: HookManager;
   prompts: SystemPromptBuilder;
+  skills: SkillRegistry;
 
   private constructor(
     config: ConfigManager,
@@ -26,6 +28,7 @@ export class App {
     tools: ToolRegistry,
     hooks: HookManager,
     prompts: SystemPromptBuilder,
+    skills: SkillRegistry,
   ) {
     this.config = config;
     this.llm = llm;
@@ -33,6 +36,7 @@ export class App {
     this.tools = tools;
     this.hooks = hooks;
     this.prompts = prompts;
+    this.skills = skills;
   }
 
   static async create(): Promise<App> {
@@ -40,22 +44,24 @@ export class App {
     const aiConfig = config.getAIConfig();
 
     const llm = LLMService.fromConfig(aiConfig);
-    const session = new SessionManager();
+    const session = new SessionManager(config.get().contextLength || 50);
     const tools = new ToolRegistry();
     const hooks = new HookManager();
+    const skills = new SkillRegistry();
+
+    // Register tools with LLM service
+    llm.registerTools(tools.list());
+
+    // Build system prompt with active skills
     const prompts = new SystemPromptBuilder({
       cwd: process.cwd(),
       tools: tools.list(),
       permissionMode: 'ask',
+      skillsPrompt: skills.getActivePrompts(),
     });
-
-    // Register tools with LLM service
-    llm.registerTools(tools.list());
-
-    // Set up system prompt
     session.addMessage('system', prompts.build());
 
-    return new App(config, llm, session, tools, hooks, prompts);
+    return new App(config, llm, session, tools, hooks, prompts, skills);
   }
 
   /**

package/src/cmd/{index.ts → index.tsx}

@@ -2,10 +2,9 @@
 
 /**
  * Thatgfsj Code - CLI Entry Point
- * Simplified from old src/index.ts (655 lines → ~60 lines)
  *
  * Two modes:
- *   gfcode              → Interactive REPL
+ *   gfcode              → Interactive TUI (Ink)
  *   gfcode "prompt"     → Single prompt mode
  *   gfcode init         → Setup wizard
  */
@@ -20,18 +19,18 @@ if (process.platform === 'win32') {
 import { program } from 'commander';
 import chalk from 'chalk';
 import { App } from '../app/index.js';
-import { REPL } from '../tui/repl.js';
 import { WelcomeScreen } from '../tui/welcome.js';
+import { REPLOutput } from '../tui/output.js';
 
 // ==================== Error Handling ====================
 
 process.on('uncaughtException', (error) => {
-  console.error(chalk.red('\n❌ Error:'), error.message);
+  console.error(chalk.red('\n  Error:'), error.message);
   process.exit(1);
 });
 
 process.on('unhandledRejection', (reason) => {
-  console.error(chalk.red('\n❌ Error:'), reason);
+  console.error(chalk.red('\n  Error:'), reason);
   process.exit(1);
 });
 
@@ -39,15 +38,13 @@ process.on('unhandledRejection', (reason) => {
 
 program
   .name('gfcode')
-  .description('🤖 Thatgfsj Code - AI Coding Assistant')
-  .version('0.5.0')
+  .description('Thatgfsj Code - AI Coding Assistant')
+  .version('0.7.0')
   .argument('[prompt]', 'Task to execute (omit to start interactive mode)')
   .option('-m, --model <model>', 'Specify model')
   .option('-i, --interactive', 'Force interactive mode')
-  .option('--hooks', 'Enable audit logging hooks')
-  .action(async (prompt: string | undefined, options: { model?: string; interactive?: boolean; hooks?: boolean }) => {
+  .action(async (prompt: string | undefined, options: { model?: string; interactive?: boolean }) => {
     try {
-      // Initialize app
       const app = await App.create();
 
       // Show welcome if no API key
@@ -58,21 +55,27 @@ program
         await app.config.save({ model: options.model });
       }
 
-      // Enable hooks if requested
-      if (options.hooks) {
-        const { auditLogHook } = await import('../hooks/index.js');
-        app.hooks.register('afterToolCall', auditLogHook);
-      }
-
       if (!prompt || options.interactive) {
-        // Interactive REPL mode
-        const repl = new REPL(app);
-        await repl.start();
+        // Interactive mode - use Ink TUI
+        const { render } = await import('ink');
+        const { TuiApp } = await import('../tui/app.js');
+
+        const { unmount } = render(<TuiApp app={app} />);
+
+        // Wait for the app to exit
+        await new Promise<void>((resolve) => {
+          const check = setInterval(() => {
+            // Ink will call process.exit or we detect it
+          }, 1000);
+          process.on('exit', () => {
+            clearInterval(check);
+            unmount();
+            resolve();
+          });
+        });
       } else {
-        // Single prompt mode - use same UI as REPL
-        const { REPLOutput } = await import('../tui/output.js');
+        // Single prompt mode - use simple output
         const out = new REPLOutput();
-
         out.printBanner();
         out.printUserInput(prompt);
         out.startThinking();
@@ -111,7 +114,6 @@ program
               if (!hasStarted) { out.beginAssistant(); hasStarted = true; }
               out.writeChunk(chunk);
             }
-
             fullResponse += chunk;
           }
           if (hasStarted) out.endAssistant();
@@ -124,18 +126,17 @@ program
         app.session.addMessage('assistant', fullResponse);
       }
     } catch (error: any) {
-      console.error(chalk.red(`\n❌ ${error.message}`));
+      console.error(chalk.red(`\n  ${error.message}`));
       process.exit(1);
     }
   });
 
-// Init command - setup wizard
+// Init command
 program
   .command('init')
-  .description('配置 API Key 和模型')
+  .description('Configure API key and model')
   .action(async () => {
     await WelcomeScreen.interactiveSetup();
   });
 
-// Parse and run
 program.parse(process.argv);

package/src/config/index.ts

@@ -14,6 +14,7 @@ const DEFAULT_CONFIG: Config = {
   apiKey: '',
   temperature: 0.7,
   maxTokens: 4096,
+  contextLength: 50,
   provider: 'siliconflow',
 };
 

package/src/config/types.ts

@@ -32,6 +32,7 @@ export interface Config {
   apiKey: string;
   temperature: number;
   maxTokens: number;
+  contextLength: number;
   provider: ProviderName;
   baseUrl?: string;
 }

package/src/prompts/index.ts

@@ -13,6 +13,7 @@ export interface SystemPromptConfig {
   includeProjectMd?: boolean;
   permissionMode?: 'accept' | 'deny' | 'ask';
   date?: Date;
+  skillsPrompt?: string;
 }
 
 export class SystemPromptBuilder {
@@ -25,6 +26,7 @@ export class SystemPromptBuilder {
       includeProjectMd: config.includeProjectMd ?? true,
       permissionMode: config.permissionMode ?? 'ask',
       date: config.date ?? new Date(),
+      skillsPrompt: config.skillsPrompt ?? '',
     };
   }
 
@@ -35,6 +37,7 @@ export class SystemPromptBuilder {
       this.buildEnvironment(),
       this.buildPermissionMode(),
       this.buildProjectInstructions(),
+      this.buildSkills(),
       this.buildDateInfo(),
     ];
     return fragments.filter(Boolean).join('\n\n');
@@ -111,6 +114,11 @@ export class SystemPromptBuilder {
     return '';
   }
 
+  private buildSkills(): string {
+    if (!this.config.skillsPrompt) return '';
+    return `## Active Skills\n\n${this.config.skillsPrompt}`;
+  }
+
   private buildDateInfo(): string {
     const now = this.config.date;
     const iso = now.toISOString().replace('T', ' ').split('.')[0];

package/src/skills/brainstorming.ts

@@ -0,0 +1,43 @@
+import type { Skill } from './index.js';
+
+export const brainstormingSkill: Skill = {
+  id: 'brainstorming',
+  name: 'Brainstorming',
+  description: 'Explore multiple approaches before committing to a solution',
+  category: 'planning',
+  autoActivate: ['怎么', 'how to', '方案', 'approach', '有没有', 'alternatives'],
+  prompt: `## Brainstorming Mode
+
+When exploring solutions, don't jump to the first idea. Instead:
+
+### 1. Generate Options
+List 3-5 different approaches, including at least one unconventional one.
+
+### 2. Evaluate Each
+For each approach, briefly note:
+- **Pros**: What makes it good
+- **Cons**: What could go wrong
+- **Effort**: How much work (quick/medium/heavy)
+
+### 3. Recommend
+Pick the best approach and explain WHY it's the best fit for this specific situation.
+
+### Format
+\`\`\`
+## Approaches
+
+### Option A: [Name]
+- Pros: ...
+- Cons: ...
+- Effort: medium
+
+### Option B: [Name]
+- Pros: ...
+- Cons: ...
+- Effort: quick
+
+**Recommendation**: Option B because [specific reason]
+\`\`\`
+
+Don't just list options - give a clear recommendation with reasoning.`,
+};

package/src/skills/code-review.ts

@@ -0,0 +1,45 @@
+import type { Skill } from './index.js';
+
+export const codeReviewSkill: Skill = {
+  id: 'code-review',
+  name: 'Code Review',
+  description: 'Systematic code review for quality, security, and correctness',
+  category: 'review',
+  autoActivate: ['review', '审查', '检查代码', 'code quality'],
+  prompt: `## Code Review Checklist
+
+When reviewing code (your own or others):
+
+### Correctness
+- Does it do what it's supposed to?
+- Are edge cases handled?
+- Are error cases handled?
+
+### Security
+- No hardcoded secrets or API keys
+- Input validation on user data
+- No SQL injection, XSS, or path traversal risks
+
+### Performance
+- No unnecessary loops or allocations
+- Efficient data structures
+- No N+1 queries or blocking calls
+
+### Readability
+- Clear variable/function names
+- Appropriate comments (why, not what)
+- Consistent style with codebase
+
+### Testability
+- Can this be easily tested?
+- Are dependencies injectable?
+- Are side effects isolated?
+
+### Output Format
+\`\`\`
+## Review Summary
+✅ Good: [what's done well]
+⚠️ Suggestions: [improvements]
+🔴 Issues: [must fix]
+\`\`\``,
+};

package/src/skills/executing-plans.ts

@@ -0,0 +1,27 @@
+import type { Skill } from './index.js';
+
+export const executingPlansSkill: Skill = {
+  id: 'executing-plans',
+  name: 'Executing Plans',
+  description: 'Execute multi-step plans methodically with verification',
+  category: 'planning',
+  prompt: `## Plan Execution Mode
+
+When executing a plan or multi-step task:
+
+1. **One step at a time** - Complete each step fully before moving to the next
+2. **Verify each step** - After each change, verify it works (read the file, run a test, check syntax)
+3. **Report progress** - Tell the user what you did for each step
+4. **Handle failures** - If a step fails, stop and explain. Don't silently skip.
+5. **Commit checkpoints** - After successful steps, suggest a git commit
+
+### Progress Format
+\`\`\`
+✅ Step 1: [What was done] - Verified
+✅ Step 2: [What was done] - Verified  
+⏳ Step 3: [Currently working on]
+⬜ Step 4: [Pending]
+\`\`\`
+
+If you encounter an unexpected issue, stop and ask the user how to proceed.`,
+};

package/src/skills/frontend-design.ts

@@ -0,0 +1,35 @@
+import type { Skill } from './index.js';
+
+export const frontendDesignSkill: Skill = {
+  id: 'frontend-design',
+  name: 'Frontend Design',
+  description: 'UI/UX best practices for web interfaces',
+  category: 'architecture',
+  autoActivate: ['ui', 'ux', 'frontend', 'css', 'layout', 'design', '界面', '页面'],
+  prompt: `## Frontend Design Principles
+
+### Layout
+- Use CSS Grid for 2D layouts, Flexbox for 1D
+- Mobile-first: design for small screens, enhance for larger
+- Consistent spacing: use a 4px or 8px grid system
+
+### Typography
+- Max 2-3 font sizes per page
+- Line height: 1.5 for body, 1.2 for headings
+- Max line length: 60-80 characters
+
+### Color
+- Use a limited palette (primary, secondary, accent, neutral)
+- Ensure contrast ratio ≥ 4.5:1 for text
+- Use color purposefully (not just decoration)
+
+### Components
+- Keep components small and focused
+- Extract reusable patterns early
+- Props should be explicit, not spread
+
+### Performance
+- Lazy load images and heavy components
+- Minimize bundle size
+- Use skeleton loaders for async content`,
+};

package/src/skills/git-workflow.ts

@@ -0,0 +1,36 @@
+import type { Skill } from './index.js';
+
+export const gitWorkflowSkill: Skill = {
+  id: 'git-workflow',
+  name: 'Git Workflow',
+  description: 'Clean git practices: commits, branches, PRs',
+  category: 'workflow',
+  autoActivate: ['git', 'commit', 'branch', 'merge', 'push', 'pull request'],
+  prompt: `## Git Best Practices
+
+### Commits
+- **Atomic**: One logical change per commit
+- **Message format**: \`type(scope): description\`
+  - feat: new feature
+  - fix: bug fix
+  - refactor: code restructuring
+  - docs: documentation
+  - test: adding tests
+  - chore: maintenance
+
+### Before Committing
+1. Review changes: \`git diff --staged\`
+2. Run tests
+3. Check for secrets or debug code
+
+### Branch Naming
+- \`feature/description\` - New features
+- \`fix/description\` - Bug fixes
+- \`refactor/description\` - Code improvements
+
+### Workflow
+1. Create branch from main
+2. Make changes with atomic commits
+3. Push and create PR
+4. Squash merge to main`,
+};

package/src/skills/improve-architecture.ts

@@ -0,0 +1,38 @@
+import type { Skill } from './index.js';
+
+export const improveArchitectureSkill: Skill = {
+  id: 'improve-architecture',
+  name: 'Improve Architecture',
+  description: 'Systematically improve codebase structure and quality',
+  category: 'architecture',
+  autoActivate: ['重构', 'refactor', '架构', 'architecture', 'clean', 'improve'],
+  prompt: `## Architecture Improvement Protocol
+
+When improving code structure:
+
+### 1. Assess Current State
+- Read the code and identify pain points
+- Look for: god classes, circular dependencies, tight coupling, code duplication
+
+### 2. Identify Patterns
+- **Single Responsibility**: Does each module/class do ONE thing?
+- **Dependency Direction**: Do high-level modules depend on low-level ones?
+- **Abstraction Level**: Is each layer at the right abstraction?
+
+### 3. Plan Changes
+- Start with the highest-impact, lowest-risk change
+- Each change should be independently valuable
+- Never refactor everything at once
+
+### 4. Execute Safely
+- Make one change at a time
+- Verify after each change
+- Commit frequently
+
+### Red Flags to Fix
+- Files over 300 lines
+- Functions over 50 lines
+- More than 3 levels of nesting
+- Copy-pasted code blocks
+- Circular imports`,
+};

package/src/skills/index.ts

@@ -0,0 +1,136 @@
+/**
+ * Skills Registry - Built-in skills for development workflows
+ * Inspired by skills.sh (obra/superpowers, mattpocock/skills, anthropics/skills)
+ */
+
+export interface Skill {
+  id: string;
+  name: string;
+  description: string;
+  category: 'planning' | 'debugging' | 'testing' | 'architecture' | 'workflow' | 'browser' | 'review';
+  prompt: string;
+  autoActivate?: string[]; // Keywords that auto-activate this skill
+}
+
+// Import all skills
+import { writingPlansSkill } from './writing-plans.js';
+import { executingPlansSkill } from './executing-plans.js';
+import { systematicDebuggingSkill } from './systematic-debugging.js';
+import { brainstormingSkill } from './brainstorming.js';
+import { tddSkill } from './tdd.js';
+import { improveArchitectureSkill } from './improve-architecture.js';
+import { verificationSkill } from './verification.js';
+import { codeReviewSkill } from './code-review.js';
+import { prototypeSkill } from './prototype.js';
+import { triageSkill } from './triage.js';
+import { gitWorkflowSkill } from './git-workflow.js';
+import { subagentSkill } from './subagent.js';
+import { playwrightSkill } from './playwright.js';
+import { frontendDesignSkill } from './frontend-design.js';
+import { supabaseSkill } from './supabase.js';
+import { neuroweaveSkill } from './neuroweave.js';
+
+// All built-in skills (16 total)
+export const BUILTIN_SKILLS: Skill[] = [
+  writingPlansSkill,
+  executingPlansSkill,
+  systematicDebuggingSkill,
+  brainstormingSkill,
+  tddSkill,
+  improveArchitectureSkill,
+  verificationSkill,
+  codeReviewSkill,
+  prototypeSkill,
+  triageSkill,
+  gitWorkflowSkill,
+  subagentSkill,
+  playwrightSkill,
+  frontendDesignSkill,
+  supabaseSkill,
+  neuroweaveSkill,
+];
+
+// Skill registry
+export class SkillRegistry {
+  private skills: Map<string, Skill> = new Map();
+  private activeSkills: Set<string> = new Set();
+
+  constructor() {
+    for (const skill of BUILTIN_SKILLS) {
+      this.skills.set(skill.id, skill);
+    }
+    // Default active skills
+    this.activeSkills.add('writing-plans');
+    this.activeSkills.add('systematic-debugging');
+    this.activeSkills.add('verification');
+  }
+
+  get(id: string): Skill | undefined {
+    return this.skills.get(id);
+  }
+
+  list(): Skill[] {
+    return [...this.skills.values()];
+  }
+
+  listActive(): Skill[] {
+    return [...this.activeSkills].map(id => this.skills.get(id)!).filter(Boolean);
+  }
+
+  activate(id: string): boolean {
+    if (this.skills.has(id)) {
+      this.activeSkills.add(id);
+      return true;
+    }
+    return false;
+  }
+
+  deactivate(id: string): boolean {
+    return this.activeSkills.delete(id);
+  }
+
+  isActive(id: string): boolean {
+    return this.activeSkills.has(id);
+  }
+
+  /**
+   * Get all active skill prompts for system prompt injection
+   */
+  getActivePrompts(): string {
+    const active = this.listActive();
+    if (active.length === 0) return '';
+
+    return active.map(s => `### Skill: ${s.name}\n${s.prompt}`).join('\n\n');
+  }
+
+  /**
+   * Auto-activate skills based on user input
+   */
+  autoActivate(input: string): void {
+    const lower = input.toLowerCase();
+    for (const skill of this.skills.values()) {
+      if (skill.autoActivate?.some(kw => lower.includes(kw))) {
+        this.activeSkills.add(skill.id);
+      }
+    }
+  }
+}
+
+export {
+  writingPlansSkill,
+  executingPlansSkill,
+  systematicDebuggingSkill,
+  brainstormingSkill,
+  tddSkill,
+  improveArchitectureSkill,
+  verificationSkill,
+  codeReviewSkill,
+  prototypeSkill,
+  triageSkill,
+  gitWorkflowSkill,
+  subagentSkill,
+  playwrightSkill,
+  frontendDesignSkill,
+  supabaseSkill,
+  neuroweaveSkill,
+};

package/src/skills/neuroweave.ts

@@ -0,0 +1,47 @@
+import type { Skill } from './index.js';
+
+export const neuroweaveSkill: Skill = {
+  id: 'neuroweave',
+  name: 'NeuroWeave Timeline',
+  description: 'Project evolution memory - track decisions, changes, and milestones',
+  category: 'workflow',
+  autoActivate: ['timeline', 'history', 'what changed', 'why was', 'track'],
+  prompt: `## NeuroWeave Timeline (NWT)
+
+You have access to the NWT tool for tracking project evolution. Use it to:
+
+### When to Log Events
+- **After significant changes**: New features, refactors, bug fixes
+- **When making decisions**: Architecture choices, library selection, design patterns
+- **At milestones**: Feature complete, tests passing, deployment ready
+
+### How to Log
+\`\`\`
+nwt log
+  task: "Add user authentication"
+  summary: "Implemented JWT-based auth with login/register endpoints"
+  reason: "Need user accounts for personalized features"
+  files: "src/auth.ts, src/routes/auth.ts"
+  tags: "feature, auth, api"
+\`\`\`
+
+### Tags Convention
+- \`feature\` - New functionality
+- \`fix\` - Bug fixes
+- \`refactor\` - Code restructuring
+- \`decision\` - Architecture/design decisions
+- \`milestone\` - Project milestones
+- \`config\` - Configuration changes
+- \`docs\` - Documentation updates
+
+### Auto-log Rule
+After completing a multi-step task, automatically log it to NWT with:
+- task: What was done (imperative)
+- summary: How it was done
+- reason: Why it was done
+- files: What files changed
+- tags: Category labels
+
+### Archives
+Events older than 30 days are automatically archived. Use \`nwt story\` to see the full project narrative.`,
+};