refactor: unified shortcut keys display using component (#31713)

This commit is contained in:
CrabSAMA
2026-01-29 17:57:46 +08:00
committed by GitHub
parent 62f46fc55c
commit 7d1ad7e03a
14 changed files with 41 additions and 106 deletions

View File

@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next'
import { cn } from '@/utils/classnames'
import Button from '../base/button'
import Tooltip from '../base/tooltip'
import { getKeyboardKeyNameBySystem } from '../workflow/utils'
import ShortcutsName from '../workflow/shortcuts-name'
type TooltipContentProps = {
expand: boolean
@ -20,18 +20,7 @@ const TooltipContent = ({
return (
<div className="flex items-center gap-x-1">
<span className="system-xs-medium px-0.5 text-text-secondary">{expand ? t('sidebar.collapseSidebar', { ns: 'layout' }) : t('sidebar.expandSidebar', { ns: 'layout' })}</span>
<div className="flex items-center gap-x-0.5">
{
TOGGLE_SHORTCUT.map(key => (
<span
key={key}
className="system-kbd inline-flex items-center justify-center rounded-[4px] bg-components-kbd-bg-gray px-1 text-text-tertiary"
>
{getKeyboardKeyNameBySystem(key)}
</span>
))
}
</div>
<ShortcutsName keys={TOGGLE_SHORTCUT} textColor="secondary" />
</div>
)
}