keymap editor: Refine how we display matching keystrokes (#35796)

| Before | After |
|--------|--------|
| <img width="1092" height="528" alt="CleanShot 2025-08-07 at 10  54
42@2x"
src="https://github.com/user-attachments/assets/8b0a3b50-e1d1-4763-824c-2b419df430fc"
/> | <img width="1096" height="580" alt="CleanShot 2025-08-07 at 11  29
47@2x"
src="https://github.com/user-attachments/assets/bd484655-90a6-46fe-91ef-c9c8d2ab93bc"
/> |

Release Notes:

- N/A
This commit is contained in:
Danilo Leal 2025-08-07 11:50:11 -03:00 committed by GitHub
parent 90fa06dd61
commit 262365ca24
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 59 additions and 45 deletions

View file

@ -2415,6 +2415,7 @@ impl Render for KeybindingEditorModal {
.header(
ModalHeader::new().child(
v_flex()
.w_full()
.pb_1p5()
.mb_1()
.gap_0p5()
@ -2438,17 +2439,55 @@ impl Render for KeybindingEditorModal {
.section(
Section::new().child(
v_flex()
.gap_2()
.gap_2p5()
.child(
v_flex()
.child(Label::new("Edit Keystroke"))
.gap_1()
.child(self.keybind_editor.clone()),
.child(Label::new("Edit Keystroke"))
.child(self.keybind_editor.clone())
.child(h_flex().gap_px().when(
matching_bindings_count > 0,
|this| {
let label = format!(
"There {} {} {} with the same keystrokes.",
if matching_bindings_count == 1 {
"is"
} else {
"are"
},
matching_bindings_count,
if matching_bindings_count == 1 {
"binding"
} else {
"bindings"
}
);
this.child(
Label::new(label)
.size(LabelSize::Small)
.color(Color::Muted),
)
.child(
Button::new("show_matching", "View")
.label_size(LabelSize::Small)
.icon(IconName::ArrowUpRight)
.icon_color(Color::Muted)
.icon_size(IconSize::XSmall)
.on_click(cx.listener(
|this, _, window, cx| {
this.show_matching_bindings(
window, cx,
);
},
)),
)
},
)),
)
.when_some(self.action_arguments_editor.clone(), |this, editor| {
this.child(
v_flex()
.mt_1p5()
.gap_1()
.child(Label::new("Edit Arguments"))
.child(editor),
@ -2459,50 +2498,25 @@ impl Render for KeybindingEditorModal {
this.child(
Banner::new()
.severity(error.severity)
// For some reason, the div overflows its container to the
//right. The padding accounts for that.
.child(
div()
.size_full()
.pr_2()
.child(Label::new(error.content.clone())),
),
.child(Label::new(error.content.clone())),
)
}),
),
)
.footer(
ModalFooter::new()
.start_slot(
div().when(matching_bindings_count > 0, |this| {
this.child(
Button::new("show_matching", format!(
"There {} {} {} with the same keystrokes. Click to view",
if matching_bindings_count == 1 { "is" } else { "are" },
matching_bindings_count,
if matching_bindings_count == 1 { "binding" } else { "bindings" }
))
.style(ButtonStyle::Transparent)
.color(Color::Accent)
.on_click(cx.listener(|this, _, window, cx| {
this.show_matching_bindings(window, cx);
}))
)
})
)
.end_slot(
h_flex()
.gap_1()
.child(
Button::new("cancel", "Cancel")
.on_click(cx.listener(|_, _, _, cx| cx.emit(DismissEvent))),
)
.child(Button::new("save-btn", "Save").on_click(cx.listener(
|this, _event, _window, cx| {
this.save_or_display_error(cx);
},
))),
),
ModalFooter::new().end_slot(
h_flex()
.gap_1()
.child(
Button::new("cancel", "Cancel")
.on_click(cx.listener(|_, _, _, cx| cx.emit(DismissEvent))),
)
.child(Button::new("save-btn", "Save").on_click(cx.listener(
|this, _event, _window, cx| {
this.save_or_display_error(cx);
},
))),
),
),
)
}

View file

@ -529,7 +529,7 @@ impl Render for KeystrokeInput {
.w_full()
.flex_1()
.justify_between()
.rounded_lg()
.rounded_sm()
.overflow_hidden()
.map(|this| {
if is_recording {

View file

@ -168,7 +168,7 @@ impl Render for SingleLineInput {
.py_1p5()
.flex_grow()
.text_color(style.text_color)
.rounded_lg()
.rounded_sm()
.bg(style.background_color)
.border_1()
.border_color(style.border_color)