feat: implement semantic install dialog for CodexLens with GPU mode selection
feat: add radio group component for GPU mode selection
feat: update navigation and localization for API settings and semantic install
- Add Play icon import for SessionStart trigger type
- Add SessionStart case to getEventIcon function
- Add SessionStart case to getEventColor function with purple color
- Add default cases to both functions to prevent undefined returns
Fixes runtime error: 'Element type is invalid: expected a string or class/function but got: undefined' in EventGroup component
Refactor ApiSettingsPage to use horizontal Tabs component like CodexLens page,
replacing the previous vertical sidebar navigation.
Changes:
- Replace Card-based sidebar with horizontal TabsList/TabsTrigger components
- Remove split-panel layout (sidebar + main panel)
- Use TabsContent to wrap each tab's content
- Import and use Tabs, TabsList, TabsTrigger, TabsContent from ui/Tabs
- Add api-settings.json import to en/zh locale index files for i18n support
Layout comparison:
- Before: Vertical sidebar (lg:w-64) with Card + nav buttons
- After: Horizontal tabs (TabsList) with tab triggers
Fix hardcoded English labels in cache strategy display and prevent runtime
error when filePatterns is undefined.
Changes:
- Replace hardcoded "TTL:", "Max:", "Patterns:" with formatMessage calls
- Add optional chaining for filePatterns.length to prevent undefined error
- Add "filePatterns" i18n key to en/zh api-settings.json
Implement a complete API Management Interface for React frontend with split-
panel layout, migrating all features from legacy JS frontend.
New Features:
- API Settings page with 5 tabs: Providers, Endpoints, Cache, Model Pools, CLI Settings
- Provider Management: CRUD operations, multi-key rotation, health checks, test connection
- Endpoint Management: CRUD operations, cache strategy configuration, enable/disable toggle
- Cache Settings: Global configuration, statistics display, clear cache functionality
- Model Pool Management: CRUD operations, auto-discovery feature, provider exclusion
- CLI Settings Management: Provider-based and Direct modes, full CRUD support
- Multi-Key Settings Modal: Manage API keys with rotation strategies and weights
- Manage Models Modal: View and manage models per provider (LLM and Embedding)
- Sync to CodexLens: Integration handler for provider configuration sync
Technical Implementation:
- Created 12 new React components in components/api-settings/
- Extended lib/api.ts with 460+ lines of API client functions
- Created hooks/useApiSettings.ts with 772 lines of TanStack Query hooks
- Added RadioGroup UI component for form selections
- Implemented unified error handling with useNotifications across all operations
- Complete i18n support (500+ keys in English and Chinese)
- Route integration (/api-settings) and sidebar navigation
Code Quality:
- All acceptance criteria from plan.json verified
- Code review passed with Gemini (all 7 IMPL tasks complete)
- Follows existing patterns: Shadcn UI, TanStack Query, react-intl, Lucide icons
- Fix prompt incorrectly passed to codex review with target flags (--uncommitted/--base/--commit)
- Remove unsupported --skip-git-repo-check flag from codex review command
- Fix TypeScript type error in codex-lens.ts (missing 'installed' property)
Codex CLI constraint: --uncommitted/--base/--commit and [PROMPT] are mutually exclusive.
- Implemented hooks for CRUD operations on providers and endpoints.
- Added cache management hooks for cache stats and settings.
- Introduced model pool management hooks for high availability and load balancing.
- Created localization files for English and Chinese translations of API settings.
- Modify conditional rendering logic to always display section headers in view mode
- Add empty state placeholders when quality_rules/learnings arrays are empty
- Add localization keys for empty state messages in English and Chinese
- Improves UX by making these features visible even when no entries exist
Related files:
- ccw/frontend/src/pages/ProjectOverviewPage.tsx
- ccw/frontend/src/locales/en/project-overview.json
- ccw/frontend/src/locales/zh/project-overview.json
- analyze-with-file: Add dynamic direction generation from dimensions, support up to 4 parallel agent perspectives, enable cli-explore-agent parallelization
- brainstorm-with-file: Add dynamic direction generation from dimensions, add Agent-First guideline for complex tasks
- collaborative-plan-with-file: Add Understanding phase guidelines to prioritize latest documentation and resolve ambiguities with user clarification
Key improvements:
- Dimension-Direction Mapping replaces hard-coded options, enabling task-aware direction recommendations
- Multi-perspective parallel exploration (Analysis Perspectives, up to 4) with synthesis
- cli-explore-agent supports parallel execution per perspective for richer codebase context
- Agent-First principle: delegate complex tasks (code analysis, implementation) to agents/CLI instead of main process analysis
- Understanding phase emphasizes latest documentation discovery and clarification of ambiguities before planning
Fixed the issue where accessing the React frontend via ccw view with a URL path
parameter would load a different workspace due to localStorage rehydration race
condition.
Root cause: zustand persist's onRehydrateStorage callback automatically called
switchWorkspace with the cached projectPath before AppShell could process the
URL parameter.
Changes:
- workflowStore.ts: Remove automatic switchWorkspace from onRehydrateStorage
- AppShell.tsx: Centralize initialization logic with clear priority order:
* Priority 1: URL ?path= parameter (explicit user intent)
* Priority 2: localStorage fallback (implicit cache)
* Added isWorkspaceInitialized state lock to prevent duplicate execution
Fixes: URL showing ?path=/new/path but loading /old/path from cache
feat: Implement ConflictTab component to display conflict resolution decisions in session detail
feat: Create ImplPlanTab component to show implementation plan with modal viewer in session detail
feat: Develop ReviewTab component to display review findings by dimension in session detail
test: Add end-to-end tests for CodexLens Manager functionality including navigation, tab switching, and settings validation
- Implemented a utility function `detectJsonInLine` to identify and parse JSON data from different formats including direct JSON, tool calls, tool results, embedded JSON, and code blocks.
- Introduced `JsonDetectionResult` interface to standardize the detection results.
- Added a new test results file to track the status of tests.
Add new components for CLI stream monitoring with JSON visualization:
- ExecutionTab: simplified tab with status indicator and active styling
- JsonCard: collapsible card for JSON data with type-based styling (6 types)
- JsonField: recursive JSON field renderer with color-coded values
- OutputLine: auto-detects JSON and renders appropriate component
- jsonDetector: smart JSON detection supporting 5 formats
Refactor CliStreamMonitorLegacy to use new components:
- Replace inline tab rendering with ExecutionTab component
- Replace inline output rendering with OutputLine component
- Add Badge import for active count display
- Fix type safety with proper id propagation
Component features:
- Type-specific styling for tool_call, metadata, system, stdout, stderr, thought
- Collapsible content (show 3 fields by default, expandable)
- Copy button and raw JSON view toggle
- Timestamp display
- Auto-detection of JSON in output lines
Fixes:
- Missing jsonDetector.ts file
- Type mismatch between OutputLine (6 types) and JsonCard (4 types)
- Unused isActive prop in ExecutionTab
- Implemented CliStreamMonitor component for real-time CLI output monitoring with multi-execution support.
- Created JsonFormatter component for displaying JSON content in various formats (text, card, inline).
- Added utility functions for JSON detection and formatting in jsonUtils.ts.
- Introduced LogBlock utility functions for styling CLI output lines.
- Developed a new Collapsible component for better UI interactions.
- Created IssueHubPage for managing issues, queue, and discovery with tab navigation.
- Implemented `DiscoveryPage` with session management and findings display.
- Added tests for `DiscoveryPage` to ensure proper rendering and functionality.
- Created `QueuePage` for managing issue execution queues with stats and actions.
- Added tests for `QueuePage` to verify UI elements and translations.
- Introduced `useIssues` hooks for fetching and managing issue data.
- Added loading skeletons and error handling for better user experience.
- Created `vite-env.d.ts` for TypeScript support in Vite environment.
Add /workflow:init-guidelines command that interactively fills project-guidelines.json
based on project analysis from project-tech.json. Features:
- 5-round questionnaire covering coding style, naming, file structure, documentation,
architecture, tech stack, performance, security, and quality rules
- Dynamic question generation based on detected language/framework/architecture
- Append/reset mode for existing guidelines
- Multi-select options with "Other" for custom input
Modify /workflow:init to ask user whether to run init-guidelines after initialization
when guidelines are empty (scaffold only).
- Updated CLI to include `--frontend` option for selecting frontend type (js, react, both).
- Modified serve command to start React frontend when specified.
- Implemented React frontend startup and shutdown logic.
- Enhanced server routing to handle requests for both JS and React frontends.
- Added workspace selector component with i18n support.
- Updated tests to reflect changes in header and A2UI components.
- Introduced new Radix UI components for improved UI consistency.
- Refactored A2UIButton and A2UIDateTimeInput components for better code clarity.
- Created migration plan for gradual transition from JS to React frontend.
- Implemented E2E tests for workspace switching functionality, covering scenarios such as switching workspaces, data isolation, language preference maintenance, and UI updates.
- Added tests to ensure workspace data is cleared on logout and handles unsaved changes during workspace switches.
- Created comprehensive backend tests for the ask_question tool, validating question creation, execution, answer handling, cancellation, and timeout scenarios.
- Included edge case tests to ensure robustness against duplicate questions and invalid answers.
- Added A2UITypes for defining question structures and answers.
- Created A2UIWebSocketHandler for managing WebSocket connections and message handling.
- Developed ask-question tool for interactive user questions via A2UI.
- Introduced platformUtils for platform detection and shell command handling.
- Centralized TypeScript types in index.ts for better organization.
- Implemented compatibility checks for hook templates based on platform requirements.
- Add --with-commit flag to argument-hint and usage examples
- Auto-commit changes based on summary document after each agent task
- Minimal principle: only commit files modified by completed task
- Commit message format: {type}: {task-title} - {summary}
- Type mapping: feature→feat, bugfix→fix, refactor→refactor, etc.
- Created error context snapshots for Firefox, WebKit, and Chromium to capture UI state during API error monitoring.
- Implemented e2e tests for API error detection, including console errors, failed API requests, and proxy errors.
- Added functionality to ignore specific API patterns in monitoring assertions.
- Ensured tests validate the monitoring system's ability to detect and report errors effectively.
Implement two major enhancements to test generation workflow:
1. Gemini Test Enhancement (Phase 1.5)
- Add Gemini CLI analysis for comprehensive test suggestions
- Generate enriched test specifications for L1-L3 test layers
- Focus on API contracts, integration patterns, error scenarios
- Create gemini-enriched-suggestions.md as artifact
2. Planning Notes Mechanism (test-planning-notes.md)
- Similar to plan.md's planning-notes pattern
- Record Test Intent (Phase 1)
- Embed complete Gemini enrichment (Phase 1.5)
- Track consolidated test requirements
- Support N+1 context with decisions and deferred items
Implementation Details:
- Created Gemini prompt template: test-suggestions-enhancement.txt
- Enhanced test-task-generate.md with Phase 1, 1.5, 2 logic
- Gemini content embedded in planning-notes for single source of truth
- test-action-planning-agent reads both TEST_ANALYSIS_RESULTS.md and test-planning-notes.md
- Backward compatible: Phase 1.5 is optional enhancement
Benefits:
- Comprehensive test coverage (API, integration, error scenarios)
- Full traceability of test planning process
- Consolidated context in one file for easy review
- Preserved Gemini output as independent artifact
- Implemented navigation.spec.ts to test language switching and translation of navigation elements.
- Created sessions-page.spec.ts to verify translations on the sessions page, including headers, status badges, and date formatting.
- Developed settings-page.spec.ts to ensure settings page content is translated and persists across sessions.
- Added skills-page.spec.ts to validate translations for skill categories, action buttons, and empty states.
- Add dimensions I (Constraints Compliance) and J (N+1 Context Validation)
- Verify tasks respect Consolidated Constraints from planning-notes.md
- Detect deferred items incorrectly included in current plan
- Check decision contradictions against N+1 Decisions table
- Introduced a comprehensive guide for generating workflow templates.
- Detailed usage instructions with examples for creating templates.
- Outlined execution flow across three phases: Template Design, Step Definition, and JSON Generation.
- Included JavaScript code snippets for each phase to facilitate implementation.
- Provided suggested step templates for various development scenarios.
- Documented command port references and minimum execution units for clarity.
- Added the crucial `ccw install` step after npm installation in both
English (INSTALL.md) and Chinese (INSTALL_CN.md) documentation
- Included detailed explanation of what ccw install does:
* Installs workflows, scripts, templates to ~/.claude/
* Installs skill definitions to ~/.codex/
* Configures shell integration (optional)
This step is essential for the complete installation of CCW system files.
Co-Authored-By: Claude (Kimi-K2-Instruct-0905) <noreply@anthropic.com>
Interactive command to create flow-coordinator templates with comprehensive
command selection (9 categories), minimum execution units, and command port
reference integrated from ccw/ccw-coordinator/codex-coordinator.
**Major changes:**
- Rename skill from meta-skill to flow-coordinator (avoid /ccw conflicts)
- Update all 17 templates: store full /workflow: command paths in cmd field
- Session ID prefix: ms → fc (fc-YYYYMMDD-HHMMSS)
- Workflow path: .workflow/.meta-skill → .workflow/.flow-coordinator
- Simplify SKILL.md schema documentation
- Streamline Status Schema section
- Consolidate Template Schema with single example
- Remove redundant Field Explanations and behavior tables
- All templates now store cmd as full paths (e.g. /workflow:lite-plan)
- Eliminates need for path assembly during execution
- Matches ccw-coordinator execution format
- Enhance CLI status rendering to display settings file information for builtin Claude.
- Introduce settings file input in CLI manager for configuring the path to settings.json.
- Update Claude CLI tool interface to include settingsFile property.
- Implement settings file resolution and validation in CLI executor.
- Create a new collaborative planning workflow command with detailed documentation.
- Add test scripts for debugging tool configuration and command building.
