feat: Add draggable resizable panels to the editor workspace

[garv999]

Description

The editor layout currently uses fixed panel widths, preventing users from adjusting the size of the left sidebar, code editor, and preview/terminal sections according to their workflow and screen size.

Expected Behavior

Add draggable resize handles (splitters) between panels so users can dynamically adjust panel widths in real time.

Current Flow

Fixed Layout
↓
Users cannot resize panels
↓
Limited flexibility and inefficient use of screen space

Desired Flow

Resizable Layout
↓
Drag splitter between panels
↓
Adjust panel sizes in real time
↓
Personalized and improved coding experience

Benefits

• Makes better use of available screen space across different display sizes.
• Allows users to prioritize the areas they need most, such as the code editor, preview, terminal, or collaboration sidebar.
• Provides an IDE-like experience similar to VS Code and CodeSandbox.
• Improves usability and productivity, especially on laptops and smaller screens.
• Enables developers to customize the workspace based on their preferences and tasks.