Fixed resizability of last column

src/frontend/src/components/tableComponent/index.tsx

@@ -5,7 +5,6 @@ import { ComponentPropsWithoutRef, ElementRef, forwardRef } from "react";
 import { useDarkStore } from "../../stores/darkStore";
 import "../../style/ag-theme-shadcn.css"; // Custom CSS applied to the grid
 import { cn } from "../../utils/utils";
-import { Card, CardContent } from "../ui/card";
 
 const TableComponent = forwardRef<
   ElementRef<typeof AgGridReact>,
@@ -14,23 +13,13 @@ const TableComponent = forwardRef<
   const dark = useDarkStore((state) => state.dark);
 
   return (
-    <div className="flex h-full flex-col">
     <div
       className={cn(
         dark ? "ag-theme-quartz-dark" : "ag-theme-quartz",
-          "ag-theme-shadcn flex h-full flex-col",
+        "ag-theme-shadcn flex h-full min-h-2 flex-col",
       )} // applying the grid theme
     >
-        <Card x-chunk="dashboard-04-chunk-2" className="pt-4">
+      <AgGridReact ref={ref} {...props} />
-          <CardContent>
-            <AgGridReact
-              overlayNoRowsTemplate="No data available"
-              ref={ref}
-              {...props}
-            />
-          </CardContent>
-        </Card>
-      </div>
     </div>
   );
 });

src/frontend/src/pages/SettingsPage/pages/GlobalVariablesPage/index.tsx

@@ -8,6 +8,7 @@ import Dropdown from "../../../../components/dropdownComponent";
 import ForwardedIconComponent from "../../../../components/genericIconComponent";
 import TableComponent from "../../../../components/tableComponent";
 import { Badge } from "../../../../components/ui/badge";
+import { Card, CardContent } from "../../../../components/ui/card";
 import { deleteGlobalVariable } from "../../../../controllers/API";
 import useAlertStore from "../../../../stores/alertStore";
 import { useGlobalVariablesStore } from "../../../../stores/globalVariables";
@@ -104,6 +105,7 @@ export default function GlobalVariablesPage() {
       field: "default_fields",
       flex: 1,
       editable: false,
+      resizable: false,
     },
   ]);
 
@@ -168,17 +170,24 @@ export default function GlobalVariablesPage() {
       </div>
 
       <div className="flex h-full w-full flex-col justify-between pb-8">
+        <Card x-chunk="dashboard-04-chunk-2" className="h-full pt-4">
+          <CardContent className="h-full">
             <TableComponent
+              overlayNoRowsTemplate="No data available"
               onSelectionChanged={(event: SelectionChangedEvent) => {
-            setSelectedRows(event.api.getSelectedRows().map((row) => row.name));
+                setSelectedRows(
+                  event.api.getSelectedRows().map((row) => row.name),
+                );
               }}
               rowSelection="multiple"
               suppressRowClickSelection={true}
               domLayout="autoHeight"
-          pagination={false}
+              pagination={true}
               columnDefs={colDefs}
               rowData={rowData}
             />
+          </CardContent>
+        </Card>
       </div>
     </div>
   );