diff --git a/front/src/AppInternalHooks.tsx b/front/src/AppInternalHooks.tsx index 1c70b13728..fdae89916a 100644 --- a/front/src/AppInternalHooks.tsx +++ b/front/src/AppInternalHooks.tsx @@ -1,15 +1,15 @@ import { AnalyticsHook } from './sync-hooks/AnalyticsHook'; import { GotoHotkeysHooks } from './sync-hooks/GotoHotkeysHooks'; -import { HotkeysScopeAutoSyncHook } from './sync-hooks/HotkeysScopeAutoSyncHook'; -import { HotkeysScopeBrowserRouterSync } from './sync-hooks/HotkeysScopeBrowserRouterSync'; +import { HotkeyScopeAutoSyncHook } from './sync-hooks/HotkeyScopeAutoSyncHook'; +import { HotkeyScopeBrowserRouterSync } from './sync-hooks/HotkeyScopeBrowserRouterSync'; export function AppInternalHooks() { return ( <> - - + + ); } diff --git a/front/src/index.tsx b/front/src/index.tsx index 261b9e2f6e..5f1ac74233 100644 --- a/front/src/index.tsx +++ b/front/src/index.tsx @@ -4,7 +4,7 @@ import { HotkeysProvider } from 'react-hotkeys-hook'; import { BrowserRouter } from 'react-router-dom'; import { RecoilRoot } from 'recoil'; -import { INITIAL_HOTKEYS_SCOPES } from '@/hotkeys/constants'; +import { INITIAL_HOTKEYS_SCOPES } from '@/lib/hotkeys/constants'; import { ThemeType } from '@/ui/themes/themes'; import '@emotion/react'; diff --git a/front/src/modules/command-menu/components/CommandMenu.tsx b/front/src/modules/command-menu/components/CommandMenu.tsx index a7b2c149d1..c109c89f1f 100644 --- a/front/src/modules/command-menu/components/CommandMenu.tsx +++ b/front/src/modules/command-menu/components/CommandMenu.tsx @@ -1,8 +1,8 @@ import { useRecoilState } from 'recoil'; -import { usePreviousHotkeysScope } from '@/hotkeys/hooks/internal/usePreviousHotkeysScope'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { usePreviousHotkeyScope } from '@/lib/hotkeys/hooks/usePreviousHotkeyScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; +import { AppHotkeyScope } from '@/lib/hotkeys/types/AppHotkeyScope'; import { isCommandMenuOpenedState } from '../states/isCommandMenuOpened'; @@ -23,22 +23,22 @@ export function CommandMenu() { () => { handleOpenChange(!open); }, - InternalHotkeysScope.CommandMenu, + AppHotkeyScope.CommandMenu, [setOpen, open, handleOpenChange], ); const { - setHotkeysScopeAndMemorizePreviousScope, - goBackToPreviousHotkeysScope, - } = usePreviousHotkeysScope(); + setHotkeyScopeAndMemorizePreviousScope, + goBackToPreviousHotkeyScope, + } = usePreviousHotkeyScope(); function handleOpenChange(newOpenState: boolean) { if (newOpenState) { setOpen(true); - setHotkeysScopeAndMemorizePreviousScope(InternalHotkeysScope.CommandMenu); + setHotkeyScopeAndMemorizePreviousScope(AppHotkeyScope.CommandMenu); } else { setOpen(false); - goBackToPreviousHotkeysScope(); + goBackToPreviousHotkeyScope(); } } diff --git a/front/src/modules/comments/components/comment-thread/CommentThreadRelationPicker.tsx b/front/src/modules/comments/components/comment-thread/CommentThreadRelationPicker.tsx index 2790f1a828..2b3516f34a 100644 --- a/front/src/modules/comments/components/comment-thread/CommentThreadRelationPicker.tsx +++ b/front/src/modules/comments/components/comment-thread/CommentThreadRelationPicker.tsx @@ -11,13 +11,13 @@ import { import { useHandleCheckableCommentThreadTargetChange } from '@/comments/hooks/useHandleCheckableCommentThreadTargetChange'; import { CommentableEntityForSelect } from '@/comments/types/CommentableEntityForSelect'; import { CompanyChip } from '@/companies/components/CompanyChip'; -import { usePreviousHotkeysScope } from '@/hotkeys/hooks/internal/usePreviousHotkeysScope'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { usePreviousHotkeyScope } from '@/lib/hotkeys/hooks/usePreviousHotkeyScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { PersonChip } from '@/people/components/PersonChip'; import { RecoilScope } from '@/recoil-scope/components/RecoilScope'; import { MultipleEntitySelect } from '@/relation-picker/components/MultipleEntitySelect'; import { useFilteredSearchEntityQuery } from '@/relation-picker/hooks/useFilteredSearchEntityQuery'; +import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope'; import { useListenClickOutsideArrayOfRef } from '@/ui/hooks/useListenClickOutsideArrayOfRef'; import { flatMapAndSortEntityForSelectArrayOfArrayByName } from '@/ui/utils/flatMapAndSortEntityForSelectArrayByName'; import { getLogoUrlFromDomainName } from '@/utils/utils'; @@ -122,17 +122,17 @@ export function CommentThreadRelationPicker({ commentThread }: OwnProps) { }); const { - setHotkeysScopeAndMemorizePreviousScope, - goBackToPreviousHotkeysScope, - } = usePreviousHotkeysScope(); + setHotkeyScopeAndMemorizePreviousScope, + goBackToPreviousHotkeyScope, + } = usePreviousHotkeyScope(); function handleRelationContainerClick() { if (isMenuOpen) { exitEditMode(); } else { setIsMenuOpen(true); - setHotkeysScopeAndMemorizePreviousScope( - InternalHotkeysScope.RelationPicker, + setHotkeyScopeAndMemorizePreviousScope( + RelationPickerHotkeyScope.RelationPicker, ); } } @@ -147,7 +147,7 @@ export function CommentThreadRelationPicker({ commentThread }: OwnProps) { }); function exitEditMode() { - goBackToPreviousHotkeysScope(); + goBackToPreviousHotkeyScope(); setIsMenuOpen(false); setSearchFilter(''); } @@ -157,7 +157,7 @@ export function CommentThreadRelationPicker({ commentThread }: OwnProps) { () => { exitEditMode(); }, - InternalHotkeysScope.RelationPicker, + RelationPickerHotkeyScope.RelationPicker, [exitEditMode], ); diff --git a/front/src/modules/comments/hooks/useOpenCommentThreadRightDrawer.ts b/front/src/modules/comments/hooks/useOpenCommentThreadRightDrawer.ts index 6e6d17e096..013d5d01d2 100644 --- a/front/src/modules/comments/hooks/useOpenCommentThreadRightDrawer.ts +++ b/front/src/modules/comments/hooks/useOpenCommentThreadRightDrawer.ts @@ -1,7 +1,7 @@ import { useRecoilState } from 'recoil'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; +import { RightDrawerHotkeyScope } from '@/ui/layout/right-drawer/types/RightDrawerHotkeyScope'; import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages'; import { useOpenRightDrawer } from '../../ui/layout/right-drawer/hooks/useOpenRightDrawer'; @@ -12,10 +12,10 @@ export function useOpenCommentThreadRightDrawer() { const [, setViewableCommentThreadId] = useRecoilState( viewableCommentThreadIdState, ); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); return function openCommentThreadRightDrawer(commentThreadId: string) { - setHotkeysScope(InternalHotkeysScope.RightDrawer, { goto: false }); + setHotkeyScope(RightDrawerHotkeyScope.RightDrawer, { goto: false }); setViewableCommentThreadId(commentThreadId); openRightDrawer(RightDrawerPages.EditCommentThread); }; diff --git a/front/src/modules/comments/hooks/useOpenCreateCommentDrawerForSelectedRowIds.ts b/front/src/modules/comments/hooks/useOpenCreateCommentDrawerForSelectedRowIds.ts index 7596dec0e8..71aea58b63 100644 --- a/front/src/modules/comments/hooks/useOpenCreateCommentDrawerForSelectedRowIds.ts +++ b/front/src/modules/comments/hooks/useOpenCreateCommentDrawerForSelectedRowIds.ts @@ -4,9 +4,9 @@ import { v4 } from 'uuid'; import { currentUserState } from '@/auth/states/currentUserState'; import { GET_COMPANIES } from '@/companies/services'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; import { GET_PEOPLE } from '@/people/services'; +import { RightDrawerHotkeyScope } from '@/ui/layout/right-drawer/types/RightDrawerHotkeyScope'; import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages'; import { selectedRowIdsSelector } from '@/ui/tables/states/selectedRowIdsSelector'; import { @@ -30,7 +30,7 @@ export function useOpenCreateCommentThreadDrawerForSelectedRowIds() { const [, setViewableCommentThreadId] = useRecoilState( viewableCommentThreadIdState, ); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); const [, setCommentableEntityArray] = useRecoilState( commentableEntityArrayState, @@ -67,7 +67,7 @@ export function useOpenCreateCommentThreadDrawerForSelectedRowIds() { getOperationName(GET_COMMENT_THREADS_BY_TARGETS) ?? '', ], onCompleted(data) { - setHotkeysScope(InternalHotkeysScope.RightDrawer, { goto: false }); + setHotkeyScope(RightDrawerHotkeyScope.RightDrawer, { goto: false }); setViewableCommentThreadId(data.createOneCommentThread.id); setCommentableEntityArray(commentableEntityArray); openRightDrawer(RightDrawerPages.CreateCommentThread); diff --git a/front/src/modules/comments/hooks/useOpenCreateCommentThreadDrawer.ts b/front/src/modules/comments/hooks/useOpenCreateCommentThreadDrawer.ts index 53d5881c55..f6afdf335f 100644 --- a/front/src/modules/comments/hooks/useOpenCreateCommentThreadDrawer.ts +++ b/front/src/modules/comments/hooks/useOpenCreateCommentThreadDrawer.ts @@ -4,9 +4,9 @@ import { v4 } from 'uuid'; import { currentUserState } from '@/auth/states/currentUserState'; import { GET_COMPANIES } from '@/companies/services'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; import { GET_PEOPLE } from '@/people/services'; +import { RightDrawerHotkeyScope } from '@/ui/layout/right-drawer/types/RightDrawerHotkeyScope'; import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages'; import { useCreateCommentThreadMutation } from '~/generated/graphql'; @@ -23,7 +23,7 @@ export function useOpenCreateCommentThreadDrawer() { const openRightDrawer = useOpenRightDrawer(); const [createCommentThreadMutation] = useCreateCommentThreadMutation(); const currentUser = useRecoilValue(currentUserState); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); const [, setCommentableEntityArray] = useRecoilState( commentableEntityArrayState, @@ -54,7 +54,7 @@ export function useOpenCreateCommentThreadDrawer() { getOperationName(GET_COMMENT_THREADS_BY_TARGETS) ?? '', ], onCompleted(data) { - setHotkeysScope(InternalHotkeysScope.RightDrawer, { goto: false }); + setHotkeyScope(RightDrawerHotkeyScope.RightDrawer, { goto: false }); setViewableCommentThreadId(data.createOneCommentThread.id); setCommentableEntityArray([entity]); openRightDrawer(RightDrawerPages.CreateCommentThread); diff --git a/front/src/modules/comments/hooks/useOpenTimelineRightDrawer.ts b/front/src/modules/comments/hooks/useOpenTimelineRightDrawer.ts index e38c09e34a..dad17e4aae 100644 --- a/front/src/modules/comments/hooks/useOpenTimelineRightDrawer.ts +++ b/front/src/modules/comments/hooks/useOpenTimelineRightDrawer.ts @@ -1,7 +1,7 @@ import { useRecoilState } from 'recoil'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; +import { RightDrawerHotkeyScope } from '@/ui/layout/right-drawer/types/RightDrawerHotkeyScope'; import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages'; import { useOpenRightDrawer } from '../../ui/layout/right-drawer/hooks/useOpenRightDrawer'; @@ -14,12 +14,12 @@ export function useOpenTimelineRightDrawer() { const [, setCommentableEntityArray] = useRecoilState( commentableEntityArrayState, ); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); return function openTimelineRightDrawer( commentableEntityArray: CommentableEntity[], ) { - setHotkeysScope(InternalHotkeysScope.RightDrawer, { goto: false }); + setHotkeyScope(RightDrawerHotkeyScope.RightDrawer, { goto: false }); setCommentableEntityArray(commentableEntityArray); openRightDrawer(RightDrawerPages.Timeline); }; diff --git a/front/src/modules/companies/components/CompanyAccountOwnerCell.tsx b/front/src/modules/companies/components/CompanyAccountOwnerCell.tsx index 224e177bf6..0ddff6959f 100644 --- a/front/src/modules/companies/components/CompanyAccountOwnerCell.tsx +++ b/front/src/modules/companies/components/CompanyAccountOwnerCell.tsx @@ -1,5 +1,5 @@ -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; import { PersonChip } from '@/people/components/PersonChip'; +import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope'; import { EditableCell } from '@/ui/components/editable-cell/EditableCell'; import { Company, User } from '~/generated/graphql'; @@ -16,7 +16,7 @@ export type OwnProps = { export function CompanyAccountOwnerCell({ company }: OwnProps) { return ( } nonEditModeContent={ company.accountOwner?.displayName ? ( diff --git a/front/src/modules/hotkeys/constants/index.ts b/front/src/modules/hotkeys/constants/index.ts deleted file mode 100644 index 12484dd42c..0000000000 --- a/front/src/modules/hotkeys/constants/index.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { CustomHotkeysScopes } from '../types/internal/CustomHotkeysScope'; -import { HotkeysScope } from '../types/internal/HotkeysScope'; -import { InternalHotkeysScope } from '../types/internal/InternalHotkeysScope'; - -export const INITIAL_HOTKEYS_SCOPES: string[] = [InternalHotkeysScope.App]; - -export const ALWAYS_ON_HOTKEYS_SCOPES: string[] = [ - InternalHotkeysScope.CommandMenu, - InternalHotkeysScope.App, -]; - -export const DEFAULT_HOTKEYS_SCOPE_CUSTOM_SCOPES: CustomHotkeysScopes = { - commandMenu: true, - goto: false, -}; - -export const INITIAL_HOTKEYS_SCOPE: HotkeysScope = { - scope: InternalHotkeysScope.App, - customScopes: { - commandMenu: true, - goto: true, - }, -}; diff --git a/front/src/modules/hotkeys/hooks/internal/useHotkeysScopeAutoSync.ts b/front/src/modules/hotkeys/hooks/internal/useHotkeysScopeAutoSync.ts deleted file mode 100644 index 575e348845..0000000000 --- a/front/src/modules/hotkeys/hooks/internal/useHotkeysScopeAutoSync.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { useEffect } from 'react'; -import { useRecoilValue } from 'recoil'; - -import { currentHotkeysScopeState } from '@/hotkeys/states/internal/currentHotkeysScopeState'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; - -import { useHotkeysScopes } from './useHotkeysScopes'; - -export function useHotkeysScopeAutoSync() { - const { setHotkeysScopes } = useHotkeysScopes(); - - const currentHotkeysScope = useRecoilValue(currentHotkeysScopeState); - - useEffect(() => { - const scopesToSet: string[] = []; - - if (currentHotkeysScope.customScopes?.commandMenu) { - scopesToSet.push(InternalHotkeysScope.CommandMenu); - } - - if (currentHotkeysScope?.customScopes?.goto) { - scopesToSet.push(InternalHotkeysScope.Goto); - } - - scopesToSet.push(currentHotkeysScope.scope); - - setHotkeysScopes(scopesToSet); - }, [setHotkeysScopes, currentHotkeysScope]); -} diff --git a/front/src/modules/hotkeys/hooks/internal/usePreviousHotkeysScope.ts b/front/src/modules/hotkeys/hooks/internal/usePreviousHotkeysScope.ts deleted file mode 100644 index af0c9e2aec..0000000000 --- a/front/src/modules/hotkeys/hooks/internal/usePreviousHotkeysScope.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { useState } from 'react'; -import { useRecoilValue } from 'recoil'; - -import { currentHotkeysScopeState } from '@/hotkeys/states/internal/currentHotkeysScopeState'; -import { CustomHotkeysScopes } from '@/hotkeys/types/internal/CustomHotkeysScope'; -import { HotkeysScope } from '@/hotkeys/types/internal/HotkeysScope'; - -import { useSetHotkeysScope } from '../useSetHotkeysScope'; - -export function usePreviousHotkeysScope() { - const [previousHotkeysScope, setPreviousHotkeysScope] = - useState(); - - const setHotkeysScope = useSetHotkeysScope(); - - const currentHotkeysScope = useRecoilValue(currentHotkeysScopeState); - - function goBackToPreviousHotkeysScope() { - if (previousHotkeysScope) { - setHotkeysScope( - previousHotkeysScope.scope, - previousHotkeysScope.customScopes, - ); - } - } - - function setHotkeysScopeAndMemorizePreviousScope( - scope: string, - customScopes?: CustomHotkeysScopes, - ) { - setPreviousHotkeysScope(currentHotkeysScope); - setHotkeysScope(scope, customScopes); - } - - return { - setHotkeysScopeAndMemorizePreviousScope, - goBackToPreviousHotkeysScope, - }; -} diff --git a/front/src/modules/hotkeys/states/internal/currentHotkeysScopeState.ts b/front/src/modules/hotkeys/states/internal/currentHotkeysScopeState.ts deleted file mode 100644 index f88f88e64f..0000000000 --- a/front/src/modules/hotkeys/states/internal/currentHotkeysScopeState.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { atom } from 'recoil'; - -import { INITIAL_HOTKEYS_SCOPE } from '@/hotkeys/constants'; -import { HotkeysScope } from '@/hotkeys/types/internal/HotkeysScope'; - -export const currentHotkeysScopeState = atom({ - key: 'currentHotkeysScopeState', - default: INITIAL_HOTKEYS_SCOPE, -}); diff --git a/front/src/modules/hotkeys/types/internal/HotkeysScope.ts b/front/src/modules/hotkeys/types/internal/HotkeysScope.ts deleted file mode 100644 index 00e47d19e0..0000000000 --- a/front/src/modules/hotkeys/types/internal/HotkeysScope.ts +++ /dev/null @@ -1,6 +0,0 @@ -import { CustomHotkeysScopes } from './CustomHotkeysScope'; - -export type HotkeysScope = { - scope: string; - customScopes?: CustomHotkeysScopes; -}; diff --git a/front/src/modules/hotkeys/types/internal/InternalHotkeysScope.ts b/front/src/modules/hotkeys/types/internal/InternalHotkeysScope.ts deleted file mode 100644 index 41b846338c..0000000000 --- a/front/src/modules/hotkeys/types/internal/InternalHotkeysScope.ts +++ /dev/null @@ -1,21 +0,0 @@ -export enum InternalHotkeysScope { - App = 'app', - Goto = 'goto', - CommandMenu = 'command-menu', - Table = 'table', - TableSoftFocus = 'table-soft-focus', - CellEditMode = 'cell-edit-mode', - CellDateEditMode = 'cell-date-edit-mode', - BoardCardFieldEditMode = 'board-card-field-edit-mode', - RightDrawer = 'right-drawer', - TableHeaderDropdownButton = 'table-header-dropdown-button', - RelationPicker = 'relation-picker', - CellDoubleTextInput = 'cell-double-text-input', - TextInput = 'text-input', - Settings = 'settings', - CreateWokspace = 'create-workspace', - PasswordLogin = 'password-login', - AuthIndex = 'auth-index', - CreateProfile = 'create-profile', - ShowPage = 'show-page', -} diff --git a/front/src/modules/lib/filters-and-sorts/components/DropdownButton.tsx b/front/src/modules/lib/filters-and-sorts/components/DropdownButton.tsx index 9178c49249..eba9d66b3f 100644 --- a/front/src/modules/lib/filters-and-sorts/components/DropdownButton.tsx +++ b/front/src/modules/lib/filters-and-sorts/components/DropdownButton.tsx @@ -2,12 +2,13 @@ import { ReactNode, useRef } from 'react'; import styled from '@emotion/styled'; import { Key } from 'ts-key-enum'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { useOutsideAlerter } from '@/ui/hooks/useOutsideAlerter'; import { IconChevronDown } from '@/ui/icons/index'; import { overlayBackground, textInputStyle } from '@/ui/themes/effects'; +import { FiltersHotkeyScope } from '../types/FiltersHotkeyScope'; + type OwnProps = { label: string; isActive: boolean; @@ -15,7 +16,7 @@ type OwnProps = { isUnfolded?: boolean; onIsUnfoldedChange?: (newIsUnfolded: boolean) => void; resetState?: () => void; - hotkeysScope: InternalHotkeysScope; + HotkeyScope: FiltersHotkeyScope; }; const StyledDropdownButtonContainer = styled.div` @@ -160,14 +161,14 @@ function DropdownButton({ children, isUnfolded = false, onIsUnfoldedChange, - hotkeysScope, + HotkeyScope, }: OwnProps) { useScopedHotkeys( [Key.Enter, Key.Escape], () => { onIsUnfoldedChange?.(false); }, - hotkeysScope, + HotkeyScope, [onIsUnfoldedChange], ); diff --git a/front/src/modules/lib/filters-and-sorts/components/FilterDropdownButton.tsx b/front/src/modules/lib/filters-and-sorts/components/FilterDropdownButton.tsx index 3aa02ca7ed..9ceef74eb6 100644 --- a/front/src/modules/lib/filters-and-sorts/components/FilterDropdownButton.tsx +++ b/front/src/modules/lib/filters-and-sorts/components/FilterDropdownButton.tsx @@ -1,15 +1,17 @@ import { Context, useCallback, useState } from 'react'; import { Key } from 'ts-key-enum'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; import { filterDefinitionUsedInDropdownScopedState } from '@/lib/filters-and-sorts/states/filterDefinitionUsedInDropdownScopedState'; import { filterDropdownSearchInputScopedState } from '@/lib/filters-and-sorts/states/filterDropdownSearchInputScopedState'; import { filtersScopedState } from '@/lib/filters-and-sorts/states/filtersScopedState'; import { isFilterDropdownOperandSelectUnfoldedScopedState } from '@/lib/filters-and-sorts/states/isFilterDropdownOperandSelectUnfoldedScopedState'; import { selectedOperandInDropdownScopedState } from '@/lib/filters-and-sorts/states/selectedOperandInDropdownScopedState'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState'; +import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope'; + +import { FiltersHotkeyScope } from '../types/FiltersHotkeyScope'; import DropdownButton from './DropdownButton'; import { FilterDropdownDateSearchInput } from './FilterDropdownDateSearchInput'; @@ -23,10 +25,10 @@ import { FilterDropdownTextSearchInput } from './FilterDropdownTextSearchInput'; export function FilterDropdownButton({ context, - hotkeysScope, + HotkeyScope, }: { context: Context; - hotkeysScope: InternalHotkeysScope; + HotkeyScope: FiltersHotkeyScope; }) { const [isUnfolded, setIsUnfolded] = useState(false); @@ -65,15 +67,15 @@ export function FilterDropdownButton({ const isFilterSelected = (filters?.length ?? 0) > 0; - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); function handleIsUnfoldedChange(newIsUnfolded: boolean) { if (newIsUnfolded) { - setHotkeysScope(hotkeysScope); + setHotkeyScope(HotkeyScope); setIsUnfolded(true); } else { if (filterDefinitionUsedInDropdown?.type === 'entity') { - setHotkeysScope(hotkeysScope); + setHotkeyScope(HotkeyScope); } setIsUnfolded(false); resetState(); @@ -85,7 +87,7 @@ export function FilterDropdownButton({ () => { handleIsUnfoldedChange(false); }, - InternalHotkeysScope.RelationPicker, + RelationPickerHotkeyScope.RelationPicker, [handleIsUnfoldedChange], ); @@ -95,7 +97,7 @@ export function FilterDropdownButton({ isActive={isFilterSelected} isUnfolded={isUnfolded} onIsUnfoldedChange={handleIsUnfoldedChange} - hotkeysScope={hotkeysScope} + HotkeyScope={HotkeyScope} > {!filterDefinitionUsedInDropdown ? ( diff --git a/front/src/modules/lib/filters-and-sorts/components/FilterDropdownFilterSelect.tsx b/front/src/modules/lib/filters-and-sorts/components/FilterDropdownFilterSelect.tsx index 080ad9aa4c..456ebb16e0 100644 --- a/front/src/modules/lib/filters-and-sorts/components/FilterDropdownFilterSelect.tsx +++ b/front/src/modules/lib/filters-and-sorts/components/FilterDropdownFilterSelect.tsx @@ -1,14 +1,14 @@ import { Context } from 'react'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; import { availableFiltersScopedState } from '@/lib/filters-and-sorts/states/availableFiltersScopedState'; import { filterDefinitionUsedInDropdownScopedState } from '@/lib/filters-and-sorts/states/filterDefinitionUsedInDropdownScopedState'; import { filterDropdownSearchInputScopedState } from '@/lib/filters-and-sorts/states/filterDropdownSearchInputScopedState'; import { selectedOperandInDropdownScopedState } from '@/lib/filters-and-sorts/states/selectedOperandInDropdownScopedState'; import { getOperandsForFilterType } from '@/lib/filters-and-sorts/utils/getOperandsForFilterType'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState'; import { useRecoilScopedValue } from '@/recoil-scope/hooks/useRecoilScopedValue'; +import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope'; import { DropdownMenuItemContainer } from '@/ui/components/menu/DropdownMenuItemContainer'; import { DropdownMenuSelectableItem } from '@/ui/components/menu/DropdownMenuSelectableItem'; @@ -39,7 +39,7 @@ export function FilterDropdownFilterSelect({ context, ); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); return ( @@ -50,7 +50,7 @@ export function FilterDropdownFilterSelect({ setFilterDefinitionUsedInDropdown(availableFilter); if (availableFilter.type === 'entity') { - setHotkeysScope(InternalHotkeysScope.RelationPicker); + setHotkeyScope(RelationPickerHotkeyScope.RelationPicker); } setSelectedOperandInDropdown( diff --git a/front/src/modules/lib/filters-and-sorts/components/SortDropdownButton.tsx b/front/src/modules/lib/filters-and-sorts/components/SortDropdownButton.tsx index 86df00271f..54fbd24cf4 100644 --- a/front/src/modules/lib/filters-and-sorts/components/SortDropdownButton.tsx +++ b/front/src/modules/lib/filters-and-sorts/components/SortDropdownButton.tsx @@ -1,18 +1,19 @@ import { useCallback, useState } from 'react'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; import { SelectedSortType, SortType, } from '@/lib/filters-and-sorts/interfaces/sorts/interface'; +import { FiltersHotkeyScope } from '../types/FiltersHotkeyScope'; + import DropdownButton from './DropdownButton'; type OwnProps = { isSortSelected: boolean; onSortSelect: (sort: SelectedSortType) => void; availableSorts: SortType[]; - hotkeysScope: InternalHotkeysScope; + HotkeyScope: FiltersHotkeyScope; }; const options: Array['order']> = ['asc', 'desc']; @@ -21,7 +22,7 @@ export function SortDropdownButton({ isSortSelected, availableSorts, onSortSelect, - hotkeysScope, + HotkeyScope, }: OwnProps) { const [isUnfolded, setIsUnfolded] = useState(false); @@ -57,7 +58,7 @@ export function SortDropdownButton({ isActive={isSortSelected} isUnfolded={isUnfolded} onIsUnfoldedChange={handleIsUnfoldedChange} - hotkeysScope={hotkeysScope} + HotkeyScope={HotkeyScope} > {isOptionUnfolded ? options.map((option, index) => ( diff --git a/front/src/modules/lib/filters-and-sorts/types/FiltersHotkeyScope.ts b/front/src/modules/lib/filters-and-sorts/types/FiltersHotkeyScope.ts new file mode 100644 index 0000000000..b2b3ca801e --- /dev/null +++ b/front/src/modules/lib/filters-and-sorts/types/FiltersHotkeyScope.ts @@ -0,0 +1,3 @@ +export enum FiltersHotkeyScope { + FilterDropdownButton = 'filter-dropdown-button', +} diff --git a/front/src/modules/lib/hotkeys/constants/index.ts b/front/src/modules/lib/hotkeys/constants/index.ts new file mode 100644 index 0000000000..b7efa06efd --- /dev/null +++ b/front/src/modules/lib/hotkeys/constants/index.ts @@ -0,0 +1,23 @@ +import { AppHotkeyScope } from '../types/AppHotkeyScope'; +import { CustomHotkeyScopes } from '../types/CustomHotkeyScope'; +import { HotkeyScope } from '../types/HotkeyScope'; + +export const INITIAL_HOTKEYS_SCOPES: string[] = [AppHotkeyScope.App]; + +export const ALWAYS_ON_HOTKEYS_SCOPES: string[] = [ + AppHotkeyScope.CommandMenu, + AppHotkeyScope.App, +]; + +export const DEFAULT_HOTKEYS_SCOPE_CUSTOM_SCOPES: CustomHotkeyScopes = { + commandMenu: true, + goto: false, +}; + +export const INITIAL_HOTKEYS_SCOPE: HotkeyScope = { + scope: AppHotkeyScope.App, + customScopes: { + commandMenu: true, + goto: true, + }, +}; diff --git a/front/src/modules/lib/hotkeys/hooks/internal/useHotkeyScopeAutoSync.ts b/front/src/modules/lib/hotkeys/hooks/internal/useHotkeyScopeAutoSync.ts new file mode 100644 index 0000000000..3f9174ad70 --- /dev/null +++ b/front/src/modules/lib/hotkeys/hooks/internal/useHotkeyScopeAutoSync.ts @@ -0,0 +1,30 @@ +import { useEffect } from 'react'; +import { useRecoilValue } from 'recoil'; + +import { currentHotkeyScopeState } from '@/lib/hotkeys/states/internal/currentHotkeyScopeState'; + +import { AppHotkeyScope } from '../../types/AppHotkeyScope'; + +import { useHotkeyScopes } from './useHotkeyScopes'; + +export function useHotkeyScopeAutoSync() { + const { setHotkeyScopes } = useHotkeyScopes(); + + const currentHotkeyScope = useRecoilValue(currentHotkeyScopeState); + + useEffect(() => { + const scopesToSet: string[] = []; + + if (currentHotkeyScope.customScopes?.commandMenu) { + scopesToSet.push(AppHotkeyScope.CommandMenu); + } + + if (currentHotkeyScope?.customScopes?.goto) { + scopesToSet.push(AppHotkeyScope.Goto); + } + + scopesToSet.push(currentHotkeyScope.scope); + + setHotkeyScopes(scopesToSet); + }, [setHotkeyScopes, currentHotkeyScope]); +} diff --git a/front/src/modules/hotkeys/hooks/internal/useHotkeysScopes.ts b/front/src/modules/lib/hotkeys/hooks/internal/useHotkeyScopes.ts similarity index 83% rename from front/src/modules/hotkeys/hooks/internal/useHotkeysScopes.ts rename to front/src/modules/lib/hotkeys/hooks/internal/useHotkeyScopes.ts index 89be27b719..dbcf8f893c 100644 --- a/front/src/modules/hotkeys/hooks/internal/useHotkeysScopes.ts +++ b/front/src/modules/lib/hotkeys/hooks/internal/useHotkeyScopes.ts @@ -1,12 +1,12 @@ import { useHotkeysContext } from 'react-hotkeys-hook'; import { useRecoilCallback } from 'recoil'; -import { internalHotkeysEnabledScopesState } from '@/hotkeys/states/internal/internalHotkeysEnabledScopesState'; +import { internalHotkeysEnabledScopesState } from '../../states/internal/internalHotkeysEnabledScopesState'; -export function useHotkeysScopes() { +export function useHotkeyScopes() { const { disableScope, enableScope } = useHotkeysContext(); - const disableAllHotkeysScopes = useRecoilCallback( + const disableAllHotkeyScopes = useRecoilCallback( ({ set, snapshot }) => { return async () => { const enabledScopes = await snapshot.getPromise( @@ -23,7 +23,7 @@ export function useHotkeysScopes() { [disableScope], ); - const enableHotkeysScope = useRecoilCallback( + const enableHotkeyScope = useRecoilCallback( ({ set, snapshot }) => { return async (scopeToEnable: string) => { const enabledScopes = await snapshot.getPromise( @@ -42,7 +42,7 @@ export function useHotkeysScopes() { [enableScope], ); - const disableHotkeysScope = useRecoilCallback( + const disableHotkeyScope = useRecoilCallback( ({ set, snapshot }) => { return async (scopeToDisable: string) => { const enabledScopes = await snapshot.getPromise( @@ -65,7 +65,7 @@ export function useHotkeysScopes() { [disableScope], ); - const setHotkeysScopes = useRecoilCallback( + const setHotkeyScopes = useRecoilCallback( ({ set, snapshot }) => { return async (scopesToSet: string[]) => { const enabledScopes = await snapshot.getPromise( @@ -95,9 +95,9 @@ export function useHotkeysScopes() { ); return { - disableAllHotkeysScopes, - enableHotkeysScope, - disableHotkeysScope, - setHotkeysScopes, + disableAllHotkeyScopes, + enableHotkeyScope, + disableHotkeyScope, + setHotkeyScopes, }; } diff --git a/front/src/modules/hotkeys/hooks/useGoToHotkeys.ts b/front/src/modules/lib/hotkeys/hooks/useGoToHotkeys.ts similarity index 81% rename from front/src/modules/hotkeys/hooks/useGoToHotkeys.ts rename to front/src/modules/lib/hotkeys/hooks/useGoToHotkeys.ts index a13c046144..38cc7dd2c9 100644 --- a/front/src/modules/hotkeys/hooks/useGoToHotkeys.ts +++ b/front/src/modules/lib/hotkeys/hooks/useGoToHotkeys.ts @@ -1,7 +1,7 @@ import { Keys } from 'react-hotkeys-hook/dist/types'; import { useNavigate } from 'react-router-dom'; -import { InternalHotkeysScope } from '../types/internal/InternalHotkeysScope'; +import { AppHotkeyScope } from '../types/AppHotkeyScope'; import { useSequenceHotkeys } from './useSequenceScopedHotkeys'; @@ -14,7 +14,7 @@ export function useGoToHotkeys(key: Keys, location: string) { () => { navigate(location); }, - InternalHotkeysScope.Goto, + AppHotkeyScope.Goto, { enableOnContentEditable: true, enableOnFormTags: true, diff --git a/front/src/modules/lib/hotkeys/hooks/usePreviousHotkeyScope.ts b/front/src/modules/lib/hotkeys/hooks/usePreviousHotkeyScope.ts new file mode 100644 index 0000000000..13d4108927 --- /dev/null +++ b/front/src/modules/lib/hotkeys/hooks/usePreviousHotkeyScope.ts @@ -0,0 +1,39 @@ +import { useState } from 'react'; +import { useRecoilValue } from 'recoil'; + +import { currentHotkeyScopeState } from '../states/internal/currentHotkeyScopeState'; +import { CustomHotkeyScopes } from '../types/CustomHotkeyScope'; +import { HotkeyScope } from '../types/HotkeyScope'; + +import { useSetHotkeyScope } from './useSetHotkeyScope'; + +export function usePreviousHotkeyScope() { + const [previousHotkeyScope, setPreviousHotkeyScope] = + useState(); + + const setHotkeyScope = useSetHotkeyScope(); + + const currentHotkeyScope = useRecoilValue(currentHotkeyScopeState); + + function goBackToPreviousHotkeyScope() { + if (previousHotkeyScope) { + setHotkeyScope( + previousHotkeyScope.scope, + previousHotkeyScope.customScopes, + ); + } + } + + function setHotkeyScopeAndMemorizePreviousScope( + scope: string, + customScopes?: CustomHotkeyScopes, + ) { + setPreviousHotkeyScope(currentHotkeyScope); + setHotkeyScope(scope, customScopes); + } + + return { + setHotkeyScopeAndMemorizePreviousScope, + goBackToPreviousHotkeyScope, + }; +} diff --git a/front/src/modules/hotkeys/hooks/useScopedHotkeys.ts b/front/src/modules/lib/hotkeys/hooks/useScopedHotkeys.ts similarity index 100% rename from front/src/modules/hotkeys/hooks/useScopedHotkeys.ts rename to front/src/modules/lib/hotkeys/hooks/useScopedHotkeys.ts diff --git a/front/src/modules/hotkeys/hooks/useSequenceScopedHotkeys.ts b/front/src/modules/lib/hotkeys/hooks/useSequenceScopedHotkeys.ts similarity index 100% rename from front/src/modules/hotkeys/hooks/useSequenceScopedHotkeys.ts rename to front/src/modules/lib/hotkeys/hooks/useSequenceScopedHotkeys.ts diff --git a/front/src/modules/hotkeys/hooks/useSetHotkeysScope.ts b/front/src/modules/lib/hotkeys/hooks/useSetHotkeyScope.ts similarity index 57% rename from front/src/modules/hotkeys/hooks/useSetHotkeysScope.ts rename to front/src/modules/lib/hotkeys/hooks/useSetHotkeyScope.ts index 1ff68b7dc3..80ab2a37d8 100644 --- a/front/src/modules/hotkeys/hooks/useSetHotkeysScope.ts +++ b/front/src/modules/lib/hotkeys/hooks/useSetHotkeyScope.ts @@ -3,12 +3,12 @@ import { useRecoilCallback } from 'recoil'; import { isDefined } from '@/utils/type-guards/isDefined'; import { DEFAULT_HOTKEYS_SCOPE_CUSTOM_SCOPES } from '../constants'; -import { currentHotkeysScopeState } from '../states/internal/currentHotkeysScopeState'; -import { CustomHotkeysScopes } from '../types/internal/CustomHotkeysScope'; +import { currentHotkeyScopeState } from '../states/internal/currentHotkeyScopeState'; +import { CustomHotkeyScopes } from '../types/CustomHotkeyScope'; function isCustomScopesEqual( - customScopesA: CustomHotkeysScopes | undefined, - customScopesB: CustomHotkeysScopes | undefined, + customScopesA: CustomHotkeyScopes | undefined, + customScopesB: CustomHotkeyScopes | undefined, ) { return ( customScopesA?.commandMenu === customScopesB?.commandMenu && @@ -16,19 +16,19 @@ function isCustomScopesEqual( ); } -export function useSetHotkeysScope() { +export function useSetHotkeyScope() { return useRecoilCallback( ({ snapshot, set }) => - async (hotkeysScopeToSet: string, customScopes?: CustomHotkeysScopes) => { - const currentHotkeysScope = await snapshot.getPromise( - currentHotkeysScopeState, + async (HotkeyScopeToSet: string, customScopes?: CustomHotkeyScopes) => { + const currentHotkeyScope = await snapshot.getPromise( + currentHotkeyScopeState, ); - if (currentHotkeysScope.scope === hotkeysScopeToSet) { + if (currentHotkeyScope.scope === HotkeyScopeToSet) { if (!isDefined(customScopes)) { if ( isCustomScopesEqual( - currentHotkeysScope?.customScopes, + currentHotkeyScope?.customScopes, DEFAULT_HOTKEYS_SCOPE_CUSTOM_SCOPES, ) ) { @@ -37,7 +37,7 @@ export function useSetHotkeysScope() { } else { if ( isCustomScopesEqual( - currentHotkeysScope?.customScopes, + currentHotkeyScope?.customScopes, customScopes, ) ) { @@ -46,8 +46,8 @@ export function useSetHotkeysScope() { } } - set(currentHotkeysScopeState, { - scope: hotkeysScopeToSet, + set(currentHotkeyScopeState, { + scope: HotkeyScopeToSet, customScopes: { commandMenu: customScopes?.commandMenu ?? true, goto: customScopes?.goto ?? false, diff --git a/front/src/modules/lib/hotkeys/states/internal/currentHotkeyScopeState.ts b/front/src/modules/lib/hotkeys/states/internal/currentHotkeyScopeState.ts new file mode 100644 index 0000000000..59a190fb49 --- /dev/null +++ b/front/src/modules/lib/hotkeys/states/internal/currentHotkeyScopeState.ts @@ -0,0 +1,9 @@ +import { atom } from 'recoil'; + +import { INITIAL_HOTKEYS_SCOPE } from '../../constants'; +import { HotkeyScope } from '../../types/HotkeyScope'; + +export const currentHotkeyScopeState = atom({ + key: 'currentHotkeyScopeState', + default: INITIAL_HOTKEYS_SCOPE, +}); diff --git a/front/src/modules/hotkeys/states/internal/internalHotkeysEnabledScopesState.ts b/front/src/modules/lib/hotkeys/states/internal/internalHotkeysEnabledScopesState.ts similarity index 100% rename from front/src/modules/hotkeys/states/internal/internalHotkeysEnabledScopesState.ts rename to front/src/modules/lib/hotkeys/states/internal/internalHotkeysEnabledScopesState.ts diff --git a/front/src/modules/hotkeys/states/internal/pendingHotkeysState.ts b/front/src/modules/lib/hotkeys/states/internal/pendingHotkeysState.ts similarity index 100% rename from front/src/modules/hotkeys/states/internal/pendingHotkeysState.ts rename to front/src/modules/lib/hotkeys/states/internal/pendingHotkeysState.ts diff --git a/front/src/modules/lib/hotkeys/types/AppHotkeyScope.ts b/front/src/modules/lib/hotkeys/types/AppHotkeyScope.ts new file mode 100644 index 0000000000..f460708af6 --- /dev/null +++ b/front/src/modules/lib/hotkeys/types/AppHotkeyScope.ts @@ -0,0 +1,5 @@ +export enum AppHotkeyScope { + App = 'app', + Goto = 'goto', + CommandMenu = 'command-menu', +} diff --git a/front/src/modules/hotkeys/types/internal/CustomHotkeysScope.ts b/front/src/modules/lib/hotkeys/types/CustomHotkeyScope.ts similarity index 56% rename from front/src/modules/hotkeys/types/internal/CustomHotkeysScope.ts rename to front/src/modules/lib/hotkeys/types/CustomHotkeyScope.ts index 3573eca085..a6917626f0 100644 --- a/front/src/modules/hotkeys/types/internal/CustomHotkeysScope.ts +++ b/front/src/modules/lib/hotkeys/types/CustomHotkeyScope.ts @@ -1,4 +1,4 @@ -export type CustomHotkeysScopes = { +export type CustomHotkeyScopes = { goto?: boolean; commandMenu?: boolean; }; diff --git a/front/src/modules/lib/hotkeys/types/HotkeyScope.ts b/front/src/modules/lib/hotkeys/types/HotkeyScope.ts new file mode 100644 index 0000000000..1b430e453a --- /dev/null +++ b/front/src/modules/lib/hotkeys/types/HotkeyScope.ts @@ -0,0 +1,6 @@ +import { CustomHotkeyScopes } from './CustomHotkeyScope'; + +export type HotkeyScope = { + scope: string; + customScopes?: CustomHotkeyScopes; +}; diff --git a/front/src/modules/people/components/PeopleCompanyCell.tsx b/front/src/modules/people/components/PeopleCompanyCell.tsx index ac9eaa1d9d..be61bcf000 100644 --- a/front/src/modules/people/components/PeopleCompanyCell.tsx +++ b/front/src/modules/people/components/PeopleCompanyCell.tsx @@ -1,6 +1,6 @@ import { CompanyChip } from '@/companies/components/CompanyChip'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState'; +import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope'; import { EditableCell } from '@/ui/components/editable-cell/EditableCell'; import { isCreateModeScopedState } from '@/ui/components/editable-cell/states/isCreateModeScopedState'; import { getLogoUrlFromDomainName } from '@/utils/utils'; @@ -24,7 +24,7 @@ export function PeopleCompanyCell({ people }: OwnProps) { return ( diff --git a/front/src/modules/people/components/PeopleCompanyPicker.tsx b/front/src/modules/people/components/PeopleCompanyPicker.tsx index 78971f50cf..0d1fdc1014 100644 --- a/front/src/modules/people/components/PeopleCompanyPicker.tsx +++ b/front/src/modules/people/components/PeopleCompanyPicker.tsx @@ -1,14 +1,15 @@ import { Key } from 'ts-key-enum'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState'; import { SingleEntitySelect } from '@/relation-picker/components/SingleEntitySelect'; import { useFilteredSearchEntityQuery } from '@/relation-picker/hooks/useFilteredSearchEntityQuery'; import { relationPickerSearchFilterScopedState } from '@/relation-picker/states/relationPickerSearchFilterScopedState'; +import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope'; import { useEditableCell } from '@/ui/components/editable-cell/hooks/useEditableCell'; import { isCreateModeScopedState } from '@/ui/components/editable-cell/states/isCreateModeScopedState'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; import { getLogoUrlFromDomainName } from '@/utils/utils'; import { CommentableType, @@ -32,7 +33,7 @@ export function PeopleCompanyPicker({ people }: OwnProps) { const { closeEditableCell } = useEditableCell(); - const addToScopeStack = useSetHotkeysScope(); + const addToScopeStack = useSetHotkeyScope(); const companies = useFilteredSearchEntityQuery({ queryHook: useSearchCompanyQuery, @@ -62,13 +63,13 @@ export function PeopleCompanyPicker({ people }: OwnProps) { function handleCreate() { setIsCreating(true); - addToScopeStack(InternalHotkeysScope.CellDoubleTextInput); + addToScopeStack(TableHotkeyScope.CellDoubleTextInput); } useScopedHotkeys( Key.Escape, () => closeEditableCell(), - InternalHotkeysScope.RelationPicker, + RelationPickerHotkeyScope.RelationPicker, [closeEditableCell], ); diff --git a/front/src/modules/pipeline-progress/components/NewButton.tsx b/front/src/modules/pipeline-progress/components/NewButton.tsx index e54b82b4e2..5015d3eb69 100644 --- a/front/src/modules/pipeline-progress/components/NewButton.tsx +++ b/front/src/modules/pipeline-progress/components/NewButton.tsx @@ -3,9 +3,9 @@ import { getOperationName } from '@apollo/client/utilities'; import { useRecoilState } from 'recoil'; import { v4 as uuidv4 } from 'uuid'; -import { usePreviousHotkeysScope } from '@/hotkeys/hooks/internal/usePreviousHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { usePreviousHotkeyScope } from '@/lib/hotkeys/hooks/usePreviousHotkeyScope'; import { RecoilScope } from '@/recoil-scope/components/RecoilScope'; +import { RelationPickerHotkeyScope } from '@/relation-picker/types/RelationPickerHotkeyScope'; import { Column } from '@/ui/board/components/Board'; import { NewButton as UINewButton } from '@/ui/board/components/NewButton'; import { @@ -32,9 +32,9 @@ export function NewButton({ pipelineId, columnId }: OwnProps) { const [boardItems, setBoardItems] = useRecoilState(boardItemsState); const { - goBackToPreviousHotkeysScope, - setHotkeysScopeAndMemorizePreviousScope, - } = usePreviousHotkeysScope(); + goBackToPreviousHotkeyScope, + setHotkeyScopeAndMemorizePreviousScope, + } = usePreviousHotkeyScope(); const [createOnePipelineProgress] = useCreateOnePipelineProgressMutation({ refetchQueries: [getOperationName(GET_PIPELINES) ?? ''], @@ -45,7 +45,7 @@ export function NewButton({ pipelineId, columnId }: OwnProps) { if (!company) return; setIsCreatingCard(false); - goBackToPreviousHotkeysScope(); + goBackToPreviousHotkeyScope(); const newUuid = uuidv4(); const newBoard = JSON.parse(JSON.stringify(board)); @@ -82,19 +82,19 @@ export function NewButton({ pipelineId, columnId }: OwnProps) { setBoard, boardItems, setBoardItems, - goBackToPreviousHotkeysScope, + goBackToPreviousHotkeyScope, ], ); const handleNewClick = useCallback(() => { setIsCreatingCard(true); - setHotkeysScopeAndMemorizePreviousScope( - InternalHotkeysScope.RelationPicker, + setHotkeyScopeAndMemorizePreviousScope( + RelationPickerHotkeyScope.RelationPicker, ); - }, [setIsCreatingCard, setHotkeysScopeAndMemorizePreviousScope]); + }, [setIsCreatingCard, setHotkeyScopeAndMemorizePreviousScope]); function handleCancel() { - goBackToPreviousHotkeysScope(); + goBackToPreviousHotkeyScope(); setIsCreatingCard(false); } diff --git a/front/src/modules/relation-picker/components/SingleEntitySelectBase.tsx b/front/src/modules/relation-picker/components/SingleEntitySelectBase.tsx index 615977eff4..46cb8a9e8b 100644 --- a/front/src/modules/relation-picker/components/SingleEntitySelectBase.tsx +++ b/front/src/modules/relation-picker/components/SingleEntitySelectBase.tsx @@ -1,8 +1,7 @@ import { useRef } from 'react'; import { Key } from 'ts-key-enum'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { EntityForSelect } from '@/relation-picker/types/EntityForSelect'; import { DropdownMenuItem } from '@/ui/components/menu/DropdownMenuItem'; import { DropdownMenuItemContainer } from '@/ui/components/menu/DropdownMenuItemContainer'; @@ -11,6 +10,7 @@ import { Avatar } from '@/users/components/Avatar'; import { isDefined } from '@/utils/type-guards/isDefined'; import { useEntitySelectScroll } from '../hooks/useEntitySelectScroll'; +import { RelationPickerHotkeyScope } from '../types/RelationPickerHotkeyScope'; import { CompanyPickerSkeleton } from './skeletons/CompanyPickerSkeleton'; import { DropdownMenuItemContainerSkeleton } from './skeletons/DropdownMenuItemContainerSkeleton'; @@ -50,7 +50,7 @@ export function SingleEntitySelectBase< onEntitySelected(entitiesInDropdown[hoveredIndex]); resetScroll(); }, - InternalHotkeysScope.RelationPicker, + RelationPickerHotkeyScope.RelationPicker, [entitiesInDropdown, hoveredIndex, onEntitySelected], ); @@ -59,7 +59,7 @@ export function SingleEntitySelectBase< () => { onCancel?.(); }, - InternalHotkeysScope.RelationPicker, + RelationPickerHotkeyScope.RelationPicker, [onCancel], ); diff --git a/front/src/modules/relation-picker/hooks/useEntitySelectScroll.ts b/front/src/modules/relation-picker/hooks/useEntitySelectScroll.ts index fffe5547ab..2febd7660f 100644 --- a/front/src/modules/relation-picker/hooks/useEntitySelectScroll.ts +++ b/front/src/modules/relation-picker/hooks/useEntitySelectScroll.ts @@ -1,12 +1,12 @@ import scrollIntoView from 'scroll-into-view'; import { Key } from 'ts-key-enum'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState'; import { relationPickerHoverIndexScopedState } from '../states/relationPickerHoverIndexScopedState'; import { EntityForSelect } from '../types/EntityForSelect'; +import { RelationPickerHotkeyScope } from '../types/RelationPickerHotkeyScope'; export function useEntitySelectScroll< CustomEntityForSelect extends EntityForSelect, @@ -60,7 +60,7 @@ export function useEntitySelectScroll< }); } }, - InternalHotkeysScope.RelationPicker, + RelationPickerHotkeyScope.RelationPicker, [setHoveredIndex, entities], ); @@ -87,7 +87,7 @@ export function useEntitySelectScroll< }); } }, - InternalHotkeysScope.RelationPicker, + RelationPickerHotkeyScope.RelationPicker, [setHoveredIndex, entities], ); diff --git a/front/src/modules/relation-picker/types/RelationPickerHotkeyScope.ts b/front/src/modules/relation-picker/types/RelationPickerHotkeyScope.ts new file mode 100644 index 0000000000..a58e703f5b --- /dev/null +++ b/front/src/modules/relation-picker/types/RelationPickerHotkeyScope.ts @@ -0,0 +1,3 @@ +export enum RelationPickerHotkeyScope { + RelationPicker = 'relation-picker', +} diff --git a/front/src/modules/ui/board-card-field/components/BoardCardEditableField.tsx b/front/src/modules/ui/board-card-field/components/BoardCardEditableField.tsx index 9b660daea1..9faaadd029 100644 --- a/front/src/modules/ui/board-card-field/components/BoardCardEditableField.tsx +++ b/front/src/modules/ui/board-card-field/components/BoardCardEditableField.tsx @@ -1,6 +1,6 @@ import { ReactElement } from 'react'; -import { HotkeysScope } from '@/hotkeys/types/internal/HotkeysScope'; +import { HotkeyScope } from '@/lib/hotkeys/types/HotkeyScope'; import { RecoilScope } from '@/recoil-scope/components/RecoilScope'; import { BoardCardFieldContext } from '../states/BoardCardFieldContext'; @@ -12,7 +12,7 @@ type OwnProps = { nonEditModeContent: ReactElement; editModeHorizontalAlign?: 'left' | 'right'; editModeVerticalPosition?: 'over' | 'below'; - editHotkeysScope?: HotkeysScope; + editHotkeyScope?: HotkeyScope; }; export function BoardCardEditableField(props: OwnProps) { diff --git a/front/src/modules/ui/board-card-field/components/BoardCardEditableFieldEditMode.tsx b/front/src/modules/ui/board-card-field/components/BoardCardEditableFieldEditMode.tsx index 818a4da375..1fa221644d 100644 --- a/front/src/modules/ui/board-card-field/components/BoardCardEditableFieldEditMode.tsx +++ b/front/src/modules/ui/board-card-field/components/BoardCardEditableFieldEditMode.tsx @@ -1,11 +1,12 @@ import { ReactElement, useRef } from 'react'; import styled from '@emotion/styled'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { useListenClickOutsideArrayOfRef } from '@/ui/hooks/useListenClickOutsideArrayOfRef'; import { overlayBackground } from '@/ui/themes/effects'; +import { BoardCardFieldHotkeyScope } from '../types/BoardCardFieldHotkeyScope'; + export const BoardCardFieldEditModeContainer = styled.div< Omit >` @@ -51,7 +52,7 @@ export function BoardCardEditableFieldEditMode({ () => { onExit(); }, - InternalHotkeysScope.BoardCardFieldEditMode, + BoardCardFieldHotkeyScope.BoardCardFieldEditMode, [onExit], ); @@ -60,7 +61,7 @@ export function BoardCardEditableFieldEditMode({ () => { onExit(); }, - InternalHotkeysScope.BoardCardFieldEditMode, + BoardCardFieldHotkeyScope.BoardCardFieldEditMode, [onExit], ); diff --git a/front/src/modules/ui/board-card-field/components/BoardCardEditableFieldInternal.tsx b/front/src/modules/ui/board-card-field/components/BoardCardEditableFieldInternal.tsx index 36d3b34b80..be286343f1 100644 --- a/front/src/modules/ui/board-card-field/components/BoardCardEditableFieldInternal.tsx +++ b/front/src/modules/ui/board-card-field/components/BoardCardEditableFieldInternal.tsx @@ -1,11 +1,11 @@ import { ReactElement } from 'react'; import styled from '@emotion/styled'; -import { usePreviousHotkeysScope } from '@/hotkeys/hooks/internal/usePreviousHotkeysScope'; -import { HotkeysScope } from '@/hotkeys/types/internal/HotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { usePreviousHotkeyScope } from '@/lib/hotkeys/hooks/usePreviousHotkeyScope'; +import { HotkeyScope } from '@/lib/hotkeys/types/HotkeyScope'; import { useBoardCardField } from '../hooks/useBoardCardField'; +import { BoardCardFieldHotkeyScope } from '../types/BoardCardFieldHotkeyScope'; import { BoardCardEditableFieldDisplayMode } from './BoardCardEditableFieldDisplayMode'; import { BoardCardEditableFieldEditMode } from './BoardCardEditableFieldEditMode'; @@ -26,7 +26,7 @@ type OwnProps = { nonEditModeContent: ReactElement; editModeHorizontalAlign?: 'left' | 'right'; editModeVerticalPosition?: 'over' | 'below'; - editHotkeysScope?: HotkeysScope; + editHotkeyScope?: HotkeyScope; }; export function BoardCardEditableFieldInternal({ @@ -34,7 +34,7 @@ export function BoardCardEditableFieldInternal({ editModeVerticalPosition = 'over', editModeContent, nonEditModeContent, - editHotkeysScope, + editHotkeyScope, }: OwnProps) { const { openBoardCardField, isBoardCardFieldInEditMode } = useBoardCardField(); @@ -42,22 +42,23 @@ export function BoardCardEditableFieldInternal({ const { closeBoardCardField } = useBoardCardField(); const { - goBackToPreviousHotkeysScope, - setHotkeysScopeAndMemorizePreviousScope, - } = usePreviousHotkeysScope(); + goBackToPreviousHotkeyScope, + setHotkeyScopeAndMemorizePreviousScope, + } = usePreviousHotkeyScope(); function handleOnClick() { if (!isBoardCardFieldInEditMode) { openBoardCardField(); - setHotkeysScopeAndMemorizePreviousScope( - editHotkeysScope?.scope ?? InternalHotkeysScope.BoardCardFieldEditMode, - editHotkeysScope?.customScopes ?? {}, + setHotkeyScopeAndMemorizePreviousScope( + editHotkeyScope?.scope ?? + BoardCardFieldHotkeyScope.BoardCardFieldEditMode, + editHotkeyScope?.customScopes ?? {}, ); } } function handleEditModeExit() { - goBackToPreviousHotkeysScope(); + goBackToPreviousHotkeyScope(); closeBoardCardField(); } diff --git a/front/src/modules/ui/board-card-field/types/BoardCardFieldHotkeyScope.ts b/front/src/modules/ui/board-card-field/types/BoardCardFieldHotkeyScope.ts new file mode 100644 index 0000000000..98b6ade879 --- /dev/null +++ b/front/src/modules/ui/board-card-field/types/BoardCardFieldHotkeyScope.ts @@ -0,0 +1,3 @@ +export enum BoardCardFieldHotkeyScope { + BoardCardFieldEditMode = 'board-card-field-edit-mode', +} diff --git a/front/src/modules/ui/components/editable-cell/EditableCell.tsx b/front/src/modules/ui/components/editable-cell/EditableCell.tsx index ef11341ef5..1b4eb1dee2 100644 --- a/front/src/modules/ui/components/editable-cell/EditableCell.tsx +++ b/front/src/modules/ui/components/editable-cell/EditableCell.tsx @@ -1,7 +1,7 @@ import { ReactElement } from 'react'; import styled from '@emotion/styled'; -import { HotkeysScope } from '@/hotkeys/types/internal/HotkeysScope'; +import { HotkeyScope } from '@/lib/hotkeys/types/HotkeyScope'; import { useCurrentCellEditMode } from './hooks/useCurrentCellEditMode'; import { useIsSoftFocusOnCurrentCell } from './hooks/useIsSoftFocusOnCurrentCell'; @@ -25,7 +25,7 @@ type OwnProps = { nonEditModeContent: ReactElement; editModeHorizontalAlign?: 'left' | 'right'; editModeVerticalPosition?: 'over' | 'below'; - editHotkeysScope?: HotkeysScope; + editHotkeyScope?: HotkeyScope; onSubmit?: () => void; onCancel?: () => void; }; @@ -35,7 +35,7 @@ export function EditableCell({ editModeVerticalPosition = 'over', editModeContent, nonEditModeContent, - editHotkeysScope, + editHotkeyScope, onSubmit, onCancel, }: OwnProps) { @@ -55,7 +55,7 @@ export function EditableCell({ {editModeContent} ) : hasSoftFocus ? ( - + {nonEditModeContent} ) : ( diff --git a/front/src/modules/ui/components/editable-cell/EditableCellSoftFocusMode.tsx b/front/src/modules/ui/components/editable-cell/EditableCellSoftFocusMode.tsx index 240db27db6..a178ace6ca 100644 --- a/front/src/modules/ui/components/editable-cell/EditableCellSoftFocusMode.tsx +++ b/front/src/modules/ui/components/editable-cell/EditableCellSoftFocusMode.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { HotkeysScope } from '@/hotkeys/types/internal/HotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; +import { HotkeyScope } from '@/lib/hotkeys/types/HotkeyScope'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; import { isNonTextWritingKey } from '@/utils/hotkeys/isNonTextWritingKey'; import { useEditableCell } from './hooks/useEditableCell'; @@ -13,14 +13,14 @@ import { export function EditableCellSoftFocusMode({ children, - editHotkeysScope, -}: React.PropsWithChildren<{ editHotkeysScope?: HotkeysScope }>) { + editHotkeyScope, +}: React.PropsWithChildren<{ editHotkeyScope?: HotkeyScope }>) { const { openEditableCell } = useEditableCell(); function openEditMode() { openEditableCell( - editHotkeysScope ?? { - scope: InternalHotkeysScope.CellEditMode, + editHotkeyScope ?? { + scope: TableHotkeyScope.CellEditMode, }, ); } @@ -30,7 +30,7 @@ export function EditableCellSoftFocusMode({ () => { openEditMode(); }, - InternalHotkeysScope.TableSoftFocus, + TableHotkeyScope.TableSoftFocus, [openEditMode], ); @@ -48,7 +48,7 @@ export function EditableCellSoftFocusMode({ openEditMode(); }, - InternalHotkeysScope.TableSoftFocus, + TableHotkeyScope.TableSoftFocus, [openEditMode], { preventDefault: false, diff --git a/front/src/modules/ui/components/editable-cell/hooks/useEditableCell.ts b/front/src/modules/ui/components/editable-cell/hooks/useEditableCell.ts index f14aaf724c..7b979be871 100644 --- a/front/src/modules/ui/components/editable-cell/hooks/useEditableCell.ts +++ b/front/src/modules/ui/components/editable-cell/hooks/useEditableCell.ts @@ -1,28 +1,28 @@ import { useRecoilCallback } from 'recoil'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { HotkeysScope } from '@/hotkeys/types/internal/HotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; +import { HotkeyScope } from '@/lib/hotkeys/types/HotkeyScope'; import { useCloseCurrentCellInEditMode } from '@/ui/tables/hooks/useClearCellInEditMode'; import { isSomeInputInEditModeState } from '@/ui/tables/states/isSomeInputInEditModeState'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; import { useCurrentCellEditMode } from './useCurrentCellEditMode'; export function useEditableCell() { const { setCurrentCellInEditMode } = useCurrentCellEditMode(); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); const closeCurrentCellInEditMode = useCloseCurrentCellInEditMode(); function closeEditableCell() { closeCurrentCellInEditMode(); - setHotkeysScope(InternalHotkeysScope.TableSoftFocus); + setHotkeyScope(TableHotkeyScope.TableSoftFocus); } const openEditableCell = useRecoilCallback( ({ snapshot, set }) => - (hotkeysScope: HotkeysScope) => { + (HotkeyScope: HotkeyScope) => { const isSomeInputInEditMode = snapshot .getLoadable(isSomeInputInEditModeState) .valueOrThrow(); @@ -32,10 +32,10 @@ export function useEditableCell() { setCurrentCellInEditMode(); - setHotkeysScope(hotkeysScope.scope); + setHotkeyScope(HotkeyScope.scope); } }, - [setCurrentCellInEditMode, setHotkeysScope], + [setCurrentCellInEditMode, setHotkeyScope], ); return { diff --git a/front/src/modules/ui/components/editable-cell/hooks/useRegisterCloseCellHandlers.ts b/front/src/modules/ui/components/editable-cell/hooks/useRegisterCloseCellHandlers.ts index a61e363e29..34c773ac5c 100644 --- a/front/src/modules/ui/components/editable-cell/hooks/useRegisterCloseCellHandlers.ts +++ b/front/src/modules/ui/components/editable-cell/hooks/useRegisterCloseCellHandlers.ts @@ -1,7 +1,7 @@ -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { useListenClickOutsideArrayOfRef } from '@/ui/hooks/useListenClickOutsideArrayOfRef'; import { useMoveSoftFocus } from '@/ui/tables/hooks/useMoveSoftFocus'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; import { useCurrentCellEditMode } from './useCurrentCellEditMode'; import { useEditableCell } from './useEditableCell'; @@ -28,7 +28,7 @@ export function useRegisterCloseCellHandlers( closeEditableCell(); moveDown(); }, - InternalHotkeysScope.CellEditMode, + TableHotkeyScope.CellEditMode, [closeEditableCell, onSubmit, moveDown], ); @@ -38,7 +38,7 @@ export function useRegisterCloseCellHandlers( closeEditableCell(); onCancel?.(); }, - InternalHotkeysScope.CellEditMode, + TableHotkeyScope.CellEditMode, [closeEditableCell, onCancel], ); @@ -49,7 +49,7 @@ export function useRegisterCloseCellHandlers( closeEditableCell(); moveRight(); }, - InternalHotkeysScope.CellEditMode, + TableHotkeyScope.CellEditMode, [closeEditableCell, onSubmit, moveRight], ); @@ -60,7 +60,7 @@ export function useRegisterCloseCellHandlers( closeEditableCell(); moveLeft(); }, - InternalHotkeysScope.CellEditMode, + TableHotkeyScope.CellEditMode, [closeEditableCell, onSubmit, moveRight], ); } diff --git a/front/src/modules/ui/components/editable-cell/hooks/useSetSoftFocusOnCurrentCell.ts b/front/src/modules/ui/components/editable-cell/hooks/useSetSoftFocusOnCurrentCell.ts index 4d36547999..c48eb020f1 100644 --- a/front/src/modules/ui/components/editable-cell/hooks/useSetSoftFocusOnCurrentCell.ts +++ b/front/src/modules/ui/components/editable-cell/hooks/useSetSoftFocusOnCurrentCell.ts @@ -1,8 +1,7 @@ import { useMemo } from 'react'; import { useRecoilCallback } from 'recoil'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; import { useRecoilScopedState } from '@/recoil-scope/hooks/useRecoilScopedState'; import { useSetSoftFocusPosition } from '@/ui/tables/hooks/useSetSoftFocusPosition'; import { CellContext } from '@/ui/tables/states/CellContext'; @@ -11,6 +10,7 @@ import { currentRowNumberScopedState } from '@/ui/tables/states/currentRowNumber import { isSoftFocusActiveState } from '@/ui/tables/states/isSoftFocusActiveState'; import { RowContext } from '@/ui/tables/states/RowContext'; import { CellPosition } from '@/ui/tables/types/CellPosition'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; export function useSetSoftFocusOnCurrentCell() { const setSoftFocusPosition = useSetSoftFocusPosition(); @@ -33,7 +33,7 @@ export function useSetSoftFocusOnCurrentCell() { [currentColumnNumber, currentRowNumber], ); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); return useRecoilCallback( ({ set }) => @@ -42,8 +42,8 @@ export function useSetSoftFocusOnCurrentCell() { set(isSoftFocusActiveState, true); - setHotkeysScope(InternalHotkeysScope.TableSoftFocus); + setHotkeyScope(TableHotkeyScope.TableSoftFocus); }, - [setHotkeysScope, currentTablePosition, setSoftFocusPosition], + [setHotkeyScope, currentTablePosition, setSoftFocusPosition], ); } diff --git a/front/src/modules/ui/components/editable-cell/types/EditableCellDate.tsx b/front/src/modules/ui/components/editable-cell/types/EditableCellDate.tsx index f62041cbc1..e222a9efbf 100644 --- a/front/src/modules/ui/components/editable-cell/types/EditableCellDate.tsx +++ b/front/src/modules/ui/components/editable-cell/types/EditableCellDate.tsx @@ -1,5 +1,5 @@ -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; import { InplaceInputDateDisplayMode } from '@/ui/inplace-inputs/components/InplaceInputDateDisplayMode'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; import { EditableCell } from '../EditableCell'; @@ -23,7 +23,7 @@ export function EditableCellDate({ } nonEditModeContent={} - editHotkeysScope={{ scope: InternalHotkeysScope.CellDateEditMode }} + editHotkeyScope={{ scope: TableHotkeyScope.CellDateEditMode }} > ); } diff --git a/front/src/modules/ui/components/editable-cell/types/EditableCellDateEditMode.tsx b/front/src/modules/ui/components/editable-cell/types/EditableCellDateEditMode.tsx index 64fadd77e3..e9ab0e5179 100644 --- a/front/src/modules/ui/components/editable-cell/types/EditableCellDateEditMode.tsx +++ b/front/src/modules/ui/components/editable-cell/types/EditableCellDateEditMode.tsx @@ -1,8 +1,8 @@ import { Key } from 'ts-key-enum'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { InplaceInputDateEditMode } from '@/ui/inplace-inputs/components/InplaceInputDateEditMode'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; import { useEditableCell } from '../hooks/useEditableCell'; @@ -27,7 +27,7 @@ export function EditableCellDateEditMode({ () => { closeEditableCell(); }, - InternalHotkeysScope.CellDateEditMode, + TableHotkeyScope.CellDateEditMode, [closeEditableCell], ); diff --git a/front/src/modules/ui/components/editable-cell/types/EditableCellDoubleText.tsx b/front/src/modules/ui/components/editable-cell/types/EditableCellDoubleText.tsx index 665bf75a78..43b68548cb 100644 --- a/front/src/modules/ui/components/editable-cell/types/EditableCellDoubleText.tsx +++ b/front/src/modules/ui/components/editable-cell/types/EditableCellDoubleText.tsx @@ -1,6 +1,6 @@ import { ReactElement, useEffect, useState } from 'react'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; import { CellSkeleton } from '../CellSkeleton'; import { EditableCell } from '../EditableCell'; @@ -46,7 +46,7 @@ export function EditableCellDoubleText({ return ( , 'onChange'> & { label?: string; onChange?: (text: string) => void; @@ -110,18 +111,18 @@ export function TextInput({ const inputRef = useRef(null); const { - goBackToPreviousHotkeysScope, - setHotkeysScopeAndMemorizePreviousScope, - } = usePreviousHotkeysScope(); + goBackToPreviousHotkeyScope, + setHotkeyScopeAndMemorizePreviousScope, + } = usePreviousHotkeyScope(); const handleFocus: FocusEventHandler = (e) => { onFocus?.(e); - setHotkeysScopeAndMemorizePreviousScope(InternalHotkeysScope.TextInput); + setHotkeyScopeAndMemorizePreviousScope(InputHotkeyScope.TextInput); }; const handleBlur: FocusEventHandler = (e) => { onBlur?.(e); - goBackToPreviousHotkeysScope(); + goBackToPreviousHotkeyScope(); }; useScopedHotkeys( @@ -129,7 +130,7 @@ export function TextInput({ () => { inputRef.current?.blur(); }, - InternalHotkeysScope.TextInput, + InputHotkeyScope.TextInput, ); const [passwordVisible, setPasswordVisible] = useState(false); diff --git a/front/src/modules/ui/components/inputs/types/InputHotkeyScope.ts b/front/src/modules/ui/components/inputs/types/InputHotkeyScope.ts new file mode 100644 index 0000000000..1aa624b671 --- /dev/null +++ b/front/src/modules/ui/components/inputs/types/InputHotkeyScope.ts @@ -0,0 +1,3 @@ +export enum InputHotkeyScope { + TextInput = 'text-input', +} diff --git a/front/src/modules/ui/components/table/table-header/TableHeader.tsx b/front/src/modules/ui/components/table/table-header/TableHeader.tsx index 0caca61f6f..00e954e081 100644 --- a/front/src/modules/ui/components/table/table-header/TableHeader.tsx +++ b/front/src/modules/ui/components/table/table-header/TableHeader.tsx @@ -1,7 +1,6 @@ import { ReactNode, useCallback, useState } from 'react'; import styled from '@emotion/styled'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; import { FilterDropdownButton } from '@/lib/filters-and-sorts/components/FilterDropdownButton'; import SortAndFilterBar from '@/lib/filters-and-sorts/components/SortAndFilterBar'; import { SortDropdownButton } from '@/lib/filters-and-sorts/components/SortDropdownButton'; @@ -9,6 +8,7 @@ import { SelectedSortType, SortType, } from '@/lib/filters-and-sorts/interfaces/sorts/interface'; +import { FiltersHotkeyScope } from '@/lib/filters-and-sorts/types/FiltersHotkeyScope'; import { TableContext } from '@/ui/tables/states/TableContext'; type OwnProps = { @@ -93,13 +93,13 @@ export function TableHeader({ isSortSelected={sorts.length > 0} availableSorts={availableSorts || []} onSortSelect={sortSelect} - hotkeysScope={InternalHotkeysScope.TableHeaderDropdownButton} + HotkeyScope={FiltersHotkeyScope.FilterDropdownButton} /> diff --git a/front/src/modules/ui/layout/right-drawer/types/RightDrawerHotkeyScope.ts b/front/src/modules/ui/layout/right-drawer/types/RightDrawerHotkeyScope.ts new file mode 100644 index 0000000000..f062a36e0e --- /dev/null +++ b/front/src/modules/ui/layout/right-drawer/types/RightDrawerHotkeyScope.ts @@ -0,0 +1,3 @@ +export enum RightDrawerHotkeyScope { + RightDrawer = 'right-drawer', +} diff --git a/front/src/modules/ui/layout/top-bar/TableTopBarHotkeys.tsx b/front/src/modules/ui/layout/top-bar/TableTopBarHotkeys.tsx index e6b87a8082..62ae36ce99 100644 --- a/front/src/modules/ui/layout/top-bar/TableTopBarHotkeys.tsx +++ b/front/src/modules/ui/layout/top-bar/TableTopBarHotkeys.tsx @@ -1,17 +1,14 @@ -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; type OwnProps = { onAddButtonClick?: () => void; }; export function TopBarHotkeys({ onAddButtonClick }: OwnProps) { - useScopedHotkeys( - 'c', - () => onAddButtonClick?.(), - InternalHotkeysScope.Table, - [onAddButtonClick], - ); + useScopedHotkeys('c', () => onAddButtonClick?.(), TableHotkeyScope.Table, [ + onAddButtonClick, + ]); return <>; } diff --git a/front/src/modules/ui/tables/hooks/useLeaveTableFocus.ts b/front/src/modules/ui/tables/hooks/useLeaveTableFocus.ts index 55f7a9716e..5627900edd 100644 --- a/front/src/modules/ui/tables/hooks/useLeaveTableFocus.ts +++ b/front/src/modules/ui/tables/hooks/useLeaveTableFocus.ts @@ -1,11 +1,11 @@ import { useRecoilCallback } from 'recoil'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { currentHotkeysScopeState } from '@/hotkeys/states/internal/currentHotkeysScopeState'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; +import { currentHotkeyScopeState } from '@/lib/hotkeys/states/internal/currentHotkeyScopeState'; import { isSoftFocusActiveState } from '../states/isSoftFocusActiveState'; import { isSomeInputInEditModeState } from '../states/isSomeInputInEditModeState'; +import { TableHotkeyScope } from '../types/TableHotkeyScope'; import { useCloseCurrentCellInEditMode } from './useClearCellInEditMode'; import { useDisableSoftFocus } from './useDisableSoftFocus'; @@ -14,7 +14,7 @@ export function useLeaveTableFocus() { const disableSoftFocus = useDisableSoftFocus(); const closeCurrentCellInEditMode = useCloseCurrentCellInEditMode(); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); return useRecoilCallback( ({ snapshot }) => @@ -27,8 +27,8 @@ export function useLeaveTableFocus() { .getLoadable(isSomeInputInEditModeState) .valueOrThrow(); - const currentHotkeysScope = snapshot - .getLoadable(currentHotkeysScopeState) + const currentHotkeyScope = snapshot + .getLoadable(currentHotkeyScopeState) .valueOrThrow(); if (isSomeInputInEditMode) { @@ -39,15 +39,15 @@ export function useLeaveTableFocus() { return; } - if (currentHotkeysScope?.scope === InternalHotkeysScope.Table) { + if (currentHotkeyScope?.scope === TableHotkeyScope.Table) { return; } closeCurrentCellInEditMode(); disableSoftFocus(); - setHotkeysScope(InternalHotkeysScope.Table, { goto: true }); + setHotkeyScope(TableHotkeyScope.Table, { goto: true }); }, - [setHotkeysScope, closeCurrentCellInEditMode, disableSoftFocus], + [setHotkeyScope, closeCurrentCellInEditMode, disableSoftFocus], ); } diff --git a/front/src/modules/ui/tables/hooks/useMapKeyboardToSoftFocus.ts b/front/src/modules/ui/tables/hooks/useMapKeyboardToSoftFocus.ts index de1a88b36f..059e73c8d5 100644 --- a/front/src/modules/ui/tables/hooks/useMapKeyboardToSoftFocus.ts +++ b/front/src/modules/ui/tables/hooks/useMapKeyboardToSoftFocus.ts @@ -1,11 +1,11 @@ import { useRecoilState } from 'recoil'; import { Key } from 'ts-key-enum'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; import { isSomeInputInEditModeState } from '../states/isSomeInputInEditModeState'; +import { TableHotkeyScope } from '../types/TableHotkeyScope'; import { useDisableSoftFocus } from './useDisableSoftFocus'; import { useMoveSoftFocus } from './useMoveSoftFocus'; @@ -14,7 +14,7 @@ export function useMapKeyboardToSoftFocus() { const { moveDown, moveLeft, moveRight, moveUp } = useMoveSoftFocus(); const disableSoftFocus = useDisableSoftFocus(); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); const [isSomeInputInEditMode] = useRecoilState(isSomeInputInEditModeState); @@ -25,7 +25,7 @@ export function useMapKeyboardToSoftFocus() { moveUp(); } }, - InternalHotkeysScope.TableSoftFocus, + TableHotkeyScope.TableSoftFocus, [moveUp, isSomeInputInEditMode], ); @@ -36,7 +36,7 @@ export function useMapKeyboardToSoftFocus() { moveDown(); } }, - InternalHotkeysScope.TableSoftFocus, + TableHotkeyScope.TableSoftFocus, [moveDown, isSomeInputInEditMode], ); @@ -47,7 +47,7 @@ export function useMapKeyboardToSoftFocus() { moveLeft(); } }, - InternalHotkeysScope.TableSoftFocus, + TableHotkeyScope.TableSoftFocus, [moveLeft, isSomeInputInEditMode], ); @@ -58,17 +58,17 @@ export function useMapKeyboardToSoftFocus() { moveRight(); } }, - InternalHotkeysScope.TableSoftFocus, + TableHotkeyScope.TableSoftFocus, [moveRight, isSomeInputInEditMode], ); useScopedHotkeys( [Key.Escape], () => { - setHotkeysScope(InternalHotkeysScope.Table, { goto: true }); + setHotkeyScope(TableHotkeyScope.Table, { goto: true }); disableSoftFocus(); }, - InternalHotkeysScope.TableSoftFocus, + TableHotkeyScope.TableSoftFocus, [disableSoftFocus], ); } diff --git a/front/src/modules/ui/tables/types/TableHotkeyScope.ts b/front/src/modules/ui/tables/types/TableHotkeyScope.ts new file mode 100644 index 0000000000..37c8318195 --- /dev/null +++ b/front/src/modules/ui/tables/types/TableHotkeyScope.ts @@ -0,0 +1,7 @@ +export enum TableHotkeyScope { + CellDoubleTextInput = 'cell-double-text-input', + CellEditMode = 'cell-edit-mode', + CellDateEditMode = 'cell-date-edit-mode', + TableSoftFocus = 'table-soft-focus', + Table = 'table', +} diff --git a/front/src/pages/auth/CreateProfile.tsx b/front/src/pages/auth/CreateProfile.tsx index 712337b156..bc27868c27 100644 --- a/front/src/pages/auth/CreateProfile.tsx +++ b/front/src/pages/auth/CreateProfile.tsx @@ -13,8 +13,7 @@ import { Title } from '@/auth/components/ui/Title'; import { useOnboardingStatus } from '@/auth/hooks/useOnboardingStatus'; import { currentUserState } from '@/auth/states/currentUserState'; import { OnboardingStatus } from '@/auth/utils/getOnboardingStatus'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { ProfilePictureUploader } from '@/settings/profile/components/ProfilePictureUploader'; import { useSnackBar } from '@/snack-bar/hooks/useSnackBar'; import { MainButton } from '@/ui/components/buttons/MainButton'; @@ -22,6 +21,7 @@ import { TextInput } from '@/ui/components/inputs/TextInput'; import { SubSectionTitle } from '@/ui/components/section-titles/SubSectionTitle'; import { GET_CURRENT_USER } from '@/users/queries'; import { useUpdateUserMutation } from '~/generated/graphql'; +import { PageHotkeyScope } from '~/sync-hooks/types/PageHotkeyScope'; const StyledContentContainer = styled.div` width: 100%; @@ -129,7 +129,7 @@ export function CreateProfile() { () => { onSubmit(getValues()); }, - InternalHotkeysScope.CreateProfile, + PageHotkeyScope.CreateProfile, [onSubmit], ); diff --git a/front/src/pages/auth/CreateWorkspace.tsx b/front/src/pages/auth/CreateWorkspace.tsx index 972f4d5dae..1a16edc4cb 100644 --- a/front/src/pages/auth/CreateWorkspace.tsx +++ b/front/src/pages/auth/CreateWorkspace.tsx @@ -10,8 +10,7 @@ import { SubTitle } from '@/auth/components/ui/SubTitle'; import { Title } from '@/auth/components/ui/Title'; import { useOnboardingStatus } from '@/auth/hooks/useOnboardingStatus'; import { OnboardingStatus } from '@/auth/utils/getOnboardingStatus'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { WorkspaceLogoUploader } from '@/settings/workspace/components/WorkspaceLogoUploader'; import { useSnackBar } from '@/snack-bar/hooks/useSnackBar'; import { MainButton } from '@/ui/components/buttons/MainButton'; @@ -19,6 +18,7 @@ import { TextInput } from '@/ui/components/inputs/TextInput'; import { SubSectionTitle } from '@/ui/components/section-titles/SubSectionTitle'; import { GET_CURRENT_USER } from '@/users/queries'; import { useUpdateWorkspaceMutation } from '~/generated/graphql'; +import { PageHotkeyScope } from '~/sync-hooks/types/PageHotkeyScope'; const StyledContentContainer = styled.div` width: 100%; @@ -101,7 +101,7 @@ export function CreateWorkspace() { () => { onSubmit(getValues()); }, - InternalHotkeysScope.CreateWokspace, + PageHotkeyScope.CreateWokspace, [onSubmit], ); diff --git a/front/src/pages/auth/Index.tsx b/front/src/pages/auth/Index.tsx index f0fe3d1974..771d48811c 100644 --- a/front/src/pages/auth/Index.tsx +++ b/front/src/pages/auth/Index.tsx @@ -12,12 +12,12 @@ import { Title } from '@/auth/components/ui/Title'; import { authFlowUserEmailState } from '@/auth/states/authFlowUserEmailState'; import { authProvidersState } from '@/client-config/states/authProvidersState'; import { isDemoModeState } from '@/client-config/states/isDemoModeState'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { MainButton } from '@/ui/components/buttons/MainButton'; import { TextInput } from '@/ui/components/inputs/TextInput'; import { AnimatedEaseIn } from '@/ui/components/motion/AnimatedEaseIn'; import { IconBrandGoogle } from '@/ui/icons'; +import { PageHotkeyScope } from '~/sync-hooks/types/PageHotkeyScope'; const StyledContentContainer = styled.div` width: 200px; @@ -60,7 +60,7 @@ export function Index() { () => { onPasswordLoginClick(); }, - InternalHotkeysScope.AuthIndex, + PageHotkeyScope.AuthIndex, [onPasswordLoginClick], ); diff --git a/front/src/pages/auth/PasswordLogin.tsx b/front/src/pages/auth/PasswordLogin.tsx index 9656568a01..42dbdc233c 100644 --- a/front/src/pages/auth/PasswordLogin.tsx +++ b/front/src/pages/auth/PasswordLogin.tsx @@ -13,13 +13,13 @@ import { useAuth } from '@/auth/hooks/useAuth'; import { authFlowUserEmailState } from '@/auth/states/authFlowUserEmailState'; import { PASSWORD_REGEX } from '@/auth/utils/passwordRegex'; import { isDemoModeState } from '@/client-config/states/isDemoModeState'; -import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; +import { useScopedHotkeys } from '@/lib/hotkeys/hooks/useScopedHotkeys'; import { useSnackBar } from '@/snack-bar/hooks/useSnackBar'; import { MainButton } from '@/ui/components/buttons/MainButton'; import { TextInput } from '@/ui/components/inputs/TextInput'; import { SubSectionTitle } from '@/ui/components/section-titles/SubSectionTitle'; import { useCheckUserExistsQuery } from '~/generated/graphql'; +import { PageHotkeyScope } from '~/sync-hooks/types/PageHotkeyScope'; const StyledContentContainer = styled.div` width: 100%; @@ -132,7 +132,7 @@ export function PasswordLogin() { () => { onSubmit(getValues()); }, - InternalHotkeysScope.PasswordLogin, + PageHotkeyScope.PasswordLogin, [onSubmit], ); diff --git a/front/src/sync-hooks/GotoHotkeysHooks.tsx b/front/src/sync-hooks/GotoHotkeysHooks.tsx index b7d8c956f3..b3f4a19c0d 100644 --- a/front/src/sync-hooks/GotoHotkeysHooks.tsx +++ b/front/src/sync-hooks/GotoHotkeysHooks.tsx @@ -1,4 +1,4 @@ -import { useGoToHotkeys } from '@/hotkeys/hooks/useGoToHotkeys'; +import { useGoToHotkeys } from '@/lib/hotkeys/hooks/useGoToHotkeys'; export function GotoHotkeysHooks() { useGoToHotkeys('p', '/people'); diff --git a/front/src/sync-hooks/HotkeyScopeAutoSyncHook.tsx b/front/src/sync-hooks/HotkeyScopeAutoSyncHook.tsx new file mode 100644 index 0000000000..946c188d70 --- /dev/null +++ b/front/src/sync-hooks/HotkeyScopeAutoSyncHook.tsx @@ -0,0 +1,7 @@ +import { useHotkeyScopeAutoSync } from '@/lib/hotkeys/hooks/internal/useHotkeyScopeAutoSync'; + +export function HotkeyScopeAutoSyncHook() { + useHotkeyScopeAutoSync(); + + return <>; +} diff --git a/front/src/sync-hooks/HotkeysScopeBrowserRouterSync.tsx b/front/src/sync-hooks/HotkeyScopeBrowserRouterSync.tsx similarity index 58% rename from front/src/sync-hooks/HotkeysScopeBrowserRouterSync.tsx rename to front/src/sync-hooks/HotkeyScopeBrowserRouterSync.tsx index 1b29e6da41..8ddd2d102d 100644 --- a/front/src/sync-hooks/HotkeysScopeBrowserRouterSync.tsx +++ b/front/src/sync-hooks/HotkeyScopeBrowserRouterSync.tsx @@ -1,71 +1,71 @@ import { useEffect } from 'react'; -import { useSetHotkeysScope } from '@/hotkeys/hooks/useSetHotkeysScope'; -import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope'; -import { PageHotkeysScope } from '@/hotkeys/types/internal/PageHotkeysScope'; +import { useSetHotkeyScope } from '@/lib/hotkeys/hooks/useSetHotkeyScope'; +import { TableHotkeyScope } from '@/ui/tables/types/TableHotkeyScope'; import { useIsMatchingLocation } from './hooks/useIsMatchingLocation'; import { AppBasePath } from './types/AppBasePath'; import { AppPath } from './types/AppPath'; import { AuthPath } from './types/AuthPath'; +import { PageHotkeyScope } from './types/PageHotkeyScope'; import { SettingsPath } from './types/SettingsPath'; -export function HotkeysScopeBrowserRouterSync() { +export function HotkeyScopeBrowserRouterSync() { const isMatchingLocation = useIsMatchingLocation(); - const setHotkeysScope = useSetHotkeysScope(); + const setHotkeyScope = useSetHotkeyScope(); useEffect(() => { switch (true) { case isMatchingLocation(AppBasePath.Root, AppPath.CompaniesPage): { - setHotkeysScope(InternalHotkeysScope.Table, { goto: true }); + setHotkeyScope(TableHotkeyScope.Table, { goto: true }); break; } case isMatchingLocation(AppBasePath.Root, AppPath.PeoplePage): { - setHotkeysScope(InternalHotkeysScope.Table, { goto: true }); + setHotkeyScope(TableHotkeyScope.Table, { goto: true }); break; } case isMatchingLocation(AppBasePath.Root, AppPath.CompanyShowPage): { - setHotkeysScope(PageHotkeysScope.CompanyShowPage, { goto: true }); + setHotkeyScope(PageHotkeyScope.CompanyShowPage, { goto: true }); break; } case isMatchingLocation(AppBasePath.Root, AppPath.PersonShowPage): { - setHotkeysScope(PageHotkeysScope.PersonShowPage, { goto: true }); + setHotkeyScope(PageHotkeyScope.PersonShowPage, { goto: true }); break; } case isMatchingLocation(AppBasePath.Root, AppPath.OpportunitiesPage): { - setHotkeysScope(PageHotkeysScope.OpportunitiesPage, { goto: true }); + setHotkeyScope(PageHotkeyScope.OpportunitiesPage, { goto: true }); break; } case isMatchingLocation(AppBasePath.Auth, AuthPath.Index): { - setHotkeysScope(InternalHotkeysScope.AuthIndex); + setHotkeyScope(PageHotkeyScope.AuthIndex); break; } case isMatchingLocation(AppBasePath.Auth, AuthPath.CreateProfile): { - setHotkeysScope(InternalHotkeysScope.CreateProfile); + setHotkeyScope(PageHotkeyScope.CreateProfile); break; } case isMatchingLocation(AppBasePath.Auth, AuthPath.CreateWorkspace): { - setHotkeysScope(InternalHotkeysScope.CreateWokspace); + setHotkeyScope(PageHotkeyScope.CreateWokspace); break; } case isMatchingLocation(AppBasePath.Auth, AuthPath.PasswordLogin): { - setHotkeysScope(InternalHotkeysScope.PasswordLogin); + setHotkeyScope(PageHotkeyScope.PasswordLogin); break; } case isMatchingLocation(AppBasePath.Settings, SettingsPath.ProfilePage): { - setHotkeysScope(PageHotkeysScope.ProfilePage, { goto: true }); + setHotkeyScope(PageHotkeyScope.ProfilePage, { goto: true }); break; } case isMatchingLocation( AppBasePath.Settings, SettingsPath.WorkspaceMembersPage, ): { - setHotkeysScope(PageHotkeysScope.WorkspaceMemberPage, { goto: true }); + setHotkeyScope(PageHotkeyScope.WorkspaceMemberPage, { goto: true }); break; } } - }, [isMatchingLocation, setHotkeysScope]); + }, [isMatchingLocation, setHotkeyScope]); return <>; } diff --git a/front/src/sync-hooks/HotkeysScopeAutoSyncHook.tsx b/front/src/sync-hooks/HotkeysScopeAutoSyncHook.tsx deleted file mode 100644 index c4e0932016..0000000000 --- a/front/src/sync-hooks/HotkeysScopeAutoSyncHook.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import { useHotkeysScopeAutoSync } from '@/hotkeys/hooks/internal/useHotkeysScopeAutoSync'; - -export function HotkeysScopeAutoSyncHook() { - useHotkeysScopeAutoSync(); - - return <>; -} diff --git a/front/src/modules/hotkeys/types/internal/PageHotkeysScope.ts b/front/src/sync-hooks/types/PageHotkeyScope.ts similarity index 93% rename from front/src/modules/hotkeys/types/internal/PageHotkeysScope.ts rename to front/src/sync-hooks/types/PageHotkeyScope.ts index 19ee0f1fe8..058fed9f03 100644 --- a/front/src/modules/hotkeys/types/internal/PageHotkeysScope.ts +++ b/front/src/sync-hooks/types/PageHotkeyScope.ts @@ -1,4 +1,4 @@ -export enum PageHotkeysScope { +export enum PageHotkeyScope { Settings = 'settings', CreateWokspace = 'create-workspace', PasswordLogin = 'password-login', diff --git a/front/src/testing/renderWrappers.tsx b/front/src/testing/renderWrappers.tsx index 37e45b16c1..2a0460554d 100644 --- a/front/src/testing/renderWrappers.tsx +++ b/front/src/testing/renderWrappers.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { HotkeysProvider } from 'react-hotkeys-hook'; import { MemoryRouter } from 'react-router-dom'; -import { INITIAL_HOTKEYS_SCOPES } from '@/hotkeys/constants'; +import { INITIAL_HOTKEYS_SCOPES } from '@/lib/hotkeys/constants'; import { RecoilScope } from '@/recoil-scope/components/RecoilScope'; import { HooksEntityTable } from '@/ui/components/table/HooksEntityTable'; import { DefaultLayout } from '@/ui/layout/DefaultLayout';