Horizontal scroll for source, context and stack

dantleech · dantleech · commit df3e1c9312e3 · 2025-05-10T15:52:03.000+01:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,7 @@ CHANGELOG
 main
 ----
 
+- Horizontal scrolling
 - Improved property rendering
 - Introduced themes (including solarized and solarized dark)
 - Show value of variables on current line
diff --git a/README.md b/README.md
@@ -34,6 +34,10 @@ Prefix with number to repeat:
 - `J`     scroll down 10
 - `k`     scroll up
 - `K`     scroll up 10
+- `h`     scroll left
+- `H`     scroll left 10
+- `l`     scroll right
+- `L`     scroll right 10
 - `+`     increase context depth
 - `-`     decrease context depth
 - `tab`   switch pane
diff --git a/src/app.rs b/src/app.rs
@@ -344,22 +344,13 @@ impl App {
                 ).await?;
             },
             AppEvent::ScrollSource(amount) => {
-                self.session_view.source_scroll = Some(self
-                    .session_view
-                    .source_scroll.unwrap_or(0)
-                    .saturating_add(amount * self.take_motion() as i16));
+                self.session_view.source_scroll = apply_scroll(self.session_view.source_scroll, amount, self.take_motion() as i16);
             }
             AppEvent::ScrollContext(amount) => {
-                self.session_view.context_scroll = self
-                    .session_view
-                    .context_scroll
-                    .saturating_add_signed(amount * self.take_motion() as i16);
+                self.session_view.context_scroll = apply_scroll(self.session_view.context_scroll, amount, self.take_motion() as i16);
             }
             AppEvent::ScrollStack(amount) => {
-                self.session_view.stack_scroll = self
-                    .session_view
-                    .stack_scroll
-                    .saturating_add_signed(amount * self.take_motion() as i16);
+                self.session_view.stack_scroll = apply_scroll(self.session_view.stack_scroll, amount, self.take_motion() as i16);
             }
             AppEvent::ToggleFullscreen => {
                 self.session_view.full_screen = !self.session_view.full_screen;
@@ -522,3 +513,10 @@ impl App {
         self.theme.scheme()
     }
 }
+
+fn apply_scroll(scroll: (u16, u16), amount: (i16, i16), motion: i16) -> (u16, u16) {
+    (
+        (scroll.0 as i16).saturating_add(amount.0 * motion).max(0) as u16,
+        (scroll.1 as i16).saturating_add(amount.1 * motion).max(0) as u16,
+    )
+}
diff --git a/src/event/input.rs b/src/event/input.rs
@@ -14,6 +14,7 @@ use tokio::sync::mpsc::Sender;
 use crate::app::CurrentView;
 use crate::dbgp::client::ContinuationStatus;
 use crate::view::session::SessionViewMode;
+use crate::view::Scroll;
 
 #[derive(Debug)]
 pub enum AppEvent {
@@ -37,12 +38,11 @@ pub enum AppEvent {
     UpdateSourceContext(String, String, u32),
     UpdateStatus(ContinuationStatus),
     NextPane,
-    ScrollDown(i16),
-    ScrollUp(i16),
-    ScrollSource(i16),
-    ScrollContext(i16),
+    Scroll(Scroll),
+    ScrollSource(Scroll),
+    ScrollContext(Scroll),
+    ScrollStack(Scroll),
     ToggleFullscreen,
-    ScrollStack(i16),
     PushInputPlurality(char),
     ContextDepth(i8),
     NextTheme,
diff --git a/src/theme.rs b/src/theme.rs
@@ -30,7 +30,7 @@ impl Theme {
                 scheme.widget_mode_debug = scheme.widget_mode_debug.fg(Solarized::Base03.to_color()).bg(Solarized::Base3.to_color());
                 scheme.widget_mode_history = scheme.widget_mode_debug.bg(Solarized::Base3.to_color()).fg(Solarized::Red.to_color());
 
-                return scheme;
+                scheme
             }
             Theme::SolarizedDark => Scheme{
                 syntax_variable: Style::default().fg(Solarized::Base00.to_color()),
diff --git a/src/view/context.rs b/src/view/context.rs
@@ -8,16 +8,14 @@ use ratatui::layout::Rect;
 use ratatui::text::Line;
 use ratatui::text::Span;
 use ratatui::widgets::Paragraph;
-use ratatui::widgets::Wrap;
 use ratatui::Frame;
 
 pub struct ContextComponent {}
 
 impl View for ContextComponent {
     fn handle(_app: &App, event: AppEvent) -> Option<AppEvent> {
         match event {
-            AppEvent::ScrollDown(amount) => Some(AppEvent::ScrollContext(amount)),
-            AppEvent::ScrollUp(amount) => Some(AppEvent::ScrollContext(-amount)),
+            AppEvent::Scroll(scroll) => Some(AppEvent::ScrollContext(scroll)),
             _ => None,
         }
     }
@@ -31,9 +29,8 @@ impl View for ContextComponent {
         draw_properties(&app.theme(), &context.properties, &mut lines, 0);
 
         frame.render_widget(
-            Paragraph::new(lines)
-                .wrap(Wrap { trim: false })
-                .scroll((app.session_view.context_scroll, 0)),
+            Paragraph::new(lines).scroll(app.session_view.context_scroll),
+
             area,
         );
     }
diff --git a/src/view/help.rs b/src/view/help.rs
@@ -43,6 +43,10 @@ Key mappings (prefix with number to repeat):
 [J]     scroll down 10
 [k]     scroll up
 [K]     scroll up 10
+[h]     scroll left
+[H]     scroll left 10
+[l]     scroll right
+[L]     scroll right 10
 [+]     increase context depth
 [-]     decrease context depth
 [t]     rotate the theme
diff --git a/src/view/mod.rs b/src/view/mod.rs
@@ -29,3 +29,5 @@ pub struct Pane {
     pub component_type: ComponentType,
     pub constraint: Constraint,
 }
+
+pub type Scroll = (i16,i16);
diff --git a/src/view/session.rs b/src/view/session.rs
@@ -29,10 +29,14 @@ impl View for SessionView {
             KeyCode::Tab => return Some(AppEvent::NextPane),
             KeyCode::Enter => return Some(AppEvent::ToggleFullscreen),
             KeyCode::Char(char) => match char {
-                'j' => return Some(AppEvent::ScrollDown(1)),
-                'k' => return Some(AppEvent::ScrollUp(1)),
-                'J' => return Some(AppEvent::ScrollDown(10)),
-                'K' => return Some(AppEvent::ScrollUp(10)),
+                'j' => return Some(AppEvent::Scroll((1, 0))),
+                'k' => return Some(AppEvent::Scroll((-1, 0))),
+                'J' => return Some(AppEvent::Scroll((10, 0))),
+                'K' => return Some(AppEvent::Scroll((-10, 0))),
+                'l' => return Some(AppEvent::Scroll((0, 1))),
+                'L' => return Some(AppEvent::Scroll((0, 10))),
+                'h' => return Some(AppEvent::Scroll((0, -1))),
+                'H' => return Some(AppEvent::Scroll((0, -10))),
                 '0'..='9' => return Some(AppEvent::PushInputPlurality(char)),
                 _ => (),
             },
@@ -74,7 +78,13 @@ impl View for SessionView {
 
     fn draw(app: &App, frame: &mut Frame, area: ratatui::prelude::Rect) {
         if app.session_view.full_screen {
-            build_pane_widget(frame, app, app.session_view.current_pane(), area, app.session_view.current_pane);
+            build_pane_widget(
+                frame,
+                app,
+                app.session_view.current_pane(),
+                area,
+                app.session_view.current_pane,
+            );
             return;
         }
 
@@ -122,12 +132,10 @@ fn build_pane_widget(frame: &mut Frame, app: &App, pane: &Pane, area: Rect, inde
             ComponentType::Context => format!("Context({})", app.context_depth),
             ComponentType::Stack => "Stack".to_string(),
         })
-        .style(
-            match index == app.session_view.current_pane {
-                true => app.theme().pane_border_active,
-                false => app.theme().pane_border_inactive,
-            }
-        );
+        .style(match index == app.session_view.current_pane {
+            true => app.theme().pane_border_active,
+            false => app.theme().pane_border_inactive,
+        });
 
     frame.render_widget(&block, area);
 
@@ -146,9 +154,9 @@ fn build_pane_widget(frame: &mut Frame, app: &App, pane: &Pane, area: Rect, inde
 
 pub struct SessionViewState {
     pub full_screen: bool,
-    pub source_scroll: Option<i16>,
-    pub context_scroll: u16,
-    pub stack_scroll: u16,
+    pub source_scroll: (u16, u16),
+    pub context_scroll: (u16, u16),
+    pub stack_scroll: (u16, u16),
     pub mode: SessionViewMode,
     pub panes: Vec<Pane>,
     pub current_pane: usize,
@@ -164,9 +172,9 @@ impl SessionViewState {
     pub fn new() -> Self {
         Self {
             full_screen: false,
-            source_scroll: None,
-            context_scroll: 0,
-            stack_scroll: 0,
+            source_scroll: (0, 0),
+            context_scroll: (0, 0),
+            stack_scroll: (0, 0),
             current_pane: 0,
             mode: SessionViewMode::Current,
             panes: vec![
@@ -196,8 +204,9 @@ impl SessionViewState {
     }
 
     pub(crate) fn reset(&mut self) {
-        self.context_scroll = 0;
-        self.source_scroll = None;
+        self.context_scroll = (0, 0);
+        self.stack_scroll = (0, 0);
+        self.source_scroll = (0, 0);
     }
 }
 
diff --git a/src/view/source.rs b/src/view/source.rs
@@ -17,8 +17,7 @@ pub struct SourceComponent {}
 impl View for SourceComponent {
     fn handle(_: &App, event: AppEvent) -> Option<AppEvent> {
         match event {
-            AppEvent::ScrollDown(amount) => Some(AppEvent::ScrollSource(amount)),
-            AppEvent::ScrollUp(amount) => Some(AppEvent::ScrollSource(-amount)),
+            AppEvent::Scroll(amount) => Some(AppEvent::ScrollSource(amount)),
             _ => None,
         }
     }
@@ -86,17 +85,17 @@ impl View for SourceComponent {
             let center = (history_entry.source.line_no as u16)
                 .saturating_sub(area.height.div_ceil(2)) as i16;
             center
-                .saturating_add(app.session_view.source_scroll.unwrap_or(0))
+                .saturating_add(app.session_view.source_scroll.0 as i16)
                 .max(0) as u16
         } else {
-            app.session_view.source_scroll.unwrap_or(0).max(0) as u16
+            app.session_view.source_scroll.0
         };
 
-        frame.render_widget(Paragraph::new(lines.clone()).scroll((scroll, 0)), rows[0]);
+        frame.render_widget(Paragraph::new(lines.clone()).scroll((scroll, app.session_view.source_scroll.1)), rows[0]);
 
         for (line_no, line_length, line) in annotations {
             let position = Position {
-                x: line_length as u16,
+                x: (line_length as u16).saturating_sub(app.session_view.source_scroll.1),
                 y: (line_no as u32).saturating_sub(scroll as u32) as u16 + 1,
             };
             if !rows[0].contains(position) {
@@ -137,7 +136,7 @@ fn render_label(property: &Property) -> Option<String> {
         PropertyType::Float => property.value.clone().unwrap_or("".to_string()),
         PropertyType::String => format!("\"{}\"", property.value.clone().unwrap_or("".to_string())),
         PropertyType::Null => String::from("null"),
-        PropertyType::Resource => String::from(property.value.clone().unwrap_or("".to_string())),
+        PropertyType::Resource => property.value.clone().unwrap_or("".to_string()),
         PropertyType::Undefined => String::from("undefined"),
     })
 }
diff --git a/src/view/stack.rs b/src/view/stack.rs
@@ -12,8 +12,7 @@ pub struct StackComponent {}
 impl View for StackComponent {
     fn handle(_: &App, event: AppEvent) -> Option<AppEvent> {
         match event {
-            AppEvent::ScrollDown(amount) => Some(AppEvent::ScrollStack(amount)),
-            AppEvent::ScrollUp(amount) => Some(AppEvent::ScrollStack(-amount)),
+            AppEvent::Scroll(amount) => Some(AppEvent::ScrollStack(amount)),
             _ => None,
         }
     }
@@ -43,7 +42,7 @@ impl View for StackComponent {
                     Alignment::Right
                 })
                 .style(app.theme.scheme().stack_line)
-                .scroll((app.session_view.stack_scroll, 0)),
+                .scroll(app.session_view.stack_scroll),
             area,
         );
     }

Original file line number	Diff line number	Diff line change
`@@ -30,7 +30,7 @@ impl Theme {`
`30`	`30`	`scheme.widget_mode_debug = scheme.widget_mode_debug.fg(Solarized::Base03.to_color()).bg(Solarized::Base3.to_color());`
`31`	`31`	`scheme.widget_mode_history = scheme.widget_mode_debug.bg(Solarized::Base3.to_color()).fg(Solarized::Red.to_color());`
`32`	`32`
`33`		`- return scheme;`
	`33`	`+ scheme`
`34`	`34`	`}`
`35`	`35`	`Theme::SolarizedDark => Scheme{`
`36`	`36`	`syntax_variable: Style::default().fg(Solarized::Base00.to_color()),`
Original file line number	Diff line number	Diff line change
`@@ -29,3 +29,5 @@ pub struct Pane {`
`29`	`29`	`pub component_type: ComponentType,`
`30`	`30`	`pub constraint: Constraint,`
`31`	`31`	`}`
	`32`	`+`
	`33`	`+pub type Scroll = (i16,i16);`