Fix project panel button and style it

Co-authored-by: max <max@zed.dev>
This commit is contained in:
Mikayla Maki 2023-03-07 14:49:05 -08:00
parent 5892f16602
commit ab4b3293d1
7 changed files with 126 additions and 91 deletions

View file

@ -867,7 +867,7 @@ impl LocalWorktree {
let old_path = self.entry_for_id(entry_id)?.path.clone(); let old_path = self.entry_for_id(entry_id)?.path.clone();
let new_path = new_path.into(); let new_path = new_path.into();
let abs_old_path = self.absolutize(&old_path); let abs_old_path = self.absolutize(&old_path);
let abs_new_path = self.absolutize(&new_path); let abs_new_path = self.absolutize(new_path.as_ref());
let rename = cx.background().spawn({ let rename = cx.background().spawn({
let fs = self.fs.clone(); let fs = self.fs.clone();
let abs_new_path = abs_new_path.clone(); let abs_new_path = abs_new_path.clone();

View file

@ -5,9 +5,8 @@ use futures::stream::StreamExt;
use gpui::{ use gpui::{
actions, actions,
anyhow::{anyhow, Result}, anyhow::{anyhow, Result},
color::Color,
elements::{ elements::{
AnchorCorner, Canvas, ChildView, ConstrainedBox, ContainerStyle, Empty, Flex, AnchorCorner, ChildView, ConstrainedBox, Container, ContainerStyle, Empty, Flex,
KeystrokeLabel, Label, MouseEventHandler, ParentElement, ScrollTarget, Stack, Svg, KeystrokeLabel, Label, MouseEventHandler, ParentElement, ScrollTarget, Stack, Svg,
UniformList, UniformListState, UniformList, UniformListState,
}, },
@ -15,7 +14,7 @@ use gpui::{
impl_internal_actions, impl_internal_actions,
keymap_matcher::KeymapContext, keymap_matcher::KeymapContext,
platform::CursorStyle, platform::CursorStyle,
AppContext, ClipboardItem, Element, ElementBox, Entity, ModelHandle, MouseButton, Action, AppContext, ClipboardItem, Element, ElementBox, Entity, ModelHandle, MouseButton,
MutableAppContext, PromptLevel, RenderContext, Task, View, ViewContext, ViewHandle, MutableAppContext, PromptLevel, RenderContext, Task, View, ViewContext, ViewHandle,
}; };
use menu::{Confirm, SelectNext, SelectPrev}; use menu::{Confirm, SelectNext, SelectPrev};
@ -29,7 +28,7 @@ use std::{
path::{Path, PathBuf}, path::{Path, PathBuf},
sync::Arc, sync::Arc,
}; };
use theme::ProjectPanelEntry; use theme::{ContainedText, ProjectPanelEntry};
use unicase::UniCase; use unicase::UniCase;
use workspace::Workspace; use workspace::Workspace;
@ -1317,79 +1316,36 @@ impl View for ProjectPanel {
.boxed() .boxed()
} else { } else {
let parent_view_id = cx.handle().id(); let parent_view_id = cx.handle().id();
Stack::new() Flex::column()
.with_child( .with_child(
MouseEventHandler::<ProjectPanel>::new(1, cx, |_, cx| { MouseEventHandler::<Self>::new(2, cx, {
Stack::new() let button_style = theme.open_project_button.clone();
.with_child( let context_menu_item_style =
Canvas::new(|bounds, _visible_bounds, cx| { cx.global::<Settings>().theme.context_menu.item.clone();
cx.scene.push_quad(gpui::Quad { move |state, cx| {
bounds, let button_style = button_style.style_for(state, false).clone();
background: Some(Color::transparent_black()), let context_menu_item =
..Default::default() context_menu_item_style.style_for(state, true).clone();
})
})
.boxed(),
)
.with_child(
MouseEventHandler::<Self>::new(2, cx, |state, cx| {
let style = &cx
.global::<Settings>()
.theme
.search
.option_button
.style_for(state, false);
let context_menu_item = cx keystroke_label(
.global::<Settings>() parent_view_id,
.theme "Open a new project",
.context_menu &button_style,
.clone() context_menu_item.keystroke,
.item workspace::Open,
.style_for(state, true) cx,
.clone();
Flex::row()
.with_child(
Label::new(
"Open a new project!".to_string(),
context_menu_item.label.clone(),
)
.contained()
.boxed(),
)
.with_child({
KeystrokeLabel::new(
cx.window_id(),
parent_view_id,
Box::new(workspace::Open),
context_menu_item.keystroke.container,
context_menu_item.keystroke.text.clone(),
)
.flex_float()
.boxed()
})
.contained()
.with_style(style.container)
.aligned()
.top()
.constrained()
.with_width(100.)
.with_height(20.)
.boxed()
})
.on_click(MouseButton::Left, move |_, cx| {
cx.dispatch_action(workspace::Open)
})
.with_cursor_style(CursorStyle::PointingHand)
.boxed(),
) )
.boxed() .boxed()
}
}) })
// TODO is this nescessary? .on_click(MouseButton::Left, move |_, cx| {
.on_click(MouseButton::Left, |_, cx| cx.focus_parent_view()) cx.dispatch_action(workspace::Open)
})
.with_cursor_style(CursorStyle::PointingHand)
.boxed(), .boxed(),
) )
.contained()
.with_style(container_style)
.boxed() .boxed()
} }
} }
@ -1401,6 +1357,38 @@ impl View for ProjectPanel {
} }
} }
fn keystroke_label<A>(
view_id: usize,
label_text: &'static str,
label_style: &ContainedText,
keystroke_style: ContainedText,
action: A,
cx: &mut RenderContext<ProjectPanel>,
) -> Container
where
A: Action,
{
Flex::row()
.with_child(
Label::new(label_text, label_style.text.clone())
.contained()
.boxed(),
)
.with_child({
KeystrokeLabel::new(
cx.window_id(),
view_id,
Box::new(action),
keystroke_style.container,
keystroke_style.text.clone(),
)
.flex_float()
.boxed()
})
.contained()
.with_style(label_style.container)
}
impl Entity for ProjectPanel { impl Entity for ProjectPanel {
type Event = Event; type Event = Event;
} }

View file

@ -111,14 +111,10 @@ mod tests {
let default_settings = cx.read(Settings::test); let default_settings = cx.read(Settings::test);
cx.update(|cx| { cx.update(|cx| {
cx.add_global_action(|_: &A, _cx| { cx.add_global_action(|_: &A, _cx| {});
}); cx.add_global_action(|_: &B, _cx| {});
cx.add_global_action(|_: &B, _cx| { cx.add_global_action(|_: &ActivatePreviousPane, _cx| {});
}); cx.add_global_action(|_: &ActivatePrevItem, _cx| {});
cx.add_global_action(|_: &ActivatePreviousPane, _cx| {
});
cx.add_global_action(|_: &ActivatePrevItem, _cx| {
});
watch_files( watch_files(
default_settings, default_settings,
settings_file, settings_file,
@ -132,7 +128,11 @@ mod tests {
// Test loading the keymap base at all // Test loading the keymap base at all
cx.update(|cx| { cx.update(|cx| {
assert_keybindings_for(cx, vec![("backspace", &A), ("k", &ActivatePreviousPane)], line!()); assert_keybindings_for(
cx,
vec![("backspace", &A), ("k", &ActivatePreviousPane)],
line!(),
);
}); });
// Test modifying the users keymap, while retaining the base keymap // Test modifying the users keymap, while retaining the base keymap
@ -152,13 +152,17 @@ mod tests {
) )
.await .await
.unwrap(); .unwrap();
cx.foreground().run_until_parked(); cx.foreground().run_until_parked();
cx.update(|cx| { cx.update(|cx| {
assert_keybindings_for(cx, vec![("backspace", &B), ("k", &ActivatePreviousPane)], line!()); assert_keybindings_for(
cx,
vec![("backspace", &B), ("k", &ActivatePreviousPane)],
line!(),
);
}); });
// Test modifying the base, while retaining the users keymap // Test modifying the base, while retaining the users keymap
fs.save( fs.save(
"/settings.json".as_ref(), "/settings.json".as_ref(),
@ -172,11 +176,15 @@ mod tests {
) )
.await .await
.unwrap(); .unwrap();
cx.foreground().run_until_parked(); cx.foreground().run_until_parked();
cx.update(|cx| { cx.update(|cx| {
assert_keybindings_for(cx, vec![("backspace", &B), ("[", &ActivatePrevItem)], line!()); assert_keybindings_for(
cx,
vec![("backspace", &B), ("[", &ActivatePrevItem)],
line!(),
);
}); });
} }
@ -185,17 +193,22 @@ mod tests {
actions: Vec<(&'static str, &'a dyn Action)>, actions: Vec<(&'static str, &'a dyn Action)>,
line: u32, line: u32,
) { ) {
for (key, action) in actions { for (key, action) in actions {
// assert that... // assert that...
assert!(cx.available_actions(0, 0).any(|(_, bound_action, b)| { assert!(
// action names match... cx.available_actions(0, 0).any(|(_, bound_action, b)| {
bound_action.name() == action.name() // action names match...
bound_action.name() == action.name()
&& bound_action.namespace() == action.namespace() && bound_action.namespace() == action.namespace()
// and key strokes contain the given key // and key strokes contain the given key
&& b.iter() && b.iter()
.any(|binding| binding.keystrokes().iter().any(|k| k.key == key)) .any(|binding| binding.keystrokes().iter().any(|k| k.key == key))
}), "On {} Failed to find {} with keybinding {}", line, action.name(), key); }),
"On {} Failed to find {} with keybinding {}",
line,
action.name(),
key
);
} }
} }

View file

@ -346,6 +346,7 @@ pub struct ProjectPanel {
pub cut_entry: Interactive<ProjectPanelEntry>, pub cut_entry: Interactive<ProjectPanelEntry>,
pub filename_editor: FieldEditor, pub filename_editor: FieldEditor,
pub indent_width: f32, pub indent_width: f32,
pub open_project_button: Interactive<ContainedText>,
} }
#[derive(Clone, Debug, Deserialize, Default)] #[derive(Clone, Debug, Deserialize, Default)]

View file

@ -2815,6 +2815,7 @@ fn open(_: &Open, cx: &mut MutableAppContext) {
directories: true, directories: true,
multiple: true, multiple: true,
}); });
cx.spawn(|mut cx| async move { cx.spawn(|mut cx| async move {
if let Some(paths) = paths.recv().await.flatten() { if let Some(paths) = paths.recv().await.flatten() {
cx.update(|cx| cx.dispatch_global_action(OpenPaths { paths })); cx.update(|cx| cx.dispatch_global_action(OpenPaths { paths }));

View file

@ -237,7 +237,6 @@ fn main() {
let app_state = app_state.clone(); let app_state = app_state.clone();
async move { async move {
while let Some(paths) = open_paths_rx.next().await { while let Some(paths) = open_paths_rx.next().await {
log::error!("OPEN PATHS FROM HANDLE");
cx.update(|cx| workspace::open_paths(&paths, &app_state, cx)) cx.update(|cx| workspace::open_paths(&paths, &app_state, cx))
.detach(); .detach();
} }

View file

@ -29,6 +29,39 @@ export default function projectPanel(colorScheme: ColorScheme) {
} }
return { return {
openProjectButton: {
...text(layer, "mono", "active", { size: "sm" }),
background: background(layer, "on"),
cornerRadius: 6,
border: border(layer, "on"),
margin: {
top: 20,
left: 10,
right: 10
},
padding: {
bottom: 2,
left: 10,
right: 10,
top: 2,
},
active: {
...text(layer, "mono", "on", "inverted"),
background: background(layer, "on", "inverted"),
border: border(layer, "on", "inverted"),
},
clicked: {
...text(layer, "mono", "on", "pressed"),
background: background(layer, "on", "pressed"),
border: border(layer, "on", "pressed"),
},
hover: {
...text(layer, "mono", "on", "hovered"),
background: background(layer, "on", "hovered"),
border: border(layer, "on", "hovered"),
},
},
background: background(layer), background: background(layer),
padding: { left: 12, right: 12, top: 6, bottom: 6 }, padding: { left: 12, right: 12, top: 6, bottom: 6 },
indentWidth: 8, indentWidth: 8,