Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Standardize button design in modal footers (#20585)

Browse source 
- Making sure this design and properties are the same across different
places
- No need for the `ButtonLike` here, we can use `Button` as it supports
`key_binding` and makes it for a cleaner code!
- Also, that ensures the binding is always to the right of the label,
which makes more sense
- Title-case the labels for consistency with other buttons across the
app

| File finder | Project finder |
|--------|--------|
| <img width="1136" alt="Screenshot 2024-11-13 at 09 21 06"
src="https://github.com/user-attachments/assets/dd051514-d873-4b65-a08f-af0920f2c010">
| <img width="1136" alt="Screenshot 2024-11-13 at 09 21 12"
src="https://github.com/user-attachments/assets/f958e3e7-4bfb-4752-839e-2bbc01334643">
|

Release Notes:

- N/A
This commit is contained in:
Danilo Leal 2024-11-13 09:36:08 -03:00 • committed by GitHub
parent 3b1f12af75
commit b44078781d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 41 additions and 61 deletions
Download patch file Download diff file Expand all files Collapse all files

73
crates/file_finder/src/file_finder.rs
View file

@ -33,8 +33,8 @@ use std::{
}; };
use text::Point; use text::Point;
use ui::{ use ui::{
prelude::*, ButtonLike, ContextMenu, HighlightedLabel, KeyBinding, ListItem, ListItemSpacing, prelude::*, ContextMenu, HighlightedLabel, KeyBinding, ListItem, ListItemSpacing, PopoverMenu,
PopoverMenu, PopoverMenuHandle, TintColor, PopoverMenuHandle,
}; };
use util::{paths::PathWithPosition, post_inc, ResultExt}; use util::{paths::PathWithPosition, post_inc, ResultExt};
use workspace::{ use workspace::{
@ -1222,54 +1222,43 @@ impl PickerDelegate for FileFinderDelegate {
} }
fn render_footer(&self, cx: &mut ViewContext<Picker<Self>>) -> Option<AnyElement> { fn render_footer(&self, cx: &mut ViewContext<Picker<Self>>) -> Option<AnyElement> {
let menu_open = self.popover_menu_handle.is_focused(cx);
Some( Some(
h_flex() h_flex()
.w_full() .w_full()
.border_t_1() .p_2()
.py_2() .gap_2()
.pr_2()
.border_color(cx.theme().colors().border)
.justify_end() .justify_end()
.border_t_1()
.border_color(cx.theme().colors().border_variant)
.child( .child(
ButtonLike::new("open-selection") Button::new("open-selection", "Open")
.when_some(KeyBinding::for_action(&menu::Confirm, cx), |button, key| { .key_binding(KeyBinding::for_action(&menu::Confirm, cx))
button.child(key)
})
.child(Label::new("Open"))
.on_click(|_, cx| cx.dispatch_action(menu::Confirm.boxed_clone())), .on_click(|_, cx| cx.dispatch_action(menu::Confirm.boxed_clone())),
) )
.child( .child(
div().pl_2().child( PopoverMenu::new("menu-popover")
PopoverMenu::new("menu-popover") .with_handle(self.popover_menu_handle.clone())
.with_handle(self.popover_menu_handle.clone()) .attach(gpui::AnchorCorner::TopRight)
.attach(gpui::AnchorCorner::TopRight) .anchor(gpui::AnchorCorner::BottomRight)
.anchor(gpui::AnchorCorner::BottomRight) .trigger(
.trigger( Button::new("actions-trigger", "Split Options")
ButtonLike::new("menu-trigger") .selected_label_color(Color::Accent)
.selected(menu_open) .key_binding(KeyBinding::for_action_in(
.selected_style(ButtonStyle::Tinted(TintColor::Accent)) &OpenMenu,
.when_some( &self.focus_handle,
KeyBinding::for_action_in( cx,
&OpenMenu, )),
&self.focus_handle, )
cx, .menu({
), move |cx| {
|button, key| button.child(key), Some(ContextMenu::build(cx, move |menu, _| {
) menu.action("Split Left", pane::SplitLeft.boxed_clone())
.child(Label::new("More actions")), .action("Split Right", pane::SplitRight.boxed_clone())
) .action("Split Up", pane::SplitUp.boxed_clone())
.menu({ .action("Split Down", pane::SplitDown.boxed_clone())
move |cx| { }))
Some(ContextMenu::build(cx, move |menu, _| { }
menu.action("Split left", pane::SplitLeft.boxed_clone()) }),
.action("Split right", pane::SplitRight.boxed_clone())
.action("Split up", pane::SplitUp.boxed_clone())
.action("Split down", pane::SplitDown.boxed_clone())
}))
}
}),
),
) )
.into_any(), .into_any(),
) )

29
crates/recent_projects/src/recent_projects.rs
View file

@ -23,9 +23,7 @@ use std::{
path::{Path, PathBuf}, path::{Path, PathBuf},
sync::Arc, sync::Arc,
}; };
use ui::{ use ui::{prelude::*, tooltip_container, KeyBinding, ListItem, ListItemSpacing, Tooltip};
prelude::*, tooltip_container, ButtonLike, KeyBinding, ListItem, ListItemSpacing, Tooltip,
};
use util::{paths::PathExt, ResultExt}; use util::{paths::PathExt, ResultExt};
use workspace::{ use workspace::{
CloseIntent, ModalView, OpenOptions, SerializedWorkspaceLocation, Workspace, WorkspaceId, CloseIntent, ModalView, OpenOptions, SerializedWorkspaceLocation, Workspace, WorkspaceId,
@ -471,27 +469,20 @@ impl PickerDelegate for RecentProjectsDelegate {
fn render_footer(&self, cx: &mut ViewContext<Picker<Self>>) -> Option<AnyElement> { fn render_footer(&self, cx: &mut ViewContext<Picker<Self>>) -> Option<AnyElement> {
Some( Some(
h_flex() h_flex()
.border_t_1() .w_full()
.py_2() .p_2()
.pr_2() .gap_2()
.border_color(cx.theme().colors().border_variant)
.justify_end() .justify_end()
.gap_4() .border_t_1()
.border_color(cx.theme().colors().border_variant)
.child( .child(
ButtonLike::new("remote") Button::new("remote", "Open Remote Folder")
.when_some(KeyBinding::for_action(&OpenRemote, cx), |button, key| { .key_binding(KeyBinding::for_action(&OpenRemote, cx))
button.child(key)
})
.child(Label::new("Open Remote Folder…").color(Color::Muted))
.on_click(|_, cx| cx.dispatch_action(OpenRemote.boxed_clone())), .on_click(|_, cx| cx.dispatch_action(OpenRemote.boxed_clone())),
) )
.child( .child(
ButtonLike::new("local") Button::new("local", "Open Local Folder")
.when_some( .key_binding(KeyBinding::for_action(&workspace::Open, cx))
KeyBinding::for_action(&workspace::Open, cx),
|button, key| button.child(key),
)
.child(Label::new("Open Local Folder…").color(Color::Muted))
.on_click(|_, cx| cx.dispatch_action(workspace::Open.boxed_clone())), .on_click(|_, cx| cx.dispatch_action(workspace::Open.boxed_clone())),
) )
.into_any(), .into_any(),