diff --git a/packages/twenty-front/src/modules/object-record/hooks/useObjectRecordTable.ts b/packages/twenty-front/src/modules/object-record/hooks/useObjectRecordTable.ts index a541b0ae6f5fe..3ad481b37710e 100644 --- a/packages/twenty-front/src/modules/object-record/hooks/useObjectRecordTable.ts +++ b/packages/twenty-front/src/modules/object-record/hooks/useObjectRecordTable.ts @@ -10,6 +10,7 @@ import { turnFiltersIntoObjectRecordFilters } from '@/object-record/utils/turnFi import { signInBackgroundMockCompanies } from '@/sign-in-background-mock/constants/signInBackgroundMockCompanies'; import { useFindManyRecords } from './useFindManyRecords'; +import { isRecordTableInitialLoadingState } from '@/object-record/record-table/states/isRecordTableInitialLoadingState'; export const useObjectRecordTable = () => { const { scopeId: objectNamePlural, setRecordTableData } = useRecordTable(); @@ -41,6 +42,8 @@ export const useObjectRecordTable = () => { foundObjectMetadataItem?.fields ?? [], ); + const setIsRecordTableInitialLoading = useSetRecoilState(isRecordTableInitialLoadingState); + const { records, loading, fetchMoreRecords, queryStateIdentifier } = useFindManyRecords({ objectNameSingular, @@ -48,6 +51,7 @@ export const useObjectRecordTable = () => { orderBy, onCompleted: () => { setLastRowVisible(false); + setIsRecordTableInitialLoading(false); }, }); 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 90e3343bd39ab..ed41b64cb5fb8 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 @@ -20,6 +20,7 @@ import { RecordTableBody } from './RecordTableBody'; import { RecordTableBodyEffect } from './RecordTableBodyEffect'; import { RecordTableHeader } from './RecordTableHeader'; import { RecordTableInternalEffect } from './RecordTableInternalEffect'; +import { isRecordTableInitialLoadingState } from '@/object-record/record-table/states/isRecordTableInitialLoadingState'; const StyledObjectEmptyContainer = styled.div` align-items: center; @@ -126,6 +127,8 @@ export const RecordTable = ({ const numberOfTableRows = useRecoilValue(numberOfTableRowsState); + const isInitialLoading = useRecoilValue(isRecordTableInitialLoadingState); + const { scopeId: objectNamePlural, resetTableRowSelection, @@ -170,6 +173,22 @@ export const RecordTable = ({ /> + {!isInitialLoading && numberOfTableRows === 0 && ( + + + No {foundObjectMetadataItem?.namePlural} + + + Create one: + +