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

51
front/src/modules/ui/data/data-table/hooks/useTableColumns.ts
View File

@ -4,13 +4,14 @@ import { useSetRecoilState } from 'recoil';
import { useMoveViewColumns } from '@/ui/data/data-table/hooks/useMoveViewColumns';
import { FieldMetadata } from '@/ui/data/field/types/FieldMetadata';
import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
import { useView } from '@/views/hooks/useView';
import { ViewFieldForVisibility } from '@/views/types/ViewFieldForVisibility';
import { TableContext } from '../contexts/TableContext';
import { availableTableColumnsScopedState } from '../states/availableTableColumnsScopedState';
import { TableRecoilScopeContext } from '../states/recoil-scope-contexts/TableRecoilScopeContext';
import { savedTableColumnsFamilyState } from '../states/savedTableColumnsFamilyState';
import { visibleTableColumnsScopedSelector } from '../states/selectors/visibleTableColumnsScopedSelector';
import { tableColumnsScopedState } from '../states/tableColumnsScopedState';
import { ColumnDefinition } from '../types/ColumnDefinition';
@ -32,6 +33,10 @@ export const useTableColumns = () => {
TableRecoilScopeContext,
);
const visibleTableColumns = useRecoilScopedValue(
visibleTableColumnsScopedSelector,
TableRecoilScopeContext,
);
const { handleColumnMove } = useMoveViewColumns();
const handleColumnsChange = useCallback(
@ -44,27 +49,18 @@ export const useTableColumns = () => {
[onColumnsChange, setSavedTableColumns, setTableColumns],
);
const handleColumnReorder = useCallback(
async (columns: ColumnDefinition<FieldMetadata>[]) => {
const updatedColumns = columns.map((column, index) => ({
...column,
index,
}));
await handleColumnsChange(updatedColumns);
},
[handleColumnsChange],
);
const handleColumnVisibilityChange = useCallback(
async (viewField: ViewFieldForVisibility) => {
async (
viewField: Omit<ColumnDefinition<FieldMetadata>, 'size' | 'position'>,
) => {
const isNewColumn = !tableColumns.some(
(tableColumns) => tableColumns.key === viewField.key,
(tableColumns) => tableColumns.fieldId === viewField.fieldId,
);
if (isNewColumn) {
const newColumn = availableTableColumns.find(
(availableTableColumn) => availableTableColumn.key === viewField.key,
(availableTableColumn) =>
availableTableColumn.fieldId === viewField.fieldId,
);
if (!newColumn) return;
@ -76,7 +72,7 @@ export const useTableColumns = () => {
await handleColumnsChange(nextColumns);
} else {
const nextColumns = tableColumns.map((previousColumn) =>
previousColumn.key === viewField.key
previousColumn.fieldId === viewField.fieldId
? { ...previousColumn, isVisible: !viewField.isVisible }
: previousColumn,
);
@ -92,18 +88,31 @@ export const useTableColumns = () => {
direction: 'left' | 'right',
column: ColumnDefinition<FieldMetadata>,
) => {
const currentColumnArrayIndex = tableColumns.findIndex(
(tableColumn) => tableColumn.key === column.key,
const currentColumnArrayIndex = visibleTableColumns.findIndex(
(visibleColumn) => visibleColumn.fieldId === column.fieldId,
);
const columns = handleColumnMove(
direction,
currentColumnArrayIndex,
tableColumns,
visibleTableColumns,
);
await handleColumnsChange(columns);
},
[tableColumns, handleColumnMove, handleColumnsChange],
[visibleTableColumns, handleColumnMove, handleColumnsChange],
);
const handleColumnReorder = useCallback(
async (columns: ColumnDefinition<FieldMetadata>[]) => {
const updatedColumns = columns.map((column, index) => ({
...column,
position: index,
}));
await handleColumnsChange(updatedColumns);
},
[handleColumnsChange],
);
return {