Iteration 1: Resizable anchored Duo Chat in the web app

Release notes

You can now resize the chat by dragging its top-left corner. This makes it easier to view code outputs or keep chat open while working with the GitLab resource in the background. Resize it to whatever feels most comfortable.

Demo

Demo

This issue focuses solely on adding the resizable functionality to the existing Duo Chat container. The aim is to allow users to resize the chat container vertically and horizontally, while keeping the current design and behavior intact.

Key Features:

• Resizable Chat Window: Users will be able to adjust the size of the Duo Chat window
  • by dragging the top and left edges,
  • or top-left corner
  • while it remains anchored to the bottom-right corner.
• Unchanged Opening Mechanism: Duo Chat will retain its current mechanism for opening and closing. No changes will be made to how users initiate the chat.
• No Redesign of the inside of the chat window: This issue focuses only on the resizing functionality—no visual changes from the proposed redesign will be implemented at this stage.
• Feature Flag: This functionality will be released behind a feature flag for testing and feedback purposes.

Answered Questions:

• I'm assuming the opening mechanism for DuoChat will remain untouched on the first iteration.
  • YES.
• How do we deal with narrow screens (mobile devices)? Do we want to keep the current DuoChat behaviour and only make it resizable on a certain min width? or what are the plans here?
  • keep as currently is, up to 767px

This needs to be implemented behind a feature flag