feat: add keyboard shortcut for unselect button

This commit is contained in:
MAZE 2024-04-26 15:03:02 +03:30
parent d3a2a12e1f
commit 99f3a41598

View file

@ -1,3 +1,4 @@
import { useEffect, useCallback } from 'react';
import { BiUndo, BiTrash } from 'react-icons/bi/index'; import { BiUndo, BiTrash } from 'react-icons/bi/index';
import { AnimatePresence, motion } from 'framer-motion'; import { AnimatePresence, motion } from 'framer-motion';
@ -20,6 +21,23 @@ export function UnselectButton() {
exit: { opacity: 0 }, exit: { opacity: 0 },
}; };
const handleToggle = useCallback(() => {
if (hasHistory) restoreHistory();
else if (!noSelected) unselectAll(true);
}, [hasHistory, noSelected, unselectAll, restoreHistory]);
useEffect(() => {
const listener = (e: KeyboardEvent) => {
if (e.shiftKey && e.key === 'R') {
handleToggle();
}
};
document.addEventListener('keydown', listener);
return () => document.removeEventListener('keydown', listener);
}, [handleToggle]);
return ( return (
<> <>
<AnimatePresence mode="wait"> <AnimatePresence mode="wait">
@ -49,10 +67,7 @@ export function UnselectButton() {
styles.unselectButton, styles.unselectButton,
noSelected && !hasHistory && styles.disabled, noSelected && !hasHistory && styles.disabled,
)} )}
onClick={() => { onClick={handleToggle}
if (hasHistory) restoreHistory();
else if (!noSelected) unselectAll(true);
}}
> >
{hasHistory ? <BiUndo /> : <BiTrash />} {hasHistory ? <BiUndo /> : <BiTrash />}
</button> </button>