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

Refactor Views by cleaning the code, relying on apolloCache and improving performances (#4516)

Browse Source 
* Wip refactoring view

* Post merge conflicts

* Fix review

* Add create view capability

* Fix create object missing view

* Fix tests
This commit is contained in:
Charles Bochet
2024-03-20 14:21:58 +01:00
committed by GitHub
parent 20e14cb455
commit cfb0cce9b8
392 changed files with 3474 additions and 4410 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
packages/twenty-front/src/modules/views/scopes/ViewScope.tsx
View File

@ -1,10 +1,6 @@
import { ReactNode } from 'react';
import { ViewFilter } from '@/views/types/ViewFilter';
import { ViewSort } from '@/views/types/ViewSort';
import { ViewType } from '@/views/types/ViewType';
import { ViewField } from '../types/ViewField';
import { GraphQLView } from '@/views/types/GraphQLView';
import { ViewScopeInitEffect } from './init-effect/ViewScopeInitEffect';
import { ViewScopeInternalContext } from './scope-internal-context/ViewScopeInternalContext';
@ -12,23 +8,13 @@ import { ViewScopeInternalContext } from './scope-internal-context/ViewScopeInte
type ViewScopeProps = {
children: ReactNode;
viewScopeId: string;
onViewSortsChange?: (sorts: ViewSort[]) => void | Promise<void>;
onViewFiltersChange?: (filters: ViewFilter[]) => void | Promise<void>;
onViewFieldsChange?: (fields: ViewField[]) => void | Promise<void>;
onViewTypeChange?: (viewType: ViewType) => void | Promise<void>;
onViewCompactModeChange?: (
isCompactModeActive: boolean,
) => void | Promise<void>;
onCurrentViewChange: (view: GraphQLView | undefined) => void | Promise<void>;
};
export const ViewScope = ({
children,
viewScopeId,
onViewSortsChange,
onViewFiltersChange,
onViewFieldsChange,
onViewTypeChange,
onViewCompactModeChange,
onCurrentViewChange,
}: ViewScopeProps) => {
return (
<ViewScopeInternalContext.Provider
@ -38,11 +24,7 @@ export const ViewScope = ({
>
<ViewScopeInitEffect
viewScopeId={viewScopeId}
onViewSortsChange={onViewSortsChange}
onViewFiltersChange={onViewFiltersChange}
onViewFieldsChange={onViewFieldsChange}
onViewTypeChange={onViewTypeChange}
onViewCompactModeChange={onViewCompactModeChange}
onCurrentViewChange={onCurrentViewChange}
/>
{children}
</ViewScopeInternalContext.Provider>

56
packages/twenty-front/src/modules/views/scopes/init-effect/ViewScopeInitEffect.tsx
View File

@ -1,64 +1,24 @@
import { useEffect } from 'react';
import { useSetRecoilState } from 'recoil';
import { useViewScopedStates } from '@/views/hooks/internal/useViewScopedStates';
import { ViewField } from '@/views/types/ViewField';
import { ViewFilter } from '@/views/types/ViewFilter';
import { ViewSort } from '@/views/types/ViewSort';
import { ViewType } from '@/views/types/ViewType';
import { useViewStates } from '@/views/hooks/internal/useViewStates';
import { GraphQLView } from '@/views/types/GraphQLView';
type ViewScopeInitEffectProps = {
viewScopeId: string;
onViewSortsChange?: (sorts: ViewSort[]) => void | Promise<void>;
onViewFiltersChange?: (filters: ViewFilter[]) => void | Promise<void>;
onViewFieldsChange?: (fields: ViewField[]) => void | Promise<void>;
onViewTypeChange?: (viewType: ViewType) => void | Promise<void>;
onViewCompactModeChange?: (
isCompactModeActive: boolean,
) => void | Promise<void>;
onCurrentViewChange: (view: GraphQLView | undefined) => void | Promise<void>;
};
export const ViewScopeInitEffect = ({
onViewSortsChange,
onViewFiltersChange,
onViewFieldsChange,
onViewTypeChange,
onViewCompactModeChange,
onCurrentViewChange,
}: ViewScopeInitEffectProps) => {
const {
onViewFieldsChangeState,
onViewFiltersChangeState,
onViewSortsChangeState,
onViewTypeChangeState,
onViewCompactModeChangeState,
} = useViewScopedStates();
const { onCurrentViewChangeState } = useViewStates();
const setOnViewSortsChange = useSetRecoilState(onViewSortsChangeState);
const setOnViewFiltersChange = useSetRecoilState(onViewFiltersChangeState);
const setOnViewFieldsChange = useSetRecoilState(onViewFieldsChangeState);
const setOnViewTypeChange = useSetRecoilState(onViewTypeChangeState);
const setOnViewCompactModeChange = useSetRecoilState(
onViewCompactModeChangeState,
);
const setOnCurrentViewChange = useSetRecoilState(onCurrentViewChangeState);
useEffect(() => {
setOnViewSortsChange(() => onViewSortsChange);
setOnViewFiltersChange(() => onViewFiltersChange);
setOnViewFieldsChange(() => onViewFieldsChange);
setOnViewTypeChange(() => onViewTypeChange);
setOnViewCompactModeChange(() => onViewCompactModeChange);
}, [
onViewCompactModeChange,
onViewFieldsChange,
onViewFiltersChange,
onViewSortsChange,
onViewTypeChange,
setOnViewCompactModeChange,
setOnViewFieldsChange,
setOnViewFiltersChange,
setOnViewSortsChange,
setOnViewTypeChange,
]);
setOnCurrentViewChange(() => onCurrentViewChange);
}, [onCurrentViewChange, setOnCurrentViewChange]);
return <></>;
};