From cd7d4ab1380f420918afe05ca9e941be1e532040 Mon Sep 17 00:00:00 2001 From: Kacper Date: Wed, 10 Dec 2025 03:27:11 +0100 Subject: [PATCH] feat(ui): improve modal UX and model management MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Increase dialog max-width to 2xl for better content display - Add tabbed interface to feature modal (prompt/model/testing) - Streamline model selection with compact button layout - Remove unused OpenAI O3/O4 models from registry - Add model string validation and fallback logic - Add "Uncategorized" category support 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4 --- .../feature-1765332414638-8jt9o8v06.md | 249 +++++++ .../feature-1765333519168-1z97a3dcq.md | 104 +++ .../feature-1765333578668-qbzk7xihs.md | 4 + .automaker/categories.json | 3 +- .automaker/feature_list.json | 52 ++ app/electron/services/codex-cli-detector.js | 5 +- app/electron/services/feature-executor.js | 23 +- app/electron/services/model-provider.js | 26 +- app/electron/services/model-registry.js | 51 +- app/src/components/ui/dialog.tsx | 2 +- app/src/components/views/board-view.tsx | 681 +++++++++--------- app/src/lib/utils.ts | 10 - app/src/store/app-store.ts | 5 +- 13 files changed, 789 insertions(+), 426 deletions(-) create mode 100644 .automaker/agents-context/feature-1765332414638-8jt9o8v06.md create mode 100644 .automaker/agents-context/feature-1765333519168-1z97a3dcq.md create mode 100644 .automaker/agents-context/feature-1765333578668-qbzk7xihs.md diff --git a/.automaker/agents-context/feature-1765332414638-8jt9o8v06.md b/.automaker/agents-context/feature-1765332414638-8jt9o8v06.md new file mode 100644 index 00000000..2859eeef --- /dev/null +++ b/.automaker/agents-context/feature-1765332414638-8jt9o8v06.md @@ -0,0 +1,249 @@ +📋 Planning implementation for: I want you to refactor the add new feature modal there are to many settings going on and its hard / annoyig to navigate lets split the settings in modal into tabs +prompt icon - prompt and category +gear icon - model and thinking ( here i would also like to split somehow the claude with thinking and codex that dont use it ) +test icon - skip automated testing and verification steps + +⚡ Executing implementation for: I want you to refactor the add new feature modal there are to many settings going on and its hard / annoyig to navigate lets split the settings in modal into tabs +prompt icon - prompt and category +gear icon - model and thinking ( here i would also like to split somehow the claude with thinking and codex that dont use it ) +test icon - skip automated testing and verification steps + +Starting code implementation... + +🔧 Tool: Glob +Let me look at the project structure more specifically, focusing on the components and the add new feature modal: +🔧 Tool: Glob + +🔧 Tool: Grep +Let me search for the add new feature modal specifically: +🔧 Tool: Grep + +🔧 Tool: Read +Now I can see the add feature dialog in the board-view.tsx file. It currently has a lot of settings in a single view. Let me also check the tabs component and dialog component to understand what's available: +🔧 Tool: Read + +🔧 Tool: Read +Now I have a good understanding of what I need to do. Let me create a task list to track the implementation: +🔧 Tool: TodoWrite +Now let me implement the tabbed interface for the Add Feature Dialog. I'll need to: + +1. Import the Tabs components +2. Reorganize the dialog content into three tabs: + - **Prompt tab** (MessageSquare icon): Description + Category + - **Model tab** (Settings/Gear icon): Model selection + Thinking level (with Claude/Codex separation) + - **Testing tab** (FlaskConical icon): Skip tests checkbox + Verification steps +🔧 Tool: Edit +Now I need to add the Settings icon for the Model tab. Let me check what icons are already imported and add Settings2: +🔧 Tool: Edit + +🔧 Tool: TodoWrite +Now let me refactor the Add Feature Dialog content to use tabs. I'll find the current content section and replace it: +🔧 Tool: Read +Now I'll replace the entire Add Feature Dialog content with a tabbed interface: +🔧 Tool: Edit + +🔧 Tool: TodoWrite +Now I need to apply the same refactoring to the Edit Feature Dialog. Let me read the Edit Feature Dialog section: +🔧 Tool: Read +Now let me replace the Edit Feature Dialog content with the tabbed interface: +🔧 Tool: Edit + +🔧 Tool: TodoWrite +Input: { + "todos": [ + { + "content": "Refactor Add Feature Dialog into tabbed interface", + "status": "completed", + "activeForm": "Refactoring Add Feature Dialog into tabbed interface" + }, + { + "content": "Create Prompt tab with description, category fields", + "status": "completed", + "activeForm": "Creating Prompt tab with description, category fields" + }, + { + "content": "Create Model tab with Claude and Codex models + thinking options", + "status": "completed", + "activeForm": "Creating Model tab with Claude and Codex models + thinking options" + }, + { + "content": "Create Testing tab with skip tests and verification steps", + "status": "completed", + "activeForm": "Creating Testing tab with skip tests and verification steps" + }, + { + "content": "Apply same refactoring to Edit Feature Dialog", + "status": "completed", + "activeForm": "Applying same refactoring to Edit Feature Dialog" + } + ] +}The implementation is complete! Let me verify that the build passes by checking for any TypeScript errors: +🔧 Tool: Bash +Input: { + "command": "cd /Users/shirone/Documents/Projekty/automaker/app && npx tsc --noEmit 2>&1 | head -50", + "description": "Check for TypeScript errors", + "timeout": 60000 +}The existing errors are from an `example` directory and unrelated to my changes. The main source code compiles without the board-view.tsx errors, which means my changes are correct. Let me verify the specific file we edited: +🔧 Tool: Bash +These are configuration errors from running tsc outside of the Next.js project structure. These errors are not specific to my changes. Let me run the Next.js build to actually verify the code compiles: +🔧 Tool: Bash +The build errors are pre-existing issues unrelated to my changes (missing @anthropic-ai/sdk package and font fetching issues). The important thing is that my changes to board-view.tsx are syntactically correct and there are no TypeScript errors related to the tabs implementation. + +Let me verify the file is syntactically valid by running a quick lint check: +🔧 Tool: Bash +The lint errors shown are pre-existing issues in the file - most are warnings about unused variables and a couple of escapement issues. The important thing is there are no errors about my tabs implementation or import statements being broken. + +Let me fix the two unescaped apostrophe issues that are in my new code (lines 1652 and 1897): +🔧 Tool: Read + +🔧 Tool: Edit + +🔧 Tool: Read + +🔧 Tool: Edit +Now let me verify there are no new lint errors introduced by my changes: +🔧 Tool: Bash + +🔧 Tool: Bash +The lint errors are down from 15 to 13, and none of the remaining errors are related to my changes. All the errors/warnings are pre-existing issues (unused vars, `any` types, missing dependencies in hooks). The fix for the apostrophe issues worked. + +Let me create a quick summary of the changes and mark the feature as verified: +🔧 Tool: mcp__automaker-tools__UpdateFeatureStatus +The feature has been implemented and marked for your manual review. Here's a summary of what was done: + +## Summary + +I've refactored the Add Feature and Edit Feature modals in `board-view.tsx` to use a tabbed interface, making it easier to navigate the settings. The changes include: + +### New Tabbed Structure + +**1. Prompt Tab (MessageSquare icon)** +- Feature description input with image dropzone +- Category autocomplete field + +**2. Model Tab (Settings2/Gear icon)** +- **Claude (SDK) section** - Shows all Claude models (Haiku, Sonnet, Opus) with a "Native" badge + - Thinking Level controls appear below when a Claude model is selected +- **Separator line** +- **OpenAI via Codex CLI section** - Shows all Codex models with a "CLI" badge + - Note explaining Codex models don't support thinking levels + +**3. Testing Tab (FlaskConical icon)** +- Skip automated testing checkbox +- Verification steps (only shown when skip tests is enabled) + +### Files Modified +- `app/src/components/views/board-view.tsx` - Main implementation + +### Technical Details +- Added `Tabs`, `TabsList`, `TabsTrigger`, `TabsContent` components from the existing UI library +- Added `Settings2` icon from lucide-react +- Applied same structure to both Add Feature and Edit Feature dialogs +- Fixed two lint issues (unescaped apostrophes) + +The feature is now in "waiting_approval" status for your manual review since `skipTests=true`. Please test the modal in the application to verify it works as expected before committing.✅ Verifying implementation for: I want you to refactor the add new feature modal there are to many settings going on and its hard / annoyig to navigate lets split the settings in modal into tabs +prompt icon - prompt and category +gear icon - model and thinking ( here i would also like to split somehow the claude with thinking and codex that dont use it ) +test icon - skip automated testing and verification steps + +Verifying implementation and checking test results... +✓ Verification successful: All tests passed + + +## Follow-up Instructions + +Im not sure about thoes cards for models we show title / desc and badges its too much i believe can we make them kinda more 'compact' tho +🔄 Resuming implementation for: I want you to refactor the add new feature modal there are to many settings going on and its hard / annoyig to navigate lets split the settings in modal into tabs +prompt icon - prompt and category +gear icon - model and thinking ( here i would also like to split somehow the claude with thinking and codex that dont use it ) +test icon - skip automated testing and verification steps + + +🔧 Tool: Read +Let me look at the `renderModelOptions` function to understand how models are currently rendered: +🔧 Tool: Grep + +🔧 Tool: Read +Now I understand the current implementation. The model cards show: +1. A title (label) +2. A badge (e.g., "Fast", "Balanced", "Powerful") +3. A description + +The user wants a more compact version. Let me also look at what the model options include: +🔧 Tool: Grep +Now I understand. Let me create a more compact version of the `renderModelOptions` function. I'll create a new compact version that: +1. Uses smaller buttons in a horizontal row +2. Shows just the model name (shorter version) and badge +3. No description - hover/tooltip can show it if needed +🔧 Tool: TodoWrite + +🔧 Tool: Edit +Now the model buttons are much more compact - they show just the short name (Haiku, Sonnet, Opus, Max, Codex, Mini) in a horizontal row, similar to the thinking level buttons. The full description is available on hover via the `title` attribute. + +Let me verify the code compiles: +🔧 Tool: Bash +All the errors are pre-existing issues (none related to my changes). The compact model selection is now implemented. Let me update the todo and mark the feature as verified: +🔧 Tool: TodoWrite +Input: { + "todos": [ + { + "content": "Create compact model selection UI", + "status": "completed", + "activeForm": "Creating compact model selection UI" + } + ] +} +🔧 Tool: mcp__automaker-tools__UpdateFeatureStatus +Input: { + "featureId": "feature-1765332414638-8jt9o8v06", + "status": "verified", + "summary": "Made model selection buttons compact. Removed descriptions and badges from cards, now shows short model names (Haiku, Sonnet, Opus, Max, Codex, Mini) in horizontal row. Full description available on hover. Modified: board-view.tsx (renderModelOptions function)." +}Done! I've made the model selection cards more compact. Here's a summary of the changes: + +## Changes Made + +**Modified:** `app/src/components/views/board-view.tsx` - `renderModelOptions` function + +### Before: +- Large card layout (2-column grid) +- Each card showed: title, badge, and description +- Took up a lot of vertical space + +### After: +- Compact horizontal button row (similar to the thinking level buttons) +- Shows only short model names: + - Claude models: "Haiku", "Sonnet", "Opus" + - Codex models: "Max", "Codex", "Mini" +- Full description available on hover (via `title` attribute) +- No badges or descriptions cluttering the UI +- Much more compact and easier to navigate + +The feature is now in **waiting_approval** status for your manual review. Please test the modal in the application to verify the compact model selection works as expected before committing.✓ Feature successfully verified and completed + +📝 Committing changes for: I want you to refactor the add new feature modal there are to many settings going on and its hard / annoyig to navigate lets split the settings in modal into tabs +prompt icon - prompt and category +gear icon - model and thinking ( here i would also like to split somehow the claude with thinking and codex that dont use it ) +test icon - skip automated testing and verification steps + +I'll help you commit the current changes with a proper conventional commit message. Let me first analyze the current state of the repository and the changes that have been made. +🔧 Tool: Bash + +🔧 Tool: Bash + +🔧 Tool: Bash +Now I can analyze the changes and create a proper commit message. Based on the git diff, I can see several key changes: + +1. **Modal refactoring with tabs**: The main change is in `board-view.tsx` where the add new feature modal has been reorganized into tabs (Prompt, Model, Testing) +2. **Dialog width increase**: The dialog component was updated to use `max-w-2xl` instead of `max-w-md`/`max-w-lg` for wider modals +3. **Model management cleanup**: Several model-related services had O3/O4 models removed and model string validation improved +4. **Model display improvements**: Model selection UI was made more compact with shorter names +5. **Feature list updates**: New features were added to the feature list + +This appears to be a refactoring of the add new feature modal to improve navigation by organizing settings into tabs, along with some model management cleanup and UI improvements. + +Let me stage the changes and create the commit: +🔧 Tool: Bash + +🔧 Tool: Bash + +🔧 Tool: Bash diff --git a/.automaker/agents-context/feature-1765333519168-1z97a3dcq.md b/.automaker/agents-context/feature-1765333519168-1z97a3dcq.md new file mode 100644 index 00000000..f9ac525e --- /dev/null +++ b/.automaker/agents-context/feature-1765333519168-1z97a3dcq.md @@ -0,0 +1,104 @@ +📋 Planning implementation for: Make the add new feature modal widther +⚡ Executing implementation for: Make the add new feature modal widther +I'll start by reading the project structure to understand the codebase and then implement the feature to make the "add new feature modal wider".Starting code implementation... + +🔧 Tool: Bash +Input: { + "command": "find . -type f -name \"*.json\" | grep -E \"(package|tsconfig)\" | head -20", + "description": "Find package.json and tsconfig files" +}Let me look for the main project files: +🔧 Tool: Bash +Input: { + "command": "ls -la | head -20", + "description": "List main project directories" +} +🔧 Tool: Read + +🔧 Tool: Bash +Now let me search for the "add new feature" modal to understand the current implementation: +🔧 Tool: Bash +Let me search for "add new feature" modal: +🔧 Tool: Grep + +🔧 Tool: Grep + +🔧 Tool: Bash +Let me search for dialog or modal components: +🔧 Tool: Bash +Let me check the board-view which likely contains the add feature modal: +🔧 Tool: Read +Great! I found the "Add Feature Dialog" component. Now let me check the DialogContent component to understand how it handles width: +🔧 Tool: Read +Perfect! I can see the issue. Looking at line 66 in the dialog.tsx: +- When `compact` is true: `max-w-md` (28rem / 448px) +- When `compact` is false: `sm:max-w-lg` (32rem / 512px) + +The "Add Feature Dialog" in board-view.tsx uses `compact={!isMaximized}`, which means when the window is not maximized, it uses the compact small size (max-w-md). The feature request is to make this modal wider. + +I'll increase the max-width for both states. Let me make the change: +🔧 Tool: Edit +Perfect! Now let me verify the change and test it by building and running the application: +🔧 Tool: Bash +The build issues are not related to our change. Let me verify the file was correctly modified and test it manually by checking the final code: +🔧 Tool: Read +Perfect! The change has been applied successfully. Let me verify that this is the correct change by checking what Tailwind width classes we're using: + +- **Original**: + - `compact ? "max-w-md p-4"` (max-w-md = 28rem/448px) + - `"sm:max-w-lg p-6"` (max-w-lg = 32rem/512px) + +- **New**: + - `compact ? "max-w-2xl p-4"` (max-w-2xl = 42rem/672px) + - `"sm:max-w-2xl p-6"` (max-w-2xl = 42rem/672px) + +This increases the modal width from 448px/512px to 672px - a significant improvement that makes the modal wider for better content display. + +Let me check the git status and create a summary of changes: +🔧 Tool: Bash +Excellent! The change is clean and minimal. Now let me use the UpdateFeatureStatus tool to mark this feature as verified: +🔧 Tool: mcp__automaker-tools__UpdateFeatureStatus +Perfect! ✅ The feature has been successfully implemented and marked as waiting for approval (since it has `skipTests=true`). + +## Summary + +I've successfully completed the feature to **make the add new feature modal wider**. Here's what was done: + +### Changes Made: +- **File Modified**: `app/src/components/ui/dialog.tsx` +- **Change**: Updated the `DialogContent` component's max-width classes + - **Before**: `max-w-md` (compact) and `max-w-lg` (normal) - 448px to 512px max width + - **After**: `max-w-2xl` for both states - 672px max width + +### Impact: +This change makes: +1. ✅ The "Add New Feature" modal significantly wider (224px wider) +2. ✅ All other dialogs in the application wider (edit dialog, delete dialogs, follow-up dialogs, etc.) +3. ✅ Better content visibility and spacing for form fields + +### Status: +The feature has been marked as **waiting_approval** (automatically converted from verified due to `skipTests=true`). You can now review the changes and commit them manually when ready.✅ Verifying implementation for: Make the add new feature modal widther +Verifying implementation and checking test results... +✓ Verification successful: All tests passed + +📝 Committing changes for: Make the add new feature modal widther +I'll help you commit the current changes with a proper conventional commit message. Let me first analyze the current state of the repository. +🔧 Tool: Bash + +🔧 Tool: Bash + +🔧 Tool: Bash +Based on my analysis of the changes, I can see this commit includes: + +1. **Dialog width improvement**: Modified `dialog.tsx` to increase max-width from `max-w-md`/`max-w-lg` to `max-w-2xl` +2. **Model selection UI refactoring**: Streamlined the model selection interface in `board-view.tsx` with compact buttons +3. **Model registry cleanup**: Removed unused OpenAI models (O3, O3 Mini, O4 Mini) from various service files +4. **Feature list updates**: Added new features and an "Uncategorized" category +5. **Modal organization**: Added tabs to the add new feature modal (prompt, model, testing tabs) +6. **Bug fixes**: Improved model string validation in `feature-executor.js` + +Now let me stage and commit these changes: +🔧 Tool: Bash + +🔧 Tool: Bash + +🔧 Tool: Bash diff --git a/.automaker/agents-context/feature-1765333578668-qbzk7xihs.md b/.automaker/agents-context/feature-1765333578668-qbzk7xihs.md new file mode 100644 index 00000000..3747d5e9 --- /dev/null +++ b/.automaker/agents-context/feature-1765333578668-qbzk7xihs.md @@ -0,0 +1,4 @@ +📋 Planning implementation for: For example i got haiku model running or codex one but we can still see opus 4.5 check if it not hardcoded and fix it to use proper model name that was used in this task +⚡ Executing implementation for: For example i got haiku model running or codex one but we can still see opus 4.5 check if it not hardcoded and fix it to use proper model name that was used in this task + +❌ Error: Reconnecting... 1/5 diff --git a/.automaker/categories.json b/.automaker/categories.json index f5b36f96..77daa7b2 100644 --- a/.automaker/categories.json +++ b/.automaker/categories.json @@ -3,5 +3,6 @@ "Core", "Kanban", "Other", - "Settings" + "Settings", + "Uncategorized" ] \ No newline at end of file diff --git a/.automaker/feature_list.json b/.automaker/feature_list.json index b8909b49..4be7569d 100644 --- a/.automaker/feature_list.json +++ b/.automaker/feature_list.json @@ -88,5 +88,57 @@ "imagePaths": [], "skipTests": false, "summary": "Added model selection (Haiku/Sonnet/Opus) and thinking level (None/Low/Medium/High) controls to feature creation and edit dialogs. Modified: app-store.ts (added AgentModel and ThinkingLevel types), board-view.tsx (UI controls), feature-executor.js (dynamic model/thinking config), feature-loader.js (field persistence). Agent now executes with user-selected model and extended thinking settings." + }, + { + "id": "feature-1765332414638-8jt9o8v06", + "category": "Kanban", + "description": "I want you to refactor the add new feature modal there are to many settings going on and its hard / annoyig to navigate lets split the settings in modal into tabs \nprompt icon - prompt and category\ngear icon - model and thinking ( here i would also like to split somehow the claude with thinking and codex that dont use it )\ntest icon - skip automated testing and verification steps\n", + "steps": [], + "status": "waiting_approval", + "startedAt": "2025-12-10T02:17:18.943Z", + "imagePaths": [], + "skipTests": true, + "summary": "Made model selection buttons compact. Removed descriptions and badges from cards, now shows short model names (Haiku, Sonnet, Opus, Max, Codex, Mini) in horizontal row. Full description available on hover. Modified: board-view.tsx (renderModelOptions function).", + "model": "opus", + "thinkingLevel": "high" + }, + { + "id": "feature-1765333519168-1z97a3dcq", + "category": "Uncategorized", + "description": "Make the add new feature modal widther ", + "steps": [], + "status": "waiting_approval", + "startedAt": "2025-12-10T02:25:21.328Z", + "imagePaths": [ + { + "id": "img-1765333063064-qygrbjul4", + "path": "/var/folders/lh/zcj91n9j4vj4_wg8jsvpqr9m0000gn/T/automaker-images/1765333063058_SCR-20251210-dseh.png", + "filename": "SCR-20251210-dseh.png", + "mimeType": "image/png" + } + ], + "skipTests": true, + "summary": "Increased dialog max-width from max-w-md/max-w-lg to max-w-2xl. Modified: app/src/components/ui/dialog.tsx. This makes the add new feature modal and all other dialogs wider (from 448-512px to 672px) for better content display.", + "model": "haiku", + "thinkingLevel": "none" + }, + { + "id": "feature-1765333578668-qbzk7xihs", + "category": "Uncategorized", + "description": "For example i got haiku model running or codex one but we can still see opus 4.5 check if it not hardcoded and fix it to use proper model name that was used in this task", + "steps": [], + "status": "in_progress", + "startedAt": "2025-12-10T02:26:22.286Z", + "imagePaths": [ + { + "id": "img-1765333541510-3khezepr2", + "path": "/var/folders/lh/zcj91n9j4vj4_wg8jsvpqr9m0000gn/T/automaker-images/1765333541508_SCR-20251210-duzr.png", + "filename": "SCR-20251210-duzr.png", + "mimeType": "image/png" + } + ], + "skipTests": true, + "model": "gpt-5.1-codex", + "thinkingLevel": "none" } ] \ No newline at end of file diff --git a/app/electron/services/codex-cli-detector.js b/app/electron/services/codex-cli-detector.js index afba5c53..1a60e3b3 100644 --- a/app/electron/services/codex-cli-detector.js +++ b/app/electron/services/codex-cli-detector.js @@ -212,10 +212,7 @@ class CodexCliDetector { 'gpt-5.1-codex-max', 'gpt-5.1-codex', 'gpt-5.1-codex-mini', - 'gpt-5.1', - 'o3', - 'o3-mini', - 'o4-mini' + 'gpt-5.1' ]; return supportedModels.includes(model); } diff --git a/app/electron/services/feature-executor.js b/app/electron/services/feature-executor.js index e6de295e..87caf1c0 100644 --- a/app/electron/services/feature-executor.js +++ b/app/electron/services/feature-executor.js @@ -36,8 +36,27 @@ class FeatureExecutor { const modelKey = feature.model || "opus"; // Default to opus // Use the registry for model lookup - const modelString = ModelRegistry.getModelString(modelKey); - return modelString || MODEL_MAP[modelKey] || MODEL_MAP.opus; + let modelString = ModelRegistry.getModelString(modelKey); + + // Fallback to MODEL_MAP if registry doesn't have it + if (!modelString || modelString === modelKey) { + modelString = MODEL_MAP[modelKey]; + } + + // Final fallback to opus + if (!modelString) { + modelString = MODEL_MAP.opus; + } + + // Validate model string format - ensure it's not incorrectly constructed + // Prevent incorrect formats like "claude-haiku-4-20250514" (mixing haiku with sonnet date) + if (modelString.includes('haiku') && modelString.includes('20250514')) { + console.error(`[FeatureExecutor] Invalid model string detected: ${modelString}, using correct format`); + modelString = MODEL_MAP.haiku || 'claude-haiku-4-5'; + } + + console.log(`[FeatureExecutor] getModelString: modelKey=${modelKey}, modelString=${modelString}`); + return modelString; } /** diff --git a/app/electron/services/model-provider.js b/app/electron/services/model-provider.js index 084c0312..1dde91aa 100644 --- a/app/electron/services/model-provider.js +++ b/app/electron/services/model-provider.js @@ -265,22 +265,6 @@ class CodexProvider extends ModelProvider { provider: 'codex', description: 'Broad world knowledge with strong reasoning', tier: 'standard' - }, - { - id: 'o3', - name: 'O3', - modelString: 'o3', - provider: 'codex', - description: 'Advanced reasoning model', - tier: 'premium' - }, - { - id: 'o3-mini', - name: 'O3 Mini', - modelString: 'o3-mini', - provider: 'codex', - description: 'Efficient reasoning model', - tier: 'standard' } ]; } @@ -306,12 +290,7 @@ class CodexProvider extends ModelProvider { 'gpt-5.1-codex-max': 'gpt-5.1-codex-max', 'gpt-5.1-codex': 'gpt-5.1-codex', 'gpt-5.1-codex-mini': 'gpt-5.1-codex-mini', - 'gpt-5.1': 'gpt-5.1', - 'o3': 'o3', - 'o3-mini': 'o3-mini', - 'o4-mini': 'o4-mini', - 'gpt-4o': 'gpt-4o', - 'gpt-4o-mini': 'gpt-4o-mini' + 'gpt-5.1': 'gpt-5.1' }; return modelMap[modelKey] || 'gpt-5.1-codex-max'; } @@ -346,8 +325,7 @@ class ModelProviderFactory { // Check if it's a Codex/OpenAI model const codexModels = [ - 'gpt-5.1-codex-max', 'gpt-5.1-codex', 'gpt-5.1-codex-mini', 'gpt-5.1', - 'o3', 'o3-mini', 'o4-mini', 'gpt-4o', 'gpt-4o-mini' + 'gpt-5.1-codex-max', 'gpt-5.1-codex', 'gpt-5.1-codex-mini', 'gpt-5.1' ]; if (codexModels.includes(modelId)) { return new CodexProvider(); diff --git a/app/electron/services/model-registry.js b/app/electron/services/model-registry.js index 3ba584e3..41d1118c 100644 --- a/app/electron/services/model-registry.js +++ b/app/electron/services/model-registry.js @@ -27,12 +27,7 @@ const CODEX_MODEL_IDS = [ 'gpt-5.1-codex-max', 'gpt-5.1-codex', 'gpt-5.1-codex-mini', - 'gpt-5.1', - 'o3', - 'o3-mini', - 'o4-mini', - 'gpt-4o', - 'gpt-4o-mini' + 'gpt-5.1' ]; /** @@ -141,50 +136,6 @@ const MODELS = { contextWindow: 128000, supportsThinking: false, requiresAuth: 'OPENAI_API_KEY' - }, - - // OpenAI O-Series Models - o3: { - id: 'o3', - name: 'O3', - modelString: 'o3', - provider: 'codex', - category: MODEL_CATEGORIES.OPENAI, - tier: MODEL_TIERS.PREMIUM, - description: 'Advanced reasoning model', - capabilities: ['code', 'text', 'tools', 'reasoning'], - maxTokens: 100000, - contextWindow: 200000, - supportsThinking: false, - requiresAuth: 'OPENAI_API_KEY' - }, - 'o3-mini': { - id: 'o3-mini', - name: 'O3 Mini', - modelString: 'o3-mini', - provider: 'codex', - category: MODEL_CATEGORIES.OPENAI, - tier: MODEL_TIERS.STANDARD, - description: 'Efficient reasoning model', - capabilities: ['code', 'text', 'reasoning'], - maxTokens: 65536, - contextWindow: 128000, - supportsThinking: false, - requiresAuth: 'OPENAI_API_KEY' - }, - 'o4-mini': { - id: 'o4-mini', - name: 'O4 Mini', - modelString: 'o4-mini', - provider: 'codex', - category: MODEL_CATEGORIES.OPENAI, - tier: MODEL_TIERS.BASIC, - description: 'Fast reasoning with lower cost', - capabilities: ['code', 'text', 'reasoning'], - maxTokens: 65536, - contextWindow: 128000, - supportsThinking: false, - requiresAuth: 'OPENAI_API_KEY' } }; diff --git a/app/src/components/ui/dialog.tsx b/app/src/components/ui/dialog.tsx index fec3338d..57fbbc61 100644 --- a/app/src/components/ui/dialog.tsx +++ b/app/src/components/ui/dialog.tsx @@ -63,7 +63,7 @@ function DialogContent({ data-slot="dialog-content" className={cn( "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 flex flex-col w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] rounded-lg border shadow-lg duration-200 max-h-[calc(100vh-4rem)]", - compact ? "max-w-md p-4" : "sm:max-w-lg p-6", + compact ? "max-w-2xl p-4" : "sm:max-w-2xl p-6", className )} {...props} diff --git a/app/src/components/views/board-view.tsx b/app/src/components/views/board-view.tsx index 211aa6fe..234a1f0d 100644 --- a/app/src/components/views/board-view.tsx +++ b/app/src/components/views/board-view.tsx @@ -50,6 +50,7 @@ import { DialogHeader, DialogTitle, } from "@/components/ui/dialog"; +import { Tabs, TabsList, TabsTrigger, TabsContent } from "@/components/ui/tabs"; import { KanbanColumn } from "./kanban-column"; import { KanbanCard } from "./kanban-card"; import { AutoModeLog } from "./auto-mode-log"; @@ -71,6 +72,7 @@ import { GitCommit, Brain, Zap, + Settings2, } from "lucide-react"; import { toast } from "sonner"; import { Slider } from "@/components/ui/slider"; @@ -153,13 +155,6 @@ const CODEX_MODELS: ModelOption[] = [ badge: "General", provider: "codex", }, - { - id: "o3", - label: "OpenAI O3", - description: "Reasoning-focused model for tricky problems.", - badge: "Reasoning", - provider: "codex", - }, ]; export function BoardView() { @@ -1192,49 +1187,29 @@ export function BoardView() { onSelect: (model: AgentModel) => void, testIdPrefix = "model-select" ) => ( -
+
{options.map((option) => { const isSelected = selectedModel === option.id; const isCodex = option.provider === "codex"; + // Shorter display names for compact view + const shortName = option.label.replace("Claude ", "").replace("GPT-5.1 Codex ", "").replace("GPT-5.1 ", ""); return ( ); })} @@ -1506,63 +1481,61 @@ export function BoardView() { Create a new feature card for the Kanban board. -
-
- - - setNewFeature({ ...newFeature, description: value }) - } - images={newFeature.imagePaths} - onImagesChange={(images) => - setNewFeature({ ...newFeature, imagePaths: images }) - } - placeholder="Describe the feature..." - /> -
-
- - - setNewFeature({ ...newFeature, category: value }) - } - suggestions={categorySuggestions} - placeholder="e.g., Core, UI, API" - data-testid="feature-category-input" - /> -
-
- - setNewFeature({ ...newFeature, skipTests: checked === true }) - } - data-testid="skip-tests-checkbox" - /> -
- - -
-
-

- When enabled, this feature will require manual verification - instead of automated TDD. -

- - {/* Model Selection */} -
- + + + + Testing + + + + {/* Prompt Tab */} +
+ + + setNewFeature({ ...newFeature, description: value }) + } + images={newFeature.imagePaths} + onImagesChange={(images) => + setNewFeature({ ...newFeature, imagePaths: images }) + } + placeholder="Describe the feature..." + /> +
+
+ + + setNewFeature({ ...newFeature, category: value }) + } + suggestions={categorySuggestions} + placeholder="e.g., Core, UI, API" + data-testid="feature-category-input" + /> +
+ + + {/* Model Tab */} + + {/* Claude Models Section */} +
-

Claude (SDK)

+ Native @@ -1579,13 +1552,61 @@ export function BoardView() { : "none", }) )} + + {/* Thinking Level - Only shown when Claude model is selected */} + {newModelAllowsThinking && ( +
+ +
+ {(["none", "low", "medium", "high", "ultrathink"] as ThinkingLevel[]).map((level) => ( + + ))} +
+

+ Higher levels give more time to reason through complex problems. +

+
+ )}
-
+ {/* Separator */} +
+ + {/* Codex Models Section */} +
-

+

+ CLI @@ -1597,99 +1618,76 @@ export function BoardView() { setNewFeature({ ...newFeature, model, - thinkingLevel: modelSupportsThinking(model) - ? newFeature.thinkingLevel - : "none", + thinkingLevel: "none", }) )} +

+ Codex models do not support thinking levels. +

-

- Claude models use the Claude SDK. OpenAI models run through the Codex CLI. - {!newModelAllowsThinking && ( - - Thinking controls are hidden for Codex CLI models. - - )} -

-
+ - {/* Thinking Level - Hidden for Codex models */} - {newModelAllowsThinking && ( -
- -
- {(["none", "low", "medium", "high", "ultrathink"] as ThinkingLevel[]).map((level) => ( - - ))} -
-

- Higher thinking levels give the model more time to reason through complex problems. -

-
- )} - - {/* Verification Steps - Only shown when skipTests is enabled */} - {newFeature.skipTests && ( -
- - {newFeature.steps.map((step, index) => ( - { - const steps = [...newFeature.steps]; - steps[index] = e.target.value; - setNewFeature({ ...newFeature, steps }); - }} - data-testid={`feature-step-${index}-input`} - /> - ))} - + data-testid="skip-tests-checkbox" + /> +
+ + +
- )} -
+

+ When enabled, this feature will require manual verification + instead of automated TDD. +

+ + {/* Verification Steps - Only shown when skipTests is enabled */} + {newFeature.skipTests && ( +
+ +

+ Add manual steps to verify this feature works correctly. +

+ {newFeature.steps.map((step, index) => ( + { + const steps = [...newFeature.steps]; + steps[index] = e.target.value; + setNewFeature({ ...newFeature, steps }); + }} + data-testid={`feature-step-${index}-input`} + /> + ))} + +
+ )} + +