Show profile context in sidebar tabs
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
use ely_browser_core::BrowserSnapshot;
|
use ely_browser_core::BrowserSnapshot;
|
||||||
use ely_design_system::{ELY_THEME, colors, spacing};
|
use ely_design_system::{ELY_THEME, colors, spacing};
|
||||||
use ely_domain::{ArchiveSource, ArchivedTab, BrowserTab, Space};
|
use ely_domain::{ArchiveSource, ArchivedTab, BrowserTab, Profile, Space};
|
||||||
use gpui::{
|
use gpui::{
|
||||||
AnyElement, Context, InteractiveElement, IntoElement, ParentElement, Render, SharedString,
|
AnyElement, Context, InteractiveElement, IntoElement, ParentElement, Render, SharedString,
|
||||||
StatefulInteractiveElement, Styled, Window, div, px, rgb,
|
StatefulInteractiveElement, Styled, Window, div, px, rgb,
|
||||||
@@ -166,17 +166,23 @@ impl ElyShell {
|
|||||||
.border_color(rgb(colors::HAIRLINE))
|
.border_color(rgb(colors::HAIRLINE))
|
||||||
.bg(rgb(colors::CANVAS))
|
.bg(rgb(colors::CANVAS))
|
||||||
.child(section_label("Favorites"))
|
.child(section_label("Favorites"))
|
||||||
.children(
|
.children(snapshot.favorites.iter().map(|tab| {
|
||||||
snapshot.favorites.iter().map(|tab| {
|
self.render_favorite_row(
|
||||||
self.render_favorite_row(tab, tab.id() == &snapshot.active_tab_id, cx)
|
tab,
|
||||||
}),
|
&snapshot.profiles,
|
||||||
|
tab.id() == &snapshot.active_tab_id,
|
||||||
|
cx,
|
||||||
)
|
)
|
||||||
|
}))
|
||||||
.child(section_label("Pinned"))
|
.child(section_label("Pinned"))
|
||||||
.children(
|
.children(snapshot.pinned_tabs.iter().map(|tab| {
|
||||||
snapshot.pinned_tabs.iter().map(|tab| {
|
self.render_pinned_row(
|
||||||
self.render_pinned_row(tab, tab.id() == &snapshot.active_tab_id, cx)
|
tab,
|
||||||
}),
|
&snapshot.profiles,
|
||||||
|
tab.id() == &snapshot.active_tab_id,
|
||||||
|
cx,
|
||||||
)
|
)
|
||||||
|
}))
|
||||||
.child(section_label("Space"))
|
.child(section_label("Space"))
|
||||||
.children(snapshot.spaces.iter().map(|space| {
|
.children(snapshot.spaces.iter().map(|space| {
|
||||||
self.render_space_row(space, space.id() == &snapshot.active_space_id, cx)
|
self.render_space_row(space, space.id() == &snapshot.active_space_id, cx)
|
||||||
@@ -243,12 +249,14 @@ impl ElyShell {
|
|||||||
fn render_favorite_row(
|
fn render_favorite_row(
|
||||||
&mut self,
|
&mut self,
|
||||||
tab: &BrowserTab,
|
tab: &BrowserTab,
|
||||||
|
profiles: &[Profile],
|
||||||
active: bool,
|
active: bool,
|
||||||
cx: &mut Context<Self>,
|
cx: &mut Context<Self>,
|
||||||
) -> AnyElement {
|
) -> AnyElement {
|
||||||
let tab_id = tab.id().clone();
|
let tab_id = tab.id().clone();
|
||||||
let background = if active { colors::SURFACE_CARD } else { colors::CANVAS };
|
let background = if active { colors::SURFACE_CARD } else { colors::CANVAS };
|
||||||
let border = if active { colors::HAIRLINE_STRONG } else { colors::HAIRLINE };
|
let border = if active { colors::HAIRLINE_STRONG } else { colors::HAIRLINE };
|
||||||
|
let detail = sidebar_tab_detail(tab, profiles);
|
||||||
|
|
||||||
div()
|
div()
|
||||||
.id(SharedString::from(format!("favorite-{}", tab.id().as_str())))
|
.id(SharedString::from(format!("favorite-{}", tab.id().as_str())))
|
||||||
@@ -281,7 +289,7 @@ impl ElyShell {
|
|||||||
.text_color(rgb(colors::INK))
|
.text_color(rgb(colors::INK))
|
||||||
.child(tab.title().to_string()),
|
.child(tab.title().to_string()),
|
||||||
)
|
)
|
||||||
.child(div().text_xs().text_color(rgb(colors::MUTED)).child(tab.display_url())),
|
.child(div().text_xs().text_color(rgb(colors::MUTED)).child(detail)),
|
||||||
)
|
)
|
||||||
.into_any_element()
|
.into_any_element()
|
||||||
}
|
}
|
||||||
@@ -289,12 +297,14 @@ impl ElyShell {
|
|||||||
fn render_pinned_row(
|
fn render_pinned_row(
|
||||||
&mut self,
|
&mut self,
|
||||||
tab: &BrowserTab,
|
tab: &BrowserTab,
|
||||||
|
profiles: &[Profile],
|
||||||
active: bool,
|
active: bool,
|
||||||
cx: &mut Context<Self>,
|
cx: &mut Context<Self>,
|
||||||
) -> AnyElement {
|
) -> AnyElement {
|
||||||
let tab_id = tab.id().clone();
|
let tab_id = tab.id().clone();
|
||||||
let background = if active { colors::SURFACE_CARD } else { colors::CANVAS };
|
let background = if active { colors::SURFACE_CARD } else { colors::CANVAS };
|
||||||
let border = if active { colors::HAIRLINE_STRONG } else { colors::HAIRLINE };
|
let border = if active { colors::HAIRLINE_STRONG } else { colors::HAIRLINE };
|
||||||
|
let detail = sidebar_tab_detail(tab, profiles);
|
||||||
|
|
||||||
div()
|
div()
|
||||||
.id(SharedString::from(format!("pinned-{}", tab.id().as_str())))
|
.id(SharedString::from(format!("pinned-{}", tab.id().as_str())))
|
||||||
@@ -327,7 +337,7 @@ impl ElyShell {
|
|||||||
.text_color(rgb(colors::INK))
|
.text_color(rgb(colors::INK))
|
||||||
.child(tab.title().to_string()),
|
.child(tab.title().to_string()),
|
||||||
)
|
)
|
||||||
.child(div().text_xs().text_color(rgb(colors::MUTED)).child(tab.display_url())),
|
.child(div().text_xs().text_color(rgb(colors::MUTED)).child(detail)),
|
||||||
)
|
)
|
||||||
.into_any_element()
|
.into_any_element()
|
||||||
}
|
}
|
||||||
@@ -451,3 +461,15 @@ fn archive_source_label(source: &ArchiveSource) -> &'static str {
|
|||||||
ArchiveSource::AutoArchive => "Auto archived",
|
ArchiveSource::AutoArchive => "Auto archived",
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
fn sidebar_tab_detail(tab: &BrowserTab, profiles: &[Profile]) -> String {
|
||||||
|
format!("{} - {}", tab.display_url(), tab_profile_label(tab, profiles))
|
||||||
|
}
|
||||||
|
|
||||||
|
pub(super) fn tab_profile_label(tab: &BrowserTab, profiles: &[Profile]) -> String {
|
||||||
|
profiles
|
||||||
|
.iter()
|
||||||
|
.find(|profile| profile.id() == tab.profile_id())
|
||||||
|
.map(|profile| format!("Profile: {}", profile.name()))
|
||||||
|
.unwrap_or_else(|| format!("Profile: {}", tab.profile_id().as_str()))
|
||||||
|
}
|
||||||
|
|||||||
@@ -9,7 +9,7 @@ use gpui_component::{
|
|||||||
button::{Button, ButtonVariants},
|
button::{Button, ButtonVariants},
|
||||||
};
|
};
|
||||||
|
|
||||||
use super::{ElyShell, ShellState};
|
use super::{ElyShell, ShellState, render::tab_profile_label};
|
||||||
use crate::ToggleSidebar;
|
use crate::ToggleSidebar;
|
||||||
|
|
||||||
impl ElyShell {
|
impl ElyShell {
|
||||||
@@ -43,6 +43,7 @@ impl ElyShell {
|
|||||||
self.render_compact_tab_button(
|
self.render_compact_tab_button(
|
||||||
("compact-favorite", index),
|
("compact-favorite", index),
|
||||||
tab,
|
tab,
|
||||||
|
snapshot,
|
||||||
tab.id() == &snapshot.active_tab_id,
|
tab.id() == &snapshot.active_tab_id,
|
||||||
IconName::Star,
|
IconName::Star,
|
||||||
cx,
|
cx,
|
||||||
@@ -52,6 +53,7 @@ impl ElyShell {
|
|||||||
self.render_compact_tab_button(
|
self.render_compact_tab_button(
|
||||||
("compact-pinned", index),
|
("compact-pinned", index),
|
||||||
tab,
|
tab,
|
||||||
|
snapshot,
|
||||||
tab.id() == &snapshot.active_tab_id,
|
tab.id() == &snapshot.active_tab_id,
|
||||||
IconName::Asterisk,
|
IconName::Asterisk,
|
||||||
cx,
|
cx,
|
||||||
@@ -69,6 +71,7 @@ impl ElyShell {
|
|||||||
self.render_compact_tab_button(
|
self.render_compact_tab_button(
|
||||||
("compact-tab", index),
|
("compact-tab", index),
|
||||||
tab,
|
tab,
|
||||||
|
snapshot,
|
||||||
tab.id() == &snapshot.active_tab_id,
|
tab.id() == &snapshot.active_tab_id,
|
||||||
IconName::Globe,
|
IconName::Globe,
|
||||||
cx,
|
cx,
|
||||||
@@ -130,17 +133,19 @@ impl ElyShell {
|
|||||||
&mut self,
|
&mut self,
|
||||||
id: (&'static str, usize),
|
id: (&'static str, usize),
|
||||||
tab: &BrowserTab,
|
tab: &BrowserTab,
|
||||||
|
snapshot: &BrowserSnapshot,
|
||||||
active: bool,
|
active: bool,
|
||||||
icon: IconName,
|
icon: IconName,
|
||||||
cx: &mut Context<Self>,
|
cx: &mut Context<Self>,
|
||||||
) -> AnyElement {
|
) -> AnyElement {
|
||||||
let tab_id = tab.id().clone();
|
let tab_id = tab.id().clone();
|
||||||
|
let tooltip = format!("{} - {}", tab.title(), tab_profile_label(tab, &snapshot.profiles));
|
||||||
Button::new(id)
|
Button::new(id)
|
||||||
.ghost()
|
.ghost()
|
||||||
.small()
|
.small()
|
||||||
.selected(active)
|
.selected(active)
|
||||||
.icon(icon)
|
.icon(icon)
|
||||||
.tooltip(tab.title().to_string())
|
.tooltip(tooltip)
|
||||||
.on_click(cx.listener(move |shell, _, window, cx| {
|
.on_click(cx.listener(move |shell, _, window, cx| {
|
||||||
shell.select_tab(&tab_id, window, cx);
|
shell.select_tab(&tab_id, window, cx);
|
||||||
}))
|
}))
|
||||||
|
|||||||
Reference in New Issue
Block a user