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

Introduce ComponentState (#4386)

Browse Source 
* Proof of concept ComponentState

* Migrate to createState and createFamilyState

* Refactor

* Fix

* Fix tests

* Fix lint

* Fix tests

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

4
packages/twenty-front/src/modules/views/scopes/scope-internal-context/ViewScopeInternalContext.ts
View File

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

4
packages/twenty-front/src/modules/views/states/availableFieldDefinitionsScopedState.ts
View File

@ -1,8 +1,8 @@
import { FieldMetadata } from '@/object-record/record-field/types/FieldMetadata';
import { ColumnDefinition } from '@/object-record/record-table/types/ColumnDefinition';
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const availableFieldDefinitionsScopedState = createStateScopeMap<
export const availableFieldDefinitionsScopedState = createComponentState<
ColumnDefinition<FieldMetadata>[]
>({
key: 'availableFieldDefinitionsScopedState',

4
packages/twenty-front/src/modules/views/states/availableFilterDefinitionsScopedState.ts
View File

@ -1,7 +1,7 @@
import { FilterDefinition } from '@/object-record/object-filter-dropdown/types/FilterDefinition';
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const availableFilterDefinitionsScopedState = createStateScopeMap<
export const availableFilterDefinitionsScopedState = createComponentState<
FilterDefinition[]
>({
key: 'availableFilterDefinitionsScopedState',

4
packages/twenty-front/src/modules/views/states/availableSortDefinitionsScopedState.ts
View File

@ -1,7 +1,7 @@
import { SortDefinition } from '@/object-record/object-sort-dropdown/types/SortDefinition';
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const availableSortDefinitionsScopedState = createStateScopeMap<
export const availableSortDefinitionsScopedState = createComponentState<
SortDefinition[]
>({
key: 'availableSortDefinitionsScopedState',

4
packages/twenty-front/src/modules/views/states/currentViewFieldsScopedFamilyState.ts
View File

@ -1,8 +1,8 @@
import { createFamilyStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap';
import { createComponentFamilyState } from '@/ui/utilities/state/component-state/utils/createComponentFamilyState';
import { ViewField } from '../types/ViewField';
export const currentViewFieldsScopedFamilyState = createFamilyStateScopeMap<
export const currentViewFieldsScopedFamilyState = createComponentFamilyState<
ViewField[],
string
>({

4
packages/twenty-front/src/modules/views/states/currentViewFiltersScopedFamilyState.ts
View File

@ -1,8 +1,8 @@
import { createFamilyStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap';
import { createComponentFamilyState } from '@/ui/utilities/state/component-state/utils/createComponentFamilyState';
import { ViewFilter } from '../types/ViewFilter';
export const currentViewFiltersScopedFamilyState = createFamilyStateScopeMap<
export const currentViewFiltersScopedFamilyState = createComponentFamilyState<
ViewFilter[],
string
>({

14
packages/twenty-front/src/modules/views/states/currentViewIdScopedState.ts
View File

@ -1,8 +1,8 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const currentViewIdScopedState = createStateScopeMap<string | undefined>(
{
key: 'currentViewIdScopedState',
defaultValue: undefined,
},
);
export const currentViewIdScopedState = createComponentState<
string | undefined
>({
key: 'currentViewIdScopedState',
defaultValue: undefined,
});

4
packages/twenty-front/src/modules/views/states/currentViewSortsScopedFamilyState.ts
View File

@ -1,8 +1,8 @@
import { createFamilyStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap';
import { createComponentFamilyState } from '@/ui/utilities/state/component-state/utils/createComponentFamilyState';
import { ViewSort } from '../types/ViewSort';
export const currentViewSortsScopedFamilyState = createFamilyStateScopeMap<
export const currentViewSortsScopedFamilyState = createComponentFamilyState<
ViewSort[],
string
>({

12
packages/twenty-front/src/modules/views/states/entityCountInCurrentViewScopedState.ts
View File

@ -1,6 +1,8 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const entityCountInCurrentViewScopedState = createStateScopeMap<number>({
key: 'entityCountInCurrentViewScopedState',
defaultValue: 0,
});
export const entityCountInCurrentViewScopedState = createComponentState<number>(
{
key: 'entityCountInCurrentViewScopedState',
defaultValue: 0,
},
);

4
packages/twenty-front/src/modules/views/states/isPersistingViewScopedState.ts
View File

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

4
packages/twenty-front/src/modules/views/states/isViewBarExpandedScopedState.ts
View File

@ -1,6 +1,6 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const isViewBarExpandedScopedState = createStateScopeMap<boolean>({
export const isViewBarExpandedScopedState = createComponentState<boolean>({
key: 'isViewBarExpandedScopedState',
defaultValue: true,
});

4
packages/twenty-front/src/modules/views/states/noneScopedFamilyState.ts
View File

@ -1,6 +1,6 @@
import { createFamilyStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap';
import { createComponentFamilyState } from '@/ui/utilities/state/component-state/utils/createComponentFamilyState';
export const noneScopedFamilyState = createFamilyStateScopeMap<any, string>({
export const noneScopedFamilyState = createComponentFamilyState<any, string>({
key: 'noneScopedFamilyState',
defaultValue: null,
});

4
packages/twenty-front/src/modules/views/states/onViewCompactModeChangeScopeState.ts
View File

@ -1,6 +1,6 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const onViewCompactModeChangeScopeState = createStateScopeMap<
export const onViewCompactModeChangeScopeState = createComponentState<
((isCompactModeActive: boolean) => void | Promise<void>) | undefined
>({
key: 'onViewCompactModeChangeScopeState',

4
packages/twenty-front/src/modules/views/states/onViewFieldsChangeScopedState.ts
View File

@ -1,8 +1,8 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
import { ViewField } from '../types/ViewField';
export const onViewFieldsChangeScopedState = createStateScopeMap<
export const onViewFieldsChangeScopedState = createComponentState<
((fields: ViewField[]) => void | Promise<void>) | undefined
>({
key: 'onViewFieldsChangeScopedState',

4
packages/twenty-front/src/modules/views/states/onViewFiltersChangeScopedState.ts
View File

@ -1,7 +1,7 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
import { ViewFilter } from '@/views/types/ViewFilter';
export const onViewFiltersChangeScopedState = createStateScopeMap<
export const onViewFiltersChangeScopedState = createComponentState<
((filters: ViewFilter[]) => void | Promise<void>) | undefined
>({
key: 'onViewFiltersChangeScopedState',

4
packages/twenty-front/src/modules/views/states/onViewSortsChangeScopedState.ts
View File

@ -1,7 +1,7 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
import { ViewSort } from '@/views/types/ViewSort';
export const onViewSortsChangeScopedState = createStateScopeMap<
export const onViewSortsChangeScopedState = createComponentState<
((sorts: ViewSort[]) => void | Promise<void>) | undefined
>({
key: 'onViewSortsChangeScopedState',

4
packages/twenty-front/src/modules/views/states/onViewTypeChangeScopedState.ts
View File

@ -1,7 +1,7 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
import { ViewType } from '@/views/types/ViewType';
export const onViewTypeChangeScopedState = createStateScopeMap<
export const onViewTypeChangeScopedState = createComponentState<
((viewType: ViewType) => void | Promise<void>) | undefined
>({
key: 'onViewTypeChangeScopedState',

4
packages/twenty-front/src/modules/views/states/savedViewFieldsScopedFamilyState.ts
View File

@ -1,8 +1,8 @@
import { createFamilyStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap';
import { createComponentFamilyState } from '@/ui/utilities/state/component-state/utils/createComponentFamilyState';
import { ViewField } from '../types/ViewField';
export const savedViewFieldsScopedFamilyState = createFamilyStateScopeMap<
export const savedViewFieldsScopedFamilyState = createComponentFamilyState<
ViewField[],
string
>({

4
packages/twenty-front/src/modules/views/states/savedViewFiltersScopedFamilyState.ts
View File

@ -1,8 +1,8 @@
import { createFamilyStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap';
import { createComponentFamilyState } from '@/ui/utilities/state/component-state/utils/createComponentFamilyState';
import { ViewFilter } from '../types/ViewFilter';
export const savedViewFiltersScopedFamilyState = createFamilyStateScopeMap<
export const savedViewFiltersScopedFamilyState = createComponentFamilyState<
ViewFilter[],
string
>({

4
packages/twenty-front/src/modules/views/states/savedViewSortsScopedFamilyState.ts
View File

@ -1,8 +1,8 @@
import { createFamilyStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createFamilyStateScopeMap';
import { createComponentFamilyState } from '@/ui/utilities/state/component-state/utils/createComponentFamilyState';
import { ViewSort } from '../types/ViewSort';
export const savedViewSortsScopedFamilyState = createFamilyStateScopeMap<
export const savedViewSortsScopedFamilyState = createComponentFamilyState<
ViewSort[],
string
>({

4
packages/twenty-front/src/modules/views/states/selectors/currentViewScopedSelector.ts → packages/twenty-front/src/modules/views/states/selectors/currentViewComponentSelector.ts
View File

@ -1,11 +1,11 @@
import { createSelectorReadOnlyScopeMap } from '@/ui/utilities/recoil-scope/utils/createSelectorReadOnlyScopeMap';
import { createComponentReadOnlySelector } from '@/ui/utilities/state/component-state/utils/createComponentReadOnlySelector';
import { GraphQLView } from '@/views/types/GraphQLView';
import { currentViewIdScopedState } from '../currentViewIdScopedState';
import { viewsByIdScopedSelector } from './viewsByIdScopedSelector';
export const currentViewScopedSelector = createSelectorReadOnlyScopeMap<
export const currentViewComponentSelector = createComponentReadOnlySelector<
GraphQLView | undefined
>({
key: 'currentViewScopedSelector',

4
packages/twenty-front/src/modules/views/states/viewEditModeScopedState.ts
View File

@ -1,6 +1,6 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const viewEditModeScopedState = createStateScopeMap<
export const viewEditModeScopedState = createComponentState<
'none' | 'edit' | 'create'
>({
key: 'viewEditModeScopedState',

4
packages/twenty-front/src/modules/views/states/viewObjectMetadataIdScopeState.ts
View File

@ -1,6 +1,6 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
export const viewObjectMetadataIdScopeState = createStateScopeMap<
export const viewObjectMetadataIdScopeState = createComponentState<
string | undefined
>({
key: 'viewObjectMetadataIdScopeState',

4
packages/twenty-front/src/modules/views/states/viewTypeScopedState.ts
View File

@ -1,8 +1,8 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
import { ViewType } from '../types/ViewType';
export const viewTypeScopedState = createStateScopeMap<ViewType>({
export const viewTypeScopedState = createComponentState<ViewType>({
key: 'viewTypeScopedState',
defaultValue: ViewType.Table,
});

4
packages/twenty-front/src/modules/views/states/viewsScopedState.ts
View File

@ -1,7 +1,7 @@
import { createStateScopeMap } from '@/ui/utilities/recoil-scope/utils/createStateScopeMap';
import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
import { GraphQLView } from '@/views/types/GraphQLView';
export const viewsScopedState = createStateScopeMap<GraphQLView[]>({
export const viewsScopedState = createComponentState<GraphQLView[]>({
key: 'viewsScopedState',
defaultValue: [],
});

6
packages/twenty-front/src/modules/views/utils/internal/getViewScopedStates.ts
View File

@ -5,7 +5,8 @@ import { currentViewIdScopedState } from '@/views/states/currentViewIdScopedStat
import { isPersistingViewScopedState } from '@/views/states/isPersistingViewScopedState';
import { onViewCompactModeChangeScopeState } from '@/views/states/onViewCompactModeChangeScopeState';
import { onViewTypeChangeScopedState } from '@/views/states/onViewTypeChangeScopedState';
import { currentViewScopedSelector } from '@/views/states/selectors/currentViewScopedSelector';
import { currentViewComponentSelector } from '@/views/states/selectors/currentViewComponentSelector';
import { savedViewFieldByKeyScopedFamilySelector } from '@/views/states/selectors/savedViewFieldByKeyScopedFamilySelector';
import { availableFieldDefinitionsScopedState } from '../../states/availableFieldDefinitionsScopedState';
import { availableFilterDefinitionsScopedState } from '../../states/availableFilterDefinitionsScopedState';
@ -23,7 +24,6 @@ import { savedViewFiltersScopedFamilyState } from '../../states/savedViewFilters
import { savedViewSortsScopedFamilyState } from '../../states/savedViewSortsScopedFamilyState';
import { canPersistViewFiltersScopedFamilySelector } from '../../states/selectors/canPersistViewFiltersScopedFamilySelector';
import { canPersistViewSortsScopedFamilySelector } from '../../states/selectors/canPersistViewSortsScopedFamilySelector';
import { savedViewFieldByKeyScopedFamilySelector } from '../../states/selectors/savedViewFieldByKeyScopedFamilySelector';
import { savedViewFiltersByKeyScopedFamilySelector } from '../../states/selectors/savedViewFiltersByKeyScopedFamilySelector';
import { savedViewSortsByKeyScopedFamilySelector } from '../../states/selectors/savedViewSortsByKeyScopedFamilySelector';
import { viewEditModeScopedState } from '../../states/viewEditModeScopedState';
@ -182,7 +182,7 @@ export const getViewScopedStates = ({
);
const currentViewSelector = getScopedSelectorDeprecated(
currentViewScopedSelector,
currentViewComponentSelector,
viewScopeId,
);