Update ShardZonesTable

Author: kraenhansen

packages/compass-global-writes/src/components/shard-zones-table.tsx

@@ -86,7 +86,6 @@ export function ShardZonesTable({
 }: {
   shardZones: ShardZoneData[];
 }) {
-  const tableContainerRef = useRef<HTMLDivElement>(null);
   const [searchText, setSearchText] = useState<string>('');
   const [expanded, setExpanded] = useState<true | Record<string, boolean>>({});
 
@@ -96,7 +95,6 @@ export function ShardZonesTable({
   );
 
   const table = useLeafyGreenTable({
-    containerRef: tableContainerRef,
     data,
     columns,
     state: {
@@ -139,12 +137,7 @@ export function ShardZonesTable({
         aria-label="Search for a location"
         placeholder="Search for a location"
       />
-      <Table
-        className={containerStyles}
-        title="Zone Mapping"
-        table={table}
-        ref={tableContainerRef}
-      >
+      <Table className={containerStyles} title="Zone Mapping" table={table}>
         <TableHead isSticky>
           {table
             .getHeaderGroups()
@@ -168,25 +161,11 @@ export function ShardZonesTable({
             <Row key={row.id} row={row}>
               {row.getVisibleCells().map((cell) => {
                 return (
-                  <Cell key={cell.id}>
+                  <Cell key={cell.id} cell={cell}>
                     {flexRender(cell.column.columnDef.cell, cell.getContext())}
                   </Cell>
                 );
               })}
-              {row.subRows.map((subRow) => (
-                <Row key={subRow.id} row={subRow}>
-                  {subRow.getVisibleCells().map((cell) => {
-                    return (
-                      <Cell key={cell.id}>
-                        {flexRender(
-                          cell.column.columnDef.cell,
-                          cell.getContext()
-                        )}
-                      </Cell>
-                    );
-                  })}
-                </Row>
-              ))}
             </Row>
           ))}
         </TableBody>