chore: checkpoint before removing POPUP_BG

src/ui/components.rs

@@ -1,7 +1,7 @@
 use ratatui::style::{Color, Modifier, Style};
 use ratatui::text::{Line, Span, Text};
-use ratatui::widgets::{Block, Borders, List, ListItem, Paragraph, Tabs};
-use ratatui::layout::{Alignment, Rect};
+use ratatui::widgets::{Block, Borders, Clear, List, ListItem, Paragraph, Tabs};
+use ratatui::layout::{Alignment, Constraint, Direction, Layout, Rect};
 use ratatui::Frame;
 
 use crate::domain::models::*;
@@ -238,7 +238,8 @@ pub fn render_input_popup(
     input: &str,
     cursor: usize,
 ) {
-    let popup_area = centered_rect(60, 3, area);
+    let popup_area = centered_rect(75, 3, area);
+    frame.render_widget(Clear, popup_area);
     let block = Block::default()
         .borders(Borders::ALL)
         .style(Style::default().bg(POPUP_BG))
@@ -256,12 +257,103 @@ pub fn render_input_popup(
     ));
 }
 
+pub fn render_edit_task_popup(
+    frame: &mut Frame,
+    area: Rect,
+    title: &str,
+    title_cursor: usize,
+    notes: &str,
+    notes_cursor: usize,
+    active_field: usize,
+) {
+    let popup_area = centered_rect(75, 10, area);
+
+    // Clear the area first to prevent style/symbol bleed from previously rendered widgets
+    frame.render_widget(Clear, popup_area);
+
+    let outer_block = Block::default()
+        .borders(Borders::ALL)
+        .style(Style::default().bg(POPUP_BG))
+        .border_style(Style::default().fg(POPUP_BORDER))
+        .title(" Edit Task ");
+    let inner_area = outer_block.inner(popup_area);
+
+    // Render outer block with borders and background
+    let outer_para = Paragraph::new(Text::raw(""))
+        .style(Style::default().bg(POPUP_BG))
+        .block(outer_block);
+    frame.render_widget(outer_para, popup_area);
+
+    // Split inner area into rows
+    let rows = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([
+            Constraint::Length(3),
+            Constraint::Length(1),
+            Constraint::Length(3),
+            Constraint::Length(1),
+        ])
+        .split(inner_area);
+
+    // ── Title block ──
+    let title_style = if active_field == 0 {
+        Style::default().fg(FOCUS_COLOR).bg(POPUP_BG)
+    } else {
+        Style::default().fg(Color::DarkGray).bg(POPUP_BG)
+    };
+    let title_block = Block::default()
+        .borders(Borders::ALL)
+        .style(Style::default().bg(POPUP_BG))
+        .border_style(title_style)
+        .title(" Title ")
+        .title_alignment(Alignment::Left);
+    let title_para = Paragraph::new(Text::from(Line::from(Span::raw(title))))
+        .style(Style::default().bg(POPUP_BG))
+        .block(title_block);
+    frame.render_widget(title_para, rows[0]);
+
+    // ── Notes block ──
+    let notes_style = if active_field == 1 {
+        Style::default().fg(FOCUS_COLOR).bg(POPUP_BG)
+    } else {
+        Style::default().fg(Color::DarkGray).bg(POPUP_BG)
+    };
+    let notes_block = Block::default()
+        .borders(Borders::ALL)
+        .style(Style::default().bg(POPUP_BG))
+        .border_style(notes_style)
+        .title(" Notes ")
+        .title_alignment(Alignment::Left);
+    let notes_para = Paragraph::new(Text::from(Line::from(Span::raw(notes))))
+        .style(Style::default().bg(POPUP_BG))
+        .block(notes_block);
+    frame.render_widget(notes_para, rows[2]);
+
+    // ── Hint row ──
+    let hint = Paragraph::new(Line::from(Span::styled(
+        " Tab:switch field  Enter:save  Esc:cancel ",
+        Style::default().fg(Color::Gray),
+    )))
+    .style(Style::default().bg(POPUP_BG))
+    .alignment(Alignment::Center);
+    frame.render_widget(hint, rows[3]);
+
+    // ── Cursor ──
+    let (cursor_x, cursor_y) = if active_field == 0 {
+        (rows[0].x + 1 + title_cursor as u16, rows[0].y + 1)
+    } else {
+        (rows[2].x + 1 + notes_cursor as u16, rows[2].y + 1)
+    };
+    frame.set_cursor_position(ratatui::layout::Position::new(cursor_x, cursor_y));
+}
+
 pub fn render_date_picker(
     frame: &mut Frame,
     area: Rect,
     date: chrono::NaiveDateTime,
 ) {
-    let popup_area = centered_rect(50, 7, area);
+    let popup_area = centered_rect(60, 7, area);
+    frame.render_widget(Clear, popup_area);
     let block = Block::default()
         .borders(Borders::ALL)
         .style(Style::default().bg(POPUP_BG))
@@ -292,7 +384,8 @@ pub fn render_date_picker(
 }
 
 pub fn render_confirm_popup(frame: &mut Frame, area: Rect) {
-    let popup_area = centered_rect(40, 5, area);
+    let popup_area = centered_rect(50, 5, area);
+    frame.render_widget(Clear, popup_area);
     let block = Block::default()
         .borders(Borders::ALL)
         .style(Style::default().bg(POPUP_BG))
@@ -328,6 +421,7 @@ pub fn render_device_auth_popup(
     error: Option<&str>,
 ) {
     let popup_area = centered_rect(80, 13, area);
+    frame.render_widget(Clear, popup_area);
 
     let border_color = if error.is_some() {
         Color::Red