Introduce ComponentState (#4386)

* Proof of concept ComponentState

* Migrate to createState and createFamilyState

* Refactor

* Fix

* Fix tests

* Fix lint

* Fix tests

* Re-enable coverage
This commit is contained in:
Charles Bochet
2024-03-09 11:31:00 +01:00
committed by GitHub
parent 17511be0cf
commit 86c0f311f5
451 changed files with 1718 additions and 2557 deletions

View File

@ -1,9 +1,9 @@
import { DropdownScopeInternalContext } from '@/ui/layout/dropdown/scopes/scope-internal-context/DropdownScopeInternalContext';
import { dropdownHotkeyStateScopeMap } from '@/ui/layout/dropdown/states/dropdownHotkeyStateScopeMap';
import { dropdownWidthStateScopeMap } from '@/ui/layout/dropdown/states/dropdownWidthStateScopeMap';
import { isDropdownOpenStateScopeMap } from '@/ui/layout/dropdown/states/isDropdownOpenStateScopeMap';
import { dropdownHotkeyComponentState } from '@/ui/layout/dropdown/states/dropdownHotkeyComponentState';
import { dropdownWidthComponentState } from '@/ui/layout/dropdown/states/dropdownWidthComponentState';
import { isDropdownOpenComponentState } from '@/ui/layout/dropdown/states/isDropdownOpenComponentState';
import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId';
import { getState } from '@/ui/utilities/recoil-scope/utils/getState';
import { extractComponentState } from '@/ui/utilities/state/component-state/utils/extractComponentState';
type UseDropdownStatesProps = {
dropdownScopeId?: string;
@ -19,8 +19,17 @@ export const useDropdownStates = ({
return {
scopeId,
dropdownHotkeyScopeState: getState(dropdownHotkeyStateScopeMap, scopeId),
dropdownWidthState: getState(dropdownWidthStateScopeMap, scopeId),
isDropdownOpenState: getState(isDropdownOpenStateScopeMap, scopeId),
dropdownHotkeyScopeState: extractComponentState(
dropdownHotkeyComponentState,
scopeId,
),
dropdownWidthState: extractComponentState(
dropdownWidthComponentState,
scopeId,
),
isDropdownOpenState: extractComponentState(
isDropdownOpenComponentState,
scopeId,
),
};
};

View File

@ -1,7 +1,7 @@
import { StateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey';
import { createScopeInternalContext } from '@/ui/utilities/recoil-scope/scopes-internal/utils/createScopeInternalContext';
import { ComponentStateKey } from '@/ui/utilities/state/component-state/types/ComponentStateKey';
type DropdownScopeInternalContextProps = StateScopeMapKey;
type DropdownScopeInternalContextProps = ComponentStateKey;
export const DropdownScopeInternalContext =
createScopeInternalContext<DropdownScopeInternalContextProps>();

View File

@ -0,0 +1,9 @@
import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const dropdownHotkeyComponentState = createComponentState<
HotkeyScope | null | undefined
>({
key: 'dropdownHotkeyComponentState',
defaultValue: null,
});

View File

@ -1,9 +0,0 @@
import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
export const dropdownHotkeyStateScopeMap = createStateScopeMap<
HotkeyScope | null | undefined
>({
key: 'dropdownHotkeyStateScopeMap',
defaultValue: null,
});

View File

@ -0,0 +1,8 @@
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const dropdownWidthComponentState = createComponentState<
number | undefined
>({
key: 'dropdownWidthComponentState',
defaultValue: 160,
});

View File

@ -1,8 +0,0 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
export const dropdownWidthStateScopeMap = createStateScopeMap<
number | undefined
>({
key: 'dropdownWidthStateScopeMap',
defaultValue: 160,
});

View File

@ -0,0 +1,6 @@
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const isDropdownOpenComponentState = createComponentState<boolean>({
key: 'isDropdownOpenComponentState',
defaultValue: false,
});

View File

@ -1,6 +0,0 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
export const isDropdownOpenStateScopeMap = createStateScopeMap<boolean>({
key: 'isDropdownOpenStateScopeMap',
defaultValue: false,
});