authorgravatar for julius0216@outlook.comJulius Marminge <julius0216@outlook.com> 2026-02-26 18:36:53-08:00
committergravatar for jmarminge@gmail.comJulius Marminge <jmarminge@gmail.com> 2026-02-26 19:03:10-08:00
log1245ce984ba9c79a8eb658f749425d3086bc667b
tree385d226c48a876cd0deab781f0fabdde1f1167b9
parent1de1b0d6be81755b88a6ce99a9705186ac7caa28

Remove mobile Cmd/Ctrl+B sidebar toggle shortcut

- Remove global keydown listener from `SidebarProvider` - Keep sidebar toggling to explicit UI interactions only

1 files changed, 0 insertions(+), 15 deletions(-)

apps/web/src/components/ui/sidebar.tsx-15
...@@ -24,7 +24,6 @@ const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;...@@ -24,7 +24,6 @@ const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
24const SIDEBAR_WIDTH = "16rem";24const SIDEBAR_WIDTH = "16rem";
25const SIDEBAR_WIDTH_MOBILE = "calc(100vw - var(--spacing(3)))";25const SIDEBAR_WIDTH_MOBILE = "calc(100vw - var(--spacing(3)))";
26const SIDEBAR_WIDTH_ICON = "3rem";26const SIDEBAR_WIDTH_ICON = "3rem";
27const SIDEBAR_KEYBOARD_SHORTCUT = "b";
28const SIDEBAR_RESIZE_DEFAULT_MIN_WIDTH = 16 * 16;27const SIDEBAR_RESIZE_DEFAULT_MIN_WIDTH = 16 * 16;
2928
30type SidebarContextProps = {29type SidebarContextProps = {
...@@ -129,20 +128,6 @@ function SidebarProvider({...@@ -129,20 +128,6 @@ function SidebarProvider({
129 return isMobile ? setOpenMobile((open) => !open) : setOpen((open) => !open);128 return isMobile ? setOpenMobile((open) => !open) : setOpen((open) => !open);
130 }, [isMobile, setOpen]);129 }, [isMobile, setOpen]);
131130
132 // Adds a keyboard shortcut to toggle the sidebar.
133 React.useEffect(() => {
134 const handleKeyDown = (event: KeyboardEvent) => {
135 if (!isMobile) return;
136 if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
137 event.preventDefault();
138 toggleSidebar();
139 }
140 };
141
142 window.addEventListener("keydown", handleKeyDown);
143 return () => window.removeEventListener("keydown", handleKeyDown);
144 }, [isMobile, toggleSidebar]);
145
146 // We add a state so that we can do data-state="expanded" or "collapsed".131 // We add a state so that we can do data-state="expanded" or "collapsed".
147 // This makes it easier to style the sidebar with Tailwind classes.132 // This makes it easier to style the sidebar with Tailwind classes.
148 const state = open ? "expanded" : "collapsed";133 const state = open ? "expanded" : "collapsed";