fix(base): re-render grid header and rows when column visibility changes

apps/client/src/features/base/components/grid/grid-container.tsx

@@ -242,6 +242,7 @@ export function GridContainer({
               table={table}
               baseId={baseId}
               columnOrder={table.getState().columnOrder}
+              columnVisibility={table.getState().columnVisibility}
               properties={properties}
               loadedRowIds={rowIds}
               onPropertyCreated={handlePropertyCreated}
@@ -262,6 +263,7 @@ export function GridContainer({
                 rowIndex={virtualRow.index}
                 onCellUpdate={onCellUpdate}
                 orderedRowIds={rowIds}
+                columnVisibility={table.getState().columnVisibility}
                 dragHandlers={
                   onRowReorder
                     ? {

apps/client/src/features/base/components/grid/grid-header.tsx

@@ -1,5 +1,5 @@
 import { memo, useMemo } from "react";
-import { Table, ColumnOrderState } from "@tanstack/react-table";
+import { Table, ColumnOrderState, VisibilityState } from "@tanstack/react-table";
 import { IBaseRow, IBaseProperty } from "@/features/base/types/base.types";
 import { GridHeaderCell } from "./grid-header-cell";
 import { CreatePropertyPopover } from "@/features/base/components/property/create-property-popover";
@@ -11,6 +11,7 @@ type GridHeaderProps = {
   // Passed explicitly to break memo when columns change
   // (table ref is stable from useReactTable, so memo won't fire without these)
   columnOrder: ColumnOrderState;
+  columnVisibility: VisibilityState;
   properties: IBaseProperty[];
   loadedRowIds: string[];
   onPropertyCreated?: () => void;
@@ -21,6 +22,8 @@ export const GridHeader = memo(function GridHeader({
   baseId,
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   columnOrder: _columnOrder,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  columnVisibility: _columnVisibility,
   properties,
   loadedRowIds,
   onPropertyCreated,

apps/client/src/features/base/components/grid/grid-row.tsx

@@ -1,5 +1,5 @@
 import { memo, useCallback } from "react";
-import { Row } from "@tanstack/react-table";
+import { Row, VisibilityState } from "@tanstack/react-table";
 import { IBaseRow } from "@/features/base/types/base.types";
 import { useRowSelection } from "@/features/base/hooks/use-row-selection";
 import { GridCell } from "./grid-cell";
@@ -21,6 +21,7 @@ type GridRowProps = {
   onCellUpdate: (rowId: string, propertyId: string, value: unknown) => void;
   dragHandlers?: RowDragHandlers;
   orderedRowIds: string[];
+  columnVisibility: VisibilityState;
 };
 
 export const GridRow = memo(function GridRow({
@@ -29,6 +30,8 @@ export const GridRow = memo(function GridRow({
   onCellUpdate,
   dragHandlers,
   orderedRowIds,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  columnVisibility: _columnVisibility,
 }: GridRowProps) {
   const isSelected = useRowSelection().isSelected(row.id);
   const handleDragStart = useCallback(