diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuItem.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuItem.tsx index 3a1f6afd3..0ab61d11c 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuItem.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuItem.tsx @@ -1,3 +1,5 @@ +import { useRecoilValue } from 'recoil'; + import { IconArrowUpRight } from '@/ui/display/icon'; import { IconComponent } from '@/ui/display/icon/types/IconComponent'; import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList'; @@ -30,7 +32,8 @@ export const CommandMenuItem = ({ Icon = IconArrowUpRight; } - const { isSelectedItemId } = useSelectableList({ itemId: id }); + const { isSelectedItemIdFamilyState } = useSelectableList(); + const isSelectedItemId = useRecoilValue(isSelectedItemIdFamilyState(id)); return ( { const navigate = useNavigate(); const setIsCommandMenuOpened = useSetRecoilState(isCommandMenuOpenedState); const setCommands = useSetRecoilState(commandMenuCommandsState); - const { resetSelectedItem } = useSelectableList({ - selectableListId: 'command-menu-list', - }); + const { resetSelectedItem } = useSelectableList('command-menu-list'); const { setHotkeyScopeAndMemorizePreviousScope, goBackToPreviousHotkeyScope, diff --git a/packages/twenty-front/src/modules/object-record/record-board/utils/getRecordBoardScopedStates.ts b/packages/twenty-front/src/modules/object-record/record-board/utils/getRecordBoardScopedStates.ts index 272d36d10..173d4da1a 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/utils/getRecordBoardScopedStates.ts +++ b/packages/twenty-front/src/modules/object-record/record-board/utils/getRecordBoardScopedStates.ts @@ -14,69 +14,69 @@ import { hiddenRecordBoardCardFieldsScopedSelector } from '@/object-record/recor import { recordBoardCardFieldsByKeyScopedSelector } from '@/object-record/record-board/states/selectors/recordBoardCardFieldsByKeyScopedSelector'; import { selectedRecordBoardCardIdsScopedSelector } from '@/object-record/record-board/states/selectors/selectedRecordBoardCardIdsScopedSelector'; import { visibleRecordBoardCardFieldsScopedSelector } from '@/object-record/record-board/states/selectors/visibleRecordBoardCardFieldsScopedSelector'; -import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; +import { getScopedStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedStateDeprecated'; export const getRecordBoardScopedStates = ({ recordBoardScopeId, }: { recordBoardScopeId: string; }) => { - const activeCardIdsState = getScopedState( + const activeCardIdsState = getScopedStateDeprecated( activeRecordBoardCardIdsScopedState, recordBoardScopeId, ); - const availableBoardCardFieldsState = getScopedState( + const availableBoardCardFieldsState = getScopedStateDeprecated( availableRecordBoardCardFieldsScopedState, recordBoardScopeId, ); - const boardColumnsState = getScopedState( + const boardColumnsState = getScopedStateDeprecated( recordBoardColumnsScopedState, recordBoardScopeId, ); - const isBoardLoadedState = getScopedState( + const isBoardLoadedState = getScopedStateDeprecated( isRecordBoardLoadedScopedState, recordBoardScopeId, ); - const isCompactViewEnabledState = getScopedState( + const isCompactViewEnabledState = getScopedStateDeprecated( isCompactViewEnabledScopedState, recordBoardScopeId, ); - const savedBoardColumnsState = getScopedState( + const savedBoardColumnsState = getScopedStateDeprecated( savedRecordBoardColumnsScopedState, recordBoardScopeId, ); - const boardFiltersState = getScopedState( + const boardFiltersState = getScopedStateDeprecated( recordBoardFiltersScopedState, recordBoardScopeId, ); - const boardSortsState = getScopedState( + const boardSortsState = getScopedStateDeprecated( recordBoardSortsScopedState, recordBoardScopeId, ); - const savedCompaniesState = getScopedState( + const savedCompaniesState = getScopedStateDeprecated( savedRecordsScopedState, recordBoardScopeId, ); - const savedOpportunitiesState = getScopedState( + const savedOpportunitiesState = getScopedStateDeprecated( savedOpportunitiesScopedState, recordBoardScopeId, ); - const savedPipelineStepsState = getScopedState( + const savedPipelineStepsState = getScopedStateDeprecated( savedPipelineStepsScopedState, recordBoardScopeId, ); - const onFieldsChangeState = getScopedState( + const onFieldsChangeState = getScopedStateDeprecated( onFieldsChangeScopedState, recordBoardScopeId, ); diff --git a/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTable.ts b/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTable.ts index 07ee5b0c6..410b0741c 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTable.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTable.ts @@ -6,7 +6,7 @@ import { onColumnsChangeScopedState } from '@/object-record/record-table/states/ import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope'; import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId'; -import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; +import { getScopedStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedStateDeprecated'; import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue'; import { FieldMetadata } from '../../field/types/FieldMetadata'; @@ -63,7 +63,7 @@ export const useRecordTable = (props?: useRecordTableProps) => { const onColumnsChange = useRecoilCallback( ({ snapshot }) => (columns: ColumnDefinition[]) => { - const onColumnsChangeState = getScopedState( + const onColumnsChangeState = getScopedStateDeprecated( onColumnsChangeScopedState, scopeId, ); @@ -80,7 +80,7 @@ export const useRecordTable = (props?: useRecordTableProps) => { const onEntityCountChange = useRecoilCallback( ({ snapshot }) => (count: number) => { - const onEntityCountChangeState = getScopedState( + const onEntityCountChangeState = getScopedStateDeprecated( onEntityCountChangeScopedState, scopeId, ); diff --git a/packages/twenty-front/src/modules/object-record/record-table/utils/getRecordTableScopedStates.ts b/packages/twenty-front/src/modules/object-record/record-table/utils/getRecordTableScopedStates.ts index 6697b7d21..2cc8386c4 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/utils/getRecordTableScopedStates.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/utils/getRecordTableScopedStates.ts @@ -1,6 +1,6 @@ import { objectMetadataConfigScopedState } from '@/object-record/record-table/states/objectMetadataConfigScopedState'; import { tableLastRowVisibleScopedState } from '@/object-record/record-table/states/tableLastRowVisibleScopedState'; -import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; +import { getScopedStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedStateDeprecated'; import { availableTableColumnsScopedState } from '../states/availableTableColumnsScopedState'; import { onColumnsChangeScopedState } from '../states/onColumnsChangeScopedState'; @@ -17,27 +17,27 @@ export const getRecordTableScopedStates = ({ }: { recordTableScopeId: string; }) => { - const availableTableColumnsState = getScopedState( + const availableTableColumnsState = getScopedStateDeprecated( availableTableColumnsScopedState, recordTableScopeId, ); - const tableFiltersState = getScopedState( + const tableFiltersState = getScopedStateDeprecated( tableFiltersScopedState, recordTableScopeId, ); - const tableSortsState = getScopedState( + const tableSortsState = getScopedStateDeprecated( tableSortsScopedState, recordTableScopeId, ); - const tableColumnsState = getScopedState( + const tableColumnsState = getScopedStateDeprecated( tableColumnsScopedState, recordTableScopeId, ); - const objectMetadataConfigState = getScopedState( + const objectMetadataConfigState = getScopedStateDeprecated( objectMetadataConfigScopedState, recordTableScopeId, ); @@ -51,17 +51,17 @@ export const getRecordTableScopedStates = ({ const visibleTableColumnsSelector = visibleTableColumnsScopedSelector(recordTableScopeId); - const onColumnsChangeState = getScopedState( + const onColumnsChangeState = getScopedStateDeprecated( onColumnsChangeScopedState, recordTableScopeId, ); - const onEntityCountChangeState = getScopedState( + const onEntityCountChangeState = getScopedStateDeprecated( onEntityCountChangeScopedState, recordTableScopeId, ); - const tableLastRowVisibleState = getScopedState( + const tableLastRowVisibleState = getScopedStateDeprecated( tableLastRowVisibleScopedState, recordTableScopeId, ); diff --git a/packages/twenty-front/src/modules/object-record/relation-picker/components/SelectableMenuItemSelect.tsx b/packages/twenty-front/src/modules/object-record/relation-picker/components/SelectableMenuItemSelect.tsx index a40737f33..0a8815257 100644 --- a/packages/twenty-front/src/modules/object-record/relation-picker/components/SelectableMenuItemSelect.tsx +++ b/packages/twenty-front/src/modules/object-record/relation-picker/components/SelectableMenuItemSelect.tsx @@ -1,4 +1,5 @@ import styled from '@emotion/styled'; +import { useRecoilValue } from 'recoil'; import { EntityForSelect } from '@/object-record/relation-picker/types/EntityForSelect'; import { SelectableItem } from '@/ui/layout/selectable-list/components/SelectableItem'; @@ -21,10 +22,13 @@ export const SelectableMenuItemSelect = ({ onEntitySelected, selectedEntity, }: SelectableMenuItemSelectProps) => { - const { isSelectedItemId } = useSelectableList({ - selectableListId: 'single-entity-select-base-list', - itemId: entity.id, - }); + const { isSelectedItemIdFamilyState } = useSelectableList( + 'single-entity-select-base-list', + ); + + const isSelectedItemId = useRecoilValue( + isSelectedItemIdFamilyState(entity.id), + ); return ( diff --git a/packages/twenty-front/src/modules/object-record/relation-picker/utils/getRelationPickerScopedStates.ts b/packages/twenty-front/src/modules/object-record/relation-picker/utils/getRelationPickerScopedStates.ts index d2962561e..ef052f37c 100644 --- a/packages/twenty-front/src/modules/object-record/relation-picker/utils/getRelationPickerScopedStates.ts +++ b/packages/twenty-front/src/modules/object-record/relation-picker/utils/getRelationPickerScopedStates.ts @@ -2,29 +2,29 @@ import { identifiersMapperScopedState } from '@/object-record/relation-picker/st import { relationPickerPreselectedIdScopedState } from '@/object-record/relation-picker/states/relationPickerPreselectedIdScopedState'; import { relationPickerSearchFilterScopedState } from '@/object-record/relation-picker/states/relationPickerSearchFilterScopedState'; import { searchQueryScopedState } from '@/object-record/relation-picker/states/searchQueryScopedState'; -import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; +import { getScopedStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedStateDeprecated'; export const getRelationPickerScopedStates = ({ relationPickerScopeId, }: { relationPickerScopeId: string; }) => { - const identifiersMapperState = getScopedState( + const identifiersMapperState = getScopedStateDeprecated( identifiersMapperScopedState, relationPickerScopeId, ); - const searchQueryState = getScopedState( + const searchQueryState = getScopedStateDeprecated( searchQueryScopedState, relationPickerScopeId, ); - const relationPickerPreselectedIdState = getScopedState( + const relationPickerPreselectedIdState = getScopedStateDeprecated( relationPickerPreselectedIdScopedState, relationPickerScopeId, ); - const relationPickerSearchFilterState = getScopedState( + const relationPickerSearchFilterState = getScopedStateDeprecated( relationPickerSearchFilterScopedState, relationPickerScopeId, ); diff --git a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx index d83cb49d7..636ca2533 100644 --- a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx @@ -1,5 +1,6 @@ import { useMemo, useState } from 'react'; import styled from '@emotion/styled'; +import { useRecoilValue } from 'recoil'; import { IconApps } from '@/ui/display/icon'; import { useIcons } from '@/ui/display/icon/hooks/useIcons'; @@ -60,7 +61,9 @@ const IconPickerIcon = ({ selectedIconKey, Icon, }: IconPickerIconProps) => { - const { isSelectedItemId } = useSelectableList({ itemId: iconKey }); + const { isSelectedItemIdFamilyState } = useSelectableList(); + + const isSelectedItemId = useRecoilValue(isSelectedItemIdFamilyState(iconKey)); return ( { - const { isSelectedItemIdSelector } = useSelectableListScopedStates({ - itemId: itemId, - }); + const { isSelectedItemIdFamilyState } = useSelectableList(); - const isSelectedItemId = useRecoilValue(isSelectedItemIdSelector); + const isSelectedItemId = useRecoilValue(isSelectedItemIdFamilyState(itemId)); const scrollRef = useRef(null); diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableList.tsx b/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableList.tsx index df06ccae3..69c928acd 100644 --- a/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableList.tsx +++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableList.tsx @@ -25,9 +25,8 @@ export const SelectableList = ({ }: SelectableListProps) => { useSelectableListHotKeys(selectableListId, hotkeyScope); - const { setSelectableItemIds, setSelectableListOnEnter } = useSelectableList({ - selectableListId, - }); + const { setSelectableItemIds, setSelectableListOnEnter } = + useSelectableList(selectableListId); useEffect(() => { setSelectableListOnEnter(() => onEnter); diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.tsx b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.tsx index a710370de..24468ddb4 100644 --- a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.tsx +++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.tsx @@ -1,9 +1,9 @@ import { useRecoilCallback } from 'recoil'; import { Key } from 'ts-key-enum'; -import { getSelectableListScopedStates } from '@/ui/layout/selectable-list/utils/internal/getSelectableListScopedStates'; +import { useSelectableListScopedState } from '@/ui/layout/selectable-list/hooks/internal/useSelectableListScopedState'; +import { getSelectableListScopeInjectors } from '@/ui/layout/selectable-list/utils/internal/getSelectableListScopeInjectors'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; -import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue'; type Direction = 'up' | 'down' | 'left' | 'right'; @@ -27,17 +27,28 @@ export const useSelectableListHotKeys = ( } }; + const { getSelectableListScopedSnapshotValue } = useSelectableListScopedState( + { + selectableListScopeId: scopeId, + }, + ); + const handleSelect = useRecoilCallback( ({ snapshot, set }) => (direction: Direction) => { - const { selectedItemIdState, selectableItemIdsState } = - getSelectableListScopedStates({ - selectableListScopeId: scopeId, - }); - const selectedItemId = getSnapshotValue(snapshot, selectedItemIdState); - const selectableItemIds = getSnapshotValue( + const { + selectedItemIdScopeInjector, + selectableItemIdsScopeInjector, + isSelectedItemIdFamilyScopeInjector, + } = getSelectableListScopeInjectors(); + + const selectedItemId = getSelectableListScopedSnapshotValue( snapshot, - selectableItemIdsState, + selectedItemIdScopeInjector, + ); + const selectableItemIds = getSelectableListScopedSnapshotValue( + snapshot, + selectableItemIdsScopeInjector, ); const currentPosition = findPosition(selectableItemIds, selectedItemId); @@ -97,24 +108,19 @@ export const useSelectableListHotKeys = ( if (selectedItemId !== nextId) { if (nextId) { - const { isSelectedItemIdSelector } = getSelectableListScopedStates({ - selectableListScopeId: scopeId, - itemId: nextId, - }); - set(isSelectedItemIdSelector, true); - set(selectedItemIdState, nextId); + set(isSelectedItemIdFamilyScopeInjector(scopeId, nextId), true); + set(selectedItemIdScopeInjector(scopeId), nextId); } if (selectedItemId) { - const { isSelectedItemIdSelector } = getSelectableListScopedStates({ - selectableListScopeId: scopeId, - itemId: selectedItemId, - }); - set(isSelectedItemIdSelector, false); + set( + isSelectedItemIdFamilyScopeInjector(scopeId, selectedItemId), + false, + ); } } }, - [scopeId], + [getSelectableListScopedSnapshotValue, scopeId], ); useScopedHotkeys(Key.ArrowUp, () => handleSelect('up'), hotkeyScope, []); @@ -135,25 +141,25 @@ export const useSelectableListHotKeys = ( useRecoilCallback( ({ snapshot }) => () => { - const { selectedItemIdState, selectableListOnEnterState } = - getSelectableListScopedStates({ - selectableListScopeId: scopeId, - }); - const selectedItemId = getSnapshotValue( + const { + selectedItemIdScopeInjector, + selectableListOnEnterScopeInjector, + } = getSelectableListScopeInjectors(); + const selectedItemId = getSelectableListScopedSnapshotValue( snapshot, - selectedItemIdState, + selectedItemIdScopeInjector, ); - const onEnter = getSnapshotValue( + const onEnter = getSelectableListScopedSnapshotValue( snapshot, - selectableListOnEnterState, + selectableListOnEnterScopeInjector, ); if (selectedItemId) { onEnter?.(selectedItemId); } }, - [scopeId], + [getSelectableListScopedSnapshotValue], ), hotkeyScope, [], diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListScopedState.ts b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListScopedState.ts new file mode 100644 index 000000000..e7a4e67e1 --- /dev/null +++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListScopedState.ts @@ -0,0 +1,31 @@ +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, + getSelectableListScopedState: getScopedState, + getSelectableListScopedFamilyState: getScopedFamilyState, + getSelectableListScopedSnapshotValue: getScopedSnapshotValue, + getSelectableListScopedFamilySnapshotValue: getScopedFamilySnapshotValue, + }; +}; diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListScopedStates.ts b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListScopedStates.ts deleted file mode 100644 index 6afabd8a6..000000000 --- a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListScopedStates.ts +++ /dev/null @@ -1,36 +0,0 @@ -import { SelectableListScopeInternalContext } from '@/ui/layout/selectable-list/scopes/scope-internal-context/SelectableListScopeInternalContext'; -import { getSelectableListScopedStates } from '@/ui/layout/selectable-list/utils/internal/getSelectableListScopedStates'; -import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId'; - -type UseSelectableListScopedStatesProps = { - selectableListScopeId?: string; - itemId?: string; -}; - -export const useSelectableListScopedStates = ( - args?: UseSelectableListScopedStatesProps, -) => { - const { selectableListScopeId, itemId } = args ?? {}; - const scopeId = useAvailableScopeIdOrThrow( - SelectableListScopeInternalContext, - selectableListScopeId, - ); - - const { - selectedItemIdState, - selectableItemIdsState, - isSelectedItemIdSelector, - selectableListOnEnterState, - } = getSelectableListScopedStates({ - selectableListScopeId: scopeId, - itemId: itemId, - }); - - return { - scopeId, - isSelectedItemIdSelector, - selectableItemIdsState, - selectedItemIdState, - selectableListOnEnterState, - }; -}; diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableList.ts b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableList.ts index c477277c9..782f619eb 100644 --- a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableList.ts +++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableList.ts @@ -1,52 +1,48 @@ -import { useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil'; +import { useResetRecoilState, useSetRecoilState } from 'recoil'; -import { useSelectableListScopedStates } from '@/ui/layout/selectable-list/hooks/internal/useSelectableListScopedStates'; -import { SelectableListScopeInternalContext } from '@/ui/layout/selectable-list/scopes/scope-internal-context/SelectableListScopeInternalContext'; -import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId'; - -type UseSelectableListProps = { - selectableListId?: string; - itemId?: string; -}; - -export const useSelectableList = (props?: UseSelectableListProps) => { - const scopeId = useAvailableScopeIdOrThrow( - SelectableListScopeInternalContext, - props?.selectableListId, - ); +import { useSelectableListScopedState } from '@/ui/layout/selectable-list/hooks/internal/useSelectableListScopedState'; +import { getSelectableListScopeInjectors } from '@/ui/layout/selectable-list/utils/internal/getSelectableListScopeInjectors'; +export const useSelectableList = (selectableListScopeId?: string) => { const { - selectableItemIdsState, - isSelectedItemIdSelector, - selectableListOnEnterState, - selectedItemIdState, - } = useSelectableListScopedStates({ - selectableListScopeId: scopeId, - itemId: props?.itemId, + getSelectableListScopedState, + getSelectableListScopedFamilyState, + scopeId, + } = useSelectableListScopedState({ + selectableListScopeId, }); - const setSelectableItemIds = useSetRecoilState(selectableItemIdsState); - const setSelectableListOnEnter = useSetRecoilState( - selectableListOnEnterState, - ); - const isSelectedItemId = useRecoilValue(isSelectedItemIdSelector); + const { + selectedItemIdScopeInjector, + selectableItemIdsScopeInjector, + selectableListOnEnterScopeInjector, + isSelectedItemIdFamilyScopeInjector, + } = getSelectableListScopeInjectors(); - const resetSelectedItemIdState = useResetRecoilState(selectedItemIdState); - const resetIsSelectedItemIdSelector = useResetRecoilState( - isSelectedItemIdSelector, + const setSelectableItemIds = useSetRecoilState( + getSelectableListScopedState(selectableItemIdsScopeInjector), + ); + const setSelectableListOnEnter = useSetRecoilState( + getSelectableListScopedState(selectableListOnEnterScopeInjector), + ); + const isSelectedItemIdFamilyState = getSelectableListScopedFamilyState( + isSelectedItemIdFamilyScopeInjector, + ); + + const resetSelectedItemIdState = useResetRecoilState( + getSelectableListScopedState(selectedItemIdScopeInjector), ); const resetSelectedItem = () => { resetSelectedItemIdState(); - resetIsSelectedItemIdSelector(); }; return { - setSelectableItemIds, - isSelectedItemId, - setSelectableListOnEnter, selectableListId: scopeId, - isSelectedItemIdSelector, + + setSelectableItemIds, + isSelectedItemIdFamilyState, + setSelectableListOnEnter, resetSelectedItem, }; }; diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectors/isSelectedItemIdScopedFamilySelector.ts b/packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectors/isSelectedItemIdScopedFamilySelector.ts index f217cef99..31cb4b048 100644 --- a/packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectors/isSelectedItemIdScopedFamilySelector.ts +++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/states/selectors/isSelectedItemIdScopedFamilySelector.ts @@ -1,25 +1,27 @@ -import { selectorFamily } from 'recoil'; - import { isSelectedItemIdMapScopedFamilyState } from '@/ui/layout/selectable-list/states/isSelectedItemIdMapScopedFamilyState'; +import { createScopedFamilySelector } from '@/ui/utilities/recoil-scope/utils/createScopedFamilySelector'; -export const isSelectedItemIdScopedFamilySelector = selectorFamily({ +export const isSelectedItemIdScopedFamilySelector = createScopedFamilySelector< + boolean, + string +>({ key: 'isSelectedItemIdScopedFamilySelector', get: - ({ scopeId, itemId }: { scopeId: string; itemId: string }) => + ({ scopeId, familyKey }: { scopeId: string; familyKey: string }) => ({ get }) => get( isSelectedItemIdMapScopedFamilyState({ scopeId: scopeId, - familyKey: itemId, + familyKey: familyKey, }), ), set: - ({ scopeId, itemId }: { scopeId: string; itemId: string }) => + ({ scopeId, familyKey }: { scopeId: string; familyKey: string }) => ({ set }, newValue) => set( isSelectedItemIdMapScopedFamilyState({ scopeId: scopeId, - familyKey: itemId, + familyKey: familyKey, }), newValue, ), diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/utils/internal/getSelectableListScopeInjectors.ts b/packages/twenty-front/src/modules/ui/layout/selectable-list/utils/internal/getSelectableListScopeInjectors.ts new file mode 100644 index 000000000..c02eebbc4 --- /dev/null +++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/utils/internal/getSelectableListScopeInjectors.ts @@ -0,0 +1,28 @@ +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, + }; +}; diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/utils/internal/getSelectableListScopedStates.ts b/packages/twenty-front/src/modules/ui/layout/selectable-list/utils/internal/getSelectableListScopedStates.ts deleted file mode 100644 index 847485dc5..000000000 --- a/packages/twenty-front/src/modules/ui/layout/selectable-list/utils/internal/getSelectableListScopedStates.ts +++ /dev/null @@ -1,42 +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 { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; - -const UNDEFINED_SELECTABLE_ITEM_ID = 'UNDEFINED_SELECTABLE_ITEM_ID'; - -export const getSelectableListScopedStates = ({ - selectableListScopeId, - itemId, -}: { - selectableListScopeId: string; - itemId?: string; -}) => { - const isSelectedItemIdSelector = isSelectedItemIdScopedFamilySelector({ - scopeId: selectableListScopeId, - itemId: itemId ?? UNDEFINED_SELECTABLE_ITEM_ID, - }); - - const selectedItemIdState = getScopedState( - selectedItemIdScopedState, - selectableListScopeId, - ); - - const selectableItemIdsState = getScopedState( - selectableItemIdsScopedState, - selectableListScopeId, - ); - - const selectableListOnEnterState = getScopedState( - selectableListOnEnterScopedState, - selectableListScopeId, - ); - - return { - isSelectedItemIdSelector, - selectableItemIdsState, - selectedItemIdState, - selectableListOnEnterState, - }; -}; diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/scopes-internal/hooks/useScopedState.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/scopes-internal/hooks/useScopedState.ts new file mode 100644 index 000000000..3ab4e24e5 --- /dev/null +++ b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/scopes-internal/hooks/useScopedState.ts @@ -0,0 +1,38 @@ +import { SerializableParam, Snapshot } from 'recoil'; + +import { FamilyScopeInjector } from '@/ui/utilities/recoil-scope/utils/getFamilyScopeInjector'; +import { ScopeInjector } from '@/ui/utilities/recoil-scope/utils/getScopeInjector'; +import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue'; + +export const useScopedState = (scopeId: string) => { + const getScopedState = (scopeInjector: ScopeInjector) => + scopeInjector(scopeId); + + const getScopedFamilyState = + ( + familyScopeInjector: FamilyScopeInjector, + ) => + (familyKey: FamilyKey) => + familyScopeInjector(scopeId, familyKey); + + const getScopedSnapshotValue = ( + snashot: Snapshot, + scopeInjector: ScopeInjector, + ) => getSnapshotValue(snashot, scopeInjector(scopeId)); + + const getScopedFamilySnapshotValue = + ( + snashot: Snapshot, + familyScopeInjector: FamilyScopeInjector, + ) => + (familyKey: FamilyKey) => + getSnapshotValue(snashot, familyScopeInjector(scopeId, familyKey)); + + return { + scopeId, + getScopedState, + getScopedFamilyState, + getScopedSnapshotValue, + getScopedFamilySnapshotValue, + }; +}; diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createScopedFamilySelector.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createScopedFamilySelector.ts new file mode 100644 index 000000000..7701f0d46 --- /dev/null +++ b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/createScopedFamilySelector.ts @@ -0,0 +1,47 @@ +import { + DefaultValue, + GetCallback, + GetRecoilValue, + Loadable, + RecoilValue, + ResetRecoilState, + selectorFamily, + SerializableParam, + SetRecoilState, + WrappedValue, +} from 'recoil'; + +import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey'; + +type SelectorGetter = ( + param: P, +) => (opts: { + get: GetRecoilValue; + getCallback: GetCallback; +}) => Promise | RecoilValue | Loadable | WrappedValue | T; + +type SelectorSetter = ( + param: P, +) => ( + opts: { set: SetRecoilState; get: GetRecoilValue; reset: ResetRecoilState }, + newValue: T | DefaultValue, +) => void; + +export const createScopedFamilySelector = < + ValueType, + FamilyKey extends SerializableParam, +>({ + key, + get, + set, +}: { + key: string; + get: SelectorGetter>; + set: SelectorSetter>; +}) => { + return selectorFamily>({ + key, + get, + set, + }); +}; diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getFamilyScopeInjector.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getFamilyScopeInjector.ts new file mode 100644 index 000000000..dc328ddc7 --- /dev/null +++ b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getFamilyScopeInjector.ts @@ -0,0 +1,23 @@ +import { RecoilState, SerializableParam } from 'recoil'; + +import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey'; + +export type FamilyScopeInjector< + StateType, + FamilyKey extends SerializableParam, +> = (scopeId: string, familyKey: FamilyKey) => RecoilState; + +export const getFamilyScopeInjector = < + StateType, + FamilyKey extends SerializableParam, +>( + scopedFamilyState: ( + scopedFamilyKey: ScopedFamilyStateKey, + ) => RecoilState, +) => { + return (scopeId: string, familyKey: FamilyKey) => + scopedFamilyState({ + scopeId, + familyKey: familyKey || ('' as FamilyKey), + }); +}; diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopeInjector.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopeInjector.ts new file mode 100644 index 000000000..7659fd352 --- /dev/null +++ b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopeInjector.ts @@ -0,0 +1,16 @@ +import { RecoilState } from 'recoil'; + +import { RecoilScopedState } from '../types/RecoilScopedState'; + +export type ScopeInjector = ( + scopeId: string, +) => RecoilState; + +export const getScopeInjector = ( + scopedState: RecoilScopedState, +) => { + return (scopeId: string) => + scopedState({ + scopeId, + }); +}; diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedFamilyState.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedFamilyStateDeprecated.ts similarity index 90% rename from packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedFamilyState.ts rename to packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedFamilyStateDeprecated.ts index 8d516e820..b95fbe01c 100644 --- a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedFamilyState.ts +++ b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedFamilyStateDeprecated.ts @@ -2,7 +2,7 @@ import { RecoilState, SerializableParam } from 'recoil'; import { ScopedFamilyStateKey } from '../scopes-internal/types/ScopedFamilyStateKey'; -export const getScopedFamilyState = < +export const getScopedFamilyStateDeprecated = < StateType, FamilyKey extends SerializableParam, >( diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedSelector.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedSelectorDeprecated.ts similarity index 78% rename from packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedSelector.ts rename to packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedSelectorDeprecated.ts index 2998d3f30..7ff7d3d91 100644 --- a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedSelector.ts +++ b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedSelectorDeprecated.ts @@ -1,6 +1,6 @@ import { RecoilScopedSelector } from '../types/RecoilScopedSelector'; -export const getScopedSelector = ( +export const getScopedSelectorDeprecated = ( recoilScopedState: RecoilScopedSelector, scopeId: string, ) => { diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedState.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedStateDeprecated.ts similarity index 78% rename from packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedState.ts rename to packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedStateDeprecated.ts index 10be20e4b..db7a3cbd2 100644 --- a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedState.ts +++ b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getScopedStateDeprecated.ts @@ -1,6 +1,6 @@ import { RecoilScopedState } from '../types/RecoilScopedState'; -export const getScopedState = ( +export const getScopedStateDeprecated = ( recoilScopedState: RecoilScopedState, scopeId: string, ) => { diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getSnapshotScopedSelector.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getSnapshotScopedSelector.ts deleted file mode 100644 index 73c084793..000000000 --- a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getSnapshotScopedSelector.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Snapshot } from 'recoil'; - -import { RecoilScopedSelector } from '../types/RecoilScopedSelector'; - -import { getScopedSelector } from './getScopedSelector'; - -export const getSnapshotScopedSelector = ( - snapshot: Snapshot, - scopedState: RecoilScopedSelector, - scopeId: string, -) => { - return snapshot - .getLoadable(getScopedSelector(scopedState, scopeId)) - .getValue(); -}; diff --git a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getSnapshotScopedValue.ts b/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getSnapshotScopedValue.ts deleted file mode 100644 index 596283788..000000000 --- a/packages/twenty-front/src/modules/ui/utilities/recoil-scope/utils/getSnapshotScopedValue.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { Snapshot } from 'recoil'; - -import { RecoilScopedState } from '../types/RecoilScopedState'; - -import { getScopedState } from './getScopedState'; - -export const getSnapshotScopedValue = ( - snapshot: Snapshot, - scopedState: RecoilScopedState, - scopeId: string, -) => { - return snapshot.getLoadable(getScopedState(scopedState, scopeId)).getValue(); -}; diff --git a/packages/twenty-front/src/modules/views/hooks/internal/useViewScopedStates.ts b/packages/twenty-front/src/modules/views/hooks/internal/useViewScopedStates.ts index acff12f9c..bc2c90030 100644 --- a/packages/twenty-front/src/modules/views/hooks/internal/useViewScopedStates.ts +++ b/packages/twenty-front/src/modules/views/hooks/internal/useViewScopedStates.ts @@ -1,7 +1,7 @@ import { useRecoilState } from 'recoil'; import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId'; -import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; +import { getScopedStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedStateDeprecated'; import { UNDEFINED_FAMILY_ITEM_ID } from '../../constants'; import { ViewScopeInternalContext } from '../../scopes/scope-internal-context/ViewScopeInternalContext'; @@ -18,7 +18,7 @@ export const useViewScopedStates = (args?: { viewScopeId?: string }) => { // View const [currentViewId] = useRecoilState( - getScopedState(currentViewIdScopedState, scopeId), + getScopedStateDeprecated(currentViewIdScopedState, scopeId), ); const viewId = currentViewId ?? UNDEFINED_FAMILY_ITEM_ID; diff --git a/packages/twenty-front/src/modules/views/utils/getViewScopedStateValuesFromSnapshot.ts b/packages/twenty-front/src/modules/views/utils/getViewScopedStateValuesFromSnapshot.ts index b17cdbef6..7276dc306 100644 --- a/packages/twenty-front/src/modules/views/utils/getViewScopedStateValuesFromSnapshot.ts +++ b/packages/twenty-front/src/modules/views/utils/getViewScopedStateValuesFromSnapshot.ts @@ -1,6 +1,6 @@ import { Snapshot } from 'recoil'; -import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; +import { getScopedStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedStateDeprecated'; import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue'; import { UNDEFINED_FAMILY_ITEM_ID } from '../constants'; @@ -19,7 +19,7 @@ export const getViewScopedStateValuesFromSnapshot = ({ }) => { const currentViewId = getSnapshotValue( snapshot, - getScopedState(currentViewIdScopedState, viewScopeId), + getScopedStateDeprecated(currentViewIdScopedState, viewScopeId), ); const familyItemId = viewId ?? currentViewId ?? UNDEFINED_FAMILY_ITEM_ID; diff --git a/packages/twenty-front/src/modules/views/utils/getViewScopedStatesFromSnapshot.ts b/packages/twenty-front/src/modules/views/utils/getViewScopedStatesFromSnapshot.ts index 7c1b7e75f..069fd33ff 100644 --- a/packages/twenty-front/src/modules/views/utils/getViewScopedStatesFromSnapshot.ts +++ b/packages/twenty-front/src/modules/views/utils/getViewScopedStatesFromSnapshot.ts @@ -1,6 +1,6 @@ import { Snapshot } from 'recoil'; -import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; +import { getScopedStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedStateDeprecated'; import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue'; import { UNDEFINED_FAMILY_ITEM_ID } from '../constants'; @@ -19,7 +19,7 @@ export const getViewScopedStatesFromSnapshot = ({ }) => { const currentViewId = getSnapshotValue( snapshot, - getScopedState(currentViewIdScopedState, viewScopeId), + getScopedStateDeprecated(currentViewIdScopedState, viewScopeId), ); const usedViewId = viewId ?? currentViewId ?? UNDEFINED_FAMILY_ITEM_ID; diff --git a/packages/twenty-front/src/modules/views/utils/internal/getViewScopedStates.ts b/packages/twenty-front/src/modules/views/utils/internal/getViewScopedStates.ts index 7234cc10e..12bf96b0c 100644 --- a/packages/twenty-front/src/modules/views/utils/internal/getViewScopedStates.ts +++ b/packages/twenty-front/src/modules/views/utils/internal/getViewScopedStates.ts @@ -1,6 +1,6 @@ -import { getScopedFamilyState } from '@/ui/utilities/recoil-scope/utils/getScopedFamilyState'; -import { getScopedSelector } from '@/ui/utilities/recoil-scope/utils/getScopedSelector'; -import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState'; +import { getScopedFamilyStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedFamilyStateDeprecated'; +import { getScopedSelectorDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedSelectorDeprecated'; +import { getScopedStateDeprecated } from '@/ui/utilities/recoil-scope/utils/getScopedStateDeprecated'; import { currentViewIdScopedState } from '@/views/states/currentViewIdScopedState'; import { isPersistingViewScopedState } from '@/views/states/isPersistingViewScopedState'; import { currentViewScopedSelector } from '@/views/states/selectors/currentViewScopedSelector'; @@ -36,43 +36,46 @@ export const getViewScopedStates = ({ viewScopeId: string; viewId: string; }) => { - const viewEditModeState = getScopedState( + const viewEditModeState = getScopedStateDeprecated( viewEditModeScopedState, viewScopeId, ); - const viewsState = getScopedState(viewsScopedState, viewScopeId); + const viewsState = getScopedStateDeprecated(viewsScopedState, viewScopeId); - const viewObjectMetadataIdState = getScopedState( + const viewObjectMetadataIdState = getScopedStateDeprecated( viewObjectMetadataIdScopeState, viewScopeId, ); - const viewTypeState = getScopedState(viewTypeScopedState, viewScopeId); + const viewTypeState = getScopedStateDeprecated( + viewTypeScopedState, + viewScopeId, + ); - const entityCountInCurrentViewState = getScopedState( + const entityCountInCurrentViewState = getScopedStateDeprecated( entityCountInCurrentViewScopedState, viewScopeId, ); - const isViewBarExpandedState = getScopedState( + const isViewBarExpandedState = getScopedStateDeprecated( isViewBarExpandedScopedState, viewScopeId, ); - const isPersistingViewState = getScopedState( + const isPersistingViewState = getScopedStateDeprecated( isPersistingViewScopedState, viewScopeId, ); // ViewSorts - const currentViewSortsState = getScopedFamilyState( + const currentViewSortsState = getScopedFamilyStateDeprecated( currentViewSortsScopedFamilyState, viewScopeId, viewId, ); - const savedViewSortsState = getScopedFamilyState( + const savedViewSortsState = getScopedFamilyStateDeprecated( savedViewSortsScopedFamilyState, viewScopeId, viewId, @@ -83,7 +86,7 @@ export const getViewScopedStates = ({ viewId: viewId, }); - const availableSortDefinitionsState = getScopedState( + const availableSortDefinitionsState = getScopedStateDeprecated( availableSortDefinitionsScopedState, viewScopeId, ); @@ -94,13 +97,13 @@ export const getViewScopedStates = ({ }); // ViewFilters - const currentViewFiltersState = getScopedFamilyState( + const currentViewFiltersState = getScopedFamilyStateDeprecated( currentViewFiltersScopedFamilyState, viewScopeId, viewId, ); - const savedViewFiltersState = getScopedFamilyState( + const savedViewFiltersState = getScopedFamilyStateDeprecated( savedViewFiltersScopedFamilyState, viewScopeId, viewId, @@ -112,7 +115,7 @@ export const getViewScopedStates = ({ viewId: viewId, }); - const availableFilterDefinitionsState = getScopedState( + const availableFilterDefinitionsState = getScopedStateDeprecated( availableFilterDefinitionsScopedState, viewScopeId, ); @@ -123,18 +126,18 @@ export const getViewScopedStates = ({ }); // ViewFields - const availableFieldDefinitionsState = getScopedState( + const availableFieldDefinitionsState = getScopedStateDeprecated( availableFieldDefinitionsScopedState, viewScopeId, ); - const currentViewFieldsState = getScopedFamilyState( + const currentViewFieldsState = getScopedFamilyStateDeprecated( currentViewFieldsScopedFamilyState, viewScopeId, viewId, ); - const savedViewFieldsState = getScopedFamilyState( + const savedViewFieldsState = getScopedFamilyStateDeprecated( savedViewFieldsScopedFamilyState, viewScopeId, viewId, @@ -146,27 +149,27 @@ export const getViewScopedStates = ({ }); // ViewChangeHandlers - const onViewSortsChangeState = getScopedState( + const onViewSortsChangeState = getScopedStateDeprecated( onViewSortsChangeScopedState, viewScopeId, ); - const onViewFiltersChangeState = getScopedState( + const onViewFiltersChangeState = getScopedStateDeprecated( onViewFiltersChangeScopedState, viewScopeId, ); - const onViewFieldsChangeState = getScopedState( + const onViewFieldsChangeState = getScopedStateDeprecated( onViewFieldsChangeScopedState, viewScopeId, ); - const currentViewIdState = getScopedState( + const currentViewIdState = getScopedStateDeprecated( currentViewIdScopedState, viewScopeId, ); - const currentViewSelector = getScopedSelector( + const currentViewSelector = getScopedSelectorDeprecated( currentViewScopedSelector, viewScopeId, );