Finish up touchups for search UI.

Co-authored-by: Nate <nate@zed.dev>
This commit is contained in:
Piotr Osiewicz 2023-11-14 18:18:52 +01:00
parent 08dde94299
commit c14efb74d7
3 changed files with 46 additions and 23 deletions

View file

@ -117,7 +117,7 @@ impl Render for BufferSearchBar {
// } // }
// (None, None) => String::new(), // (None, None) => String::new(),
// }; // };
let new_placeholder_text = Arc::from("Fix this up!"); let new_placeholder_text = Arc::from("Search for..");
self.query_editor.update(cx, |editor, cx| { self.query_editor.update(cx, |editor, cx| {
editor.set_placeholder_text(new_placeholder_text, cx); editor.set_placeholder_text(new_placeholder_text, cx);
}); });
@ -172,18 +172,22 @@ impl Render for BufferSearchBar {
cx, cx,
) )
}; };
div() let should_show_replace_input = self.replace_enabled && supported_options.replacement;
.border() let replace_all = should_show_replace_input.then(|| {
.border_color(blue()) super::replace_action::<Self>(ReplaceAll, "Replace all", ui::Icon::ReplaceAll)
.flex() });
.justify_between() let replace_next = should_show_replace_input
.then(|| super::replace_action::<Self>(ReplaceNext, "Replace next", ui::Icon::Replace));
h_stack()
.w_full()
.p_1()
.child( .child(
div() div()
.flex() .flex()
.flex_1()
.border_1() .border_1()
.border_color(red()) .border_color(red())
.rounded_md() .rounded_md()
.w_96()
.items_center() .items_center()
.child(IconElement::new(Icon::MagnifyingGlass)) .child(IconElement::new(Icon::MagnifyingGlass))
.child(self.query_editor.clone()) .child(self.query_editor.clone())
@ -198,21 +202,35 @@ impl Render for BufferSearchBar {
.then(|| search_option_button(SearchOptions::WHOLE_WORD)), .then(|| search_option_button(SearchOptions::WHOLE_WORD)),
), ),
) )
.child(ButtonGroup::new(vec![ .child(
search_button_for_mode(SearchMode::Text, Some(Side::Left), cx), h_stack()
search_button_for_mode(SearchMode::Regex, Some(Side::Right), cx), .flex_none()
])) .child(ButtonGroup::new(vec![
.when(supported_options.replacement, |this| { search_button_for_mode(SearchMode::Text, Some(Side::Left), cx),
this.child(super::toggle_replace_button(self.replace_enabled)) search_button_for_mode(SearchMode::Regex, Some(Side::Right), cx),
}) ]))
.when(self.replace_enabled, |this| { .when(supported_options.replacement, |this| {
this.child(div().w_80().child(self.replacement_editor.clone())) this.child(super::toggle_replace_button(self.replace_enabled))
}) }),
.children(match_count) )
.child(nav_button_for_direction("<", Direction::Prev, cx)) .child(
.child(nav_button_for_direction(">", Direction::Next, cx)) h_stack()
.flex() .gap_0p5()
.justify_between() .flex_1()
.when(self.replace_enabled, |this| {
this.child(self.replacement_editor.clone())
.children(replace_next)
.children(replace_all)
}),
)
.child(
h_stack()
.gap_0p5()
.flex_none()
.children(match_count)
.child(nav_button_for_direction("<", Direction::Prev, cx))
.child(nav_button_for_direction(">", Direction::Next, cx)),
)
// let query_column = Flex::row() // let query_column = Flex::row()
// .with_child( // .with_child(

View file

@ -109,8 +109,10 @@ fn toggle_replace_button<V: 'static>(active: bool) -> impl Component<V> {
fn replace_action<V: 'static>( fn replace_action<V: 'static>(
action: impl Action + 'static + Send + Sync, action: impl Action + 'static + Send + Sync,
name: &'static str, name: &'static str,
icon: ui::Icon,
) -> impl Component<V> { ) -> impl Component<V> {
ui::IconButton::new(0, ui::Icon::Replace).on_click(move |_: &mut V, cx| { // todo: add tooltip
ui::IconButton::new(0, icon).on_click(move |_: &mut V, cx| {
cx.dispatch_action(action.boxed_clone()); cx.dispatch_action(action.boxed_clone());
}) })
} }

View file

@ -3,6 +3,7 @@ use gpui::{
div, AnyView, Component, Div, Entity, EntityId, EventEmitter, ParentElement, Render, Styled, div, AnyView, Component, Div, Entity, EntityId, EventEmitter, ParentElement, Render, Styled,
View, ViewContext, WindowContext, View, ViewContext, WindowContext,
}; };
use theme2::ActiveTheme;
use ui::{h_stack, v_stack, Button, Icon, IconButton, Label, LabelColor, StyledExt}; use ui::{h_stack, v_stack, Button, Icon, IconButton, Label, LabelColor, StyledExt};
pub enum ToolbarItemEvent { pub enum ToolbarItemEvent {
@ -81,6 +82,8 @@ impl Render for Toolbar {
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element { fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
//dbg!(&self.items.len()); //dbg!(&self.items.len());
v_stack() v_stack()
.border_b()
.border_color(cx.theme().colors().border)
.child( .child(
h_stack() h_stack()
.justify_between() .justify_between()