admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Refactor recoil v4 (#3266)

Browse Source 
* Refactor recoil v4

* Fix ci
This commit is contained in:
Charles Bochet
2024-01-05 19:18:22 +01:00
committed by GitHub
parent 8455e15443
commit 96264e264c
140 changed files with 467 additions and 482 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/twenty-front/src/modules/ui/feedback/dialog-manager/scopes/scope-internal-context/DialogManagerScopeInternalContext.ts
View File

@ -1,7 +1,7 @@
import { ScopedStateKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey';
import { createScopeInternalContext } from '@/ui/utilities/recoil-scope/scopes-internal/utils/createScopeInternalContext';
type DialogManagerScopeInternalContextProps = ScopedStateKey;
type DialogManagerScopeInternalContextProps = StateScopeMapKey;
export const DialogManagerScopeInternalContext =
createScopeInternalContext<DialogManagerScopeInternalContextProps>();

4
packages/twenty-front/src/modules/ui/feedback/dialog-manager/states/dialogInternalScopedState.ts
View File

@ -1,4 +1,4 @@
import { createScopedState } from '@/ui/utilities/recoil-scope/utils/createScopedState';
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { DialogOptions } from '../types/DialogOptions';
@ -7,7 +7,7 @@ type DialogState = {
queue: DialogOptions[];
};
export const dialogInternalScopedState = createScopedState<DialogState>({
export const dialogInternalScopedState = createStateScopeMap<DialogState>({
key: 'dialog/internal-state',
defaultValue: {
maxQueue: 2,

4
packages/twenty-front/src/modules/ui/feedback/snack-bar-manager/scopes/scope-internal-context/SnackBarManagerScopeInternalContext.ts
View File

@ -1,7 +1,7 @@
import { ScopedStateKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey';
import { createScopeInternalContext } from '@/ui/utilities/recoil-scope/scopes-internal/utils/createScopeInternalContext';
type SnackBarManagerScopeInternalContextProps = ScopedStateKey;
type SnackBarManagerScopeInternalContextProps = StateScopeMapKey;
export const SnackBarManagerScopeInternalContext =
createScopeInternalContext<SnackBarManagerScopeInternalContextProps>();

4
packages/twenty-front/src/modules/ui/feedback/snack-bar-manager/states/snackBarInternalScopedState.ts
View File

@ -1,4 +1,4 @@
import { createScopedState } from '@/ui/utilities/recoil-scope/utils/createScopedState';
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { SnackBarProps } from '../components/SnackBar';
@ -11,7 +11,7 @@ type SnackBarState = {
queue: SnackBarOptions[];
};
export const snackBarInternalScopedState = createScopedState<SnackBarState>({
export const snackBarInternalScopedState = createStateScopeMap<SnackBarState>({
key: 'snackBarState',
defaultValue: {
maxQueue: 3,

4
packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx
View File

@ -61,9 +61,9 @@ const IconPickerIcon = ({
selectedIconKey,
Icon,
}: IconPickerIconProps) => {
const { isSelectedItemIdFamilyState } = useSelectableList();
const { isSelectedItemIdSelector } = useSelectableList();
const isSelectedItemId = useRecoilValue(isSelectedItemIdFamilyState(iconKey));
const isSelectedItemId = useRecoilValue(isSelectedItemIdSelector(iconKey));
return (
<StyledLightIconButton

4
packages/twenty-front/src/modules/ui/layout/dropdown/scopes/scope-internal-context/DropdownScopeInternalContext.ts
View File

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

4
packages/twenty-front/src/modules/ui/layout/dropdown/states/dropdownHotkeyScopeScopedState.ts
View File

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

12
packages/twenty-front/src/modules/ui/layout/dropdown/states/dropdownWidthScopedState.ts
View File

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

4
packages/twenty-front/src/modules/ui/layout/dropdown/states/isDropdownOpenScopedState.ts
View File

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

4
packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableItem.tsx
View File

@ -14,9 +14,9 @@ export const SelectableItem = ({
children,
className,
}: SelectableItemProps) => {
const { isSelectedItemIdFamilyState } = useSelectableList();
const { isSelectedItemIdSelector } = useSelectableList();
const isSelectedItemId = useRecoilValue(isSelectedItemIdFamilyState(itemId));
const isSelectedItemId = useRecoilValue(isSelectedItemIdSelector(itemId));
const scrollRef = useRef<HTMLDivElement>(null);

57
packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.tsx
View File

@ -1,9 +1,9 @@
import { useRecoilCallback } from 'recoil';
import { Key } from 'ts-key-enum';
import { useSelectableListScopedState } from '@/ui/layout/selectable-list/hooks/internal/useSelectableListScopedState';
import { getSelectableListScopeInjectors } from '@/ui/layout/selectable-list/utils/internal/getSelectableListScopeInjectors';
import { useSelectableListStates } from '@/ui/layout/selectable-list/hooks/internal/useSelectableListStates';
import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
type Direction = 'up' | 'down' | 'left' | 'right';
@ -27,27 +27,22 @@ export const useSelectableListHotKeys = (
}
};
const { injectSnapshotValueWithSelectableListScopeId } =
useSelectableListScopedState({
selectableListScopeId: scopeId,
});
const {
selectedItemIdState,
selectableItemIdsState,
isSelectedItemIdSelector,
selectableListOnEnterState,
} = useSelectableListStates({
selectableListScopeId: scopeId,
});
const handleSelect = useRecoilCallback(
({ snapshot, set }) =>
(direction: Direction) => {
const {
selectedItemIdScopeInjector,
selectableItemIdsScopeInjector,
isSelectedItemIdFamilyScopeInjector,
} = getSelectableListScopeInjectors();
const selectedItemId = injectSnapshotValueWithSelectableListScopeId(
const selectedItemId = getSnapshotValue(snapshot, selectedItemIdState);
const selectableItemIds = getSnapshotValue(
snapshot,
selectedItemIdScopeInjector,
);
const selectableItemIds = injectSnapshotValueWithSelectableListScopeId(
snapshot,
selectableItemIdsScopeInjector,
selectableItemIdsState,
);
const currentPosition = findPosition(selectableItemIds, selectedItemId);
@ -107,19 +102,16 @@ export const useSelectableListHotKeys = (
if (selectedItemId !== nextId) {
if (nextId) {
set(isSelectedItemIdFamilyScopeInjector(scopeId, nextId), true);
set(selectedItemIdScopeInjector(scopeId), nextId);
set(isSelectedItemIdSelector(nextId), true);
set(selectedItemIdState, nextId);
}
if (selectedItemId) {
set(
isSelectedItemIdFamilyScopeInjector(scopeId, selectedItemId),
false,
);
set(isSelectedItemIdSelector(selectedItemId), false);
}
}
},
[injectSnapshotValueWithSelectableListScopeId, scopeId],
[isSelectedItemIdSelector, selectableItemIdsState, selectedItemIdState],
);
useScopedHotkeys(Key.ArrowUp, () => handleSelect('up'), hotkeyScope, []);
@ -140,25 +132,20 @@ export const useSelectableListHotKeys = (
useRecoilCallback(
({ snapshot }) =>
() => {
const {
selectedItemIdScopeInjector,
selectableListOnEnterScopeInjector,
} = getSelectableListScopeInjectors();
const selectedItemId = injectSnapshotValueWithSelectableListScopeId(
const selectedItemId = getSnapshotValue(
snapshot,
selectedItemIdScopeInjector,
selectedItemIdState,
);
const onEnter = injectSnapshotValueWithSelectableListScopeId(
const onEnter = getSnapshotValue(
snapshot,
selectableListOnEnterScopeInjector,
selectableListOnEnterState,
);
if (selectedItemId) {
onEnter?.(selectedItemId);
}
},
[injectSnapshotValueWithSelectableListScopeId],
[selectableListOnEnterState, selectedItemIdState],
),
hotkeyScope,
[],

32
packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListScopedState.ts
View File

@ -1,32 +0,0 @@
import { SelectableListScopeInternalContext } from '@/ui/layout/selectable-list/scopes/scope-internal-context/SelectableListScopeInternalContext';
import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId';
import { useScopedState } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useScopedState';
type UseSelectableListScopedStatesProps = {
selectableListScopeId?: string;
};
export const useSelectableListScopedState = ({
selectableListScopeId,
}: UseSelectableListScopedStatesProps) => {
const scopeId = useAvailableScopeIdOrThrow(
SelectableListScopeInternalContext,
selectableListScopeId,
);
const {
getScopedState,
getScopedFamilyState,
getScopedSnapshotValue,
getScopedFamilySnapshotValue,
} = useScopedState(scopeId);
return {
scopeId,
injectStateWithSelectableListScopeId: getScopedState,
injectFamilyStateWithSelectableListScopeId: getScopedFamilyState,
injectSnapshotValueWithSelectableListScopeId: getScopedSnapshotValue,
injectFamilySnapshotValueWithSelectableListScopeId:
getScopedFamilySnapshotValue,
};
};

35
packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListStates.ts Normal file
View File

@ -0,0 +1,35 @@
import { SelectableListScopeInternalContext } from '@/ui/layout/selectable-list/scopes/scope-internal-context/SelectableListScopeInternalContext';
import { selectableItemIdsStateScopeMap } from '@/ui/layout/selectable-list/states/selectableItemIdsStateScopeMap';
import { selectableListOnEnterStateScopeMap } from '@/ui/layout/selectable-list/states/selectableListOnEnterStateScopeMap';
import { selectedItemIdStateScopeMap } from '@/ui/layout/selectable-list/states/selectedItemIdStateScopeMap';
import { isSelectedItemIdFamilySelectorScopeMap } from '@/ui/layout/selectable-list/states/selectors/isSelectedItemIdFamilySelectorScopeMap';
import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId';
import { getFamilyState } from '@/ui/utilities/recoil-scope/utils/getFamilyState';
import { getState } from '@/ui/utilities/recoil-scope/utils/getState';
type useSelectableListStatesProps = {
selectableListScopeId?: string;
};
export const useSelectableListStates = ({
selectableListScopeId,
}: useSelectableListStatesProps) => {
const scopeId = useAvailableScopeIdOrThrow(
SelectableListScopeInternalContext,
selectableListScopeId,
);
return {
scopeId,
isSelectedItemIdSelector: getFamilyState(
isSelectedItemIdFamilySelectorScopeMap,
scopeId,
),
selectableItemIdsState: getState(selectableItemIdsStateScopeMap, scopeId),
selectableListOnEnterState: getState(
selectableListOnEnterStateScopeMap,
scopeId,
),
selectedItemIdState: getState(selectedItemIdStateScopeMap, scopeId),
};
};

34
packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableList.ts
View File

@ -1,38 +1,24 @@
import { useResetRecoilState, useSetRecoilState } from 'recoil';
import { useSelectableListScopedState } from '@/ui/layout/selectable-list/hooks/internal/useSelectableListScopedState';
import { getSelectableListScopeInjectors } from '@/ui/layout/selectable-list/utils/internal/getSelectableListScopeInjectors';
import { useSelectableListStates } from '@/ui/layout/selectable-list/hooks/internal/useSelectableListStates';
export const useSelectableList = (selectableListId?: string) => {
const {
injectStateWithSelectableListScopeId,
injectFamilyStateWithSelectableListScopeId,
scopeId,
} = useSelectableListScopedState({
selectableItemIdsState,
selectableListOnEnterState,
isSelectedItemIdSelector,
selectedItemIdState,
} = useSelectableListStates({
selectableListScopeId: selectableListId,
});
const {
selectedItemIdScopeInjector,
selectableItemIdsScopeInjector,
selectableListOnEnterScopeInjector,
isSelectedItemIdFamilyScopeInjector,
} = getSelectableListScopeInjectors();
const setSelectableItemIds = useSetRecoilState(
injectStateWithSelectableListScopeId(selectableItemIdsScopeInjector),
);
const setSelectableItemIds = useSetRecoilState(selectableItemIdsState);
const setSelectableListOnEnter = useSetRecoilState(
injectStateWithSelectableListScopeId(selectableListOnEnterScopeInjector),
selectableListOnEnterState,
);
const isSelectedItemIdFamilyState =
injectFamilyStateWithSelectableListScopeId(
isSelectedItemIdFamilyScopeInjector,
);
const resetSelectedItemIdState = useResetRecoilState(
injectStateWithSelectableListScopeId(selectedItemIdScopeInjector),
);
const resetSelectedItemIdState = useResetRecoilState(selectedItemIdState);
const resetSelectedItem = () => {
resetSelectedItemIdState();
@ -42,7 +28,7 @@ export const useSelectableList = (selectableListId?: string) => {
selectableListId: scopeId,
setSelectableItemIds,
isSelectedItemIdFamilyState,
isSelectedItemIdSelector,
setSelectableListOnEnter,
resetSelectedItem,
};

4
packages/twenty-front/src/modules/ui/layout/selectable-list/scopes/scope-internal-context/SelectableListScopeInternalContext.ts
View File

@ -1,7 +1,7 @@
import { ScopedStateKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey';
import { createScopeInternalContext } from '@/ui/utilities/recoil-scope/scopes-internal/utils/createScopeInternalContext';
type SelectableListScopeInternalContextProps = ScopedStateKey;
type SelectableListScopeInternalContextProps = StateScopeMapKey;
export const SelectableListScopeInternalContext =
createScopeInternalContext<SelectableListScopeInternalContextProps>();

9
packages/twenty-front/src/modules/ui/layout/selectable-list/states/isSelectedItemIdFamilyStateScopeMap.ts Normal file
View File

@ -0,0 +1,9 @@
import { createFamilyStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap';
export const isSelectedItemIdFamilyStateScopeMap = createFamilyStateScopeMap<
boolean,
string
>({
key: 'isSelectedItemIdMapScopedFamilyState',
defaultValue: false,
});

9
packages/twenty-front/src/modules/ui/layout/selectable-list/states/isSelectedItemIdMapScopedFamilyState.ts
View File

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

6
packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectableItemIdsScopedState.ts
View File

@ -1,6 +0,0 @@
import { createScopedState } from '@/ui/utilities/recoil-scope/utils/createScopedState';
export const selectableItemIdsScopedState = createScopedState<string[][]>({
key: 'selectableItemIdsScopedState',
defaultValue: [[]],
});

6
packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectableItemIdsStateScopeMap.ts Normal file
View File

@ -0,0 +1,6 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
export const selectableItemIdsStateScopeMap = createStateScopeMap<string[][]>({
key: 'selectableItemIdsScopedState',
defaultValue: [[]],
});

8
packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectableListOnEnterScopedState.ts
View File

@ -1,8 +0,0 @@
import { createScopedState } from '@/ui/utilities/recoil-scope/utils/createScopedState';
export const selectableListOnEnterScopedState = createScopedState<
((itemId: string) => void) | undefined
>({
key: 'selectableListOnEnterScopedState',
defaultValue: undefined,
});

8
packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectableListOnEnterStateScopeMap.ts Normal file
View File

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

6
packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectedItemIdScopedState.ts
View File

@ -1,6 +0,0 @@
import { createScopedState } from '@/ui/utilities/recoil-scope/utils/createScopedState';
export const selectedItemIdScopedState = createScopedState<string | null>({
key: 'selectedItemIdScopedState',
defaultValue: null,
});

6
packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectedItemIdStateScopeMap.ts Normal file
View File

@ -0,0 +1,6 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
export const selectedItemIdStateScopeMap = createStateScopeMap<string | null>({
key: 'selectedItemIdScopedState',
defaultValue: null,
});

26
packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectors/isSelectedItemIdFamilySelectorScopeMap.ts Normal file
View File

@ -0,0 +1,26 @@
import { isSelectedItemIdFamilyStateScopeMap } from '@/ui/layout/selectable-list/states/isSelectedItemIdFamilyStateScopeMap';
import { createFamilySelectorScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilySelectorScopeMap';
export const isSelectedItemIdFamilySelectorScopeMap =
createFamilySelectorScopeMap<boolean, string>({
key: 'isSelectedItemIdScopedFamilySelector',
get:
({ scopeId, familyKey }: { scopeId: string; familyKey: string }) =>
({ get }) =>
get(
isSelectedItemIdFamilyStateScopeMap({
scopeId: scopeId,
familyKey: familyKey,
}),
),
set:
({ scopeId, familyKey }: { scopeId: string; familyKey: string }) =>
({ set }, newValue) =>
set(
isSelectedItemIdFamilyStateScopeMap({
scopeId: scopeId,
familyKey: familyKey,
}),
newValue,
),
});

28
packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectors/isSelectedItemIdScopedFamilySelector.ts
View File

@ -1,28 +0,0 @@
import { isSelectedItemIdMapScopedFamilyState } from '@/ui/layout/selectable-list/states/isSelectedItemIdMapScopedFamilyState';
import { createScopedFamilySelector } from '@/ui/utilities/recoil-scope/utils/createScopedFamilySelector';
export const isSelectedItemIdScopedFamilySelector = createScopedFamilySelector<
boolean,
string
>({
key: 'isSelectedItemIdScopedFamilySelector',
get:
({ scopeId, familyKey }: { scopeId: string; familyKey: string }) =>
({ get }) =>
get(
isSelectedItemIdMapScopedFamilyState({
scopeId: scopeId,
familyKey: familyKey,
}),
),
set:
({ scopeId, familyKey }: { scopeId: string; familyKey: string }) =>
({ set }, newValue) =>
set(
isSelectedItemIdMapScopedFamilyState({
scopeId: scopeId,
familyKey: familyKey,
}),
newValue,
),
});

28
packages/twenty-front/src/modules/ui/layout/selectable-list/utils/internal/getSelectableListScopeInjectors.ts
View File

@ -1,28 +0,0 @@
import { selectableItemIdsScopedState } from '@/ui/layout/selectable-list/states/selectableItemIdsScopedState';
import { selectableListOnEnterScopedState } from '@/ui/layout/selectable-list/states/selectableListOnEnterScopedState';
import { selectedItemIdScopedState } from '@/ui/layout/selectable-list/states/selectedItemIdScopedState';
import { isSelectedItemIdScopedFamilySelector } from '@/ui/layout/selectable-list/states/selectors/isSelectedItemIdScopedFamilySelector';
import { getFamilyScopeInjector } from '@/ui/utilities/recoil-scope/utils/getFamilyScopeInjector';
import { getScopeInjector } from '@/ui/utilities/recoil-scope/utils/getScopeInjector';
export const getSelectableListScopeInjectors = () => {
const selectedItemIdScopeInjector = getScopeInjector(
selectedItemIdScopedState,
);
const selectableItemIdsScopeInjector = getScopeInjector(
selectableItemIdsScopedState,
);
const selectableListOnEnterScopeInjector = getScopeInjector(
selectableListOnEnterScopedState,
);
const isSelectedItemIdFamilyScopeInjector = getFamilyScopeInjector(
isSelectedItemIdScopedFamilySelector,
);
return {
selectedItemIdScopeInjector,
selectableItemIdsScopeInjector,
selectableListOnEnterScopeInjector,
isSelectedItemIdFamilyScopeInjector,
};
};

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/hooks/useRecoilScopedFamilyState.ts
View File

@ -1,13 +1,13 @@
import { RecoilState, SerializableParam, useRecoilState } from 'recoil';
import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey';
import { FamilyStateScopeMapKey } from '../scopes-internal/types/FamilyStateScopeMapKey';
export const useRecoilScopedFamilyState = <
StateType,
FamilyKey extends SerializableParam,
>(
recoilState: (
scopedFamilyKey: ScopedFamilyStateKey<FamilyKey>,
scopedFamilyKey: FamilyStateScopeMapKey<FamilyKey>,
) => RecoilState<StateType>,
scopeId: string,
familyKey?: FamilyKey,

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/hooks/useRecoilScopedStateV2.ts
View File

@ -1,9 +1,9 @@
import { RecoilState, useRecoilState } from 'recoil';
import { ScopedStateKey } from '../scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '../scopes-internal/types/StateScopeMapKey';
export const useRecoilScopedStateV2 = <StateType>(
recoilState: (scopedKey: ScopedStateKey) => RecoilState<StateType>,
recoilState: (scopedKey: StateScopeMapKey) => RecoilState<StateType>,
scopeId: string,
) => {
return useRecoilState<StateType>(

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/hooks/useRecoilScopedValueV2.ts
View File

@ -1,9 +1,9 @@
import { RecoilState, useRecoilValue } from 'recoil';
import { ScopedStateKey } from '../scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '../scopes-internal/types/StateScopeMapKey';
export const useRecoilScopedValueV2 = <StateType>(
recoilState: (scopedKey: ScopedStateKey) => RecoilState<StateType>,
recoilState: (scopedKey: StateScopeMapKey) => RecoilState<StateType>,
scopeId: string,
) => {
return useRecoilValue<StateType>(

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/hooks/useSetRecoilScopedFamilyState.ts
View File

@ -1,13 +1,13 @@
import { RecoilState, SerializableParam, useSetRecoilState } from 'recoil';
import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey';
import { FamilyStateScopeMapKey } from '../scopes-internal/types/FamilyStateScopeMapKey';
export const useSetRecoilScopedFamilyState = <
StateType,
FamilyKey extends SerializableParam,
>(
recoilState: (
scopedFamilyKey: ScopedFamilyStateKey<FamilyKey>,
scopedFamilyKey: FamilyStateScopeMapKey<FamilyKey>,
) => RecoilState<StateType>,
scopeId: string,
familyKey?: FamilyKey,

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/hooks/useSetRecoilScopedStateV2.ts
View File

@ -1,9 +1,9 @@
import { RecoilState, useSetRecoilState } from 'recoil';
import { ScopedStateKey } from '../scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '../scopes-internal/types/StateScopeMapKey';
export const useSetRecoilScopedStateV2 = <StateType>(
recoilState: (scopedKey: ScopedStateKey) => RecoilState<StateType>,
recoilState: (scopedKey: StateScopeMapKey) => RecoilState<StateType>,
scopeId: string,
) => {
return useSetRecoilState<StateType>(

2
packages/twenty-front/src/modules/ui/utilities/recoil-scope/scopes-internal/types/ScopedFamilyStateKey.ts → packages/twenty-front/src/modules/ui/utilities/recoil-scope/scopes-internal/types/FamilyStateScopeMapKey.ts
View File

@ -1,6 +1,6 @@
import { SerializableParam } from 'recoil';
export type ScopedFamilyStateKey<FamilyKey extends SerializableParam> = {
export type FamilyStateScopeMapKey<FamilyKey extends SerializableParam> = {
scopeId: string;
familyKey: FamilyKey;
};

3
packages/twenty-front/src/modules/ui/utilities/recoil-scope/scopes-internal/types/ScopedStateKey.ts
View File

@ -1,3 +0,0 @@
export type ScopedStateKey = {
scopeId: string;
};

3
packages/twenty-front/src/modules/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey.ts Normal file
View File

@ -0,0 +1,3 @@
export type StateScopeMapKey = {
scopeId: string;
};

6
packages/twenty-front/src/modules/ui/utilities/recoil-scope/scopes-internal/utils/createScopeInternalContext.ts
View File

@ -1,10 +1,10 @@
import { Context, createContext } from 'react';
import { ScopedStateKey } from '../types/ScopedStateKey';
import { StateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey';
type ScopeInternalContext<T extends ScopedStateKey> = Context<T | null>;
type ScopeInternalContext<T extends StateScopeMapKey> = Context<T | null>;
export const createScopeInternalContext = <T extends ScopedStateKey>(
export const createScopeInternalContext = <T extends StateScopeMapKey>(
initialValue?: T,
) => {
return createContext<T | null>(

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/types/RecoilScopedSelector.ts
View File

@ -1,7 +1,7 @@
import { RecoilValueReadOnly } from 'recoil';
import { ScopedStateKey } from '../scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '../scopes-internal/types/StateScopeMapKey';
export type RecoilScopedSelector<StateType> = (
scopedKey: ScopedStateKey,
scopedKey: StateScopeMapKey,
) => RecoilValueReadOnly<StateType>;

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/types/RecoilScopedState.ts
View File

@ -1,7 +1,7 @@
import { RecoilState } from 'recoil';
import { ScopedStateKey } from '../scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '../scopes-internal/types/StateScopeMapKey';
export type RecoilScopedState<StateType> = (
scopedKey: ScopedStateKey,
scopedKey: StateScopeMapKey,
) => RecoilState<StateType>;

10
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createScopedFamilySelector.ts → packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createFamilySelectorScopeMap.ts
View File

@ -11,7 +11,7 @@ import {
WrappedValue,
} from 'recoil';
import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey';
import { FamilyStateScopeMapKey } from '../scopes-internal/types/FamilyStateScopeMapKey';
type SelectorGetter<T, P> = (
param: P,
@ -27,7 +27,7 @@ type SelectorSetter<T, P> = (
newValue: T | DefaultValue,
) => void;
export const createScopedFamilySelector = <
export const createFamilySelectorScopeMap = <
ValueType,
FamilyKey extends SerializableParam,
>({
@ -36,10 +36,10 @@ export const createScopedFamilySelector = <
set,
}: {
key: string;
get: SelectorGetter<ValueType, ScopedFamilyStateKey<FamilyKey>>;
set: SelectorSetter<ValueType, ScopedFamilyStateKey<FamilyKey>>;
get: SelectorGetter<ValueType, FamilyStateScopeMapKey<FamilyKey>>;
set: SelectorSetter<ValueType, FamilyStateScopeMapKey<FamilyKey>>;
}) => {
return selectorFamily<ValueType, ScopedFamilyStateKey<FamilyKey>>({
return selectorFamily<ValueType, FamilyStateScopeMapKey<FamilyKey>>({
key,
get,
set,

6
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createScopedFamilyState.ts → packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap.ts
View File

@ -1,8 +1,8 @@
import { atomFamily, SerializableParam } from 'recoil';
import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey';
import { FamilyStateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/FamilyStateScopeMapKey';
export const createScopedFamilyState = <
export const createFamilyStateScopeMap = <
ValueType,
FamilyKey extends SerializableParam,
>({
@ -12,7 +12,7 @@ export const createScopedFamilyState = <
key: string;
defaultValue: ValueType;
}) => {
return atomFamily<ValueType, ScopedFamilyStateKey<FamilyKey>>({
return atomFamily<ValueType, FamilyStateScopeMapKey<FamilyKey>>({
key,
default: defaultValue,
});

14
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createScopedState.ts
View File

@ -1,14 +0,0 @@
import { atomFamily } from 'recoil';
export const createScopedState = <ValueType>({
key,
defaultValue,
}: {
key: string;
defaultValue: ValueType;
}) => {
return atomFamily<ValueType, { scopeId: string }>({
key,
default: defaultValue,
});
};

8
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createScopedSelector.ts → packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createSelectorScopeMap.ts
View File

@ -7,7 +7,7 @@ import {
WrappedValue,
} from 'recoil';
import { ScopedStateKey } from '../scopes-internal/types/ScopedStateKey';
import { StateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey';
type SelectorGetter<T, P> = (
param: P,
@ -16,14 +16,14 @@ type SelectorGetter<T, P> = (
getCallback: GetCallback;
}) => Promise<T> | RecoilValue<T> | Loadable<T> | WrappedValue<T> | T;
export const createScopedSelector = <ValueType>({
export const createSelectorScopeMap = <ValueType>({
key,
get,
}: {
key: string;
get: SelectorGetter<ValueType, ScopedStateKey>;
get: SelectorGetter<ValueType, StateScopeMapKey>;
}) => {
return selectorFamily<ValueType, ScopedStateKey>({
return selectorFamily<ValueType, StateScopeMapKey>({
key,
get,
});

16
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createStateScopeMap.ts Normal file
View File

@ -0,0 +1,16 @@
import { atomFamily } from 'recoil';
import { StateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey';
export const createStateScopeMap = <ValueType>({
key,
defaultValue,
}: {
key: string;
defaultValue: ValueType;
}) => {
return atomFamily<ValueType, StateScopeMapKey>({
key,
default: defaultValue,
});
};

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getFamilyScopeInjector.ts
View File

@ -1,6 +1,6 @@
import { RecoilState, SerializableParam } from 'recoil';
import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey';
import { FamilyStateScopeMapKey } from '../scopes-internal/types/FamilyStateScopeMapKey';
export type FamilyScopeInjector<
StateType,
@ -12,7 +12,7 @@ export const getFamilyScopeInjector = <
FamilyKey extends SerializableParam,
>(
scopedFamilyState: (
scopedFamilyKey: ScopedFamilyStateKey<FamilyKey>,
scopedFamilyKey: FamilyStateScopeMapKey<FamilyKey>,
) => RecoilState<StateType>,
) => {
return (scopeId: string, familyKey: FamilyKey) =>

16
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getFamilyState.ts Normal file
View File

@ -0,0 +1,16 @@
import { RecoilState, SerializableParam } from 'recoil';
import { FamilyStateScopeMapKey } from '../scopes-internal/types/FamilyStateScopeMapKey';
export const getFamilyState = <StateType, FamilyKey extends SerializableParam>(
familyStateScopeMap: (
scopedFamilyKey: FamilyStateScopeMapKey<FamilyKey>,
) => RecoilState<StateType>,
scopeId: string,
) => {
return (familyKey: FamilyKey) =>
familyStateScopeMap({
scopeId,
familyKey: familyKey || ('' as FamilyKey),
});
};

4
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedFamilyStateDeprecated.ts
View File

@ -1,13 +1,13 @@
import { RecoilState, SerializableParam } from 'recoil';
import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey';
import { FamilyStateScopeMapKey } from '../scopes-internal/types/FamilyStateScopeMapKey';
export const getScopedFamilyStateDeprecated = <
StateType,
FamilyKey extends SerializableParam,
>(
recoilState: (
scopedFamilyKey: ScopedFamilyStateKey<FamilyKey>,
scopedFamilyKey: FamilyStateScopeMapKey<FamilyKey>,
) => RecoilState<StateType>,
scopeId: string,
familyKey: FamilyKey,

10
packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getState.ts Normal file
View File

@ -0,0 +1,10 @@
import { RecoilState } from 'recoil';
import { StateScopeMapKey } from '@/ui/utilities/recoil-scope/scopes-internal/types/StateScopeMapKey';
export const getState = <StateType>(
stateScopeMap: (stateScopeMapKey: StateScopeMapKey) => RecoilState<StateType>,
scopeId: string,
) => {
return stateScopeMap({ scopeId });
};