Add Recordings section to the left panel

crates/re_log_types/src/time.rs

@@ -2,7 +2,7 @@ use std::ops::RangeInclusive;
 use time::OffsetDateTime;
 
 /// A date-time represented as nanoseconds since unix epoch
-#[derive(Copy, Clone, Default, PartialOrd, Ord, PartialEq, Eq, Hash)]
+#[derive(Copy, Clone, PartialOrd, Ord, PartialEq, Eq, Hash)]
 #[cfg_attr(feature = "serde", derive(serde::Deserialize, serde::Serialize))]
 pub struct Time(i64);
 

crates/re_ui/examples/re_ui_example.rs

@@ -246,7 +246,7 @@ impl eframe::App for ExampleApp {
             .show_animated(egui_ctx, self.right_panel, |ui| {
                 ui.set_clip_rect(ui.max_rect());
 
-                // first section - no scroll area, so a global Frame can be used.
+                // first section - no scroll area, so a single outer "panel_content" can be used.
                 self.re_ui.panel_content(ui, |re_ui, ui| {
                     re_ui.panel_title_bar(
                         ui,
@@ -262,7 +262,7 @@ impl eframe::App for ExampleApp {
                 });
 
                 // Second section. It's a list of `list_items`, so we need to remove the default
-                // spacing. Also, it uses a scroll area, so we must use several `Frame`s.
+                // spacing. Also, it uses a scroll area, so we must use several "panel_content".
                 ui.scope(|ui| {
                     ui.spacing_mut().item_spacing.y = 0.0;
 

crates/re_ui/src/command.rs

@@ -284,6 +284,14 @@ impl UICommand {
             Default::default()
         }
     }
+
+    pub fn tooltip_with_shortcut(self, egui_ctx: &egui::Context) -> String {
+        format!(
+            "{}{}",
+            self.tooltip(),
+            self.format_shortcut_tooltip_suffix(egui_ctx)
+        )
+    }
 }
 
 #[test]

crates/re_ui/src/lib.rs

@@ -512,7 +512,7 @@ impl ReUi {
                 ui.allocate_ui_with_layout(
                     ui.available_size(),
                     egui::Layout::right_to_left(egui::Align::Center),
-                    |ui| add_right_buttons(ui),
+                    add_right_buttons,
                 )
                 .inner
             },
@@ -723,7 +723,7 @@ impl ReUi {
             let image_rect = egui::Rect::from_min_size(
                 ui.painter().round_pos_to_pixels(egui::pos2(
                     rect.min.x.ceil(),
-                    ((rect.min.y + rect.max.y - Self::small_icon_size().y) * 0.5).ceil(),
+                    (rect.center().y - 0.5 * ReUi::small_icon_size().y).ceil(),
                 )),
                 Self::small_icon_size(),
             );

crates/re_ui/src/list_item.rs

@@ -1,8 +1,19 @@
 use crate::{Icon, ReUi};
-use egui::{NumExt, Response, Shape, Ui};
+use egui::{Align2, NumExt, Response, Shape, Ui};
 
 /// Generic widget for use in lists.
 ///
+/// Layout:
+/// ```text
+/// ┌───────────────────────────────────────────────────┐
+/// │┌──────┐                           ┌──────┐┌──────┐│
+/// ││      │                           │      ││      ││
+/// ││ icon │  label                    │ btns ││ btns ││
+/// ││      │                           │      ││      ││
+/// │└──────┘                           └──────┘└──────┘│
+/// └───────────────────────────────────────────────────┘
+/// ```
+///
 /// Features:
 /// - selectable
 /// - full span highlighting
@@ -83,6 +94,8 @@ impl<'a> ListItem<'a> {
     }
 
     /// Provide a closure to display on-hover buttons on the right of the item.
+    ///
+    /// Note that the a right to left layout is used, so the right-most button must be added first.
     pub fn with_buttons(
         mut self,
         buttons: impl FnOnce(&ReUi, &mut egui::Ui) -> egui::Response + 'a,
@@ -100,9 +113,8 @@ impl<'a> ListItem<'a> {
 impl egui::Widget for ListItem<'_> {
     fn ui(self, ui: &mut Ui) -> Response {
         let button_padding = ui.spacing().button_padding;
-        let icon_width_plus_padding = ReUi::small_icon_size().x + ReUi::text_to_icon_padding();
         let icon_extra = if self.icon_fn.is_some() {
-            icon_width_plus_padding
+            ReUi::small_icon_size().x + ReUi::text_to_icon_padding()
         } else {
             0.0
         };
@@ -114,7 +126,7 @@ impl egui::Widget for ListItem<'_> {
                 .clone()
                 .into_galley(ui, Some(false), wrap_width, egui::TextStyle::Button);
 
-        let desired_size = (padding_extra + text.size() + egui::vec2(icon_extra, 0.0))
+        let desired_size = (padding_extra + egui::vec2(icon_extra, 0.0) + text.size())
             .at_least(egui::vec2(ui.available_width(), ReUi::list_item_height()));
         let (rect, response) = ui.allocate_at_least(desired_size, egui::Sense::click());
 
@@ -138,22 +150,22 @@ impl egui::Widget for ListItem<'_> {
             bg_rect.extend_with_x(ui.clip_rect().left());
             let background_frame = ui.painter().add(egui::Shape::Noop);
 
-            let min_pos = ui.painter().round_pos_to_pixels(egui::pos2(
-                rect.min.x.ceil(),
-                ((rect.min.y + rect.max.y - ReUi::small_icon_size().y) * 0.5).ceil(),
-            ));
+            let leftmost_x_pos = rect.min.x.ceil();
 
             // Draw icon
             if let Some(icon_fn) = self.icon_fn {
-                let icon_rect = egui::Rect::from_min_size(min_pos, ReUi::small_icon_size());
+                let icon_pos = ui.painter().round_pos_to_pixels(egui::pos2(
+                    leftmost_x_pos,
+                    (rect.center().y - 0.5 * ReUi::small_icon_size().y).ceil(),
+                ));
+                let icon_rect = egui::Rect::from_min_size(icon_pos, ReUi::small_icon_size());
                 icon_fn(self.re_ui, ui, icon_rect, visuals);
             }
 
             // Draw text next to the icon.
             let mut text_rect = rect;
-            text_rect.min.x = min_pos.x + icon_extra;
-            let text_pos = ui
-                .layout()
+            text_rect.min.x = leftmost_x_pos + icon_extra;
+            let text_pos = Align2::LEFT_CENTER
                 .align_size_within_rect(text.size(), text_rect)
                 .min;
             text.paint_with_visuals(ui.painter(), text_pos, &visuals);

crates/re_viewer/src/app.rs

@@ -294,7 +294,11 @@ impl App {
             SystemCommand::LoadRrd(path) => {
                 let with_notification = true;
                 if let Some(rrd) = crate::loading::load_file_path(&path, with_notification) {
+                    let store_id = rrd.store_dbs().next().map(|db| db.store_id().clone());
                     store_hub.add_bundle(rrd);
+                    if let Some(store_id) = store_id {
+                        store_hub.set_recording_id(store_id);
+                    }
                 }
             }
             SystemCommand::ResetViewer => self.reset(store_hub, egui_ctx),

crates/re_viewer/src/app_state.rs

@@ -166,7 +166,7 @@ impl AppState {
                         ui.set_clip_rect(ui.max_rect());
 
                         // TODO(ab): this might be promoted higher in the hierarchy once list item are
-                        //  used in the blueprint panel section
+                        // used in the blueprint panel section.
                         ui.scope(|ui| {
                             ui.spacing_mut().item_spacing.y = 0.0;
                             recordings_panel_ui(&mut ctx, ui);

crates/re_viewer/src/ui/recordings_panel.rs

@@ -1,22 +1,17 @@
 use re_data_store::StoreDb;
-use re_log_types::Time;
 use re_viewer_context::{SystemCommand, SystemCommandSender, ViewerContext};
 use time::macros::format_description;
 
-#[cfg(not(target_arch = "wasm32"))]
-use re_ui::UICommandSender;
-
-/// Show the Recordings section of the left panel
+/// Show the currently open Recordings in a selectable list.
 pub fn recordings_panel_ui(ctx: &mut ViewerContext<'_>, ui: &mut egui::Ui) {
     ctx.re_ui.panel_content(ui, |re_ui, ui| {
         re_ui.panel_title_bar_with_buttons(
             ui,
             "Recordings",
             Some("These are the Recordings currently loaded in the Viewer"),
-            #[allow(unused_variables)]
-            |ui| {
+            |_ui| {
                 #[cfg(not(target_arch = "wasm32"))]
-                add_button_ui(ctx, ui);
+                add_button_ui(ctx, _ui);
             },
         );
     });
@@ -44,17 +39,17 @@ fn recording_list_ui(ctx: &mut ViewerContext<'_>, ui: &mut egui::Ui) {
         return;
     }
 
-    fn store_db_key(store_db: &StoreDb) -> (&str, Time) {
-        store_db.store_info().map_or(("", Time::default()), |info| {
-            (info.application_id.0.as_str(), info.started)
-        })
+    fn store_db_key(store_db: &StoreDb) -> impl Ord + '_ {
+        store_db
+            .store_info()
+            .map(|info| (info.application_id.0.as_str(), info.started))
     }
 
     store_dbs.sort_by_key(|store_db| store_db_key(store_db));
 
     let active_recording = store_context.recording.map(|rec| rec.store_id());
 
-    let desc = format_description!(version = 2, "[hour]:[minute]:[second]");
+    let desc = format_description!(version = 2, "[hour]:[minute]:[second]Z");
     for store_db in &store_dbs {
         let info = if let Some(store_info) = store_db.store_info() {
             format!(
@@ -93,10 +88,12 @@ fn recording_list_ui(ctx: &mut ViewerContext<'_>, ui: &mut egui::Ui) {
 
 #[cfg(not(target_arch = "wasm32"))]
 fn add_button_ui(ctx: &mut ViewerContext<'_>, ui: &mut egui::Ui) {
+    use re_ui::UICommandSender;
+
     if ctx
         .re_ui
         .small_icon_button(ui, &re_ui::icons::ADD)
-        .on_hover_text(re_ui::UICommand::Open.text_and_tooltip().1)
+        .on_hover_text(re_ui::UICommand::Open.tooltip_with_shortcut(ui.ctx()))
         .clicked()
     {
         ctx.command_sender.send_ui(re_ui::UICommand::Open);

crates/re_viewer/src/ui/rerun_menu.rs

@@ -10,7 +10,7 @@ use crate::App;
 impl App {
     pub fn rerun_menu_button_ui(
         &mut self,
-        #[allow(unused_variables)] store_context: Option<&StoreContext<'_>>,
+        _store_context: Option<&StoreContext<'_>>,
         ui: &mut egui::Ui,
         frame: &mut eframe::Frame,
     ) {
@@ -38,7 +38,7 @@ impl App {
             {
                 UICommand::Open.menu_button_ui(ui, &self.command_sender);
 
-                self.save_buttons_ui(ui, store_context);
+                self.save_buttons_ui(ui, _store_context);
 
                 ui.add_space(spacing);