fix(TableVirtualizedBody): take height of header into consideration (#…

…1891)
mondaycom · Jan 14, 2024 · fec3c16 · fec3c16
1 parent 00bc711
commit fec3c16
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss b/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss
@@ -0,0 +1,4 @@
+.tableBody {
+  // Take into consideration header's height since VirtualizedBody sets a static height
+  height: calc(100% - var(--table-row-size));
+}
diff --git a/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.tsx b/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.tsx
@@ -2,6 +2,7 @@ import React, { ComponentProps, CSSProperties, FC, useCallback } from "react";
 import { VibeComponentProps } from "../../../types";
 import VirtualizedList, { VirtualizedListItem } from "../../VirtualizedList/VirtualizedList";
 import TableBody from "../TableBody/TableBody";
+import styles from "./TableVirtualizedBody.module.scss";
 
 export interface ITableVirtualizedBodyProps extends VibeComponentProps {
   items: ComponentProps<typeof VirtualizedList>["items"];
@@ -18,7 +19,7 @@ const TableVirtualizedBody: FC<ITableVirtualizedBodyProps> = ({ items, rowRender
   );
 
   return (
-    <TableBody>
+    <TableBody className={styles.tableBody}>
       <VirtualizedList items={items} itemRenderer={itemRenderer} getItemHeight={() => 40} layout="vertical" />
     </TableBody>
   );