diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/__tests__/useFilterDropdown.test.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/__tests__/useFilterDropdown.test.tsx index 2d77ce2b840a..a3007acdccc6 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/__tests__/useFilterDropdown.test.tsx +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/__tests__/useFilterDropdown.test.tsx @@ -313,7 +313,7 @@ describe('useFilterDropdown', () => { }); }); - it('should handle scopeId undefined on initial values', () => { + it('should handle componentInstanceId undefined on initial values', () => { global.console.error = jest.fn(); const renderFunction = () => { @@ -322,16 +322,16 @@ describe('useFilterDropdown', () => { expect(renderFunction).toThrow(Error); expect(renderFunction).toThrow( - 'Scope id is not provided and cannot be found in context.', + 'Instance id is not provided and cannot be found in context.', ); }); - it('should scopeId have been defined on initial values', () => { + it('should componentInstanceId have been defined on initial values', () => { const { result } = renderHook( () => useFilterDropdown({ filterDropdownId }), renderHookConfig, ); - expect(result.current.scopeId).toBeDefined(); + expect(result.current.componentInstanceId).toBeDefined(); }); }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useFilterDropdown.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useFilterDropdown.ts index e492f5eb24a8..df5acd6765a6 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useFilterDropdown.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useFilterDropdown.ts @@ -1,25 +1,24 @@ import { useRecoilCallback, useSetRecoilState } from 'recoil'; import { useFilterDropdownStates } from '@/object-record/object-filter-dropdown/hooks/useFilterDropdownStates'; -import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId'; import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; import { objectFilterDropdownFilterIsSelectedComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownFilterIsSelectedComponentState'; import { objectFilterDropdownIsSelectingCompositeFieldComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownIsSelectingCompositeFieldComponentState'; +import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow'; import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2'; import { useUpsertCombinedViewFilters } from '@/views/hooks/useUpsertCombinedViewFilters'; import { isDefined } from 'twenty-ui'; -import { ObjectFilterDropdownScopeInternalContext } from '../scopes/scope-internal-context/ObjectFilterDropdownScopeInternalContext'; import { Filter } from '../types/Filter'; type UseFilterDropdownProps = { filterDropdownId?: string; - advancedFilterViewFilterId?: string; }; export const useFilterDropdown = (props?: UseFilterDropdownProps) => { - const scopeId = useAvailableScopeIdOrThrow( - ObjectFilterDropdownScopeInternalContext, + const componentInstanceId = useAvailableComponentInstanceIdOrThrow( + ObjectFilterDropdownComponentInstanceContext, props?.filterDropdownId, ); @@ -33,7 +32,7 @@ export const useFilterDropdown = (props?: UseFilterDropdownProps) => { onFilterSelectState, advancedFilterViewFilterGroupIdState, advancedFilterViewFilterIdState, - } = useFilterDropdownStates(scopeId); + } = useFilterDropdownStates(componentInstanceId); const { upsertCombinedViewFilter } = useUpsertCombinedViewFilters(); @@ -129,7 +128,7 @@ export const useFilterDropdown = (props?: UseFilterDropdownProps) => { ); return { - scopeId, + componentInstanceId, selectFilter, resetFilter, setSelectedFilter, diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useFilterDropdownStates.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useFilterDropdownStates.ts index 9068c113edd4..4b530d43f1ed 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useFilterDropdownStates.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useFilterDropdownStates.ts @@ -7,53 +7,50 @@ import { objectFilterDropdownSelectedRecordIdsComponentState } from '@/object-re import { onFilterSelectComponentState } from '@/object-record/object-filter-dropdown/states/onFilterSelectComponentState'; import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState'; import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState'; -import { extractComponentState } from '@/ui/utilities/state/component-state/utils/extractComponentState'; -export const useFilterDropdownStates = (scopeId: string) => { - const filterDefinitionUsedInDropdownState = extractComponentState( - filterDefinitionUsedInDropdownComponentState, - scopeId, - ); +export const useFilterDropdownStates = (componentInstanceId: string) => { + const filterDefinitionUsedInDropdownState = + filterDefinitionUsedInDropdownComponentState.atomFamily({ + instanceId: componentInstanceId, + }); - const objectFilterDropdownSearchInputState = extractComponentState( - objectFilterDropdownSearchInputComponentState, - scopeId, - ); + const objectFilterDropdownSearchInputState = + objectFilterDropdownSearchInputComponentState.atomFamily({ + instanceId: componentInstanceId, + }); - const objectFilterDropdownSelectedRecordIdsState = extractComponentState( - objectFilterDropdownSelectedRecordIdsComponentState, - scopeId, - ); + const objectFilterDropdownSelectedRecordIdsState = + objectFilterDropdownSelectedRecordIdsComponentState.atomFamily({ + instanceId: componentInstanceId, + }); - const objectFilterDropdownSelectedOptionValuesState = extractComponentState( - objectFilterDropdownSelectedOptionValuesComponentState, - scopeId, - ); + const objectFilterDropdownSelectedOptionValuesState = + objectFilterDropdownSelectedOptionValuesComponentState.atomFamily({ + instanceId: componentInstanceId, + }); - const selectedFilterState = extractComponentState( - selectedFilterComponentState, - scopeId, - ); + const selectedFilterState = selectedFilterComponentState.atomFamily({ + instanceId: componentInstanceId, + }); - const selectedOperandInDropdownState = extractComponentState( - selectedOperandInDropdownComponentState, - scopeId, - ); + const selectedOperandInDropdownState = + selectedOperandInDropdownComponentState.atomFamily({ + instanceId: componentInstanceId, + }); - const onFilterSelectState = extractComponentState( - onFilterSelectComponentState, - scopeId, - ); + const onFilterSelectState = onFilterSelectComponentState.atomFamily({ + instanceId: componentInstanceId, + }); - const advancedFilterViewFilterGroupIdState = extractComponentState( - advancedFilterViewFilterGroupIdComponentState, - scopeId, - ); + const advancedFilterViewFilterGroupIdState = + advancedFilterViewFilterGroupIdComponentState.atomFamily({ + instanceId: componentInstanceId, + }); - const advancedFilterViewFilterIdState = extractComponentState( - advancedFilterViewFilterIdComponentState, - scopeId, - ); + const advancedFilterViewFilterIdState = + advancedFilterViewFilterIdComponentState.atomFamily({ + instanceId: componentInstanceId, + }); return { filterDefinitionUsedInDropdownState, diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useSetFilterDefinitionUsedInDropdownInScope.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useSetFilterDefinitionUsedInDropdownInScope.ts index 85a515c6d15c..142f76a5d2c9 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useSetFilterDefinitionUsedInDropdownInScope.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useSetFilterDefinitionUsedInDropdownInScope.ts @@ -1,16 +1,19 @@ import { useRecoilCallback } from 'recoil'; import { filterDefinitionUsedInDropdownComponentState } from '../states/filterDefinitionUsedInDropdownComponentState'; import { FilterDefinition } from '../types/FilterDefinition'; -import { extractComponentState } from '@/ui/utilities/state/component-state/utils/extractComponentState'; export const useSetFilterDefinitionUsedInDropdownInScope = () => { const setFilterDefinitionUsedInDropdownInScope = useRecoilCallback( ({ set }) => - (scopeId: string, filterDefinition: FilterDefinition | null) => { - const filterDefinitionUsedInDropdownState = extractComponentState( - filterDefinitionUsedInDropdownComponentState, - scopeId, - ); + ( + componentInstanceId: string, + filterDefinition: FilterDefinition | null, + ) => { + const filterDefinitionUsedInDropdownState = + filterDefinitionUsedInDropdownComponentState.atomFamily({ + instanceId: componentInstanceId, + }); + set(filterDefinitionUsedInDropdownState, filterDefinition); }, [], diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/scopes/ObjectFilterDropdownScope.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/scopes/ObjectFilterDropdownScope.tsx index f7950d494804..25122ffd31ff 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/scopes/ObjectFilterDropdownScope.tsx +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/scopes/ObjectFilterDropdownScope.tsx @@ -1,7 +1,6 @@ import { ReactNode } from 'react'; import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; -import { ObjectFilterDropdownScopeInternalContext } from './scope-internal-context/ObjectFilterDropdownScopeInternalContext'; type ObjectFilterDropdownScopeProps = { children: ReactNode; @@ -16,11 +15,7 @@ export const ObjectFilterDropdownScope = ({ - - {children} - + {children} ); }; diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/scopes/scope-internal-context/ObjectFilterDropdownScopeInternalContext.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/scopes/scope-internal-context/ObjectFilterDropdownScopeInternalContext.ts deleted file mode 100644 index be81417c1ca9..000000000000 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/scopes/scope-internal-context/ObjectFilterDropdownScopeInternalContext.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { createScopeInternalContext } from '@/ui/utilities/recoil-scope/scopes-internal/utils/createScopeInternalContext'; -import { RecoilComponentStateKey } from '@/ui/utilities/state/component-state/types/RecoilComponentStateKey'; - -type ObjectFilterDropdownScopeInternalContextProps = RecoilComponentStateKey; - -export const ObjectFilterDropdownScopeInternalContext = - createScopeInternalContext(); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/advancedFilterViewFilterGroupIdComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/advancedFilterViewFilterGroupIdComponentState.ts index b2c1dad91cf0..64d8238bcc2e 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/advancedFilterViewFilterGroupIdComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/advancedFilterViewFilterGroupIdComponentState.ts @@ -1,7 +1,9 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; export const advancedFilterViewFilterGroupIdComponentState = - createComponentState({ + createComponentStateV2({ key: 'advancedFilterViewFilterGroupIdComponentState', defaultValue: undefined, + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/advancedFilterViewFilterIdComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/advancedFilterViewFilterIdComponentState.ts index 59053b825af0..cc3e3678ddc0 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/advancedFilterViewFilterIdComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/advancedFilterViewFilterIdComponentState.ts @@ -1,8 +1,10 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; -export const advancedFilterViewFilterIdComponentState = createComponentState< +export const advancedFilterViewFilterIdComponentState = createComponentStateV2< string | undefined >({ key: 'advancedFilterViewFilterIdComponentState', defaultValue: undefined, + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/availableFilterDefinitionsComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/availableFilterDefinitionsComponentState.ts index 9a3f649ea491..49d20cb08a8c 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/availableFilterDefinitionsComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/availableFilterDefinitionsComponentState.ts @@ -1,9 +1,11 @@ +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; import { FilterDefinition } from '@/object-record/object-filter-dropdown/types/FilterDefinition'; -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; -export const availableFilterDefinitionsComponentState = createComponentState< +export const availableFilterDefinitionsComponentState = createComponentStateV2< FilterDefinition[] >({ key: 'availableFilterDefinitionsComponentState', defaultValue: [], + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState.ts index c7fd89f92902..dff9ad352888 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState.ts @@ -1,9 +1,10 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; - +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; import { FilterDefinition } from '../types/FilterDefinition'; export const filterDefinitionUsedInDropdownComponentState = - createComponentState({ + createComponentStateV2({ key: 'filterDefinitionUsedInDropdownComponentState', defaultValue: null, + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/isObjectFilterDropdownOperandSelectUnfoldedComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/isObjectFilterDropdownOperandSelectUnfoldedComponentState.ts index 389c6d30f928..eacaa84cc05c 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/isObjectFilterDropdownOperandSelectUnfoldedComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/isObjectFilterDropdownOperandSelectUnfoldedComponentState.ts @@ -1,7 +1,9 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; export const isObjectFilterDropdownOperandSelectUnfoldedComponentState = - createComponentState({ + createComponentStateV2({ key: 'isObjectFilterDropdownOperandSelectUnfoldedComponentState', defaultValue: false, + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/isObjectFilterDropdownUnfoldedComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/isObjectFilterDropdownUnfoldedComponentState.ts index cfd6dea10c8f..ac62700b8d99 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/isObjectFilterDropdownUnfoldedComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/isObjectFilterDropdownUnfoldedComponentState.ts @@ -1,7 +1,9 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; export const isObjectFilterDropdownUnfoldedComponentState = - createComponentState({ - key: 'isObjectFilterDropdownUnfoldedScopedState', + createComponentStateV2({ + key: 'isObjectFilterDropdownUnfoldedComponentState', defaultValue: false, + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState.ts index 8addf2fb6cc6..47ed066c2f7b 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState.ts @@ -1,7 +1,9 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; export const objectFilterDropdownSearchInputComponentState = - createComponentState({ + createComponentStateV2({ key: 'objectFilterDropdownSearchInputComponentState', defaultValue: '', + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedOptionValuesComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedOptionValuesComponentState.ts index feef87220c1e..da1b563a6a59 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedOptionValuesComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedOptionValuesComponentState.ts @@ -1,7 +1,9 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; export const objectFilterDropdownSelectedOptionValuesComponentState = - createComponentState({ + createComponentStateV2({ key: 'objectFilterDropdownSelectedOptionValuesComponentState', defaultValue: [], + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedRecordIdsComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedRecordIdsComponentState.ts index de23b3b0daa5..b579beec63bd 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedRecordIdsComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedRecordIdsComponentState.ts @@ -1,7 +1,9 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; export const objectFilterDropdownSelectedRecordIdsComponentState = - createComponentState({ + createComponentStateV2({ key: 'objectFilterDropdownSelectedRecordIdsComponentState', defaultValue: [], + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/onFilterSelectComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/onFilterSelectComponentState.ts index b73c2cbe962f..2efbd31db7e1 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/onFilterSelectComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/onFilterSelectComponentState.ts @@ -1,10 +1,11 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; - +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; import { Filter } from '../types/Filter'; -export const onFilterSelectComponentState = createComponentState< +export const onFilterSelectComponentState = createComponentStateV2< ((filter: Filter | null) => void) | undefined >({ key: 'onFilterSelectComponentState', defaultValue: undefined, + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/selectedFilterComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/selectedFilterComponentState.ts index 7b4183c74841..543f47806c23 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/selectedFilterComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/selectedFilterComponentState.ts @@ -1,10 +1,11 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; - +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; import { Filter } from '../types/Filter'; -export const selectedFilterComponentState = createComponentState< +export const selectedFilterComponentState = createComponentStateV2< Filter | undefined | null >({ key: 'selectedFilterComponentState', defaultValue: undefined, + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, }); diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState.ts index eef8fe552a96..7ed790b5155b 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState.ts @@ -1,8 +1,10 @@ -import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState'; +import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext'; +import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; import { ViewFilterOperand } from '@/views/types/ViewFilterOperand'; export const selectedOperandInDropdownComponentState = - createComponentState({ + createComponentStateV2({ key: 'selectedOperandInDropdownComponentState', defaultValue: null, + componentInstanceContext: ObjectFilterDropdownComponentInstanceContext, });