feat: close RightDrawer with ESC key (#719)

Closes #576
This commit is contained in:
Thaïs
2023-07-18 18:02:08 +02:00
committed by GitHub
parent 4d37270e74
commit 434ea605a8

View File

@ -3,6 +3,7 @@ import { useTheme } from '@emotion/react';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import { motion } from 'framer-motion'; import { motion } from 'framer-motion';
import { useRecoilState } from 'recoil'; import { useRecoilState } from 'recoil';
import { Key } from 'ts-key-enum';
import { import {
ClickOutsideMode, ClickOutsideMode,
@ -10,8 +11,10 @@ import {
} from '@/ui/hooks/useListenClickOutsideArrayOfRef'; } from '@/ui/hooks/useListenClickOutsideArrayOfRef';
import { isDefined } from '~/utils/isDefined'; import { isDefined } from '~/utils/isDefined';
import { useScopedHotkeys } from '../../hotkey/hooks/useScopedHotkeys';
import { isRightDrawerOpenState } from '../states/isRightDrawerOpenState'; import { isRightDrawerOpenState } from '../states/isRightDrawerOpenState';
import { rightDrawerPageState } from '../states/rightDrawerPageState'; import { rightDrawerPageState } from '../states/rightDrawerPageState';
import { RightDrawerHotkeyScope } from '../types/RightDrawerHotkeyScope';
import { RightDrawerRouter } from './RightDrawerRouter'; import { RightDrawerRouter } from './RightDrawerRouter';
@ -47,6 +50,14 @@ export function RightDrawer() {
mode: ClickOutsideMode.absolute, mode: ClickOutsideMode.absolute,
}); });
const theme = useTheme(); const theme = useTheme();
useScopedHotkeys(
[Key.Escape],
() => setIsRightDrawerOpen(false),
RightDrawerHotkeyScope.RightDrawer,
[setIsRightDrawerOpen],
);
if (!isDefined(rightDrawerPage)) { if (!isDefined(rightDrawerPage)) {
return <></>; return <></>;
} }