From 98c27c46efc31e302f00b2ae90b9172437da742b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=A9r=C3=A9my=20Magrin?= Date: Thu, 14 Nov 2024 09:38:00 +0100 Subject: [PATCH] fix: apply review --- .../types/RecordGroupDefinition.ts | 2 - .../record-table/components/RecordTable.tsx | 16 +++--- ...s.tsx => RecordTableNoRecordGroupRows.tsx} | 2 +- ...Row.tsx => RecordTableRecordGroupRows.tsx} | 9 ++- .../perf/RecordTableCell.perf.stories.tsx | 2 +- .../hooks/useCreateNewTableRecords.ts | 2 +- .../hooks/useRecordTableMoveFocus.ts | 57 ++++--------------- ...y.tsx => RecordTableNoRecordGroupBody.tsx} | 6 +- ...=> RecordTableNoRecordGroupBodyEffect.tsx} | 2 +- ...x => RecordTableRecordGroupBodyEffect.tsx} | 2 +- ... => RecordTableRecordGroupBodyEffects.tsx} | 6 +- ...ps.tsx => RecordTableRecordGroupsBody.tsx} | 8 +-- .../components/RecordTableCellWrapper.tsx | 6 +- .../record-table-cell/hooks/__mocks__/cell.ts | 2 +- .../useSelectedTableCellEditMode.test.tsx | 10 ++-- .../hooks/useSelectedTableCellEditMode.ts | 4 +- ...bleCellInEditModePositionComponentState.ts | 2 +- .../states/softFocusPositionComponentState.ts | 2 +- .../tableRecordGroupIdsComponentState.ts | 4 +- .../tableRowIdsByGroupComponentFamilyState.ts | 4 +- .../record-table/types/TableCellPosition.ts | 2 +- 21 files changed, 60 insertions(+), 90 deletions(-) rename packages/twenty-front/src/modules/object-record/record-table/components/{RecordTableRows.tsx => RecordTableNoRecordGroupRows.tsx} (94%) rename packages/twenty-front/src/modules/object-record/record-table/components/{RecordTableRecordGroupRow.tsx => RecordTableRecordGroupRows.tsx} (64%) rename packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/{RecordTableBody.tsx => RecordTableNoRecordGroupBody.tsx} (86%) rename packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/{RecordTableBodyEffect.tsx => RecordTableNoRecordGroupBodyEffect.tsx} (98%) rename packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/{RecordTableBodyRecordGroupEffect.tsx => RecordTableRecordGroupBodyEffect.tsx} (97%) rename packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/{RecordTableBodyRecordGroupEffects.tsx => RecordTableRecordGroupBodyEffects.tsx} (73%) rename packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/{RecordTableBodyRecordGroups.tsx => RecordTableRecordGroupsBody.tsx} (91%) diff --git a/packages/twenty-front/src/modules/object-record/record-group/types/RecordGroupDefinition.ts b/packages/twenty-front/src/modules/object-record/record-group/types/RecordGroupDefinition.ts index f1f4199d97bc..2c6884ce103c 100644 --- a/packages/twenty-front/src/modules/object-record/record-group/types/RecordGroupDefinition.ts +++ b/packages/twenty-front/src/modules/object-record/record-group/types/RecordGroupDefinition.ts @@ -15,5 +15,3 @@ export type RecordGroupDefinition = { position: number; isVisible: boolean; }; - -export type RecordGroupDefinitionId = RecordGroupDefinition['id']; diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx index f525db8f7b11..ac2fd976d25d 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx @@ -8,11 +8,11 @@ import { RecordTableStickyEffect } from '@/object-record/record-table/components import { RECORD_TABLE_CLICK_OUTSIDE_LISTENER_ID } from '@/object-record/record-table/constants/RecordTableClickOutsideListenerId'; import { RecordTableEmptyState } from '@/object-record/record-table/empty-state/components/RecordTableEmptyState'; import { useRecordTable } from '@/object-record/record-table/hooks/useRecordTable'; -import { RecordTableBody } from '@/object-record/record-table/record-table-body/components/RecordTableBody'; -import { RecordTableBodyEffect } from '@/object-record/record-table/record-table-body/components/RecordTableBodyEffect'; -import { RecordTableBodyRecordGroupEffects } from '@/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroupEffects'; -import { RecordTableBodyRecordGroups } from '@/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroups'; import { RecordTableBodyUnselectEffect } from '@/object-record/record-table/record-table-body/components/RecordTableBodyUnselectEffect'; +import { RecordTableNoRecordGroupBody } from '@/object-record/record-table/record-table-body/components/RecordTableNoRecordGroupBody'; +import { RecordTableNoRecordGroupBodyEffect } from '@/object-record/record-table/record-table-body/components/RecordTableNoRecordGroupBodyEffect'; +import { RecordTableRecordGroupBodyEffects } from '@/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffects'; +import { RecordTableRecordGroupsBody } from '@/object-record/record-table/record-table-body/components/RecordTableRecordGroupsBody'; import { RecordTableHeader } from '@/object-record/record-table/record-table-header/components/RecordTableHeader'; import { isRecordTableInitialLoadingComponentState } from '@/object-record/record-table/states/isRecordTableInitialLoadingComponentState'; import { recordTablePendingRecordIdComponentState } from '@/object-record/record-table/states/recordTablePendingRecordIdComponentState'; @@ -92,9 +92,9 @@ export const RecordTable = ({ viewBarId={viewBarId} > {!hasRecordGroups ? ( - + ) : ( - + )} {!hasRecordGroups ? ( - + ) : ( - )} diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRows.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableNoRecordGroupRows.tsx similarity index 94% rename from packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRows.tsx rename to packages/twenty-front/src/modules/object-record/record-table/components/RecordTableNoRecordGroupRows.tsx index acafabf6869d..f36fa08ae48f 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRows.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableNoRecordGroupRows.tsx @@ -3,7 +3,7 @@ import { RecordTableRow } from '@/object-record/record-table/record-table-row/co import { tableAllRowIdsComponentState } from '@/object-record/record-table/states/tableAllRowIdsComponentState'; import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; -export const RecordTableRows = () => { +export const RecordTableNoRecordGroupRows = () => { const rowIds = useRecoilComponentValueV2(tableAllRowIdsComponentState); return ( diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRow.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx similarity index 64% rename from packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRow.tsx rename to packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx index b8f0c2dc957d..74cafa957962 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRow.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx @@ -1,17 +1,24 @@ import { useCurrentRecordGroupId } from '@/object-record/record-group/hooks/useCurrentRecordGroupId'; import { RecordTableRow } from '@/object-record/record-table/record-table-row/components/RecordTableRow'; +import { tableAllRowIdsComponentState } from '@/object-record/record-table/states/tableAllRowIdsComponentState'; import { tableRowIdsByGroupComponentFamilyState } from '@/object-record/record-table/states/tableRowIdsByGroupComponentFamilyState'; import { useRecoilComponentFamilyValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentFamilyValueV2'; +import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; export const RecordTableRecordGroupRows = () => { const recordGroupId = useCurrentRecordGroupId(); + const allRowIds = useRecoilComponentValueV2(tableAllRowIdsComponentState); + const recordGroupRowIds = useRecoilComponentFamilyValueV2( tableRowIdsByGroupComponentFamilyState, recordGroupId, ); - return recordGroupRowIds.map((recordId, rowIndex) => { + return recordGroupRowIds.map((recordId) => { + // Find the index of the recordId in allRowIds + const rowIndex = allRowIds.indexOf(recordId); + return ( ); diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/__stories__/perf/RecordTableCell.perf.stories.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/__stories__/perf/RecordTableCell.perf.stories.tsx index 4545d14e0756..8846fc39f7da 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/__stories__/perf/RecordTableCell.perf.stories.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/__stories__/perf/RecordTableCell.perf.stories.tsx @@ -105,7 +105,7 @@ const meta: Meta = { value={{ columnDefinition: mockPerformance.fieldDefinition, columnIndex: 0, - cellPosition: { recordId: 'recordId', column: 0 }, + cellPosition: { row: 0, column: 0 }, hasSoftFocus: false, isInEditMode: false, }} diff --git a/packages/twenty-front/src/modules/object-record/record-table/hooks/useCreateNewTableRecords.ts b/packages/twenty-front/src/modules/object-record/record-table/hooks/useCreateNewTableRecords.ts index 0ba3db5459a5..15056d35102d 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/hooks/useCreateNewTableRecords.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/hooks/useCreateNewTableRecords.ts @@ -23,7 +23,7 @@ export const useCreateNewTableRecord = (recordTableIdFromProps?: string) => { const createNewTableRecord = () => { setPendingRecordId(v4()); - setSelectedTableCellEditMode('', 0); + setSelectedTableCellEditMode(-1, 0); setHotkeyScope(DEFAULT_CELL_SCOPE.scope, DEFAULT_CELL_SCOPE.customScopes); }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTableMoveFocus.ts b/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTableMoveFocus.ts index 6c73b98c57e6..bcc4a226cd97 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTableMoveFocus.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/hooks/useRecordTableMoveFocus.ts @@ -7,22 +7,8 @@ import { numberOfTableColumnsComponentSelector } from '@/object-record/record-ta import { softFocusPositionComponentState } from '@/object-record/record-table/states/softFocusPositionComponentState'; import { tableAllRowIdsComponentState } from '@/object-record/record-table/states/tableAllRowIdsComponentState'; import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2'; -import { isDefined } from '~/utils/isDefined'; import { useSetSoftFocusPosition } from './internal/useSetSoftFocusPosition'; -const getRecordIdFromRowIndex = ( - rowIds: string[], - rowIndex: number, -): string => { - const rowId = rowIds?.[rowIndex]; - - if (!isDefined(rowId)) { - throw new Error(`Record ID not found at index ${rowIndex}`); - } - - return rowId; -}; - export const useRecordTableMoveFocus = (recordTableId?: string) => { const setSoftFocusPosition = useSetSoftFocusPosition(recordTableId); @@ -39,19 +25,12 @@ export const useRecordTableMoveFocus = (recordTableId?: string) => { const moveUp = useRecoilCallback( ({ snapshot }) => () => { - const allRowIds = getSnapshotValue(snapshot, tableAllRowIdsState); const softFocusPosition = getSnapshotValue( snapshot, softFocusPositionState, ); - const currentRowIndex = allRowIds.indexOf(softFocusPosition.recordId); - - if (currentRowIndex === -1) { - return; - } - - let newRowIndex = currentRowIndex - 1; + let newRowIndex = softFocusPosition.row - 1; if (newRowIndex < 0) { newRowIndex = 0; @@ -59,10 +38,10 @@ export const useRecordTableMoveFocus = (recordTableId?: string) => { setSoftFocusPosition({ ...softFocusPosition, - recordId: getRecordIdFromRowIndex(allRowIds, newRowIndex), + row: newRowIndex, }); }, - [tableAllRowIdsState, softFocusPositionState, setSoftFocusPosition], + [softFocusPositionState, setSoftFocusPosition], ); const moveDown = useRecoilCallback( @@ -74,13 +53,7 @@ export const useRecordTableMoveFocus = (recordTableId?: string) => { softFocusPositionState, ); - const currentRowIndex = allRowIds.indexOf(softFocusPosition.recordId); - - if (currentRowIndex === -1) { - return; - } - - let newRowIndex = currentRowIndex + 1; + let newRowIndex = softFocusPosition.row + 1; if (newRowIndex >= allRowIds.length) { newRowIndex = allRowIds.length - 1; @@ -88,7 +61,7 @@ export const useRecordTableMoveFocus = (recordTableId?: string) => { setSoftFocusPosition({ ...softFocusPosition, - recordId: getRecordIdFromRowIndex(allRowIds, newRowIndex), + row: newRowIndex, }); }, [tableAllRowIdsState, setSoftFocusPosition, softFocusPositionState], @@ -114,11 +87,7 @@ export const useRecordTableMoveFocus = (recordTableId?: string) => { ); const currentColumnIndex = softFocusPosition.column; - const currentRowIndex = allRowIds.indexOf(softFocusPosition.recordId); - - if (currentRowIndex === -1) { - return; - } + const currentRowIndex = softFocusPosition.row; const isLastRowAndLastColumn = currentColumnIndex === numberOfTableColumns - 1 && @@ -136,12 +105,12 @@ export const useRecordTableMoveFocus = (recordTableId?: string) => { if (isNotLastColumn) { setSoftFocusPosition({ - recordId: getRecordIdFromRowIndex(allRowIds, currentRowIndex), + row: currentRowIndex, column: currentColumnIndex + 1, }); } else if (isLastColumnButNotLastRow) { setSoftFocusPosition({ - recordId: getRecordIdFromRowIndex(allRowIds, currentRowIndex + 1), + row: currentRowIndex + 1, column: 0, }); } @@ -169,11 +138,7 @@ export const useRecordTableMoveFocus = (recordTableId?: string) => { ); const currentColumnIndex = softFocusPosition.column; - const currentRowIndex = allRowIds.indexOf(softFocusPosition.recordId); - - if (currentRowIndex === -1) { - return; - } + const currentRowIndex = softFocusPosition.row; const isFirstRowAndFirstColumn = currentColumnIndex === 0 && currentRowIndex === 0; @@ -189,12 +154,12 @@ export const useRecordTableMoveFocus = (recordTableId?: string) => { if (isNotFirstColumn) { setSoftFocusPosition({ - recordId: getRecordIdFromRowIndex(allRowIds, currentRowIndex), + row: currentRowIndex, column: currentColumnIndex - 1, }); } else if (isFirstColumnButNotFirstRow) { setSoftFocusPosition({ - recordId: getRecordIdFromRowIndex(allRowIds, currentRowIndex - 1), + row: currentRowIndex - 1, column: numberOfTableColumns - 1, }); } diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBody.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableNoRecordGroupBody.tsx similarity index 86% rename from packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBody.tsx rename to packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableNoRecordGroupBody.tsx index 6ab990d12cf0..f2a765d6d47f 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBody.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableNoRecordGroupBody.tsx @@ -1,4 +1,4 @@ -import { RecordTableRows } from '@/object-record/record-table/components/RecordTableRows'; +import { RecordTableNoRecordGroupRows } from '@/object-record/record-table/components/RecordTableNoRecordGroupRows'; import { RecordTableBodyDragDropContext } from '@/object-record/record-table/record-table-body/components/RecordTableBodyDragDropContext'; import { RecordTableBodyDroppable } from '@/object-record/record-table/record-table-body/components/RecordTableBodyDroppable'; import { RecordTableBodyLoading } from '@/object-record/record-table/record-table-body/components/RecordTableBodyLoading'; @@ -7,7 +7,7 @@ import { isRecordTableInitialLoadingComponentState } from '@/object-record/recor import { tableAllRowIdsComponentState } from '@/object-record/record-table/states/tableAllRowIdsComponentState'; import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; -export const RecordTableBody = () => { +export const RecordTableNoRecordGroupBody = () => { const tableAllRowIds = useRecoilComponentValueV2( tableAllRowIdsComponentState, ); @@ -24,7 +24,7 @@ export const RecordTableBody = () => { - + ); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyEffect.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableNoRecordGroupBodyEffect.tsx similarity index 98% rename from packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyEffect.tsx rename to packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableNoRecordGroupBodyEffect.tsx index 5a6f12ee5302..76a29fccab60 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableNoRecordGroupBodyEffect.tsx @@ -14,7 +14,7 @@ import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-sta import { isNonEmptyString } from '@sniptt/guards'; import { useScrollToPosition } from '~/hooks/useScrollToPosition'; -export const RecordTableBodyEffect = () => { +export const RecordTableNoRecordGroupBodyEffect = () => { const { objectNameSingular } = useContext(RecordTableContext); const [hasInitializedScroll, setHasInitializedScroll] = useState(false); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroupEffect.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffect.tsx similarity index 97% rename from packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroupEffect.tsx rename to packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffect.tsx index da1c7d29b1e6..831f1dc4fdd1 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroupEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffect.tsx @@ -11,7 +11,7 @@ import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-sta import { isNonEmptyString } from '@sniptt/guards'; import { useScrollToPosition } from '~/hooks/useScrollToPosition'; -export const RecordTableBodyRecordGroupEffect = () => { +export const RecordTableRecordGroupBodyEffect = () => { const { objectNameSingular } = useContext(RecordTableContext); const recordGroupId = useCurrentRecordGroupId(); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroupEffects.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffects.tsx similarity index 73% rename from packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroupEffects.tsx rename to packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffects.tsx index d6abe4848d76..c3579d2f20b5 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroupEffects.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffects.tsx @@ -1,9 +1,9 @@ import { RecordGroupContext } from '@/object-record/record-group/states/context/RecordGroupContext'; import { recordGroupDefinitionsComponentState } from '@/object-record/record-group/states/recordGroupDefinitionsComponentState'; -import { RecordTableBodyRecordGroupEffect } from '@/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroupEffect'; +import { RecordTableRecordGroupBodyEffect } from '@/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffect'; import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; -export const RecordTableBodyRecordGroupEffects = () => { +export const RecordTableRecordGroupBodyEffects = () => { const recordGroupDefinitions = useRecoilComponentValueV2( recordGroupDefinitionsComponentState, ); @@ -12,7 +12,7 @@ export const RecordTableBodyRecordGroupEffects = () => { - + )); }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroups.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupsBody.tsx similarity index 91% rename from packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroups.tsx rename to packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupsBody.tsx index cde835f77f01..7f807346b507 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyRecordGroups.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupsBody.tsx @@ -1,6 +1,6 @@ import { useRecordGroups } from '@/object-record/record-group/hooks/useRecordGroups'; import { RecordGroupContext } from '@/object-record/record-group/states/context/RecordGroupContext'; -import { RecordTableRecordGroupRows } from '@/object-record/record-table/components/RecordTableRecordGroupRow'; +import { RecordTableRecordGroupRows } from '@/object-record/record-table/components/RecordTableRecordGroupRows'; import { RecordTableBodyDragDropContext } from '@/object-record/record-table/record-table-body/components/RecordTableBodyDragDropContext'; import { RecordTableBodyDroppable } from '@/object-record/record-table/record-table-body/components/RecordTableBodyDroppable'; import { RecordTableBodyLoading } from '@/object-record/record-table/record-table-body/components/RecordTableBodyLoading'; @@ -9,13 +9,13 @@ import { isRecordTableInitialLoadingComponentState } from '@/object-record/recor import { tableAllRowIdsComponentState } from '@/object-record/record-table/states/tableAllRowIdsComponentState'; import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; -type RecordTableBodyRecordGroupsProps = { +type RecordTableRecordGroupsBodyProps = { objectNameSingular: string; }; -export const RecordTableBodyRecordGroups = ({ +export const RecordTableRecordGroupsBody = ({ objectNameSingular, -}: RecordTableBodyRecordGroupsProps) => { +}: RecordTableRecordGroupsBodyProps) => { const tableAllRowIds = useRecoilComponentValueV2( tableAllRowIdsComponentState, ); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellWrapper.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellWrapper.tsx index 7b923653ab61..f131b1409aae 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellWrapper.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellWrapper.tsx @@ -19,14 +19,14 @@ export const RecordTableCellWrapper = ({ columnIndex: number; children: React.ReactNode; }) => { - const { recordId } = useContext(RecordTableRowContext); + const { rowIndex } = useContext(RecordTableRowContext); const currentTableCellPosition: TableCellPosition = useMemo( () => ({ column: columnIndex, - recordId, + row: rowIndex, }), - [columnIndex, recordId], + [columnIndex, rowIndex], ); const isInEditMode = useRecoilComponentFamilyValueV2( diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/__mocks__/cell.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/__mocks__/cell.ts index 239a6a83d836..9bbaeaec89d1 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/__mocks__/cell.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/__mocks__/cell.ts @@ -30,7 +30,7 @@ export const recordTableCell: RecordTableCellContextProps = { }, }, cellPosition: { - recordId: 'recordId', + row: 2, column: 3, }, hasSoftFocus: false, diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/__tests__/useSelectedTableCellEditMode.test.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/__tests__/useSelectedTableCellEditMode.test.tsx index ae29ff47075b..c0eb841e8a2d 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/__tests__/useSelectedTableCellEditMode.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/__tests__/useSelectedTableCellEditMode.test.tsx @@ -11,7 +11,7 @@ const mockCallbackInterface = { set: jest.fn(), snapshot: { getLoadable: () => ({ - getValue: () => ({ recordId: 'initialRecordId', column: 0 }), + getValue: () => ({ row: 0, column: 0 }), }), }, } as unknown as CallbackInterface; @@ -28,7 +28,7 @@ jest.mock('recoil', () => ({ describe('useSelectedTableCellEditMode', () => { it('should have property setSelectedTableCellEditMode', async () => { const tableCellPosition: TableCellPosition = { - recordId: 'newRecordId', + row: 1, column: 5, }; @@ -41,21 +41,21 @@ describe('useSelectedTableCellEditMode', () => { act(() => { result.current.setSelectedTableCellEditMode( - tableCellPosition.recordId, + tableCellPosition.row, tableCellPosition.column, ); }); expect(mockCallbackInterface.set).toHaveBeenCalledWith( { - key: 'isTableCellInEditModeComponentFamilyState__{"familyKey":{"column":0,"recordId":"initialRecordId"},"instanceId":"yourScopeId"}', + key: 'isTableCellInEditModeComponentFamilyState__{"familyKey":{"column":0,"row":0},"instanceId":"yourScopeId"}', }, false, ); expect(mockCallbackInterface.set).toHaveBeenCalledWith( { - key: 'isTableCellInEditModeComponentFamilyState__{"familyKey":{"column":5,"recordId":"newRecordId"},"instanceId":"yourScopeId"}', + key: 'isTableCellInEditModeComponentFamilyState__{"familyKey":{"column":5,"row":1},"instanceId":"yourScopeId"}', }, true, ); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useSelectedTableCellEditMode.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useSelectedTableCellEditMode.ts index eb4738b12698..d768c06170da 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useSelectedTableCellEditMode.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useSelectedTableCellEditMode.ts @@ -11,8 +11,8 @@ export const useSelectedTableCellEditMode = ({ useMoveEditModeToTableCellPosition(scopeId); const setSelectedTableCellEditMode = useCallback( - (recordId: string, column: number) => { - moveEditModeToTableCellPosition({ column, recordId }); + (row: number, column: number) => { + moveEditModeToTableCellPosition({ column, row }); }, [moveEditModeToTableCellPosition], ); diff --git a/packages/twenty-front/src/modules/object-record/record-table/states/currentTableCellInEditModePositionComponentState.ts b/packages/twenty-front/src/modules/object-record/record-table/states/currentTableCellInEditModePositionComponentState.ts index dea7c401d1c1..77adc75b2310 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/states/currentTableCellInEditModePositionComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/states/currentTableCellInEditModePositionComponentState.ts @@ -6,7 +6,7 @@ export const currentTableCellInEditModePositionComponentState = createComponentStateV2({ key: 'currentTableCellInEditModePositionComponentState', defaultValue: { - recordId: '', + row: 0, column: 1, }, componentInstanceContext: RecordTableComponentInstanceContext, diff --git a/packages/twenty-front/src/modules/object-record/record-table/states/softFocusPositionComponentState.ts b/packages/twenty-front/src/modules/object-record/record-table/states/softFocusPositionComponentState.ts index 346b722ff69e..c59f2cd1f448 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/states/softFocusPositionComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/states/softFocusPositionComponentState.ts @@ -6,7 +6,7 @@ export const softFocusPositionComponentState = createComponentStateV2({ key: 'softFocusPositionComponentState', defaultValue: { - recordId: '', + row: 0, column: 1, }, componentInstanceContext: RecordTableComponentInstanceContext, diff --git a/packages/twenty-front/src/modules/object-record/record-table/states/tableRecordGroupIdsComponentState.ts b/packages/twenty-front/src/modules/object-record/record-table/states/tableRecordGroupIdsComponentState.ts index 3d9c67f69482..fd6f666a9483 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/states/tableRecordGroupIdsComponentState.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/states/tableRecordGroupIdsComponentState.ts @@ -1,9 +1,9 @@ -import { RecordGroupDefinitionId } from '@/object-record/record-group/types/RecordGroupDefinition'; +import { RecordGroupDefinition } from '@/object-record/record-group/types/RecordGroupDefinition'; import { RecordTableComponentInstanceContext } from '@/object-record/record-table/states/context/RecordTableComponentInstanceContext'; import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2'; export const tableRecordGroupIdsComponentState = createComponentStateV2< - RecordGroupDefinitionId[] + RecordGroupDefinition['id'][] >({ key: 'tableRecordGroupIdsComponentState', defaultValue: [], diff --git a/packages/twenty-front/src/modules/object-record/record-table/states/tableRowIdsByGroupComponentFamilyState.ts b/packages/twenty-front/src/modules/object-record/record-table/states/tableRowIdsByGroupComponentFamilyState.ts index 49c4e1d6ed3c..395f7f185bb7 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/states/tableRowIdsByGroupComponentFamilyState.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/states/tableRowIdsByGroupComponentFamilyState.ts @@ -1,9 +1,9 @@ -import { RecordGroupDefinitionId } from '@/object-record/record-group/types/RecordGroupDefinition'; +import { RecordGroupDefinition } from '@/object-record/record-group/types/RecordGroupDefinition'; import { RecordTableComponentInstanceContext } from '@/object-record/record-table/states/context/RecordTableComponentInstanceContext'; import { createComponentFamilyStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentFamilyStateV2'; export const tableRowIdsByGroupComponentFamilyState = - createComponentFamilyStateV2({ + createComponentFamilyStateV2({ key: 'tableRowIdsByGroupComponentFamilyState', defaultValue: [], componentInstanceContext: RecordTableComponentInstanceContext, diff --git a/packages/twenty-front/src/modules/object-record/record-table/types/TableCellPosition.ts b/packages/twenty-front/src/modules/object-record/record-table/types/TableCellPosition.ts index 51e24ea37f6f..a79088447f10 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/types/TableCellPosition.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/types/TableCellPosition.ts @@ -1,4 +1,4 @@ export type TableCellPosition = { - recordId: string; + row: number; column: number; };