diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableBodyFetchMoreLoader.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableBodyFetchMoreLoader.tsx index 196f5aae3..33173a925 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableBodyFetchMoreLoader.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableBodyFetchMoreLoader.tsx @@ -1,3 +1,4 @@ +import { useContext } from 'react'; import { useInView } from 'react-intersection-observer'; import styled from '@emotion/styled'; import { useRecoilCallback, useRecoilValue } from 'recoil'; @@ -6,6 +7,7 @@ import { useLoadRecordIndexTable } from '@/object-record/record-index/hooks/useL import { useRecordTable } from '@/object-record/record-table/hooks/useRecordTable'; import { isFetchingMoreRecordsFamilyState } from '@/object-record/states/isFetchingMoreRecordsFamilyState'; import { GRAY_SCALE } from '@/ui/theme/constants/GrayScale'; +import { ScrollWrapperContext } from '@/ui/utilities/scroll/components/ScrollWrapper'; type RecordTableBodyFetchMoreLoaderProps = { objectNameSingular: string; @@ -38,8 +40,14 @@ export const RecordTableBodyFetchMoreLoader = ({ [setRecordTableLastRowVisible], ); + const scrollWrapperRef = useContext(ScrollWrapperContext); + const { ref: tbodyRef } = useInView({ onChange: onLastRowVisible, + rootMargin: '1000px', + root: scrollWrapperRef.current?.querySelector( + '[data-overlayscrollbars-viewport="scrollbarHidden"]', + ), }); return (