Make the command bar button hotkey label update live

This commit is contained in:
Frank Noirot
2024-10-28 14:53:56 -04:00
parent 5374fab199
commit 1cb519e66c
2 changed files with 16 additions and 4 deletions

View File

@ -2,10 +2,22 @@ import { useCommandsContext } from 'hooks/useCommandsContext'
import usePlatform from 'hooks/usePlatform' import usePlatform from 'hooks/usePlatform'
import { hotkeyDisplay } from 'lib/hotkeyWrapper' import { hotkeyDisplay } from 'lib/hotkeyWrapper'
import { COMMAND_PALETTE_HOTKEY } from './CommandBar/CommandBar' import { COMMAND_PALETTE_HOTKEY } from './CommandBar/CommandBar'
import { KEYBINDING_CATEGORIES } from 'lib/constants'
import { useMemo } from 'react'
import { useInteractionMapContext } from 'hooks/useInteractionMapContext'
export function CommandBarOpenButton() { export function CommandBarOpenButton() {
const { commandBarSend } = useCommandsContext()
const platform = usePlatform() const platform = usePlatform()
const { commandBarSend } = useCommandsContext()
const { state: interactionMapState } = useInteractionMapContext()
const resolvedKeybinding = useMemo(
() =>
interactionMapState.context.overrides[
`${KEYBINDING_CATEGORIES.COMMAND_BAR}.toggle`
] || COMMAND_PALETTE_HOTKEY,
[interactionMapState.context.overrides]
)
return ( return (
<button <button
@ -15,7 +27,7 @@ export function CommandBarOpenButton() {
> >
<span>Commands</span> <span>Commands</span>
<kbd className="bg-primary/10 dark:bg-chalkboard-80 dark:group-hover:bg-primary font-mono rounded-sm dark:text-inherit inline-block px-1 border-primary dark:border-chalkboard-90"> <kbd className="bg-primary/10 dark:bg-chalkboard-80 dark:group-hover:bg-primary font-mono rounded-sm dark:text-inherit inline-block px-1 border-primary dark:border-chalkboard-90">
{hotkeyDisplay(COMMAND_PALETTE_HOTKEY, platform)} {hotkeyDisplay(resolvedKeybinding, platform)}
</kbd> </kbd>
</button> </button>
) )

View File

@ -65,7 +65,7 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) {
id: 'export', id: 'export',
title: 'Export part', title: 'Export part',
icon: 'floppyDiskArrow', icon: 'floppyDiskArrow',
keybinding: 'Ctrl + Shift + E', keybinding: 'Ctrl+Shift+E',
action: () => action: () =>
commandBarSend({ commandBarSend({
type: 'Find and select command', type: 'Find and select command',
@ -76,7 +76,7 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) {
id: 'make', id: 'make',
title: 'Make part', title: 'Make part',
icon: 'printer3d', icon: 'printer3d',
keybinding: 'Ctrl + Shift + M', keybinding: 'Ctrl+Shift+M',
// eslint-disable-next-line @typescript-eslint/no-misused-promises // eslint-disable-next-line @typescript-eslint/no-misused-promises
action: async () => { action: async () => {
commandBarSend({ commandBarSend({