fix: slight nanofixes

Author: astandrik

src/components/PaginatedTable/TableChunksRenderer.tsx

@@ -150,7 +150,7 @@ export const TableChunksRenderer = <T, F>({
     );
 
     const renderChunks = React.useCallback(() => {
-        // Chunk states are distrubuted like [fetch, fetch, render/fetch, render/fetch, fetch, fetch]
+        // Chunk states are distrubuted like [null, null, fetch, fetch, render+fetch, render+fetch, fetch, fetch, null, null]
         // i.e. fetched chunks include rendered chunks
         const {firstFetchIndex, lastFetchIndex} = findFetchChunkRange();
         const {firstRenderIndex, lastRenderIndex} = findRenderChunkRange();

src/components/PaginatedTable/useScrollBasedChunks.ts

@@ -1,5 +1,7 @@
 import React from 'react';
 
+import {throttle} from 'lodash';
+
 import {rafThrottle} from './utils';
 
 interface UseScrollBasedChunksProps {
@@ -23,6 +25,7 @@ const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
 // Bad performance in Safari - reduce overscan counts
 const DEFAULT_RENDER_OVERSCAN = isSafari ? 1 : 2;
 const DEFAULT_FETCH_OVERSCAN = 4;
+const THROTTLE_DELAY = 200;
 
 export const useScrollBasedChunks = ({
     scrollContainerRef,
@@ -95,7 +98,10 @@ export const useScrollBasedChunks = ({
             return undefined;
         }
 
-        const throttledHandleScroll = rafThrottle(handleScroll);
+        const throttledHandleScroll = throttle(handleScroll, THROTTLE_DELAY, {
+            trailing: true,
+            leading: true,
+        });
 
         container.addEventListener('scroll', throttledHandleScroll, {passive: true});
         return () => {