use dioxus::prelude::*;
use crate::components::modal::Modal;
#[component]
pub fn KeyboardShortcutsDialog(on_close: EventHandler<()>) -> Element {
rsx! {
Modal {
title: "Keyboard Shortcuts".to_string(),
on_close: move |_| on_close.call(()),
div {
class: "keyboard-shortcuts",
div {
class: "keyboard-shortcuts__section",
h4 { class: "keyboard-shortcuts__section-title", "Navigation" }
ShortcutRow { keys: "Ctrl+K", desc: "Open spotlight search" }
ShortcutRow { keys: "Alt+Up/Down", desc: "Previous/Next room" }
ShortcutRow { keys: "Ctrl+`", desc: "Toggle room list" }
}
div {
class: "keyboard-shortcuts__section",
h4 { class: "keyboard-shortcuts__section-title", "Messaging" }
ShortcutRow { keys: "Enter", desc: "Send message" }
ShortcutRow { keys: "Shift+Enter", desc: "New line" }
ShortcutRow { keys: "Arrow Up", desc: "Edit last message (when composer empty)" }
ShortcutRow { keys: "Escape", desc: "Cancel edit / close dialog" }
ShortcutRow { keys: "Ctrl+Shift+E", desc: "Toggle emoji picker" }
}
div {
class: "keyboard-shortcuts__section",
h4 { class: "keyboard-shortcuts__section-title", "Formatting (Rich Text)" }
ShortcutRow { keys: "Ctrl+B", desc: "Bold" }
ShortcutRow { keys: "Ctrl+I", desc: "Italic" }
ShortcutRow { keys: "Ctrl+U", desc: "Underline" }
ShortcutRow { keys: "Ctrl+Shift+X", desc: "Strikethrough" }
ShortcutRow { keys: "Ctrl+Shift+C", desc: "Code block" }
}
div {
class: "keyboard-shortcuts__section",
h4 { class: "keyboard-shortcuts__section-title", "Other" }
ShortcutRow { keys: "Ctrl+/", desc: "Show keyboard shortcuts" }
ShortcutRow { keys: "Ctrl+.", desc: "Toggle right panel" }
ShortcutRow { keys: "Ctrl+F", desc: "Search in room" }
}
}
}
}
}
#[component]
fn ShortcutRow(keys: String, desc: String) -> Element {
rsx! {
div {
class: "keyboard-shortcuts__row",
kbd { class: "keyboard-shortcuts__keys", "{keys}" }
span { class: "keyboard-shortcuts__desc", "{desc}" }
}
}
}