feat: add default keybindings for toggle mode and assets panel (#8593)

## Summary
Add default keyboard shortcuts for mode toggle and assets panel access.

## Changes
- **Ctrl+Shift+A**: Toggle between Simple Mode and Graph Mode
(`Comfy.ToggleLinear`)
- **A**: Open/toggle assets panel (`Workspace.ToggleSidebarTab.assets`)
- Show keybinding in ModeToggle button tooltip (e.g. "Simple Mode
(Ctrl+Shift+A)")

## Keybinding Rationale
- `A` follows the existing pattern: `w` (workflows), `n` (node-lib), `m`
(model-lib)
- `Ctrl+Shift+A` chosen because:
  - Ctrl+Shift is the standard modifier pattern for toggle commands
  - "A" mnemonic for "App mode"
  - Does not conflict with existing keybindings

## Testing
- Verified typecheck passes
- Verified lint passes

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Tooltips now show dynamic keyboard shortcut suffixes for mode and tab
controls.
  * Added keyboard shortcut: A — toggles the assets sidebar.
  * Added keyboard shortcut: Ctrl+Shift+A — toggles linear mode.

* **Localization**
* Added a localized shortcut suffix template so displayed shortcuts
respect translations.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8593-feat-add-default-keybindings-for-toggle-mode-and-assets-panel-2fc6d73d36508172bd6ed3378f43de55)
by [Unito](https://www.unito.io)

---------

Co-authored-by: GitHub Action <action@github.com>
This commit is contained in:
Christian Byrne
2026-02-03 16:06:33 -08:00
committed by GitHub
parent f98232c272
commit 66e776774a
4 changed files with 34 additions and 6 deletions

View File

@@ -1,10 +1,22 @@
<script setup lang="ts">
import { computed } from 'vue'
import Button from '@/components/ui/button/Button.vue'
import { t } from '@/i18n'
import { useKeybindingStore } from '@/platform/keybindings/keybindingStore'
import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
import { useCommandStore } from '@/stores/commandStore'
const canvasStore = useCanvasStore()
const keybindingStore = useKeybindingStore()
const keybindingSuffix = computed(() => {
const shortcut = keybindingStore
.getKeybindingByCommandId('Comfy.ToggleLinear')
?.combo.toString()
return shortcut ? t('g.shortcutSuffix', { shortcut }) : ''
})
function toggleLinearMode() {
useCommandStore().execute('Comfy.ToggleLinear', {
metadata: { source: 'button' }
@@ -18,7 +30,7 @@ function toggleLinearMode() {
>
<Button
v-tooltip="{
value: t('linearMode.linearMode'),
value: t('linearMode.linearMode') + keybindingSuffix,
showDelay: 300,
hideDelay: 300
}"
@@ -30,7 +42,7 @@ function toggleLinearMode() {
</Button>
<Button
v-tooltip="{
value: t('linearMode.graphMode'),
value: t('linearMode.graphMode') + keybindingSuffix,
showDelay: 300,
hideDelay: 300
}"

View File

@@ -66,6 +66,7 @@ import SidebarBottomPanelToggleButton from '@/components/sidebar/SidebarBottomPa
import SidebarSettingsButton from '@/components/sidebar/SidebarSettingsButton.vue'
import SidebarShortcutsToggleButton from '@/components/sidebar/SidebarShortcutsToggleButton.vue'
import { useFeatureFlags } from '@/composables/useFeatureFlags'
import { t } from '@/i18n'
import { isCloud } from '@/platform/distribution/types'
import { useSettingStore } from '@/platform/settings/settingStore'
import { useTelemetry } from '@/platform/telemetry'
@@ -151,10 +152,10 @@ const onTabClick = async (item: SidebarTabExtension) => {
const keybindingStore = useKeybindingStore()
const getTabTooltipSuffix = (tab: SidebarTabExtension) => {
const keybinding = keybindingStore.getKeybindingByCommandId(
`Workspace.ToggleSidebarTab.${tab.id}`
)
return keybinding ? ` (${keybinding.combo.toString()})` : ''
const shortcut = keybindingStore
.getKeybindingByCommandId(`Workspace.ToggleSidebarTab.${tab.id}`)
?.combo.toString()
return shortcut ? t('g.shortcutSuffix', { shortcut }) : ''
}
const isOverflowing = ref(false)

View File

@@ -1,5 +1,6 @@
{
"g": {
"shortcutSuffix": " ({shortcut})",
"user": "User",
"you": "You",
"currentUser": "Current user",

View File

@@ -48,6 +48,20 @@ export const CORE_KEYBINDINGS: Keybinding[] = [
},
commandId: 'Workspace.ToggleSidebarTab.model-library'
},
{
combo: {
key: 'a'
},
commandId: 'Workspace.ToggleSidebarTab.assets'
},
{
combo: {
ctrl: true,
shift: true,
key: 'a'
},
commandId: 'Comfy.ToggleLinear'
},
{
combo: {
key: 's',