mukeshs/twenty_crm
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Migrate view field to new data model - Part 2 (#2270)

Browse Source 
* Migrate view field to new data model

* Migrate view fields to new model
This commit is contained in:
Charles Bochet
2023-10-28 19:13:48 +02:00
committed by GitHub
parent b591023eb3
commit 685d342170
168 changed files with 960 additions and 4568 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
front/src/modules/companies/table/components/CompanyTable.tsx
View File

@ -1,5 +1,7 @@
import styled from '@emotion/styled';
import { useRecoilCallback, useSetRecoilState } from 'recoil';
import { companiesAvailableFieldDefinitions } from '@/companies/constants/companiesAvailableFieldDefinitions';
import { getCompaniesOptimisticEffectDefinition } from '@/companies/graphql/optimistic-effect-definitions/getCompaniesOptimisticEffectDefinition';
import { useCompanyTableActionBarEntries } from '@/companies/hooks/useCompanyTableActionBarEntries';
import { useCompanyTableContextMenuEntries } from '@/companies/hooks/useCompanyTableContextMenuEntries';
@ -9,10 +11,13 @@ import { DataTableEffect } from '@/ui/data/data-table/components/DataTableEffect
import { TableContext } from '@/ui/data/data-table/contexts/TableContext';
import { useUpsertDataTableItem } from '@/ui/data/data-table/hooks/useUpsertDataTableItem';
import { TableOptionsDropdown } from '@/ui/data/data-table/options/components/TableOptionsDropdown';
import { tableColumnsScopedState } from '@/ui/data/data-table/states/tableColumnsScopedState';
import { ViewBar } from '@/views/components/ViewBar';
import { useViewFields } from '@/views/hooks/internal/useViewFields';
import { useView } from '@/views/hooks/useView';
import { ViewScope } from '@/views/scopes/ViewScope';
import { columnDefinitionsToViewFields } from '@/views/utils/columnDefinitionToViewField';
import { viewFieldsToColumnDefinitions } from '@/views/utils/viewFieldsToColumnDefinitions';
import {
UpdateOneCompanyMutationVariables,
useGetCompaniesQuery,
@ -26,13 +31,18 @@ import CompanyTableEffect from './CompanyTableEffect';
export const CompanyTable = () => {
const tableViewScopeId = 'company-table';
const setTableColumns = useSetRecoilState(
tableColumnsScopedState('companies'),
);
const [updateEntityMutation] = useUpdateOneCompanyMutation();
const upsertDataTableItem = useUpsertDataTableItem();
const [getWorkspaceMember] = useGetWorkspaceMembersLazyQuery();
const { persistViewFields } = useViewFields(tableViewScopeId);
const { setCurrentViewFields } = useView({ viewScopeId: tableViewScopeId });
const { setCurrentViewFields, currentViewId } = useView({
viewScopeId: tableViewScopeId,
});
const { setContextMenuEntries } = useCompanyTableContextMenuEntries();
const { setActionBarEntries } = useCompanyTableActionBarEntries();
@ -77,14 +87,25 @@ export const CompanyTable = () => {
`;
return (
<ViewScope viewScopeId={tableViewScopeId}>
<ViewScope
viewScopeId={tableViewScopeId}
onViewFieldsChange={(viewFields) => {
setTableColumns(
viewFieldsToColumnDefinitions(
viewFields,
companiesAvailableFieldDefinitions,
),
);
}}
onViewFiltersChange={() => {}}
>
<StyledContainer>
<TableContext.Provider
value={{
onColumnsChange: (columns) => {
setCurrentViewFields?.(columns);
persistViewFields(columns);
},
onColumnsChange: useRecoilCallback(() => (columns) => {
setCurrentViewFields?.(columnDefinitionsToViewFields(columns));
persistViewFields(columnDefinitionsToViewFields(columns));
}),
}}
>
<ViewBar

66
front/src/modules/companies/table/components/CompanyTableEffect.tsx
View File

@ -3,13 +3,9 @@ import { useEffect } from 'react';
import { companiesAvailableFieldDefinitions } from '@/companies/constants/companiesAvailableFieldDefinitions';
import { availableTableColumnsScopedState } from '@/ui/data/data-table/states/availableTableColumnsScopedState';
import { TableRecoilScopeContext } from '@/ui/data/data-table/states/recoil-scope-contexts/TableRecoilScopeContext';
import { tableColumnsScopedState } from '@/ui/data/data-table/states/tableColumnsScopedState';
import { tableFiltersScopedState } from '@/ui/data/data-table/states/tableFiltersScopedState';
import { tableSortsScopedState } from '@/ui/data/data-table/states/tableSortsScopedState';
import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
import { useView } from '@/views/hooks/useView';
import { useViewInternalStates } from '@/views/hooks/useViewInternalStates';
import { ViewType } from '~/generated/graphql';
import { ViewType } from '@/views/types/ViewType';
import { companyAvailableFilters } from '~/pages/companies/companies-filters';
import { companyAvailableSorts } from '~/pages/companies/companies-sorts';
@ -21,23 +17,6 @@ const CompanyTableEffect = () => {
setViewType,
setViewObjectId,
} = useView();
const { currentViewFields, currentViewSorts, currentViewFilters } =
useViewInternalStates();
const [, setTableColumns] = useRecoilScopedState(
tableColumnsScopedState,
TableRecoilScopeContext,
);
const [, setTableSorts] = useRecoilScopedState(
tableSortsScopedState,
TableRecoilScopeContext,
);
const [, setTableFilters] = useRecoilScopedState(
tableFiltersScopedState,
TableRecoilScopeContext,
);
const [, setAvailableTableColumns] = useRecoilScopedState(
availableTableColumnsScopedState,
@ -57,33 +36,32 @@ const CompanyTableEffect = () => {
setAvailableFilters,
setAvailableSorts,
setAvailableTableColumns,
setTableColumns,
setViewObjectId,
setViewType,
]);
useEffect(() => {
if (currentViewFields) {
setTableColumns([...currentViewFields].sort((a, b) => a.index - b.index));
}
}, [currentViewFields, setTableColumns]);
// useEffect(() => {
// if (currentViewFields) {
// setTableColumns([...currentViewFields].sort((a, b) => a.index - b.index));
// }
// }, [currentViewFields, setTableColumns]);
useEffect(() => {
if (currentViewSorts) {
setTableSorts(currentViewSorts);
}
}, [currentViewFields, currentViewSorts, setTableColumns, setTableSorts]);
// useEffect(() => {
// if (currentViewSorts) {
// setTableSorts(currentViewSorts);
// }
// }, [currentViewFields, currentViewSorts, setTableColumns, setTableSorts]);
useEffect(() => {
if (currentViewFilters) {
setTableFilters(currentViewFilters);
}
}, [
currentViewFields,
currentViewFilters,
setTableColumns,
setTableFilters,
setTableSorts,
]);
// useEffect(() => {
// if (currentViewFilters) {
// setTableFilters(currentViewFilters);
// }
// }, [
// currentViewFields,
// currentViewFilters,
// setTableColumns,
// setTableFilters,
// setTableSorts,
// ]);
return <></>;
};