@perspective-dev/viewer 5.3.1 → 5.5.0

package/src/rust/tasks/sync_update_panels.rs

@@ -26,6 +26,9 @@ use crate::*;
 extern "C" {
     #[wasm_bindgen(typescript_type = "ViewerConfigUpdate")]
     pub type JsViewerConfigUpdate;
+
+    #[wasm_bindgen(typescript_type = "WorkspaceConfigUpdate")]
+    pub type JsWorkspaceConfigUpdate;
 }
 
 pub type SyncUpdatePanelsResult = (
@@ -33,12 +36,12 @@ pub type SyncUpdatePanelsResult = (
     std::vec::Vec<perspective_js::utils::ApiFuture<()>>,
 );
 
-/// Update the panel state to match a `WorkspaceConfigUpdate`.
-///
-/// This method must be synchronous.
+/// Synchronously apply a `WorkspaceConfigUpdate` to the element's models
+/// field-wise, replacing the panel set only when `panels` is present, and
+/// return the fresh panels to restore plus the eject tasks.
 pub fn sync_update_panels(
     this: &PerspectiveViewerElement,
-    update: JsViewerConfigUpdate,
+    update: JsWorkspaceConfigUpdate,
 ) -> ApiResult<SyncUpdatePanelsResult> {
     let WorkspaceConfigUpdate {
         active,
@@ -49,98 +52,175 @@ pub fn sync_update_panels(
         palette,
     } = update.into_serde_ext()?;
 
-    let palette = validate_palette(palette.unwrap_or_default())
-        .map_err(|e| ApiError::from(JsValue::from_str(&e)))?;
+    let palette = match palette {
+        OptionalUpdate::Missing => None,
+        OptionalUpdate::SetDefault => Some(Default::default()),
+        OptionalUpdate::Update(palette) => {
+            Some(validate_palette(palette).map_err(|e| ApiError::from(JsValue::from_str(&e)))?)
+        },
+    };
+
     let old_ids = this.workspace.panel_ids();
+    let replace = panels.is_some();
 
     // Phase 1 — models only, NO renders and NO draws
     let mut id_map: HashMap<String, String> = Default::default();
-    let mut fallback_fresh: Option<String> = None;
-    let mut active_fresh: Option<String> = None;
     let mut contents = Vec::new();
-    // `panels` entries are `ViewerConfigInitial`s — `table` required by
-    // TYPE (a placed panel without a binding would be permanently blank),
-    // and no per-panel `settings` exists (element-level; carried by the
-    // top-level `active` field). An EMPTY `panels` map restores to the
-    // zero-panel empty stage — the former table-less fallback panel was
-    // exactly the blank-panel state this type exists to preclude.
-    for (saved_id, config) in panels {
-        let (fresh, session, renderer, config) = create_panel_model(
-            &this.elem,
-            &this.presentation,
-            &this.workspace,
-            None,
-            config.into(),
-            None,
-            Placement::Placed,
-        );
-
-        if active.as_deref() == Some(saved_id.as_str()) {
-            active_fresh = Some(fresh.as_str().to_owned());
-        }
-
-        fallback_fresh.get_or_insert_with(|| fresh.as_str().to_owned());
-        id_map.insert(saved_id, fresh.as_str().to_owned());
-        contents.push((fresh, session, renderer, config));
-    }
-
     let mut eject_tasks = Vec::new();
-    if let Some(panel) = this.workspace.take_reserved() {
-        eject_tasks.push(eject_panel(panel));
+    match panels {
+        // `panels` entries are `ViewerConfigInitial`s — `table` required by
+        // TYPE (a placed panel without a binding would be permanently blank),
+        // and no per-panel `settings` exists (element-level; carried by the
+        // top-level `active` field). An EMPTY `panels` map restores to the
+        // zero-panel empty stage — the former table-less fallback panel was
+        // exactly the blank-panel state this type exists to preclude.
+        Some(panels) => {
+            for (saved_id, config) in panels {
+                let (fresh, session, renderer, config) = create_panel_model(
+                    &this.elem,
+                    &this.presentation,
+                    &this.workspace,
+                    None,
+                    config.into(),
+                    None,
+                    Placement::Placed,
+                );
+
+                id_map.insert(saved_id, fresh.as_str().to_owned());
+                contents.push((fresh, session, renderer, config));
+            }
+
+            if let Some(panel) = this.workspace.take_reserved() {
+                eject_tasks.push(eject_panel(panel));
+            }
+
+            for old in &old_ids {
+                if let Some(panel) = this.workspace.remove_panel(old) {
+                    eject_tasks.push(eject_panel(panel));
+                }
+            }
+        },
+        None => {
+            for id in &old_ids {
+                id_map.insert(id.as_str().to_owned(), id.as_str().to_owned());
+            }
+        },
     }
 
-    for old in old_ids {
-        if let Some(panel) = this.workspace.remove_panel(&old) {
-            eject_tasks.push(eject_panel(panel));
-        }
+    if let Some(palette) = palette {
+        this.presentation.set_palette(palette)?;
     }
 
-    this.presentation.set_palette(palette)?;
-
     // Phase 2 — stage the remapped layout tree on the Workspace
+    let layout_staged = layout.is_some();
     if let Some(layout) = layout {
         this.workspace
             .set_pending_layout(layout.remap(&|name| id_map.get(name).cloned()));
+        if !replace {
+            this.workspace.layout_staged().emit(());
+        }
     }
 
     // Phase 3 — the single visible commit
-    if let Some(saved) = &active
-        && active_fresh.is_none()
-    {
-        tracing::warn!("`active` names unknown panel \"{saved}\"");
-    }
-
-    let sidebar_open = active_fresh.is_some();
-    if let Some(target) = active_fresh.or(fallback_fresh)
+    let active_target = match &active {
+        OptionalUpdate::Update(saved) => {
+            let target = id_map.get(saved).cloned();
+            if target.is_none() {
+                tracing::warn!("`active` names unknown panel \"{saved}\"");
+            }
+
+            target
+        },
+        _ => None,
+    };
+
+    let commit_target = if replace {
+        active_target
+            .clone()
+            .or_else(|| contents.first().map(|(id, ..)| id.as_str().to_owned()))
+    } else if layout_staged || active_target.is_some() {
+        active_target
+            .clone()
+            .or_else(|| this.workspace.active_id().map(|id| id.as_str().to_owned()))
+    } else {
+        None
+    };
+
+    if let Some(target) = commit_target
         && let Some(app) = this.root.borrow().as_ref()
     {
         app.send_message(PerspectiveViewerMsg::CommitWorkspaceRestore(target));
     }
 
-    if let Some(app) = this.root.borrow().as_ref() {
+    let settings = if replace {
+        Some(active_target.is_some())
+    } else {
+        match active {
+            OptionalUpdate::Update(_) => active_target.as_ref().map(|_| true),
+            OptionalUpdate::SetDefault => Some(false),
+            OptionalUpdate::Missing => None,
+        }
+    };
+
+    if let Some(open) = settings
+        && let Some(app) = this.root.borrow().as_ref()
+    {
         // Silent (`announce: false`): each restored panel's own view-config
         // commit dispatch announces the config, settings field included.
         app.send_message(PerspectiveViewerMsg::ToggleSettingsInit(
-            Some(SettingsUpdate::Update(sidebar_open)),
+            Some(SettingsUpdate::Update(open)),
             false,
             None,
         ));
     }
 
-    let masters = masters
-        .unwrap_or_default()
-        .into_iter()
-        .filter_map(|saved| match id_map.get(&saved) {
-            Some(fresh) => Some(PanelId::from(fresh.as_str())),
-            None => {
-                tracing::warn!("`masters` names unknown panel \"{saved}\"");
-                None
-            },
-        })
-        .collect::<Vec<_>>();
-
-    this.workspace.set_masters(masters);
-    this.workspace
-        .set_global_filters(global_filters.unwrap_or_default());
+    let masters = match masters {
+        OptionalUpdate::Missing => None,
+        OptionalUpdate::SetDefault => Some(Vec::new()),
+        OptionalUpdate::Update(masters) => Some(
+            masters
+                .into_iter()
+                .filter_map(|saved| match id_map.get(&saved) {
+                    Some(fresh) => Some(PanelId::from(fresh.as_str())),
+                    None => {
+                        tracing::warn!("`masters` names unknown panel \"{saved}\"");
+                        None
+                    },
+                })
+                .collect::<Vec<_>>(),
+        ),
+    };
+
+    if let Some(masters) = masters {
+        let before = this.workspace.masters();
+        this.workspace.set_masters(masters);
+        if !replace {
+            let after = this.workspace.masters();
+            for id in &old_ids {
+                let is_master = after.contains(id);
+                if before.contains(id) != is_master
+                    && let Some(panel) = this.workspace.panel(id)
+                {
+                    let mode = if is_master {
+                        "SELECT_ROW_TREE"
+                    } else {
+                        "READ_ONLY"
+                    };
+
+                    set_edit_mode(&panel.session, &panel.renderer, mode);
+                    if !is_master {
+                        this.workspace.clear_contribution(id);
+                    }
+                }
+            }
+        }
+    }
+
+    match global_filters {
+        OptionalUpdate::Missing => {},
+        OptionalUpdate::SetDefault => this.workspace.set_global_filters(Vec::new()),
+        OptionalUpdate::Update(filters) => this.workspace.set_global_filters(filters),
+    }
+
     Ok((contents, eject_tasks))
 }

package/src/rust/tasks/table_lifecycle.rs

@@ -150,7 +150,13 @@ async fn bind_pending(
                     return Ok(());
                 };
 
-                super::restore_panel::bind_table_task(&session, &workspace, name).await
+                super::restore_panel::bind_table_task(
+                    &session,
+                    &workspace,
+                    name,
+                    crate::session::MissingTable::Pend,
+                )
+                .await
             }
         },
     )

package/src/rust/{components → ui}/containers/control_group.rs

@@ -12,7 +12,12 @@
 
 use wasm_bindgen::JsCast;
 use web_sys::{Event, MouseEvent};
-use yew::{Callback, Html, Properties, function_component, html, use_callback, use_mut_ref};
+use yew::{
+    Callback, Html, Properties, function_component, html, use_callback, use_effect_with,
+    use_mut_ref, use_node_ref,
+};
+
+use crate::ui::form::intl_label::IntlLabel;
 
 #[derive(Properties, PartialEq)]
 pub struct ControlGroupProps {
@@ -78,12 +83,29 @@ pub fn ControlGroup(props: &ControlGroupProps) -> Html {
         }
     });
 
+    let details_ref = use_node_ref();
+    {
+        let details_ref = details_ref.clone();
+        use_effect_with(
+            (props.group_key.clone(), props.on_toggle.clone()),
+            move |(group_key, on_toggle)| {
+                let group_key = group_key.clone();
+                let on_toggle = on_toggle.clone();
+                move || {
+                    if let Some(el) = details_ref.cast::<web_sys::Element>() {
+                        on_toggle.emit((group_key, el.has_attribute("open")));
+                    }
+                }
+            },
+        );
+    }
+
     let open = *use_mut_ref(|| props.open).borrow();
     html! {
-        <details class="control-group" {open} {ontoggle}>
+        <details ref={details_ref} class="control-group" {open} {ontoggle}>
             <summary {onclick}>
                 <span class="control-group-chevron shift-alt-icon" />
-                <label id={format!("{}-group-label", props.group_key)} />
+                <IntlLabel name={props.group_key.clone()} group=true />
             </summary>
             { props.children.clone() }
         </details>

package/src/rust/{components → ui}/containers/dropdown_menu.rs

@@ -27,6 +27,7 @@ where
     pub callback: Callback<T>,
 }
 
+/// A clickable item list, optionally grouped (`DropDownMenuItem::OptGroup`).
 pub struct DropDownMenu<T>
 where
     T: Into<Html> + Clone + PartialEq + 'static,
@@ -64,7 +65,9 @@ where
                         });
 
                         html! {
-                            <span onmousedown={click} class="selected">{ x.clone().into() }</span>
+                            <span onmousedown={click} class="dropdown-menu-item">
+                                { x.clone().into() }
+                            </span>
                         }
                     },
                     DropDownMenuItem::OptGroup(name, xs) => {
@@ -78,7 +81,7 @@ where
                                         move |_: MouseEvent| value.clone()
                                     });
                                     html! {
-                                        <span onmousedown={ click }>
+                                        <span onmousedown={ click } class="dropdown-menu-item">
                                             { x.clone().into() }
                                         </span>
                                     }

package/src/rust/{components → ui}/containers/mod.rs

@@ -10,11 +10,7 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
-//! `containers` are generic container-like components for collections of other
-//! `Component` types.
-
 pub mod control_group;
-pub mod dragdrop_list;
 pub mod dropdown_menu;
 pub mod scroll_panel;
 pub mod scroll_panel_item;

package/src/rust/{components → ui}/containers/scroll_panel.rs

@@ -10,9 +10,6 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
-// Forked from https://github.com/AircastDev/yew-virtual-scroller (Apache 2.0)
-// Adds support for Yew 0.19, auto-width and a simplified message structure.
-
 use std::ops::Range;
 use std::rc::Rc;
 
@@ -67,8 +64,6 @@ pub struct ScrollPanelProps {
 }
 
 impl ScrollPanelProps {
-    /// Calculate the total virtual height of this scroll panel from the `size`
-    /// prop of its children.
     fn total_height(&self) -> f64 {
         self.children
             .iter()
@@ -148,8 +143,6 @@ impl Component for ScrollPanel {
                 self.calculate_window_content(ctx)
             },
 
-            // TODO don't hardcode pixel offsets - fix the CSS container to not
-            // require pixel offsets to work.
             ScrollPanelMsg::UpdateViewportDimensions => {
                 let viewport = self.viewport_elem(ctx);
                 let rect = viewport.get_bounding_client_rect();
@@ -174,9 +167,6 @@ impl Component for ScrollPanel {
         }
     }
 
-    /// If the new total row height is different than last time this component
-    /// was rendered, we need to double-render to read the container's
-    /// potentially updated height.
     fn changed(&mut self, ctx: &Context<Self>, _old: &Self::Properties) -> bool {
         let total_height = ctx.props().total_height();
         self.needs_rerender =
@@ -213,8 +203,6 @@ impl Component for ScrollPanel {
                 ]
             });
 
-            // TODO This glitches - we should use the `sticky` positioning strategy that
-            // `regular-table` uses.
             html! {
                 <div
                     ref={self.viewport(ctx)}
@@ -306,16 +294,6 @@ impl ScrollPanel {
             .map(|x| x.0)
             .unwrap_or_default();
 
-        // Why is this `end_node + 2`, I can see you asking yourself? `end_node` is the
-        // index of the last visible child, but [`Range`] is an open interval so we must
-        // increment by 1. The next rendered element is always occluded by the parent
-        // container, it may seem unnecessary to render it, however not doing so causing
-        // scroll glitching in Chrome:
-        // * When the first pixel of the `end_node + 1` child is scrolled into view, the
-        //   container element it is embedded in will expand past the end of the scroll
-        //   container.
-        // * Chrome detects this and helpfully scrolls this new element into view,
-        //   re-triggering the on scroll callback.
         let visible_range = start_node..ctx.props().children.len().min(end_node + 2);
         let content_window = Some(ContentWindow {
             scroll_top,

package/src/rust/{components → ui}/containers/scroll_panel_item.rs

@@ -10,9 +10,6 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
-// Forked from https://github.com/AircastDev/yew-virtual-scroller (Apache 2.0)
-// Adds support for Yew 0.19, auto-width and a simplified message structure.
-
 use std::cell::Cell;
 use std::rc::Rc;
 
@@ -22,21 +19,11 @@ use yew::prelude::*;
 pub struct ScrollPanelItemProps {
     pub children: Children,
 
-    /// The expected size of this component in pixels. Calculating this value
-    /// ahead of time makes it easier to implement a high-performance virtual
-    /// renderer without resorting to weird tricks, _but_ checking that this
-    /// hint is correct is nearly as expensive. So, we only generate the
-    /// validation code in debug builds.
     pub size_hint: f64,
 
-    /// Should we measure the child sizes or just rely on the hint? This
-    /// option may be enabled during debugging to validation render optimization
-    /// via [`Self::size_hint`], but will faile tests due to the extra DOM
-    /// structure it emits.
     #[prop_or_default]
     pub is_debug_mode: bool,
 
-    /// Communicate the panel size to virtual parent
     #[prop_or_default]
     measured_size: Rc<Cell<Option<f64>>>,
 }

package/src/rust/{components → ui}/containers/select.rs

@@ -88,10 +88,6 @@ where
                 true
             },
 
-            // All the up and down arrow keys to instantly select, which is
-            // useful for keyboard warrios. This is not ada without the shift
-            // key. I'm not sure if it is _with_ the shift key either, but its
-            // cool.
             SelectMsg::KeyboardInput(is_shift, idx, code) => {
                 if is_shift {
                     if code.as_str() == "ArrowUp" {
@@ -114,13 +110,11 @@ where
         }
     }
 
-    // The `<select>` has its own state not refelcted by `SelectProps`.
     fn changed(&mut self, ctx: &Context<Self>, _old: &Self::Properties) -> bool {
         self.selected = ctx.props().selected.clone();
         true
     }
 
-    // Annoyingly, `<select>` cannot be updated from its HTML alone.
     fn rendered(&mut self, _ctx: &Context<Self>, _first_render: bool) {
         if let Some(elem) = self.select_ref.cast::<web_sys::HtmlSelectElement>() {
             elem.set_value(&format!("{}", self.selected))

package/src/rust/{components → ui}/containers/sidebar.rs

@@ -19,38 +19,25 @@ use yew::{
     use_node_ref,
 };
 
-use crate::components::containers::sidebar_close_button::SidebarCloseButton;
-use crate::components::editable_header::{EditableHeader, EditableHeaderProps};
 use crate::js::{ResizeObserver, ResizeObserverEntry};
+use crate::ui::containers::sidebar_close_button::SidebarCloseButton;
 
 #[derive(PartialEq, Clone, Properties)]
 pub struct SidebarProps {
-    /// The component's children.
     pub children: Children,
 
-    /// When this callback is called, the sidebar will close
     pub on_close: Callback<()>,
     pub id_prefix: String,
     pub width_override: Option<i32>,
     pub selected_tab: Option<usize>,
-    pub header_props: EditableHeaderProps,
-
-    /// Trap-door width shared across this sidebar's tabs: the lifted
-    /// running max of the widths this component reports through
-    /// `on_auto_width`. Held by the parent (ultimately
-    /// `PerspectiveViewer`'s geometry state, like the settings panel's
-    /// Query/Plugin/Debug trap-door) so it survives tab switches AND
-    /// sidebar re-mounts, and clears on divider reset.
+    pub header: Html,
+
     #[prop_or_default]
     pub auto_width: f64,
 
-    /// Fires with the sidebar's rendered width after each render; the
-    /// owner keeps the running max threaded back as `auto_width`.
     #[prop_or_default]
     pub on_auto_width: Callback<f64>,
 
-    /// Pinned state for the header's pin toggle; the button renders only
-    /// when `on_toggle_pin` is provided.
     #[prop_or_default]
     pub is_pinned: bool,
 
@@ -58,23 +45,12 @@ pub struct SidebarProps {
     pub on_toggle_pin: Option<Callback<()>>,
 }
 
-/// Sidebars are designed to live in a
-/// [`super::split_panel::SplitPanel`]
+/// Sidebars are designed to live in a `SplitPanel`.
 #[function_component]
 pub fn Sidebar(p: &SidebarProps) -> Html {
     let id = &p.id_prefix;
     let noderef = use_node_ref();
 
-    // The trap-door reports the sidebar's rendered width to its owner via
-    // a `ResizeObserver` on the sidebar element, NOT a render effect:
-    // width changes are driven by DOM mutations anywhere in the tab
-    // subtree (e.g. the window editor staging a long column name into a
-    // slot), which need not re-render this component at all. The observer
-    // sees every one. `contentRect` (not the border box) is load-bearing:
-    // the sizer below is a content child, so ratcheting the border box
-    // would feed any sidebar padding back into unbounded growth. A manual
-    // divider drag (`width_override`) disables the ratchet until the
-    // divider resets.
     let live_props = use_mut_ref(|| (Callback::<f64>::default(), None::<i32>));
     *live_props.borrow_mut() = (p.on_auto_width.clone(), p.width_override);
     use_effect_with((), {
@@ -139,10 +115,7 @@ pub fn Sidebar(p: &SidebarProps) -> Html {
         <>
             <SidebarCloseButton id={format!("{id}_close_button")} on_close_sidebar={&p.on_close} />
             <div class="sidebar_column" id={format!("{id}_sidebar")} ref={noderef}>
-                <div class="sidebar_header">
-                    <EditableHeader ..p.header_props.clone() />
-                    { pin_button }
-                </div>
+                <div class="sidebar_header">{ p.header.clone() }{ pin_button }</div>
                 <div class="sidebar_border" id={format!("{id}_border")} />
                 { p.children.iter().collect::<Html>() }
                 <div class="sidebar-auto-width" style={width_style} />