sidebar: Add to support disable state to sidebar item. (#1645)
Hello, I added a disabled flag to turn off the SidebarmenuItem <img width="735" height="528" alt="image" src="https://github.com/user-attachments/assets/47f60476-004c-4fe5-9baf-519d16b93f93" /> --------- Co-authored-by: TUMINOA <adriano.tumino@leonardocompany.com> Co-authored-by: Jason Lee <huacnlee@gmail.com>
This commit is contained in:
parent
65c5bae745
commit
2e3387a76f
2 changed files with 47 additions and 18 deletions
|
|
@ -125,6 +125,13 @@ impl Item {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
pub fn is_disabled(&self) -> bool {
|
||||||
|
match self {
|
||||||
|
Self::Travel => true,
|
||||||
|
_ => false,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
pub fn icon(&self) -> IconName {
|
pub fn icon(&self) -> IconName {
|
||||||
match self {
|
match self {
|
||||||
Self::Playground => IconName::SquareTerminal,
|
Self::Playground => IconName::SquareTerminal,
|
||||||
|
|
@ -196,6 +203,13 @@ impl SubItem {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
pub fn is_disabled(&self) -> bool {
|
||||||
|
match self {
|
||||||
|
Self::Quantum => true,
|
||||||
|
_ => false,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
pub fn handler(
|
pub fn handler(
|
||||||
&self,
|
&self,
|
||||||
item: &Item,
|
item: &Item,
|
||||||
|
|
@ -336,6 +350,7 @@ impl Render for SidebarStory {
|
||||||
|(ix, sub_item)| {
|
|(ix, sub_item)| {
|
||||||
SidebarMenuItem::new(sub_item.label())
|
SidebarMenuItem::new(sub_item.label())
|
||||||
.active(self.active_subitem == Some(sub_item))
|
.active(self.active_subitem == Some(sub_item))
|
||||||
|
.disable(sub_item.is_disabled())
|
||||||
.when(ix == 0, |this| {
|
.when(ix == 0, |this| {
|
||||||
this.suffix(
|
this.suffix(
|
||||||
Switch::new("switch")
|
Switch::new("switch")
|
||||||
|
|
@ -363,6 +378,7 @@ impl Render for SidebarStory {
|
||||||
SidebarMenuItem::new(item.label())
|
SidebarMenuItem::new(item.label())
|
||||||
.icon(item.icon())
|
.icon(item.icon())
|
||||||
.active(is_active)
|
.active(is_active)
|
||||||
|
.disable(item.is_disabled())
|
||||||
.click_to_open(self.click_to_open_submenu)
|
.click_to_open(self.click_to_open_submenu)
|
||||||
.when(ix == 0, |this| {
|
.when(ix == 0, |this| {
|
||||||
this.suffix(
|
this.suffix(
|
||||||
|
|
|
||||||
|
|
@ -78,6 +78,7 @@ pub struct SidebarMenuItem {
|
||||||
collapsed: bool,
|
collapsed: bool,
|
||||||
children: Vec<Self>,
|
children: Vec<Self>,
|
||||||
suffix: Option<AnyElement>,
|
suffix: Option<AnyElement>,
|
||||||
|
disabled: bool,
|
||||||
}
|
}
|
||||||
|
|
||||||
impl SidebarMenuItem {
|
impl SidebarMenuItem {
|
||||||
|
|
@ -94,6 +95,7 @@ impl SidebarMenuItem {
|
||||||
click_to_open: false,
|
click_to_open: false,
|
||||||
children: Vec::new(),
|
children: Vec::new(),
|
||||||
suffix: None,
|
suffix: None,
|
||||||
|
disabled: false,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -153,6 +155,12 @@ impl SidebarMenuItem {
|
||||||
self
|
self
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/// Set disabled flat for menu item.
|
||||||
|
pub fn disable(mut self, disable: bool) -> Self {
|
||||||
|
self.disabled = disable;
|
||||||
|
self
|
||||||
|
}
|
||||||
|
|
||||||
/// Set id to the menu item.
|
/// Set id to the menu item.
|
||||||
fn id(mut self, id: impl Into<ElementId>) -> Self {
|
fn id(mut self, id: impl Into<ElementId>) -> Self {
|
||||||
self.id = id.into();
|
self.id = id.into();
|
||||||
|
|
@ -173,6 +181,8 @@ impl RenderOnce for SidebarMenuItem {
|
||||||
let handler = self.handler.clone();
|
let handler = self.handler.clone();
|
||||||
let is_collapsed = self.collapsed;
|
let is_collapsed = self.collapsed;
|
||||||
let is_active = self.active;
|
let is_active = self.active;
|
||||||
|
let is_hoverable = !is_active && !self.disabled;
|
||||||
|
let is_disabled = self.disabled;
|
||||||
let is_submenu = self.is_submenu();
|
let is_submenu = self.is_submenu();
|
||||||
let is_open = is_submenu && !is_collapsed && *open_state.read(cx);
|
let is_open = is_submenu && !is_collapsed && *open_state.read(cx);
|
||||||
|
|
||||||
|
|
@ -189,13 +199,11 @@ impl RenderOnce for SidebarMenuItem {
|
||||||
.gap_x_2()
|
.gap_x_2()
|
||||||
.rounded(cx.theme().radius)
|
.rounded(cx.theme().radius)
|
||||||
.text_sm()
|
.text_sm()
|
||||||
.hover(|this| {
|
.when(is_hoverable, |this| {
|
||||||
if is_active {
|
this.hover(|this| {
|
||||||
return this;
|
this.bg(cx.theme().sidebar_accent.opacity(0.8))
|
||||||
}
|
.text_color(cx.theme().sidebar_accent_foreground)
|
||||||
|
})
|
||||||
this.bg(cx.theme().sidebar_accent.opacity(0.8))
|
|
||||||
.text_color(cx.theme().sidebar_accent_foreground)
|
|
||||||
})
|
})
|
||||||
.when(is_active, |this| {
|
.when(is_active, |this| {
|
||||||
this.font_medium()
|
this.font_medium()
|
||||||
|
|
@ -251,18 +259,23 @@ impl RenderOnce for SidebarMenuItem {
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
.on_click({
|
.when(is_disabled, |this| {
|
||||||
let open_state = open_state.clone();
|
this.text_color(cx.theme().muted_foreground)
|
||||||
move |ev, window, cx| {
|
})
|
||||||
if click_to_open {
|
.when(!is_disabled, |this| {
|
||||||
open_state.update(cx, |is_open, cx| {
|
this.on_click({
|
||||||
*is_open = true;
|
let open_state = open_state.clone();
|
||||||
cx.notify();
|
move |ev, window, cx| {
|
||||||
});
|
if click_to_open {
|
||||||
}
|
open_state.update(cx, |is_open, cx| {
|
||||||
|
*is_open = true;
|
||||||
|
cx.notify();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
handler(ev, window, cx)
|
handler(ev, window, cx)
|
||||||
}
|
}
|
||||||
|
})
|
||||||
}),
|
}),
|
||||||
)
|
)
|
||||||
.when(is_open, |this| {
|
.when(is_open, |this| {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue