Skip to content

Commit

Permalink
Refactor perspective-viewer sidebar
Browse files Browse the repository at this point in the history
  • Loading branch information
@texodus
texodus committed Jan 3, 2024
1 parent 04ecb4c commit 29dc1d4
Show file tree
Hide file tree
Showing 27 changed files with 319 additions and 335 deletions.
12 changes: 0 additions & 12 deletions rust/perspective-viewer/Cargo.lock
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 0 additions & 3 deletions rust/perspective-viewer/Cargo.toml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,9 +64,6 @@ wasm-bindgen-test = "0.3.13"
# Provides async `Mutex` for locked sections such as `render`
async-lock = "2.5.0"

# Allow async methods to be used in traits
async-trait = "^0.1.73"

# Encode persistence tokens
base64 = "0.13.0"

Expand Down
8 changes: 4 additions & 4 deletions rust/perspective-viewer/src/rust/components/column_settings_sidebar/attributes_tab.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,10 +37,10 @@ pub fn AttributesTab(p: &AttributesTabProps) -> Html {
<div id="attributes-tab">
<div class="tab-section">
<ExprEditorAttr
{on_close}
{selected_column}
{session}
{renderer}/>
{ on_close }
{ selected_column }
{ session }
{ renderer }/>
</div>
</div>
}
Expand Down
128 changes: 58 additions & 70 deletions rust/perspective-viewer/src/rust/components/column_settings_sidebar/sidebar.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ use yew::{function_component, html, use_callback, use_state, Callback, Html, Pro
use crate::components::column_settings_sidebar::attributes_tab::AttributesTab;
use crate::components::column_settings_sidebar::style_tab::StyleTab;
use crate::components::containers::sidebar::Sidebar;
use crate::components::containers::tablist::{Tab, TabList};
use crate::components::containers::tab_list::{Tab, TabList};
use crate::components::expression_editor::get_new_column_name;
use crate::components::style::LocalStyle;
use crate::components::viewer::ColumnLocator;
Expand All @@ -28,7 +28,7 @@ use crate::renderer::Renderer;
use crate::session::Session;
use crate::{clone, css, derive_model, html_template};

#[derive(Debug, Default, Clone, PartialEq)]
#[derive(Debug, Default, Clone, Copy, PartialEq)]
pub enum ColumnSettingsTab {
#[default]
Attributes,
Expand Down Expand Up @@ -62,97 +62,82 @@ impl PartialEq for ColumnSettingsProps {
}

#[function_component]
pub fn ColumnSettingsSidebar(p: &ColumnSettingsProps) -> Html {
let column_name = match p.selected_column.clone() {
pub fn ColumnSettingsSidebar(props: &ColumnSettingsProps) -> Html {
let column_name = match props.selected_column.clone() {
ColumnLocator::Expr(Some(name)) | ColumnLocator::Plain(name) => name,
ColumnLocator::Expr(None) => get_new_column_name(&p.session),
ColumnLocator::Expr(None) => get_new_column_name(&props.session),
};

let column_type = p.session.metadata().get_column_view_type(&column_name);
let column_type = props.session.metadata().get_column_view_type(&column_name);
let is_active = column_type.is_some();

let (config, attrs) = (p.get_plugin_config(), p.get_plugin_attrs());
let (config, attrs) = (props.get_plugin_config(), props.get_plugin_attrs());
if config.is_none() || attrs.is_none() {
tracing::warn!(
"Could not get full plugin config!\nconfig (plugin.save()): {:?}\nplugin_attrs: {:?}",
config,
attrs
);
}
// view_ty != table_ty when aggregate is applied, i.e. on group-by
let maybe_view_ty = p.session.metadata().get_column_view_type(&column_name);
let maybe_table_ty = p.session.metadata().get_column_table_type(&column_name);

// view_ty != table_ty when aggregate is applied, i.e. on group-by
let view_type = props.session.metadata().get_column_view_type(&column_name);
let table_type = props.session.metadata().get_column_table_type(&column_name);
let mut tabs = vec![];

// TODO: This needs to be replaced. Replacing it requires more information
// about the capabilities of the plugin, which requires updating the internal
// plugin API. Leaving it for now.
let plugin = p.renderer.get_active_plugin().unwrap();
let show_styles = match &*plugin.name() {
"Datagrid" => maybe_view_ty.map(|ty| ty != Type::Bool).unwrap_or_default(),
"X/Y Scatter" => maybe_table_ty
.map(|ty| ty == Type::String)
.unwrap_or_default(),
let plugin = props.renderer.get_active_plugin().unwrap();
let show_styles = match plugin.name().as_str() {
"Datagrid" => view_type.map(|ty| ty != Type::Bool).unwrap_or_default(),
"X/Y Scatter" => table_type.map(|ty| ty == Type::String).unwrap_or_default(),
_ => false,
};

if !matches!(p.selected_column, ColumnLocator::Expr(None))
let mut children = vec![];

if !matches!(props.selected_column, ColumnLocator::Expr(None))
&& show_styles
&& is_active
&& config.is_some()
&& maybe_view_ty.is_some()
&& view_type.is_some()
{
clone!(
props.session,
props.renderer,
props.custom_events,
column_name
);

tabs.push(ColumnSettingsTab::Style);
}
if matches!(p.selected_column, ColumnLocator::Expr(_)) {
tabs.push(ColumnSettingsTab::Attributes);
children.push(html! {
<StyleTab
{ session }
{ renderer }
{ custom_events }
{ column_name }/>
});
}

let match_fn = {
if matches!(props.selected_column, ColumnLocator::Expr(_)) {
clone!(
p.selected_column,
p.on_close,
p.session,
p.renderer,
p.custom_events,
column_name
props.selected_column,
props.on_close,
props.session,
props.renderer,
props.custom_events
);
Callback::from(move |tab| {
clone!(
selected_column,
on_close,
session,
renderer,
custom_events,
column_name
);

match tab {
ColumnSettingsTab::Attributes => {
html! {
<AttributesTab
{ session }
{ renderer }
{ custom_events }
{ selected_column }
{ on_close }
/>
}
},
ColumnSettingsTab::Style => html! {
<StyleTab
{ session }
{ renderer }
{ custom_events }
{ column_name }
{ maybe_view_ty }
{ maybe_table_ty }
/>
},
}
})
};

tabs.push(ColumnSettingsTab::Attributes);
children.push(html! {
<AttributesTab
{ session }
{ renderer }
{ custom_events }
{ selected_column }
{ on_close }/>
});
}

let selected_tab = use_state(|| None);
let on_tab_change = {
Expand All @@ -163,20 +148,23 @@ pub fn ColumnSettingsSidebar(p: &ColumnSettingsProps) -> Html {
};

html_template! {
<LocalStyle href={ css!("column-settings-panel") } />
<LocalStyle href={ css!("column-settings-panel") }/>
<Sidebar
title={ column_name }
on_close={ p.on_close.clone() }
on_close={ props.on_close.clone() }
id_prefix="column_settings"
icon={ "column_settings_icon" }
width_override={ p.width_override }
width_override={ props.width_override }
selected_tab={ *selected_tab }>

<TabList<ColumnSettingsTab>
{ tabs }
{ match_fn }
{ on_tab_change }
selected_tab={ *selected_tab }/>
</Sidebar>
selected_tab={ *selected_tab }>

{ for children.into_iter() }

</TabList<ColumnSettingsTab>>
</Sidebar>
}
}
79 changes: 34 additions & 45 deletions rust/perspective-viewer/src/rust/components/column_settings_sidebar/style_tab.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,11 @@ mod column_style;
pub mod stub;
mod symbol;

use wasm_bindgen::UnwrapThrowExt;
use yew::{function_component, html, Html, Properties};

use crate::components::column_settings_sidebar::style_tab::column_style::ColumnStyle;
use crate::components::column_settings_sidebar::style_tab::stub::Stub;
use crate::components::column_settings_sidebar::style_tab::symbol::SymbolStyle;
use crate::config::Type;
use crate::custom_events::CustomEvents;
use crate::renderer::Renderer;
use crate::session::Session;
Expand All @@ -31,48 +29,40 @@ pub struct StyleTabProps {
pub custom_events: CustomEvents,
pub session: Session,
pub renderer: Renderer,

pub maybe_table_ty: Option<Type>,
pub maybe_view_ty: Option<Type>,
pub column_name: String,
}

#[function_component]
pub fn StyleTab(props: &StyleTabProps) -> Html {
let plugin = props
.renderer
.get_active_plugin()
.expect("No active plugins!");

let plugin = props.renderer.get_active_plugin().unwrap();
let plugin_column_names = plugin
.config_column_names()
.and_then(|arr| arr.into_serde_ext::<Vec<Option<String>>>().ok())
.unwrap();

let view_config = props.session.get_view_config();
let (col_idx, _) = view_config
.columns
.iter()
.enumerate()
.find(|(_, opt)| {
opt.as_ref()
.map(|s| s == &props.column_name)
.unwrap_or_default()
})
.expect_throw(&format!(
"Could not find column with name {:?}",
props.column_name
));
let (col_idx, _) =
view_config
.columns
.iter()
.enumerate()
.find(|(_, opt)| {
opt.as_ref()
.map(|s| s == &props.column_name)
.unwrap_or_default()
})
.unwrap();

let col_grp = plugin_column_names
.iter()
// This mimics the behavior where plugins can take a single value
// per column grouping, and any overflow falls into the final heading
.chain(std::iter::repeat(plugin_column_names.last().unwrap()))
.nth(col_idx)
.unwrap()
.to_owned()
.unwrap();
// This mimics the behavior where plugins can take a single value
// per column grouping, and any overflow falls into the final heading
let col_grp =
plugin_column_names
.iter()
.chain(std::iter::repeat(plugin_column_names.last().unwrap()))
.nth(col_idx)
.unwrap()
.to_owned()
.unwrap();

// TODO: We need a better way to determine which styling components to show.
// This will come with future changes to the plugin API.
Expand All @@ -84,27 +74,26 @@ pub fn StyleTab(props: &StyleTabProps) -> Html {
renderer={ &props.renderer }
custom_events={ &props.custom_events }/>
}),
"Columns" => props.maybe_view_ty.map(|view_ty| {
html! {
<ColumnStyle
custom_events={ props.custom_events.clone() }
session={ props.session.clone() }
renderer={ props.renderer.clone() }
{view_ty}
column_name={ props.column_name.clone() }/>
}
"Columns" => Some(html! {
<ColumnStyle
custom_events={ props.custom_events.clone() }
session={ props.session.clone() }
renderer={ props.renderer.clone() }
column_name={ props.column_name.clone() }/>
}),
_ => None,
};

let components = components.unwrap_or(
html! {<Stub message="No plugin styles available" error="Could not get plugin styles" />},
);
let components = components.unwrap_or(html! {
<Stub
message="No plugin styles available"
error="Could not get plugin styles"/>
});

html! {
<div id="style-tab">
<div id="column-style-container" class="tab-section">
{components}
{ components }
</div>
</div>
}
Expand Down
Loading

0 comments on commit 29dc1d4

Please sign in to comment.