HotkeySettings.tsx42 lines · main

1	import { Card } from 'ui'
2	import {
3	PageSection,
4	PageSectionContent,
5	PageSectionDescription,
6	PageSectionMeta,
7	PageSectionSummary,
8	PageSectionTitle,
9	} from 'ui-patterns/PageSection'
10
11	import { HotkeyToggle } from './HotkeyToggle'
12	import { SHORTCUT_DEFINITIONS } from '@/state/shortcuts/registry'
13
14	const SHORTCUT_ORDER = Object.values(SHORTCUT_DEFINITIONS).filter(
15	(definition) => definition.showInSettings !== false
16	)
17
18	export const HotkeySettings = () => {
19	return (
20	<PageSection>
21	<PageSectionMeta>
22	<PageSectionSummary>
23	<PageSectionTitle id="keyboard-shortcuts">Keyboard shortcuts</PageSectionTitle>
24	<PageSectionDescription>
25	Choose which shortcuts stay active while working in the dashboard.
26	</PageSectionDescription>
27	</PageSectionSummary>
28	</PageSectionMeta>
29	<PageSectionContent>
30	<Card>
31	{SHORTCUT_ORDER.map((definition, index) => (
32	<HotkeyToggle
33	key={definition.id}
34	definition={definition}
35	isLast={index === SHORTCUT_ORDER.length - 1}
36	/>
37	))}
38	</Card>
39	</PageSectionContent>
40	</PageSection>
41	)
42	}