Files
headquarter/openspec/changes/tool-config-ui-rework/design.md
T

39 lines
2.2 KiB
Markdown

## Context
The current tool configuration page at `/tool-configs` uses a simple flat list with dropdown selection. Each config only has `key`, `value`, `config_type`, and `file_path` fields. Users have requested:
1. A split-pane layout (list on left, detail on right) for better navigation
2. Additional configuration options like start command, port, working directory
3. Better organization of environment variables and volume mounts
## Goals / Non-Goals
**Goals:**
- Implement split-pane layout with tool config list on left and detail/edit panel on right
- Add new fields to tool config model: `start_command`, `port`, `working_directory`, `environment_variables`, `volumes`
- Support JSON editing for complex fields (environment variables, volumes)
- Maintain backward compatibility with existing configs
- Improve UX for managing multiple tool configurations
**Non-Goals:**
- Changing the underlying Docker/container runtime behavior
- Adding new tool types
- Modifying the tool instance creation flow beyond config injection
- Real-time collaboration on configs
## Decisions
1. **Split-pane layout**: Use a responsive 2-column layout (30/70 split) that stacks on mobile. Left panel shows scrollable list of configs grouped by tool type. Right panel shows form for selected config.
2. **New fields as JSON columns**: Store `environment_variables` and `volumes` as JSON in PostgreSQL to allow flexible key-value structures without rigid schema changes.
3. **Port field**: Store as integer with validation (1-65535). Null means "use tool type default".
4. **Form design**: Use tabs or sections within the right panel to organize: Basic (key, value), Runtime (start_command, port, working_directory), Advanced (env vars, volumes).
5. **Validation**: Validate JSON structure on backend before saving. Show clear error messages in the UI.
## Risks / Trade-offs
- **Migration complexity**: Existing configs need default values for new columns. Mitigation: All new fields are nullable with sensible defaults.
- **JSON editing UX**: Raw JSON editing is error-prone. Mitigation: Provide structured key-value editors that generate JSON under the hood.
- **Mobile experience**: Split-pane may be cramped on small screens. Mitigation: Stack panels vertically on mobile breakpoints.