tweak pagination and virtualization thresholds to have a smoother scroll (#4991)

web/core/components/gantt-chart/sidebar/issues/sidebar.tsx

@@ -54,7 +54,7 @@ export const IssueGanttSidebar: React.FC<Props> = observer((props) => {
     ganttContainerRef,
     isPaginating ? null : intersectionElement,
     loadMoreBlocks,
-    "50% 0% 50% 0%"
+    "100% 0% 100% 0%"
   );
 
   const handleOnDrop = (

web/core/components/issues/issue-layouts/kanban/block.tsx

@@ -224,7 +224,8 @@ export const KanbanIssueBlock: React.FC<IssueBlockProps> = observer((props) => {
             classNames="space-y-2 px-3 py-2"
             root={scrollableContainerRef}
             defaultHeight="100px"
-            horizontalOffset={50}
+            horizontalOffset={100}
+            verticalOffset={200}
           >
             <KanbanIssueDetailsBlock
               cardRef={cardRef}

web/core/components/issues/issue-layouts/list/block-root.tsx

@@ -125,6 +125,7 @@ export const IssueBlockRoot: FC<Props> = observer((props) => {
         defaultHeight="3rem"
         root={containerRef}
         classNames={`relative ${isLastChild && !isExpanded ? "" : "border-b border-b-custom-border-200"}`}
+        verticalOffset={100}
       >
         <IssueBlock
           issueId={issueId}

web/core/components/issues/issue-layouts/list/list-group.tsx

@@ -102,7 +102,7 @@ export const ListGroup = observer((props: Props) => {
   const nextPageResults = getPaginationData(group.id, undefined)?.nextPageResults;
   const isPaginating = !!getIssueLoader(group.id);
 
-  useIntersectionObserver(containerRef, isPaginating ? null : intersectionElement, loadMoreIssues, `50% 0% 50% 0%`);
+  useIntersectionObserver(containerRef, isPaginating ? null : intersectionElement, loadMoreIssues, `100% 0% 100% 0%`);
 
   const shouldLoadMore =
     nextPageResults === undefined && groupIssueCount !== undefined && groupIssueIds

web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx

@@ -84,6 +84,7 @@ export const SpreadsheetIssueRow = observer((props: Props) => {
           "group selected-issue-row": isIssueSelected,
           "border-[0.5px] border-custom-border-400": isIssueActive,
         })}
+        verticalOffset={100}
       >
         <IssueRowDetails
           issueId={issueId}

web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-table.tsx

@@ -92,7 +92,7 @@ export const SpreadsheetTable = observer((props: Props) => {
 
   const isPaginating = !!getIssueLoader();
 
-  useIntersectionObserver(containerRef, isPaginating ? null : intersectionElement, loadMoreIssues, `50% 0% 50% 0%`);
+  useIntersectionObserver(containerRef, isPaginating ? null : intersectionElement, loadMoreIssues, `100% 0% 100% 0%`);
 
   const handleKeyBoardNavigation = useTableKeyboardNavigation();