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

Improve RecordTableCellperformances (#3659)

Browse Source 
* Improve RecordTableCellperformances

* Fixes
This commit is contained in:
Charles Bochet
2024-01-28 20:32:28 +01:00
committed by GitHub
parent ada8f55574
commit 419f8adde6
46 changed files with 667 additions and 637 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/twenty-front/src/modules/object-record/hooks/__tests__/useObjectRecordTable.test.tsx
View File

@ -4,13 +4,13 @@ import { expect } from '@storybook/test';
import { renderHook } from '@testing-library/react';
import { RecoilRoot } from 'recoil';
import { useObjectRecordTable } from '@/object-record/hooks/useObjectRecordTable';
import { useLoadRecordIndexTable } from '@/object-record/record-index/hooks/useLoadRecordIndexTable';
import { RecordTableScope } from '@/object-record/record-table/scopes/RecordTableScope';
import { SnackBarProviderScope } from '@/ui/feedback/snack-bar-manager/scopes/SnackBarProviderScope';
import { getScopeIdFromComponentId } from '@/ui/utilities/recoil-scope/utils/getScopeIdFromComponentId';
const recordTableId = 'people';
const objectNamePlural = 'people';
const objectNameSingular = 'person';
const onColumnsChange = jest.fn();
const ObjectNamePluralSetter = ({ children }: { children: ReactNode }) => {
@ -37,7 +37,7 @@ const Wrapper = ({ children }: { children: ReactNode }) => {
describe('useObjectRecordTable', () => {
it('should skip fetch if currentWorkspace is undefined', async () => {
const { result } = renderHook(
() => useObjectRecordTable(objectNamePlural),
() => useLoadRecordIndexTable(objectNameSingular),
{
wrapper: Wrapper,
},

67
packages/twenty-front/src/modules/object-record/hooks/useObjectRecordTable.ts
View File

@ -1,67 +0,0 @@
import { useRecoilValue, useSetRecoilState } from 'recoil';
import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
import { turnSortsIntoOrderBy } from '@/object-record/object-sort-dropdown/utils/turnSortsIntoOrderBy';
import { turnObjectDropdownFilterIntoQueryFilter } from '@/object-record/record-filter/utils/turnObjectDropdownFilterIntoQueryFilter';
import { useRecordTableStates } from '@/object-record/record-table/hooks/internal/useRecordTableStates';
import { useRecordTable } from '@/object-record/record-table/hooks/useRecordTable';
import { signInBackgroundMockCompanies } from '@/sign-in-background-mock/constants/signInBackgroundMockCompanies';
import { useFindManyRecords } from './useFindManyRecords';
export const useObjectRecordTable = (objectNamePlural: string) => {
const { setRecordTableData, setIsRecordTableInitialLoading } =
useRecordTable();
const currentWorkspace = useRecoilValue(currentWorkspaceState);
const { objectNameSingular } = useObjectNameSingularFromPlural({
objectNamePlural,
});
const { objectMetadataItem: foundObjectMetadataItem } = useObjectMetadataItem(
{
objectNameSingular,
},
);
const {
getTableFiltersState,
getTableSortsState,
getTableLastRowVisibleState,
} = useRecordTableStates();
const tableFilters = useRecoilValue(getTableFiltersState());
const tableSorts = useRecoilValue(getTableSortsState());
const setLastRowVisible = useSetRecoilState(getTableLastRowVisibleState());
const requestFilters = turnObjectDropdownFilterIntoQueryFilter(
tableFilters,
foundObjectMetadataItem?.fields ?? [],
);
const orderBy = turnSortsIntoOrderBy(
tableSorts,
foundObjectMetadataItem?.fields ?? [],
);
const { records, loading, fetchMoreRecords, queryStateIdentifier } =
useFindManyRecords({
objectNameSingular,
filter: requestFilters,
orderBy,
onCompleted: () => {
setLastRowVisible(false);
setIsRecordTableInitialLoading(false);
},
});
return {
records: currentWorkspace ? records : signInBackgroundMockCompanies,
loading,
fetchMoreRecords,
queryStateIdentifier,
setRecordTableData,
};
};