Vx browse supports rendering visual segment map of the file (#3195)

Renders 2d grid based on column names from struct layout

https://github.com/user-attachments/assets/b84797d0-9e7a-4e08-924e-13e794b236b4

Author: robert3005

Cargo.lock

@@ -155,6 +155,7 @@ simplelog = "0.12"
 sketches-ddsketch = "0.3.0"
 static_assertions = "1.1"
 tabled = { version = "0.19.0", default-features = false }
+taffy = "0.8.0"
 tar = "0.4"
 tempfile = "3"
 thiserror = "2.0.3"

Cargo.toml

@@ -15,14 +15,14 @@ version = { workspace = true }
 
 [dependencies]
 anyhow = { workspace = true }
-async-trait = { workspace = true }
 clap = { workspace = true, features = ["derive"] }
 crossterm = { workspace = true }
 futures-util = { workspace = true }
 humansize = { workspace = true }
 indicatif = { workspace = true, features = ["futures"] }
 parquet = { workspace = true, features = ["arrow", "async"] }
 ratatui = { workspace = true }
+taffy = { workspace = true }
 tokio = { workspace = true, features = ["rt-multi-thread"] }
 vortex = { workspace = true, features = ["tokio", "parquet"] }
 vortex-layout = { workspace = true }

vortex-tui/Cargo.toml

@@ -1,6 +1,7 @@
 use std::path::Path;
 use std::sync::Arc;
 
+use ratatui::prelude::Size;
 use ratatui::widgets::ListState;
 use vortex::dtype::DType;
 use vortex::error::{VortexExpect, VortexResult, VortexUnwrap, vortex_panic};
@@ -20,13 +21,16 @@ use vortex_layout::{
     STATS_LAYOUT_ID, STRUCT_LAYOUT_ID,
 };
 
+use crate::browse::ui::SegmentGridState;
+
 #[derive(Default, Copy, Clone, Eq, PartialEq)]
 pub enum Tab {
     /// The layout tree browser.
     #[default]
     Layout,
-    /// The encoding tree viewer
-    Encodings,
+
+    /// Show a segment map of the file
+    Segments,
     // TODO(aduffy): SQL query page powered by DF
     // Query,
 }
@@ -207,7 +211,7 @@ pub enum KeyMode {
 /// State saved across all Tabs.
 ///
 /// Holding them all allows us to switch between tabs without resetting view state.
-pub struct AppState {
+pub struct AppState<'a> {
     pub key_mode: KeyMode,
     pub search_filter: String,
     pub filter: Option<Vec<bool>>,
@@ -218,17 +222,19 @@ pub struct AppState {
 
     /// List state for the Layouts view
     pub layouts_list_state: ListState,
+    pub segment_grid_state: SegmentGridState<'a>,
+    pub frame_size: Size,
 }
 
-impl AppState {
+impl AppState<'_> {
     pub fn clear_search(&mut self) {
         self.search_filter.clear();
         self.filter.take();
     }
 }
 
 /// Create an app backed from a file path.
-pub async fn create_file_app(path: impl AsRef<Path>) -> VortexResult<AppState> {
+pub async fn create_file_app<'a>(path: impl AsRef<Path>) -> VortexResult<AppState<'a>> {
     let vxf = VortexOpenOptions::file().open(path).await?;
 
     let cursor = LayoutCursor::new(vxf.footer().clone());
@@ -241,6 +247,8 @@ pub async fn create_file_app(path: impl AsRef<Path>) -> VortexResult<AppState> {
         filter: None,
         current_tab: Tab::default(),
         layouts_list_state: ListState::default().with_selected(Some(0)),
+        segment_grid_state: SegmentGridState::default(),
+        frame_size: Size::new(0, 0),
     })
 }
 

vortex-tui/src/browse/app.rs

@@ -48,42 +48,46 @@ fn handle_normal_mode(app: &mut AppState, event: Event) -> HandleResult {
                 (KeyCode::Tab, _) => {
                     // toggle between tabs
                     app.current_tab = match app.current_tab {
-                        Tab::Layout => Tab::Encodings,
-                        Tab::Encodings => Tab::Layout,
+                        Tab::Layout => Tab::Segments,
+                        Tab::Segments => Tab::Layout,
                     };
                 }
                 (KeyCode::Up | KeyCode::Char('k'), _)
                 | (KeyCode::Char('p'), KeyModifiers::CONTROL) => {
                     // We send the key-up to the list state if we're looking at
                     // the Layouts tab.
-                    if app.current_tab == Tab::Layout {
-                        app.layouts_list_state.scroll_up_by(1);
+                    match app.current_tab {
+                        Tab::Layout => app.layouts_list_state.select_previous(),
+                        Tab::Segments => app.segment_grid_state.scroll_up(10),
                     }
                 }
                 (KeyCode::Down | KeyCode::Char('j'), _)
-                | (KeyCode::Char('n'), KeyModifiers::CONTROL) => {
-                    if app.current_tab == Tab::Layout {
-                        app.layouts_list_state.scroll_down_by(1);
-                    }
-                }
+                | (KeyCode::Char('n'), KeyModifiers::CONTROL) => match app.current_tab {
+                    Tab::Layout => app.layouts_list_state.select_next(),
+                    Tab::Segments => app.segment_grid_state.scroll_down(10),
+                },
                 (KeyCode::PageUp, _) | (KeyCode::Char('v'), KeyModifiers::ALT) => {
-                    if app.current_tab == Tab::Layout {
-                        app.layouts_list_state.scroll_up_by(10);
+                    match app.current_tab {
+                        Tab::Layout => app.layouts_list_state.scroll_up_by(10),
+                        Tab::Segments => app.segment_grid_state.scroll_up(100),
                     }
                 }
                 (KeyCode::PageDown, _) | (KeyCode::Char('v'), KeyModifiers::CONTROL) => {
-                    if app.current_tab == Tab::Layout {
-                        app.layouts_list_state.scroll_down_by(10);
+                    match app.current_tab {
+                        Tab::Layout => app.layouts_list_state.scroll_down_by(10),
+                        Tab::Segments => app.segment_grid_state.scroll_down(100),
                     }
                 }
                 (KeyCode::Home, _) | (KeyCode::Char('<'), KeyModifiers::ALT) => {
-                    if app.current_tab == Tab::Layout {
-                        app.layouts_list_state.select_first();
+                    match app.current_tab {
+                        Tab::Layout => app.layouts_list_state.select_first(),
+                        Tab::Segments => app.segment_grid_state.scroll_left(200),
                     }
                 }
                 (KeyCode::End, _) | (KeyCode::Char('>'), KeyModifiers::ALT) => {
-                    if app.current_tab == Tab::Layout {
-                        app.layouts_list_state.select_last();
+                    match app.current_tab {
+                        Tab::Layout => app.layouts_list_state.select_last(),
+                        Tab::Segments => app.segment_grid_state.scroll_right(200),
                     }
                 }
                 (KeyCode::Enter, _) => {
@@ -98,13 +102,21 @@ fn handle_normal_mode(app: &mut AppState, event: Event) -> HandleResult {
                 }
                 (KeyCode::Left | KeyCode::Char('h'), _)
                 | (KeyCode::Char('b'), KeyModifiers::CONTROL) => {
-                    if app.current_tab == Tab::Layout {
-                        // Ascend back up to the Parent node
-                        app.cursor = app.cursor.parent();
-                        // Reset the list scroll state.
-                        app.layouts_list_state = ListState::default().with_selected(Some(0));
+                    match app.current_tab {
+                        Tab::Layout => {
+                            // Ascend back up to the Parent node
+                            app.cursor = app.cursor.parent();
+                            // Reset the list scroll state.
+                            app.layouts_list_state = ListState::default().with_selected(Some(0));
+                        }
+                        Tab::Segments => app.segment_grid_state.scroll_left(20),
                     }
                 }
+                (KeyCode::Right | KeyCode::Char('l'), _)
+                | (KeyCode::Char('b'), KeyModifiers::ALT) => match app.current_tab {
+                    Tab::Layout => {}
+                    Tab::Segments => app.segment_grid_state.scroll_right(20),
+                },
 
                 (KeyCode::Char('/'), _) | (KeyCode::Char('s'), KeyModifiers::CONTROL) => {
                     app.key_mode = KeyMode::Search;

vortex-tui/src/browse/mod.rs

@@ -1,12 +1,13 @@
-mod encodings;
 mod layouts;
+mod segments;
 
-use encodings::encodings_ui;
 use layouts::render_layouts;
 use ratatui::prelude::*;
 use ratatui::widgets::{Block, BorderType, Borders, Tabs};
+pub use segments::SegmentGridState;
 
 use super::app::{AppState, KeyMode, Tab};
+use crate::browse::ui::segments::segments_ui;
 
 pub fn render_app(app: &mut AppState, frame: &mut Frame) {
     // Render the outer tab view, then render the inner frame view.
@@ -26,7 +27,7 @@ pub fn render_app(app: &mut AppState, frame: &mut Frame) {
         .borders(Borders::ALL)
         .border_type(BorderType::Rounded)
         .border_style(Style::default().magenta())
-        .title_top("vx-browse")
+        .title_top("Vortex Browser")
         .title_bottom(bottom_text)
         .title_alignment(Alignment::Center);
 
@@ -47,12 +48,12 @@ pub fn render_app(app: &mut AppState, frame: &mut Frame) {
     // Display a tab indicator.
     let selected_tab = match app.current_tab {
         Tab::Layout => 0,
-        Tab::Encodings => 1,
+        Tab::Segments => 1,
     };
 
     let tabs = Tabs::new([
         "File Layout",
-        "Arrays",
+        "Segments",
         // TODO(aduffy): add SQL query interface
         // "Query",
     ])
@@ -67,8 +68,6 @@ pub fn render_app(app: &mut AppState, frame: &mut Frame) {
         Tab::Layout => {
             render_layouts(app, app_view, frame.buffer_mut());
         }
-        Tab::Encodings => {
-            frame.render_widget(encodings_ui(app), app_view);
-        }
+        Tab::Segments => segments_ui(app, app_view, frame.buffer_mut()),
     }
 }