GSD-2 Configurator

A React 19 + TypeScript SPA wizard for configuring AI-assisted development projects using GSD-2 (Get Shit Done). The app helps users configure LLM providers, project settings, and milestone structures for autonomous development.

Overview

GSD-2 Configurator is a 9-step wizard that guides users through setting up a project for autonomous AI-assisted development. It supports multiple LLM providers, flexible project templates, and comprehensive configuration options.

Features

• 9-Step Wizard Flow: Welcome → Project → Provider → Models → Git → Preferences → Milestones → Skills → Summary
• Multiple Entry Points: Start with Interview, Configure Manually, or Configure Chat AI
• 11 Project Templates: Web App, API Service, CLI Tool, ML/AI, Mobile, Library, SaaS, E-commerce, Debug, Feature, Refactor
• 9 LLM Providers: Anthropic, OpenAI, Google Gemini, OpenRouter, GitHub Copilot, Amazon Bedrock, Azure OpenAI, Groq, Ollama
• Per-Phase Model Selection: Different models for Research, Planning, Execution, and Completion phases
• Fallback Models: Automatic retry with fallback models on failure
• Configurable Git Strategy: None, Branch Isolation, or Worktree Isolation
• Token Budget Profiles: Budget, Balanced, or Quality optimization
• Interview Mode: AI-powered conversation to help structure milestones
• Configuration Management: Save, load, import, and export configurations
• Persistent State: Auto-save progress to localStorage

Tech Stack

• Framework: React 19 + TypeScript
• Build Tool: Vite 7
• UI Components: shadcn/ui (Radix UI primitives)
• Styling: Tailwind CSS
• Forms: React Hook Form + Zod
• State Management: React Context + hooks
• Icons: Lucide React

Getting Started

Prerequisites

• Node.js 18+
• npm 9+

Installation

# Clone the repository
cd gsd2

# Install dependencies
npm install

# Start development server
npm run dev

Build Commands

npm run dev        # Start Vite dev server with HMR
npm run build      # TypeScript check + Vite production build
npm run lint       # ESLint on all .ts/.tsx files
npm run preview    # Preview production build locally

Project Structure

src/
├── App.tsx                    # Root component, provider wrappers
├── main.tsx                   # React entry point
├── index.css                  # Global Tailwind directives
├── lib/
│   ├── utils.ts               # cn() helper, shared utilities
│   ├── llm.ts                 # LLM API integration, Ollama functions
│   └── oauth.ts               # OAuth flow handling
├── hooks/
│   └── useWizard.tsx          # Wizard state context + provider + hook
├── types/
│   └── wizard.ts              # All wizard-related types, constants, defaults
├── components/
│   ├── ui/                    # shadcn/ui components (60+ Radix primitives)
│   └── wizard/                # Wizard step components
│       ├── Wizard.tsx         # Main wizard container with step navigation
│       ├── WelcomeStep.tsx    # Entry point with 3-card layout
│       ├── ProjectStep.tsx    # Project template and details
│       ├── ProviderStep.tsx   # LLM provider selection
│       ├── ModelsStep.tsx     # Per-phase model configuration
│       ├── GitStep.tsx        # Git isolation strategy
│       ├── PreferencesStep.tsx # Budget, timeouts, verification
│       ├── MilestonesStep.tsx  # Slice management
│       ├── SkillsStep.tsx     # Skills selection
│       ├── SummaryStep.tsx    # Generated output
│       ├── InterviewMode.tsx  # AI-powered interview flow
│       ├── ConfigManager.tsx  # Import/export configs
│       └── OAuthCallback.tsx  # OAuth callback handler

Wizard Steps

1. Welcome

• 3 Entry Options: Start with Interview, Configure Manually, Configure Chat AI
• Inline Provider Config: Configure LLM provider directly from Welcome step
• Config Manager: Import/export saved configurations

2. Project

• Template Selection: Choose from 11 project templates
• Project Details: Name, path, tech stack
• Goals & Features: Define project goals and key features

3. Provider

• 9 LLM Providers: Anthropic, OpenAI, Google Gemini, OpenRouter, GitHub Copilot, Amazon Bedrock, Azure OpenAI, Groq, Ollama
• OAuth Support: For Anthropic, Google Gemini, and GitHub Copilot
• API Key Management: Secure local storage
• Ollama Config: Custom endpoint configuration (default: http://localhost:11434)

4. Models

• Per-Phase Selection: Different models for Research, Planning, Execution, Completion
• Fallback Models: Automatic retry with configurable fallback models

5. Git

• Isolation Strategies: None (default), Branch Isolation, Worktree Isolation
• Gitignore Management: Auto-generate .gitignore

6. Preferences

• Token Profiles: Budget (40-60% savings), Balanced (10-20% savings), Quality (no savings)
• Timeout Settings: Soft, idle, and hard timeouts
• Verification Commands: Custom lint/test commands

7. Milestones

• Slice Management: View, edit, add, remove slices
• Risk Levels: Low, Medium, High
• Dependency Tracking: Track which slices depend on others

8. Skills

• 15 Skills: React, Vue.js, Next.js, TypeScript, Python, Rust, Go, Node.js, Docker, AWS, PostgreSQL, MongoDB, Redis, Tailwind CSS, Prisma

9. Summary

• Generated Files: Commands, PROJECT.md, PREFERENCES.md, ROADMAP.md, .gitignore
• Quick Start: Ready-to-run commands

Configuration

Environment Variables

The application stores configuration in localStorage:

• gsd-wizard-state: Current wizard state
• gsd-wizard-saved-configs: Saved configuration presets

State Schema

interface WizardState {
  // Project Info
  projectName: string;
  projectDescription: string;
  projectPath: string;
  projectType: string;
  projectGoals: string[];
  targetUsers: string;
  keyFeatures: string[];
  techStack: string;

  // LLM Provider
  provider: string;
  apiKey: string;
  useOAuth: boolean;
  ollamaEndpoint: string;

  // Model Configuration
  models: {
    research: string;
    planning: string;
    execution: string;
    completion: string;
  };
  useFallbacks: boolean;
  fallbackModels: string[];

  // Git Strategy
  gitIsolation: "none" | "worktree" | "branch";
  manageGitignore: boolean;

  // Preferences
  tokenProfile: "budget" | "balanced" | "quality";
  budgetCeiling: number;
  softTimeout: number;
  idleTimeout: number;
  hardTimeout: number;
  uniqueMilestoneIds: boolean;
  autoReport: boolean;

  // Verification
  verificationCommands: string[];
  verificationAutoFix: boolean;
  verificationMaxRetries: number;

  // Milestone Structure
  milestoneName: string;
  milestoneDescription: string;
  slices: SliceConfig[];

  // Skills
  selectedSkills: string[];
}

Supported Providers

Provider	OAuth	API Key Required	Notes
Anthropic	✅	✅	Claude models (Sonnet, Opus, Haiku)
OpenAI	❌	✅	GPT-4o, GPT-4o Mini
Google Gemini	✅	✅	Gemini 2.5 Pro/Flash
OpenRouter	❌	✅	100+ models via single API
GitHub Copilot	✅	✅	Uses Copilot subscription
Amazon Bedrock	❌	✅	AWS-hosted models
Azure OpenAI	❌	✅	Enterprise OpenAI via Azure
Groq	❌	✅	Fast inference for open models
Ollama	❌	❌	Local models (Llama, Mistral, etc.)

Project Templates

Template	Slices	Skills	Description
Web Application	18	7	Full-stack web app with frontend, backend, database
API Service	16	6	Backend API service with database and authentication
CLI Tool	13	3	Command-line tool or developer utility
ML/AI Project	15	4	Machine learning model, training pipeline
Mobile App	18	3	iOS or Android mobile application
Library/Package	15	2	Reusable library or npm package
SaaS Platform	10	6	Multi-tenant SaaS with subscriptions
E-commerce	12	6	Online store with products, cart, payments
Debug & Fix	6	4	Debug, fix bugs, resolve issues
Add New Feature	8	5	Implement new feature in existing project
Refactor & Enhance	9	4	Improve code quality or architecture

Interview Mode

The Interview Mode provides an AI-powered conversation flow to help users define their project. It uses rule-based responses when no LLM is connected and can integrate with any configured provider for intelligent responses.

Flow

1. Ask about project type (web app, API, feature, bug, refactor)
2. Gather problem description
3. Identify target users
4. Define success criteria
5. Extract and apply results to wizard state

Testing

Browser Testing Results

All wizard steps tested and verified working:

Step	Status	Notes
Welcome	✅	3-card layout, Configure Chat AI panel
Project	✅	Template selection (11 templates)
Provider	✅	Ollama fix - no API key required
Models	✅	4 phases + fallback models
Git	✅	3 isolation modes
Preferences	✅	Budget/Balanced/Quality profiles
Milestones	✅	18 slices from Web Application template
Skills	✅	Category-based selection
Summary	✅	Generated commands, config preview

Bug Fixed During Testing

Ollama API Key Requirement: ProviderStep was incorrectly requiring an API key for Ollama (a local service that doesn't need one). Fixed by:

• Adding isOllama check to validation logic
• Hiding API Key section when Ollama is selected
• Next button now enabled immediately when Ollama is selected

Known Issues

1. Interview Mode LLM Integration: Currently uses rule-based responses. Actual LLM streaming requires a running Ollama instance or valid API key.
2. Bundle Size: Production build exceeds 500KB (610KB). Consider code-splitting for production.
3. No Test Suite: Vitest is recommended but not yet configured.

Future Improvements

See Forgejo Issues for planned features:

• #1: Git Repository Integration
• #2: Issue Tracker Integration (Forgejo)
• #3: Project Import

License

MIT

Contributing

Contributions are welcome! Please ensure:

• Run npm run lint before committing
• Run npm run build to verify TypeScript compiles
• Follow the code style in AGENTS.md