fix infinite re renders / unnecessary logic

Author: iamfaran

client/packages/lowcoder/src/comps/comps/tableLiteComp/parts/ResizeableTable.tsx

@@ -75,11 +75,7 @@ function ResizeableTableComp<RecordType extends object>(
 
   const [resizeData, setResizeData] = useState({ index: -1, width: -1 });
   const tableRef = useRef<HTMLDivElement>(null);
-  const [measuredHeights, setMeasuredHeights] = useState<{
-    header: number;
-    summary: number;
-    bodyContent: number;
-  }>({ header: 0, summary: 0, bodyContent: 0 });
+
 
   const handleResize = useCallback((width: number, index: number) => {
     setResizeData({ index, width });
@@ -178,30 +174,7 @@ function ResizeableTableComp<RecordType extends object>(
     });
   }, [columns, resizeData, createCellHandler, createHeaderCellHandler]);
 
-  // Measure header, summary & body content heights so we can derive the body viewport height for vertical scrolling
-  useEffect(() => {
-    if (!isFixedHeight || !tableRef.current) return;
-    const tableEl = tableRef.current;
-
-    const measure = () => {
-      const headerH =
-        (tableEl.querySelector(".ant-table-header") as HTMLElement)
-          ?.clientHeight ?? 0;
-      const summaryH =
-        (tableEl.querySelector(".ant-table-summary") as HTMLElement)
-          ?.clientHeight ?? 0;
-      const bodyContentH =
-        (tableEl.querySelector(".ant-table-tbody") as HTMLElement)
-          ?.scrollHeight ?? 0;
-      setMeasuredHeights({ header: headerH, summary: summaryH, bodyContent: bodyContentH });
-    };
-
-    measure();
-    const resizeObserver = new ResizeObserver(measure);
-    resizeObserver.observe(tableEl);
-
-    return () => resizeObserver.disconnect();
-  }, [isFixedHeight, dataSource?.length, columns.length]);
+ 
 
   // Sum widths (including resized values) to keep horizontal scroll baseline accurate
   function getTotalTableWidth(
@@ -222,47 +195,17 @@ function ResizeableTableComp<RecordType extends object>(
 
   const scrollAndVirtualizationSettings = useMemo(() => {
     const totalWidth = getTotalTableWidth(memoizedColumns as any, resizeData);
-    const scrollSettings: { x?: number; y?: number } = { x: totalWidth };
-
-    // For fixed height mode, set vertical scroll height (body viewport height)
-    if (isFixedHeight && containerHeight && containerHeight > 0) {
-      const availableHeight = Math.max(
-        containerHeight - measuredHeights.header - measuredHeights.summary,
-        200
-      );
-
-      // Enable virtualization for fixed height mode with 50+ rows
-      const shouldUseVirtualization = Boolean(
-        isFixedHeight &&
-          containerHeight &&
-          dataSource?.length &&
-          dataSource.length >= 50
-      );
-
-      // Only set scroll.y if virtualization is on OR content actually overflows
-      const contentOverflows = measuredHeights.bodyContent > availableHeight;
-      if (shouldUseVirtualization || contentOverflows) {
-        scrollSettings.y = availableHeight;
-      }
-
-      return {
-        virtual: shouldUseVirtualization,
-        scroll: scrollSettings,
-      };
-    }
-
+    const shouldVirtualize = isFixedHeight && (dataSource?.length ?? 0) >= 50;
+    
     return {
-      virtual: false,
-      scroll: scrollSettings,
+      virtual: shouldVirtualize,
+      scroll: {
+        x: totalWidth,
+        // FIX: Set y for ANY fixed height mode, not just virtualization
+        y: isFixedHeight && containerHeight ? containerHeight : undefined
+      }
     };
-  }, [
-    isFixedHeight,
-    containerHeight,
-    dataSource?.length,
-    measuredHeights,
-    memoizedColumns,
-    resizeData,
-  ]);
+  }, [isFixedHeight, containerHeight, dataSource?.length, memoizedColumns, resizeData]);
 
   return (
     <StyledTableWrapper ref={tableRef}>

client/packages/lowcoder/src/comps/comps/tableLiteComp/tableCompView.tsx

@@ -21,7 +21,6 @@ export const TableCompView = React.memo((props: {
 
 	const compName = useContext(CompNameContext);
 	const [loading, setLoading] = useState(false);
-	const tableContainerRef = useRef<HTMLDivElement>(null);
 	const tableViewportRef = useRef<HTMLDivElement>(null);
 
 	const [containerHeight, setContainerHeight] = useState<number>(0);
@@ -53,22 +52,6 @@ export const TableCompView = React.memo((props: {
 	const isFixedHeight = !compChildren.autoHeight.getView(); // autoHeight: "fixed" when false
 	const rowAutoHeight = compChildren.rowAutoHeight.getView();
 
-	const enableVirtualization = useMemo(() => {
-		const shouldVirtualize = isFixedHeight && data.length >= 50;
-		
-		// Debug logging
-		if (process.env.NODE_ENV === 'development') {
-			console.log('Table Virtualization Status:', {
-				shouldVirtualize,
-				isFixedHeight,
-				dataLength: data.length,
-				threshold: 50,
-			});
-		}
-		
-		return shouldVirtualize;
-	}, [isFixedHeight, data.length]);
-
 	// Measure container height for virtualization
 	useEffect(() => {
 		if (!isFixedHeight || !tableViewportRef.current) return;
@@ -194,7 +177,7 @@ export const TableCompView = React.memo((props: {
 		compChildren.loading.getView();
 
 	return (
-		<div ref={tableContainerRef} style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
+		<div style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
 			{toolbar.position === "above" && !hideToolbar && toolbarView}
 			<div ref={tableViewportRef} style={{ flex: 1, minHeight: 0 }}>
 				<ResizeableTable<any>