Mirroring/my-links
1
0
Fork 0
mirror of https://github.com/Sonny93/my-links.git synced 2025-12-10 15:35:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: create shortcut hook that with default config

Browse Source
This commit is contained in:
Sonny
2024-05-16 22:03:00 +02:00
committed by Sonny
parent 57ed2c5e94
commit 18b2eb2c5a
6 changed files with 82 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
inertia/components/common/dropdown/dropdown.tsx
View File

@@ -1,12 +1,10 @@
import KEYS from '#constants/keys';
import styled from '@emotion/styled';
import { ReactNode, useRef } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import DropdownContainer from '~/components/common/dropdown/dropdown_container';
import DropdownLabel from '~/components/common/dropdown/dropdown_label';
import useClickOutside from '~/hooks/use_click_outside';
import useGlobalHotkeys from '~/hooks/use_global_hotkeys';
import useToggle from '~/hooks/use_modal';
import useShortcut from '~/hooks/use_shortcut';
const DropdownStyle = styled.div<{ opened: boolean; svgSize?: number }>(
({ opened, theme, svgSize = 24 }) => ({
@@ -44,14 +42,9 @@ export default function Dropdown({
}) {
const dropdownRef = useRef<HTMLDivElement>(null);
const { isShowing, toggle, close } = useToggle();
const { globalHotkeysEnabled } = useGlobalHotkeys();
useClickOutside(dropdownRef, close);
useHotkeys(KEYS.ESCAPE_KEY, close, {
enabled: globalHotkeysEnabled,
enableOnFormTags: ['INPUT'],
});
useShortcut('ESCAPE_KEY', close);
return (
<DropdownStyle

13
inertia/components/common/navigation/back_to_dashboard.tsx
View File

@@ -1,21 +1,14 @@
import KEYS from '#constants/keys';
import { router } from '@inertiajs/react';
import { route } from '@izzyjs/route/client';
import { ReactNode } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import useGlobalHotkeys from '~/hooks/use_global_hotkeys';
import useSearchParam from '~/hooks/use_search_param';
import useShortcut from '~/hooks/use_shortcut';
import { appendCollectionId } from '~/lib/navigation';
export default function BackToDashboard({ children }: { children: ReactNode }) {
const collectionId = useSearchParam('collectionId');
const { globalHotkeysEnabled } = useGlobalHotkeys();
useHotkeys(
KEYS.ESCAPE_KEY,
() => {
router.visit(appendCollectionId(route('dashboard').url, collectionId));
},
{ enabled: globalHotkeysEnabled, enableOnFormTags: ['INPUT'] }
useShortcut('ESCAPE_KEY', () =>
router.visit(appendCollectionId(route('dashboard').url, collectionId))
);
return <>{children}</>;
}