Refactor TaskPanel into smaller focused components#28
Refactor TaskPanel into smaller focused components#28johannesjo wants to merge 1 commit intomainfrom
Conversation
Extract 5 components from the 1472-line monolithic TaskPanel: - TaskTitleBar: title bar with drag, status dot, action buttons - TaskBranchInfoBar: branch/project/editor info bar - TaskNotesPanel: notes/plan tabs + changed files list - TaskShellSection: shell toolbar + terminal views - TaskAITerminal: AI agent terminal + exit badge + restart menu TaskPanel now serves as a coordinator (~300 lines), composing these sub-components and managing shared state (dialogs, focus, push status). Each extracted component owns its own signals and lifecycle. https://claude.ai/code/session_01QKHMqgf27nEbHkNnegfjHq
Review: Superseded by direct commit to mainThis PR has been fully superseded. All five extracted components ( The main branch version is also more complete — it includes a sixth component ( Recommendation: close this PR as superseded. The refactoring goal has already been achieved on main. |
johannesjo
left a comment
There was a problem hiding this comment.
This PR is fully superseded by code already on main. All five extracted components (TaskTitleBar, TaskBranchInfoBar, TaskNotesPanel, TaskShellSection, TaskAITerminal) were committed directly to main on 2026-03-22 (commit cd1ad01) — the same day this PR was opened. The main-branch version is more complete, adding TaskClosingOverlay and a focus-registration.ts utility. Merging this PR would overwrite those improvements.
Recommend closing this PR.
Summary
This PR refactors the monolithic
TaskPanelcomponent into smaller, more focused and maintainable sub-components. The changes improve code organization and separation of concerns without altering functionality.Key Changes
Extracted
TaskTitleBar: New component handling the task title bar with status dot, mode badges, editable task name, and action buttons (merge, push, close)Extracted
TaskBranchInfoBar: New component for displaying branch information, project selector, GitHub link, and file system navigationExtracted
TaskNotesPanel: New component managing the notes and plan tabs, including the notes textarea, plan viewer, and changed files listExtracted
TaskShellSection: New component handling the shell toolbar and terminal views, including bookmark buttons and shell session managementExtracted
TaskAITerminal: New component for the AI agent terminal display, including agent status, exit badges, and restart controlsRemoved unused imports and state: Cleaned up imports from
TaskPanelthat are now only used in extracted components (e.g.,For,createStore, shell-related store functions)Simplified focus management: Moved shell-toolbar focus registration logic into
TaskShellSectionwhere it's more contextually relevantImplementation Details
https://claude.ai/code/session_01QKHMqgf27nEbHkNnegfjHq