From 5da3467bc1ee1ec023806c30d964bb44326a6e3a Mon Sep 17 00:00:00 2001 From: Waleed Latif Date: Sat, 11 Jul 2026 20:57:08 -0700 Subject: [PATCH 1/4] feat(sidebar): add Cmd+B shortcut to toggle sidebar collapse --- .../rich-markdown-editor.tsx | 2 +- .../rich-markdown-field.tsx | 5 +++-- .../[workspaceId]/utils/commands-utils.ts | 6 ++++++ .../w/components/sidebar/sidebar.tsx | 17 +++++++++++++++-- 4 files changed, 25 insertions(+), 5 deletions(-) diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-editor.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-editor.tsx index 9107dbd795d..b2d6449d096 100644 --- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-editor.tsx +++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-editor.tsx @@ -298,7 +298,7 @@ export function LoadedRichMarkdownEditor({ shouldRerenderOnTransaction: false, content: initialContent, editorProps: { - attributes: { class: 'rich-markdown-prose', 'data-owned-shortcuts': 'Mod+K' }, + attributes: { class: 'rich-markdown-prose', 'data-owned-shortcuts': 'Mod+K,Mod+B' }, handleKeyDown: (_view, event) => { const isSaveShortcut = (event.metaKey || event.ctrlKey) && event.key?.toLowerCase() === 's' if (!isSaveShortcut) return false diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-field.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-field.tsx index 8936c9a489b..e34566606d5 100644 --- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-field.tsx +++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-field.tsx @@ -105,8 +105,9 @@ function LoadedRichMarkdownField({ editorProps: { attributes: { class: 'rich-markdown-prose rich-markdown-field-prose', - // Claim ⌘K so the bubble-menu link editor wins over the global search palette. - 'data-owned-shortcuts': 'Mod+K', + // Claim ⌘K so the bubble-menu link editor wins over the global search palette, + // and ⌘B so bold wins over the global sidebar toggle. + 'data-owned-shortcuts': 'Mod+K,Mod+B', }, handlePaste: (_view, event) => { const handler = onPasteTextRef.current diff --git a/apps/sim/app/workspace/[workspaceId]/utils/commands-utils.ts b/apps/sim/app/workspace/[workspaceId]/utils/commands-utils.ts index 24a6eead3ad..2f5f9be26cb 100644 --- a/apps/sim/app/workspace/[workspaceId]/utils/commands-utils.ts +++ b/apps/sim/app/workspace/[workspaceId]/utils/commands-utils.ts @@ -17,6 +17,7 @@ export type CommandId = | 'clear-terminal-console' | 'focus-toolbar-search' | 'fit-to-view' + | 'toggle-sidebar' /** * Static metadata for a global command. @@ -92,6 +93,11 @@ export const COMMAND_DEFINITIONS: Record = { shortcut: 'Mod+Shift+F', allowInEditable: false, }, + 'toggle-sidebar': { + id: 'toggle-sidebar', + shortcut: 'Mod+B', + allowInEditable: true, + }, } /** diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx index 6929727cc15..66a04dfd0d4 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx @@ -120,18 +120,20 @@ export function SidebarTooltip({ label, enabled, side = 'right', + shortcut, }: { children: React.ReactElement label: string enabled: boolean side?: 'right' | 'bottom' + shortcut?: string }) { if (!enabled) return children return ( {children} -

{label}

+ {shortcut ? {label} :

{label}

}
) @@ -1234,6 +1236,12 @@ export const Sidebar = memo(function Sidebar({ isCollapsed }: SidebarProps) { handleCreateWorkflow() }, }, + { + id: 'toggle-sidebar', + handler: () => { + toggleCollapsed() + }, + }, ]) ) @@ -1284,7 +1292,12 @@ export const Sidebar = memo(function Sidebar({ isCollapsed }: SidebarProps) { isCollapsed={isCollapsed} onExpandSidebar={toggleCollapsed} /> - +