Multi-column support

src/app.rs

@@ -146,8 +146,8 @@ impl App {
                 (KeyCode::Char('q'), _) => return Ok(true),
                 (KeyCode::Char('j'), _) | (KeyCode::Down, _) => self.move_selection(1),
                 (KeyCode::Char('k'), _) | (KeyCode::Up, _) => self.move_selection(-1),
-                (KeyCode::Char('h'), _) | (KeyCode::Left, _) => self.change_pane(-1),
+                (KeyCode::Char('h'), _) | (KeyCode::Left, _) => self.move_column(-1),
-                (KeyCode::Char('l'), _) | (KeyCode::Right, _) => self.change_pane(1),
+                (KeyCode::Char('l'), _) | (KeyCode::Right, _) => self.move_column(1),
                 (KeyCode::Char('n'), KeyModifiers::CONTROL) => self.change_pane(1),
                 (KeyCode::Char('p'), KeyModifiers::CONTROL) => self.change_pane(-1),
                 (KeyCode::Enter, _) => self.toggle_current_item()?,
@@ -1085,24 +1085,136 @@ impl App {
     }
 
     fn move_selection(&mut self, delta: i32) {
-        let items_len = match self.state.current_pane {
+        let items = match self.state.current_pane {
-            0 => self.state.permanent_items.len(),
+            0 => &self.state.permanent_items,
-            1 => self.state.recurring_items.len(),
+            1 => &self.state.recurring_items,
-            2 => self.state.recent_items.len(),
+            2 => &self.state.recent_items,
             _ => return,
         };
 
-        if items_len == 0 {
+        if items.is_empty() {
             return;
         }
 
         let current = self.state.selected_indices[self.state.current_pane] as i32;
-        let new_index = (current + delta).rem_euclid(items_len as i32) as usize;
+        let items_len = items.len() as i32;
-        self.state.selected_indices[self.state.current_pane] = new_index;
+        
+        // Check if we're using two-column mode
+        let use_two_columns = self.config.multi_column && items.len() > 6;
+        
+        if use_two_columns {
+            let mid_point = (items.len() + 1) / 2;
+            let (col_start, col_end) = if self.state.current_column == 0 {
+                (0, mid_point as i32 - 1)
+            } else {
+                (mid_point as i32, items_len - 1)
+            };
+            
+            let new_index = current + delta;
+            
+            if new_index < col_start && delta < 0 {
+                // Moving up beyond column - go to previous pane
+                self.change_pane(-1);
+                let new_items = match self.state.current_pane {
+                    0 => &self.state.permanent_items,
+                    1 => &self.state.recurring_items,
+                    2 => &self.state.recent_items,
+                    _ => return,
+                };
+                if !new_items.is_empty() {
+                    self.state.selected_indices[self.state.current_pane] = new_items.len() - 1;
+                    // Stay in right column if new pane has enough items
+                    if self.config.multi_column && new_items.len() > 6 {
+                        self.state.current_column = 1;
+                    } else {
+                        self.state.current_column = 0;
+                    }
+                }
+            } else if new_index > col_end && delta > 0 {
+                // Moving down beyond column - go to next pane
+                self.change_pane(1);
+                self.state.selected_indices[self.state.current_pane] = 0;
+                self.state.current_column = 0;
+            } else {
+                // Normal movement within column
+                self.state.selected_indices[self.state.current_pane] = 
+                    new_index.clamp(col_start, col_end) as usize;
+            }
+        } else {
+            // Single column mode
+            let new_index = current + delta;
+            
+            if new_index < 0 && delta < 0 {
+                // At top, move to previous pane
+                self.change_pane(-1);
+                let new_items = match self.state.current_pane {
+                    0 => &self.state.permanent_items,
+                    1 => &self.state.recurring_items,
+                    2 => &self.state.recent_items,
+                    _ => return,
+                };
+                if !new_items.is_empty() {
+                    self.state.selected_indices[self.state.current_pane] = new_items.len() - 1;
+                }
+            } else if new_index >= items_len && delta > 0 {
+                // At bottom, move to next pane
+                self.change_pane(1);
+                self.state.selected_indices[self.state.current_pane] = 0;
+            } else {
+                // Normal movement within pane
+                self.state.selected_indices[self.state.current_pane] = 
+                    new_index.clamp(0, items_len - 1) as usize;
+            }
+        }
+    }
+    
+    fn move_column(&mut self, delta: i32) {
+        if !self.config.multi_column {
+            return;
+        }
+        
+        let items = match self.state.current_pane {
+            0 => &self.state.permanent_items,
+            1 => &self.state.recurring_items,
+            2 => &self.state.recent_items,
+            _ => return,
+        };
+        
+        // Only switch columns if we have enough items for two columns
+        if items.len() <= 6 {
+            return;
+        }
+        
+        let mid_point = (items.len() + 1) / 2;
+        let new_column = if delta > 0 { 1 } else { 0 };
+        
+        if new_column != self.state.current_column {
+            let current_selected = self.state.selected_indices[self.state.current_pane];
+            
+            // Calculate which row we're on in the current column
+            let current_row = if self.state.current_column == 0 {
+                current_selected  // In left column
+            } else {
+                current_selected.saturating_sub(mid_point)  // In right column
+            };
+            
+            // Switch column and jump to the same row in the new column
+            self.state.current_column = new_column;
+            
+            if new_column == 0 {
+                // Moving to left column - jump to same row
+                self.state.selected_indices[self.state.current_pane] = current_row.min(mid_point - 1);
+            } else {
+                // Moving to right column - jump to same row
+                let right_items_len = items.len() - mid_point;
+                self.state.selected_indices[self.state.current_pane] = (mid_point + current_row).min(items.len() - 1).min(mid_point + right_items_len - 1);
+            }
+        }
     }
     
     fn change_pane(&mut self, delta: i32) {
         self.state.current_pane = ((self.state.current_pane as i32 + delta).rem_euclid(3)) as usize;
+        self.state.current_column = 0;
     }
 
     fn get_current_item(&self) -> Option<TimeItem> {

src/config.rs

@@ -9,6 +9,8 @@ pub struct Config {
     pub projects: Vec<String>,
     #[serde(default = "default_strict_projects")]
     pub strict_projects: bool,
+    #[serde(default = "default_multi_column")]
+    pub multi_column: bool,
 }
 
 fn default_show_help_hint() -> bool {
@@ -19,12 +21,17 @@ fn default_strict_projects() -> bool {
     false
 }
 
+fn default_multi_column() -> bool {
+    true
+}
+
 impl Default for Config {
     fn default() -> Self {
         Self {
             show_help_hint: default_show_help_hint(),
             projects: Vec::new(),
             strict_projects: default_strict_projects(),
+            multi_column: default_multi_column(),
         }
     }
 }

src/state.rs

@@ -16,6 +16,8 @@ pub struct AppState {
     pub recent_items: Vec<TimeItem>,
     pub current_pane: usize,
     pub selected_indices: [usize; 3],
+    #[serde(default)]
+    pub current_column: usize,  // 0 = left, 1 = right
     pub active_timer: Option<(TimeItem, DateTime<Utc>)>,
 }
 
@@ -27,6 +29,7 @@ impl Default for AppState {
             recent_items: Vec::new(),
             current_pane: 0,
             selected_indices: [0; 3],
+            current_column: 0,
             active_timer: None,
         }
     }

src/ui.rs

@@ -2,17 +2,16 @@ use ratatui::{
     layout::{Alignment, Constraint, Direction, Layout, Rect},
     style::{Color, Modifier, Style},
     text::{Line, Span},
-    widgets::{Block, Borders, Clear, List, ListItem, Paragraph},
+    widgets::{Block, Borders, Clear, List, ListItem, Paragraph, Row, Table, TableState},
     Frame,
 };
 
 use crate::{
     app::{App, LogViewDayOrder, LogViewGrouping, LogViewPeriod, LogViewSelection, NewEntryMode, Screen},
-    state::{AppState, TimeItem},
+    state::TimeItem,
 };
 
 const ACTIVE_COLOR: Color = Color::Green;
-const INACTIVE_COLOR: Color = Color::Yellow;
 
 pub fn render(frame: &mut Frame, app: &App) {
     match app.current_screen {
@@ -83,7 +82,8 @@ fn render_main(frame: &mut Frame, app: &App) {
         &app.state.permanent_items,
         app.state.current_pane == 0,
         app.state.selected_indices[0],
-        &app.state,
+        app.state.current_column,
+        app.config.multi_column,
     );
 
     render_section(
@@ -93,7 +93,8 @@ fn render_main(frame: &mut Frame, app: &App) {
         &app.state.recurring_items,
         app.state.current_pane == 1,
         app.state.selected_indices[1],
-        &app.state,
+        app.state.current_column,
+        app.config.multi_column,
     );
 
     render_section(
@@ -103,7 +104,8 @@ fn render_main(frame: &mut Frame, app: &App) {
         &app.state.recent_items,
         app.state.current_pane == 2,
         app.state.selected_indices[2],
-        &app.state,
+        app.state.current_column,
+        app.config.multi_column,
     );
 
     // Render bottom bar if needed
@@ -252,9 +254,8 @@ fn render_help(frame: &mut Frame, app: &App) {
         "3. Ad-Hoc Items: One-off tasks and quick entries",
         "",
         "Navigation:",
-        "- j/k or ↑/↓: Move selection up/down",
+        "- j/k or ↑/↓: Move selection up/down (wraps between sections)",
-        "- h/l or ←/→: Switch between panes",
+        "- Ctrl+n/Ctrl+p: Switch between sections (Permanent/Recurring/Ad-Hoc)",
-        "- Ctrl+n/Ctrl+p: Switch between panes",
         "- Enter: Start/stop time tracking for selected item",
         "- n: Create a new task in the current section",
         "",
@@ -364,45 +365,131 @@ fn render_section(
     items: &[TimeItem],
     is_active: bool,
     selected: usize,
-    _state: &AppState,
+    current_column: usize,
+    multi_column: bool,
 ) {
-    let border_color = if is_active {
-        ACTIVE_COLOR
-    } else {
-        INACTIVE_COLOR
-    };
-
     let block = Block::default()
         .borders(Borders::ALL)
         .title(title)
-        .style(Style::default().fg(border_color));
+        .style(Style::default().fg(if is_active { ACTIVE_COLOR } else { Color::White }));
 
-    let items: Vec<ListItem> = items
+    // Check if we should use two-column layout
-        .iter()
+    let use_two_columns = multi_column && items.len() > 6;
-        .enumerate()
+
-        .map(|(i, item)| {
+    if use_two_columns {
-            let style = if i == selected && is_active {
+        // Split items into two halves
-                Style::default()
+        let mid_point = (items.len() + 1) / 2;
-                    .fg(border_color)
+        let left_items = &items[..mid_point];
-                    .add_modifier(Modifier::REVERSED)
+        let right_items = &items[mid_point..];
+
+        // Create inner area for columns
+        let inner_area = block.inner(area);
+        let columns = Layout::default()
+            .direction(Direction::Horizontal)
+            .constraints([Constraint::Percentage(50), Constraint::Percentage(50)])
+            .split(inner_area);
+
+        // Render the block first
+        frame.render_widget(block, area);
+
+        // Calculate which row to show (same for both columns)
+        let row_in_column = if current_column == 0 {
+            selected  // Left column: row = selected index
         } else {
-                Style::default()
+            selected.saturating_sub(mid_point)  // Right column: row = index - mid_point
         };
 
-            let line = if !item.tags.is_empty() {
+        // Left column
-                // Display as: tag [project]
+        let left_rows: Vec<Row> = left_items
+            .iter()
+            .map(|item| {
+                let display = if !item.tags.is_empty() {
                     format!("{} [{}]", item.tags.join(", "), item.name)
                 } else {
-                // No tags, just show project
                     item.name.clone()
                 };
-
+                Row::new(vec![display])
-            ListItem::new(Line::from(vec![Span::styled(line, style)]))
             })
             .collect();
 
-    let list = List::new(items).block(block);
+        let left_table = Table::new(left_rows)
-    frame.render_widget(list, area);
+            .widths(&[Constraint::Percentage(100)])
+            .highlight_style(if is_active && current_column == 0 {
+                Style::default()
+                    .fg(ACTIVE_COLOR)
+                    .add_modifier(Modifier::REVERSED)
+            } else {
+                Style::default()  // No highlight for inactive column
+            });
+
+        // Both columns use the same row offset for synchronized scrolling
+        let mut left_state = TableState::default();
+        if !left_items.is_empty() {
+            // Always select the same row to force scrolling, but only highlight if active
+            left_state.select(Some(row_in_column.min(left_items.len() - 1)));
+        }
+
+        // Right column
+        let right_rows: Vec<Row> = right_items
+            .iter()
+            .map(|item| {
+                let display = if !item.tags.is_empty() {
+                    format!("{} [{}]", item.tags.join(", "), item.name)
+                } else {
+                    item.name.clone()
+                };
+                Row::new(vec![display])
+            })
+            .collect();
+
+        let right_table = Table::new(right_rows)
+            .widths(&[Constraint::Percentage(100)])
+            .highlight_style(if is_active && current_column == 1 {
+                Style::default()
+                    .fg(ACTIVE_COLOR)
+                    .add_modifier(Modifier::REVERSED)
+            } else {
+                Style::default()  // No highlight for inactive column
+            });
+
+        let mut right_state = TableState::default();
+        if !right_items.is_empty() {
+            // Always select the same row to force scrolling, but only highlight if active
+            right_state.select(Some(row_in_column.min(right_items.len() - 1)));
+        }
+
+        frame.render_stateful_widget(left_table, columns[0], &mut left_state);
+        frame.render_stateful_widget(right_table, columns[1], &mut right_state);
+    } else {
+        // Single column mode
+        let rows: Vec<Row> = items
+            .iter()
+            .map(|item| {
+                let display = if !item.tags.is_empty() {
+                    format!("{} [{}]", item.tags.join(", "), item.name)
+                } else {
+                    item.name.clone()
+                };
+                Row::new(vec![display])
+            })
+            .collect();
+
+        let table = Table::new(rows)
+            .block(block)
+            .widths(&[Constraint::Percentage(100)])
+            .highlight_style(
+                Style::default()
+                    .fg(ACTIVE_COLOR)
+                    .add_modifier(Modifier::REVERSED),
+            );
+
+        let mut table_state = TableState::default();
+        if !items.is_empty() && is_active {
+            table_state.select(Some(selected.min(items.len() - 1)));
+        }
+
+        frame.render_stateful_widget(table, area, &mut table_state);
+    }
 }
 
 fn centered_rect(width: u16, height: u16, r: Rect) -> Rect {