sidebar behaviour is now amazing

client/src/ui/handlers/render.rs

@@ -20,6 +20,7 @@ pub fn render_ui(
     command_message: &str,
     ui_state: &UiState,
 ) {
+    // Render background first
     render_background(f, f.size(), theme);
 
     // Root layout - vertical split for main content, status, and command line
@@ -30,18 +31,23 @@ pub fn render_ui(
             Constraint::Length(1),  // Status line
             Constraint::Length(1),  // Command line
         ])
-        .split(f.area());
+        .split(f.size());
 
     // Main content area layout
     let main_content_area = root[0];
 
-    // Split into sidebar + content or just content
+    // Calculate available width for form
-    let (sidebar_area, content_area) = if ui_state.show_sidebar {
+    let full_width = main_content_area.width;
+    let sidebar_width = if ui_state.show_sidebar { 16 } else { 0 };
+    let available_width = full_width.saturating_sub(sidebar_width);
+
+    // Create layout chunks based on available space
+    let (sidebar_area, form_area) = if ui_state.show_sidebar {
         let chunks = Layout::default()
             .direction(Direction::Horizontal)
             .constraints([
-                Constraint::Length(16),  // Fixed sidebar width
+                Constraint::Length(sidebar_width),
-                Constraint::Fill(1),     // Remaining space for form/preview
+                Constraint::Min(0),
             ])
             .split(main_content_area);
         (Some(chunks[0]), chunks[1])
@@ -49,20 +55,33 @@ pub fn render_ui(
         (None, main_content_area)
     };
 
-    // Create centered form layout
+    // Center form in available space or full width depending on space
-    let form_layout = Layout::default()
+    let form_constraint = if available_width >= 80 {
-        .direction(Direction::Horizontal)
+        // Center in full width if there's enough space
-        .constraints([
+        Layout::default()
-            Constraint::Min(0),
+            .direction(Direction::Horizontal)
-            Constraint::Max(80),
+            .constraints([
-            Constraint::Min(0),
+                Constraint::Min(0),
-        ])
+                Constraint::Length(80),
-        .split(content_area);
+                Constraint::Min(0),
+            ])
+            .split(main_content_area)[1]  // Use full width centering
+    } else {
+        // Center in remaining space
+        Layout::default()
+            .direction(Direction::Horizontal)
+            .constraints([
+                Constraint::Min(0),
+                Constraint::Length(80.min(available_width)),
+                Constraint::Min(0),
+            ])
+            .split(form_area)[1]  // Use remaining space centering
+    };
 
-    // Render form in the left content area
+    // Render form in the calculated area
     form_state.render(
         f,
-        form_layout[1],
+        form_constraint,
         theme,
         is_edit_mode,
         total_count,