Skip to content

Refactor TaskPanel into smaller focused components#28

Open
johannesjo wants to merge 1 commit intomainfrom
claude/identify-priority-improvement-p33Fg
Open

Refactor TaskPanel into smaller focused components#28
johannesjo wants to merge 1 commit intomainfrom
claude/identify-priority-improvement-p33Fg

Conversation

@johannesjo
Copy link
Copy Markdown
Owner

Summary

This PR refactors the monolithic TaskPanel component 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 navigation

  • Extracted TaskNotesPanel: New component managing the notes and plan tabs, including the notes textarea, plan viewer, and changed files list

  • Extracted TaskShellSection: New component handling the shell toolbar and terminal views, including bookmark buttons and shell session management

  • Extracted TaskAITerminal: New component for the AI agent terminal display, including agent status, exit badges, and restart controls

  • Removed unused imports and state: Cleaned up imports from TaskPanel that 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 TaskShellSection where it's more contextually relevant

Implementation Details

  • All extracted components receive necessary props to maintain their functionality
  • State management (signals, effects) moved to the components that use them
  • Focus function registration and cleanup properly scoped to each component
  • Component composition maintains the same visual layout and user interactions
  • No changes to store functions or data structures

https://claude.ai/code/session_01QKHMqgf27nEbHkNnegfjHq

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
@johannesjo
Copy link
Copy Markdown
Owner Author

Review: Superseded by direct commit to main

This PR has been fully superseded. All five extracted components (TaskTitleBar, TaskBranchInfoBar, TaskNotesPanel, TaskShellSection, TaskAITerminal) were already committed directly to main on the same day this PR was opened, via commit cd1ad01 ("refactor: decompose TaskPanel into focused sub-components").

The main branch version is also more complete — it includes a sixth component (TaskClosingOverlay), a shared src/lib/focus-registration.ts utility for auto-cleanup, and deduplicated inline styles (badgeStyle, infoBarBtnStyle, toolbarBtnStyle). Merging this PR would overwrite those improvements with an older, less-refined version.

Recommendation: close this PR as superseded. The refactoring goal has already been achieved on main.

Copy link
Copy Markdown
Owner Author

@johannesjo johannesjo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants