e46aca4992
* Add keyboard custom icon * Refactor Settings to be more modular * Add basic keybindings view to settings * Add more shortcuts * Add link to see keyboard shortcuts tab * Little more bottom padding * A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu) * A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu) * Add keybindings to settings search * Add a playwright test for opening the the keyboard shortcuts * fmt --------- Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
36 lines
976 B
TypeScript
36 lines
976 B
TypeScript
import {
|
|
interactionMap,
|
|
sortInteractionMapByCategory,
|
|
} from 'lib/settings/initialKeybindings'
|
|
|
|
interface KeybindingSectionsListProps {
|
|
scrollRef: React.RefObject<HTMLDivElement>
|
|
}
|
|
|
|
export function KeybindingsSectionsList({
|
|
scrollRef,
|
|
}: KeybindingSectionsListProps) {
|
|
return (
|
|
<div className="flex w-32 flex-col gap-3 pr-2 py-1 border-0 border-r border-r-chalkboard-20 dark:border-r-chalkboard-90">
|
|
{Object.entries(interactionMap)
|
|
.sort(sortInteractionMapByCategory)
|
|
.map(([category]) => (
|
|
<button
|
|
key={category}
|
|
onClick={() =>
|
|
scrollRef.current
|
|
?.querySelector(`#category-${category}`)
|
|
?.scrollIntoView({
|
|
block: 'center',
|
|
behavior: 'smooth',
|
|
})
|
|
}
|
|
className="capitalize text-left border-none px-1"
|
|
>
|
|
{category}
|
|
</button>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|