Skip to content

Commit 9e01dfa

Browse files
antfuclaude
antfu
and
claude
committed
fix: merge command shortcuts into user settings for persistence
Consolidate `devtoolskit:internal:command-shortcuts` shared state into `user-settings` so keyboard shortcut overrides are persisted to disk alongside other user preferences. Also improve RPC resilience by handling missing shared states gracefully. **Changes:** - Add `commandShortcuts` field to `DevToolsDocksUserSettings` type - Remove separate `command-shortcuts` from RPC shared state registry - Update client command context to read shortcuts from settings store - Make server RPC handlers resilient to missing states (return undefined/no-op) - Update settings UI to mutate shortcuts within settings object - Prevent client from overwriting initial values with undefined server response Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
1 parent 5ab172b commit 9e01dfa

13 files changed

Lines changed: 33 additions & 35 deletions

File tree

‎packages/core/src/client/webcomponents/components/views-builtin/SettingsAdvanced.vue‎

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
<script setup lang="ts">
2-
import type { DevToolsCommandKeybinding } from '@vitejs/devtools-kit'
32
import type { DocksContext } from '@vitejs/devtools-kit/client'
43
import type { SharedState } from '@vitejs/devtools-kit/utils/shared-state'
54
import type { DevToolsDocksUserSettings } from '../../state/dock-settings'
@@ -16,19 +15,14 @@ function resetAllSettings() {
1615
props.settingsStore.mutate(() => {
1716
return DEFAULT_STATE_USER_SETTINGS()
1817
})
19-
props.context.commands.shortcutOverrides.mutate((state: Record<string, DevToolsCommandKeybinding[]>) => {
20-
for (const key of Object.keys(state))
21-
delete state[key]
22-
})
2318
}
2419
}
2520
2621
function resetShortcuts() {
2722
// eslint-disable-next-line no-alert
2823
if (confirm('Reset all keyboard shortcuts to defaults?')) {
29-
props.context.commands.shortcutOverrides.mutate((state: Record<string, DevToolsCommandKeybinding[]>) => {
30-
for (const key of Object.keys(state))
31-
delete state[key]
24+
props.settingsStore.mutate((state) => {
25+
state.commandShortcuts = {}
3226
})
3327
}
3428
}

‎packages/core/src/client/webcomponents/components/views-builtin/SettingsShortcuts.vue‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@ const props = defineProps<{
1212
}>()
1313
1414
const commandsCtx = props.context.commands
15-
const shortcutOverrides = sharedStateToRef(commandsCtx.shortcutOverrides)
15+
const settings = sharedStateToRef(commandsCtx.settings)
16+
const shortcutOverrides = computed(() => settings.value.commandShortcuts ?? {})
1617
const shortcutSearch = ref('')
1718
1819
interface ShortcutRow {
@@ -58,14 +59,14 @@ function isOverridden(id: string): boolean {
5859
}
5960
6061
function clearShortcut(commandId: string) {
61-
commandsCtx.shortcutOverrides.mutate((state: Record<string, DevToolsCommandKeybinding[]>) => {
62-
state[commandId] = []
62+
commandsCtx.settings.mutate((state) => {
63+
state.commandShortcuts[commandId] = []
6364
})
6465
}
6566
6667
function resetShortcut(commandId: string) {
67-
commandsCtx.shortcutOverrides.mutate((state: Record<string, DevToolsCommandKeybinding[]>) => {
68-
delete state[commandId]
68+
commandsCtx.settings.mutate((state) => {
69+
delete state.commandShortcuts[commandId]
6970
})
7071
}
7172
@@ -186,8 +187,8 @@ function onEditorKeyDown(e: KeyboardEvent) {
186187
function saveEditor() {
187188
if (!editorCommandId.value || !editorCanSave.value)
188189
return
189-
commandsCtx.shortcutOverrides.mutate((state: Record<string, DevToolsCommandKeybinding[]>) => {
190-
state[editorCommandId.value!] = [{ key: editorComposedKey.value }]
190+
commandsCtx.settings.mutate((state) => {
191+
state.commandShortcuts[editorCommandId.value!] = [{ key: editorComposedKey.value }]
191192
})
192193
closeEditor()
193194
}

‎packages/core/src/client/webcomponents/state/__tests__/context-cache.test.ts‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -22,11 +22,6 @@ function createMockRpc(entries: DevToolsDockEntry[] = []): DevToolsRpcClient {
2222
enablePatches: false,
2323
})
2424

25-
const shortcutsState = createSharedState({
26-
initialValue: {} as Record<string, any>,
27-
enablePatches: false,
28-
})
29-
3025
return {
3126
sharedState: {
3227
get: async (key: string) => {
@@ -36,8 +31,6 @@ function createMockRpc(entries: DevToolsDockEntry[] = []): DevToolsRpcClient {
3631
return settingsState as any
3732
if (key === 'devtoolskit:internal:commands')
3833
return commandsState as any
39-
if (key === 'devtoolskit:internal:command-shortcuts')
40-
return shortcutsState as any
4134
throw new Error(`Unexpected shared state key: ${key}`)
4235
},
4336
},

‎packages/core/src/client/webcomponents/state/commands.ts‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import type { DevToolsClientCommand, DevToolsCommandEntry, DevToolsCommandKeybinding, DevToolsServerCommandEntry, WhenContext } from '@vitejs/devtools-kit'
1+
import type { DevToolsClientCommand, DevToolsCommandEntry, DevToolsCommandKeybinding, DevToolsDocksUserSettings, DevToolsServerCommandEntry, WhenContext } from '@vitejs/devtools-kit'
22
import type { CommandsContext, DevToolsRpcClient } from '@vitejs/devtools-kit/client'
3+
import type { SharedState } from '@vitejs/devtools-kit/utils/shared-state'
34
import type { ShallowRef } from 'vue'
45
import { evaluateWhen } from '@vitejs/devtools-kit/utils/when'
56
import { computed, markRaw, reactive, ref } from 'vue'
@@ -13,6 +14,7 @@ const commandsContextByRpc = new WeakMap<DevToolsRpcClient, CommandsContext>()
1314
export async function createCommandsContext(
1415
clientType: 'embedded' | 'standalone',
1516
rpc: DevToolsRpcClient,
17+
settingsState: SharedState<DevToolsDocksUserSettings>,
1618
whenContextProvider?: () => WhenContext,
1719
): Promise<CommandsContext> {
1820
if (commandsContextByRpc.has(rpc)) {
@@ -26,9 +28,9 @@ export async function createCommandsContext(
2628
// Client commands (local registry)
2729
const clientCommands = reactive(new Map<string, DevToolsClientCommand>())
2830

29-
// Shortcut overrides
30-
const shortcutOverridesState = await rpc.sharedState.get('devtoolskit:internal:command-shortcuts', { initialValue: {} })
31-
const shortcutOverrides = sharedStateToRef(shortcutOverridesState)
31+
// Shortcut overrides from user settings
32+
const settings = sharedStateToRef(settingsState)
33+
const shortcutOverrides = computed(() => settings.value.commandShortcuts ?? {})
3234

3335
const paletteOpen = ref(false)
3436

@@ -135,7 +137,7 @@ export async function createCommandsContext(
135137
register,
136138
execute,
137139
getKeybindings,
138-
shortcutOverrides: markRaw(shortcutOverridesState),
140+
settings: markRaw(settingsState),
139141
paletteOpen,
140142
})
141143

‎packages/core/src/client/webcomponents/state/context.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ export async function createDocksContext(
124124
})
125125

126126
// Initialize commands context with reactive when-context
127-
const commandsContextResult = await createCommandsContext(clientType, rpc, getWhenContext)
127+
const commandsContextResult = await createCommandsContext(clientType, rpc, settingsStore, getWhenContext)
128128
commandsContext = commandsContextResult
129129

130130
// Register built-in client commands

‎packages/core/src/node/rpc/index.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { DevToolsCommandShortcutOverrides, DevToolsDockEntry, DevToolsDocksUserSettings, DevToolsServerCommandEntry, DevToolsTerminalSessionStreamChunkEvent, RpcDefinitionsFilter, RpcDefinitionsToFunctions } from '@vitejs/devtools-kit'
1+
import type { DevToolsDockEntry, DevToolsDocksUserSettings, DevToolsServerCommandEntry, DevToolsTerminalSessionStreamChunkEvent, RpcDefinitionsFilter, RpcDefinitionsToFunctions } from '@vitejs/devtools-kit'
22
import type { SharedStatePatch } from '@vitejs/devtools-kit/utils/shared-state'
33
import { anonymousAuth } from './anonymous/auth'
44
import { commandsExecute } from './internal/commands-execute'
@@ -80,7 +80,6 @@ declare module '@vitejs/devtools-kit' {
8080

8181
// @keep-sorted
8282
export interface DevToolsRpcSharedStates {
83-
'devtoolskit:internal:command-shortcuts': DevToolsCommandShortcutOverrides
8483
'devtoolskit:internal:commands': DevToolsServerCommandEntry[]
8584
'devtoolskit:internal:docks': DevToolsDockEntry[]
8685
'devtoolskit:internal:user-settings': DevToolsDocksUserSettings

‎packages/core/src/node/rpc/internal/state/get.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ export const sharedStateGet = defineRpcFunction({
1313
setup: (context: DevToolsNodeContext) => {
1414
return {
1515
handler: async (key: string): Promise<any> => {
16+
if (!context.rpc.sharedState.keys().includes(key))
17+
return undefined
1618
const state = await context.rpc.sharedState.get(key as keyof DevToolsRpcSharedStates)
1719
return state.value()
1820
},

‎packages/core/src/node/rpc/internal/state/patch.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ export const sharedStatePatch = defineRpcFunction({
88
setup: (context: DevToolsNodeContext) => {
99
return {
1010
handler: async (key: string, patches: SharedStatePatch[], syncId: string) => {
11+
if (!context.rpc.sharedState.keys().includes(key))
12+
return
1113
const state = await context.rpc.sharedState.get(key as keyof DevToolsRpcSharedStates)
1214
state.patch(patches, syncId)
1315
},

‎packages/core/src/node/rpc/internal/state/set.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export const sharedStateSet = defineRpcFunction({
77
setup: (context: DevToolsNodeContext) => {
88
return {
99
handler: async (key: string, value: any, syncId: string) => {
10-
const state = await context.rpc.sharedState.get(key as keyof DevToolsRpcSharedStates)
10+
const state = await context.rpc.sharedState.get(key as keyof DevToolsRpcSharedStates, { initialValue: value })
1111
state.mutate(() => value, syncId)
1212
},
1313
}

‎packages/kit/src/client/docks.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { RpcFunctionsCollector } from '@vitejs/devtools-rpc'
2-
import type { DevToolsClientCommand, DevToolsCommandEntry, DevToolsCommandKeybinding, DevToolsCommandShortcutOverrides, DevToolsDockEntriesGrouped, DevToolsDockEntry, DevToolsDocksUserSettings, DevToolsDockUserEntry, DevToolsRpcClientFunctions, EventEmitter, WhenContext } from '../types'
2+
import type { DevToolsClientCommand, DevToolsCommandEntry, DevToolsCommandKeybinding, DevToolsDockEntriesGrouped, DevToolsDockEntry, DevToolsDocksUserSettings, DevToolsDockUserEntry, DevToolsRpcClientFunctions, EventEmitter, WhenContext } from '../types'
33
import type { SharedState } from '../utils/shared-state'
44
import type { DevToolsRpcClient } from './rpc'
55

@@ -135,9 +135,9 @@ export interface CommandsContext {
135135
*/
136136
getKeybindings: (id: string) => DevToolsCommandKeybinding[]
137137
/**
138-
* Shortcut overrides (persisted via shared state)
138+
* User settings store (persisted, includes command shortcuts)
139139
*/
140-
shortcutOverrides: SharedState<DevToolsCommandShortcutOverrides>
140+
settings: SharedState<DevToolsDocksUserSettings>
141141
/**
142142
* Whether the command palette is open
143143
*/

0 commit comments

Comments
 (0)