Fix Dragging Roo to the sides leaves blank space or makes buttons unresponsive (#3729)

[forestyoo]

Related GitHub Issue

Closes: #3729

Description

This PR resolves issues where dragging Roo to the left or right side resulted in blank spaces or unresponsive buttons.

Cause: Dragging Roo triggered an asynchronous dispose of the old webview's provider while a new webview simultaneously invoked resolveWebviewView.

• The asynchronous nature of dispose meant resolveWebviewView could complete before view.dispose executed, resulting in blank spaces.
• Crucially, dispose immediately removed the provider from activeInstances, leading to unresponsive buttons. These issues could occur concurrently.

Solution: Introduced a ComponentManager to immediately mark a provider as disposed, even for async dispose calls. resolveWebviewView now adds the provider to activeInstances and recreates the ComponentManager if it was previously disposed.

Test Procedure

1. Open Roo and start a task.
2. Drag Roo to the other side.
3. Check for blank spaces or unresponsive buttons.

Type of Change

• 🐛 Bug Fix: Non-breaking change that fixes an issue.
• ✨ New Feature: Non-breaking change that adds functionality.
• 💥 Breaking Change: Fix or feature that would cause existing functionality to not work as expected.
• ♻️ Refactor: Code change that neither fixes a bug nor adds a feature.
• 💅 Style: Changes that do not affect the meaning of the code (white-space, formatting, etc.).
• 📚 Documentation: Updates to documentation files.
• ⚙️ Build/CI: Changes to the build process or CI configuration.
• 🧹 Chore: Other changes that don't modify src or test files.

Pre-Submission Checklist

• Issue Linked: This PR is linked to an approved GitHub Issue (see "Related GitHub Issue" above).
• Scope: My changes are focused on the linked issue (one major feature/fix per PR).
• Self-Review: I have performed a thorough self-review of my code.
• Code Quality:
  • My code adheres to the project's style guidelines.
  • There are no new linting errors or warnings (npm run lint).
  • All debug code (e.g., console.log) has been removed.
• Testing:
  • New and/or updated tests have been added to cover my changes.
  • All tests pass locally (npm test).
  • The application builds successfully with my changes.
• Branch Hygiene: My branch is up-to-date (rebased) with the main branch.
• Documentation Impact: I have considered if my changes require documentation updates (see "Documentation Updates" section below).
• Changeset: A changeset has been created using npm run changeset if this PR includes user-facing changes or dependency updates.
• Contribution Guidelines: I have read and agree to the Contributor Guidelines.

Screenshots / Videos

Documentation Updates

Additional Notes

Get in Touch

---

Important

Fixes blank spaces and unresponsive buttons in Roo by introducing ComponentManager for component lifecycle management in ClineProvider.

• Behavior:
  • Fixes issue where dragging Roo to sides caused blank spaces or unresponsive buttons by ensuring proper disposal and recreation of components in ClineProvider.
  • Introduces ComponentManager to manage lifecycle of WorkspaceTracker, McpHub, and CustomModesManager.
• Code Changes:
  • Refactors ClineProvider to use ComponentManager for component management.
  • Updates dispose() in ClineProvider to handle async disposal correctly.
  • Ensures resolveWebviewView() recreates ComponentManager if disposed.
• Testing:
  • Updates tests in ClineProvider.test.ts to mock ComponentManager and verify component lifecycle management.

^{This description was created by for aabd0475b3afd44d6c8f927fd4651f3c3bd7c846. You can customize this summary. It will automatically update as commits are pushed.}

[daniel-lxs]

Hey @forestyoo, thank you for your quick PR, sorry that the fix was merged the day before.

We are working on organizing our issues and trying to respond faster to prevent situations like this.

We appreciate the time you put into this.