Listing entities

gui/rpk-gui/src/pages/firm/base-page/List.tsx

@@ -1,21 +1,28 @@
 import { UiSchema } from "@rjsf/utils";
-import { List as RefineList } from "@refinedev/mui";
-import { DataGrid } from "@mui/x-data-grid";
+import { List as RefineList, useDataGrid } from "@refinedev/mui";
+import { DataGrid, GridColDef, GridValidRowModel } from "@mui/x-data-grid";
+import React from "react";
 
-type ListProps = {
+type ListProps<T extends GridValidRowModel> = {
   resource: string,
+  columns: GridColDef<T>[],
   schemaName?: string,
   uiSchema?: UiSchema,
 }
 
-const List = (props: ListProps) => {
-  const { schemaName, resource, uiSchema } = props;
+const List = <T extends GridValidRowModel>(props: ListProps<T>) => {
+  const { schemaName, resource, uiSchema, columns } = props;
+  const { dataGridProps } = useDataGrid<T>({resource: resource});
 
+  const cols = React.useMemo<GridColDef<T>[]>(
+    () => columns,
+    [],
+  );
   return (
     <RefineList
-      resource={resource}
+      canCreate={true}
       >
-      <DataGrid columns={} />
+      <DataGrid {...dataGridProps} columns={cols} />
     </RefineList>
   )
 }