authorgravatar for bortstheboat@gmail.comAndrew Barnes <bortstheboat@gmail.com> 2026-07-20 04:33:43-04:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-07-20 08:33:43+00:00
logdfbda843628c817a48523b1a4a28a6ef232d1d65
tree06d550e17300cbb05f6693664838bcd0f1eafcf7
parent78485e6d50d06180618aacd0d25151e831f666a4
signature Signed by PGP key B5690EEEBB952194

fix(web): handle sidebar shortcut before editors (#3921)

2 files changed, 11 insertions(+), 2 deletions(-)

apps/web/src/components/AppSidebarLayout.tsx+9-2
...@@ -33,6 +33,12 @@ function SidebarControl() {...@@ -33,6 +33,12 @@ function SidebarControl() {
33 useEffect(() => {33 useEffect(() => {
34 const onKeyDown = (event: KeyboardEvent) => {34 const onKeyDown = (event: KeyboardEvent) => {
35 if (event.defaultPrevented) return;35 if (event.defaultPrevented) return;
36 if (
37 event.target instanceof HTMLElement &&
38 event.target.closest("[data-keybinding-capture]")
39 ) {
40 return;
41 }
36 if (resolveShortcutCommand(event, keybindings) !== "sidebar.toggle") return;42 if (resolveShortcutCommand(event, keybindings) !== "sidebar.toggle") return;
3743
38 event.preventDefault();44 event.preventDefault();
...@@ -40,8 +46,9 @@ function SidebarControl() {...@@ -40,8 +46,9 @@ function SidebarControl() {
40 toggleSidebar();46 toggleSidebar();
41 };47 };
4248
43 window.addEventListener("keydown", onKeyDown);49 // Capture before focused editors consume commands such as Mod+B for rich-text formatting.
44 return () => window.removeEventListener("keydown", onKeyDown);50 window.addEventListener("keydown", onKeyDown, true);
51 return () => window.removeEventListener("keydown", onKeyDown, true);
45 }, [keybindings, toggleSidebar]);52 }, [keybindings, toggleSidebar]);
4653
47 return (54 return (
apps/web/src/components/settings/KeybindingsSettings.tsx+2
...@@ -846,6 +846,7 @@ function KeybindingTableRow({...@@ -846,6 +846,7 @@ function KeybindingTableRow({
846 </button>846 </button>
847 ) : (847 ) : (
848 <Input848 <Input
849 data-keybinding-capture=""
849 autoFocus={isRecording}850 autoFocus={isRecording}
850 aria-label={`Keybinding for ${commandLabel(row.command)}`}851 aria-label={`Keybinding for ${commandLabel(row.command)}`}
851 value={isRecording ? "" : keyDraft}852 value={isRecording ? "" : keyDraft}
...@@ -1011,6 +1012,7 @@ function NewKeybindingTableRow({...@@ -1011,6 +1012,7 @@ function NewKeybindingTableRow({
1011 </div>1012 </div>
1012 <div className="flex min-w-0 items-center gap-2 pr-4">1013 <div className="flex min-w-0 items-center gap-2 pr-4">
1013 <Input1014 <Input
1015 data-keybinding-capture=""
1014 aria-label={`Keybinding for ${commandLabelText}`}1016 aria-label={`Keybinding for ${commandLabelText}`}
1015 value={isRecording ? "" : keyDraft}1017 value={isRecording ? "" : keyDraft}
1016 placeholder={isRecording ? "Press shortcut" : "Unassigned"}1018 placeholder={isRecording ? "Press shortcut" : "Unassigned"}