Improve the LSP popover menu design (#34081)
- Add a slightly different bolt icon SVG so it sits better when with an indicator - Attempt to clarify what happens when clicking any of the menu items - Add descriptions to the tooltips to clarify what each indicator color means - Add section titles to clarify in which category each menu item is sitting on Release Notes: - N/A
This commit is contained in:
parent
139af02737
commit
ad8b823555
2 changed files with 55 additions and 12 deletions
|
@ -1,3 +1,3 @@
|
|||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M6.75776 5.50003H8.49988C8.70769 5.50003 8.89518 5.62971 8.95455 5.82346C9.04049 6.01876 8.9858 6.23906 8.82956 6.37656L4.82971 9.87643C4.65315 10.0295 4.39488 10.042 4.20614 9.90455C4.01724 9.76705 3.94849 9.51706 4.04052 9.30301L5.24219 6.49999H3.48601C3.2918 6.49999 3.10524 6.37031 3.03197 6.17657C2.9587 5.98126 3.014 5.76096 3.1708 5.62346L7.17018 2.12375C7.34674 1.97001 7.60454 1.95829 7.7936 2.09547C7.98265 2.23275 8.0514 2.48218 7.95922 2.69695L6.75776 5.50003Z" fill="black"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.98749 1.67322C7.08029 1.71878 7.15543 1.79374 7.20121 1.88643C7.24699 1.97912 7.26084 2.08434 7.24061 2.18572L6.72812 4.75007H9.28122C9.37107 4.75006 9.45903 4.77588 9.53463 4.82445C9.61022 4.87302 9.67027 4.94229 9.70761 5.02402C9.74495 5.10574 9.75801 5.19648 9.74524 5.28542C9.73247 5.37437 9.69441 5.45776 9.63559 5.52569L5.57313 10.2131C5.50536 10.2912 5.41366 10.3447 5.31233 10.3653C5.211 10.3858 5.10571 10.3723 5.01285 10.3268C4.92 10.2813 4.8448 10.2064 4.79896 10.1137C4.75311 10.021 4.7392 9.9158 4.75939 9.81439L5.27188 7.25004H2.71878C2.62893 7.25005 2.54097 7.22423 2.46537 7.17566C2.38978 7.12709 2.32973 7.05782 2.29239 6.97609C2.25505 6.89437 2.24199 6.80363 2.25476 6.71469C2.26753 6.62574 2.30559 6.54235 2.36441 6.47443L6.42687 1.78697C6.49466 1.70879 6.58641 1.65524 6.68782 1.63467C6.78923 1.61409 6.89459 1.62765 6.98749 1.67322Z" fill="black"/>
|
||||
</svg>
|
||||
|
|
Before Width: | Height: | Size: 601 B After Width: | Height: | Size: 1 KiB |
|
@ -185,15 +185,18 @@ impl LanguageServerState {
|
|||
menu = menu.separator().item(button);
|
||||
continue;
|
||||
};
|
||||
|
||||
let Some(server_info) = item.server_info() else {
|
||||
continue;
|
||||
};
|
||||
|
||||
let workspace = self.workspace.clone();
|
||||
let server_selector = server_info.server_selector();
|
||||
// TODO currently, Zed remote does not work well with the LSP logs
|
||||
// https://github.com/zed-industries/zed/issues/28557
|
||||
let has_logs = lsp_store.read(cx).as_local().is_some()
|
||||
&& lsp_logs.read(cx).has_server_logs(&server_selector);
|
||||
|
||||
let status_color = server_info
|
||||
.binary_status
|
||||
.and_then(|binary_status| match binary_status.status {
|
||||
|
@ -218,16 +221,40 @@ impl LanguageServerState {
|
|||
.other_servers_start_index
|
||||
.is_some_and(|index| index == i)
|
||||
{
|
||||
menu = menu.separator();
|
||||
menu = menu.separator().header("Other Buffers");
|
||||
}
|
||||
|
||||
if i == 0 && self.other_servers_start_index.is_some() {
|
||||
menu = menu.header("Current Buffer");
|
||||
}
|
||||
|
||||
menu = menu.item(ContextMenuItem::custom_entry(
|
||||
move |_, _| {
|
||||
h_flex()
|
||||
.gap_1()
|
||||
.group("menu_item")
|
||||
.w_full()
|
||||
.child(Indicator::dot().color(status_color))
|
||||
.child(Label::new(server_info.name.0.clone()))
|
||||
.when(!has_logs, |div| div.cursor_default())
|
||||
.gap_2()
|
||||
.justify_between()
|
||||
.child(
|
||||
h_flex()
|
||||
.gap_2()
|
||||
.child(Indicator::dot().color(status_color))
|
||||
.child(Label::new(server_info.name.0.clone())),
|
||||
)
|
||||
.child(
|
||||
h_flex()
|
||||
.visible_on_hover("menu_item")
|
||||
.child(
|
||||
Label::new("View Logs")
|
||||
.size(LabelSize::Small)
|
||||
.color(Color::Muted),
|
||||
)
|
||||
.child(
|
||||
Icon::new(IconName::ChevronRight)
|
||||
.size(IconSize::Small)
|
||||
.color(Color::Muted),
|
||||
),
|
||||
)
|
||||
.into_any_element()
|
||||
},
|
||||
{
|
||||
|
@ -836,17 +863,27 @@ impl Render for LspTool {
|
|||
}
|
||||
}
|
||||
|
||||
let indicator = if has_errors {
|
||||
Some(Indicator::dot().color(Color::Error))
|
||||
let (indicator, description) = if has_errors {
|
||||
(
|
||||
Some(Indicator::dot().color(Color::Error)),
|
||||
"Server with errors",
|
||||
)
|
||||
} else if has_warnings {
|
||||
Some(Indicator::dot().color(Color::Warning))
|
||||
(
|
||||
Some(Indicator::dot().color(Color::Warning)),
|
||||
"Server with warnings",
|
||||
)
|
||||
} else if has_other_notifications {
|
||||
Some(Indicator::dot().color(Color::Modified))
|
||||
(
|
||||
Some(Indicator::dot().color(Color::Modified)),
|
||||
"Server with notifications",
|
||||
)
|
||||
} else {
|
||||
None
|
||||
(None, "All Servers Operational")
|
||||
};
|
||||
|
||||
let lsp_tool = cx.entity().clone();
|
||||
|
||||
div().child(
|
||||
PopoverMenu::new("lsp-tool")
|
||||
.menu(move |_, cx| lsp_tool.read(cx).lsp_menu.clone())
|
||||
|
@ -858,7 +895,13 @@ impl Render for LspTool {
|
|||
.icon_size(IconSize::Small)
|
||||
.indicator_border_color(Some(cx.theme().colors().status_bar_background)),
|
||||
move |window, cx| {
|
||||
Tooltip::for_action("Language Servers", &ToggleMenu, window, cx)
|
||||
Tooltip::with_meta(
|
||||
"Language Servers",
|
||||
Some(&ToggleMenu),
|
||||
description,
|
||||
window,
|
||||
cx,
|
||||
)
|
||||
},
|
||||
),
|
||||
)
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue