Finish update table component

Author: b-yogesh

chartlets.js/packages/lib/src/plugins/mui/Table.test.tsx

@@ -6,8 +6,8 @@ import { createChangeHandler } from "@/plugins/mui/common.test";
 
 describe("Table", () => {
   const rows = [
-    { id: 1, data: { firstName: "John", lastName: "Doe" } },
-    { id: 2, data: { firstName: "Johnie", lastName: "Undoe" } },
+    ["John", "Doe"],
+    ["Johnie", "Undoe"],
   ];
   const columns = [
     { id: "firstName", label: "First Name" },
@@ -30,9 +30,8 @@ describe("Table", () => {
     columns.forEach((column) => {
       expect(screen.getByText(column.label)).toBeInTheDocument();
     });
-    rows.forEach((row) => {
-      expect(screen.getByText(row.data.firstName)).toBeInTheDocument();
-      expect(screen.getByText(row.data.lastName)).toBeInTheDocument();
+    rows.forEach((row, index) => {
+      expect(screen.getByText(row[index])).toBeInTheDocument();
     });
   });
 
@@ -69,11 +68,8 @@ describe("Table", () => {
       id: "table",
       property: "value",
       value: {
-        id: 1,
-        data: {
-          firstName: "John",
-          lastName: "Doe",
-        },
+        firstName: "John",
+        lastName: "Doe",
       },
     });
   });

chartlets.js/packages/lib/src/plugins/mui/Table.tsx

@@ -14,7 +14,6 @@ interface TableCellProps {
   id: string | number;
   size?: "medium" | "small";
   align?: "inherit" | "left" | "center" | "right" | "justify";
-  padding?: "checkbox" | "none" | "normal";
   sx?: SxProps;
 }
 
@@ -70,30 +69,6 @@ export const Table = ({
     }
   };
 
-  // function descendingComparator<T>(a: T, b: T, orderBy: keyof T) {
-  //   if (b[orderBy] < a[orderBy]) {
-  //     return -1;
-  //   }
-  //   if (b[orderBy] > a[orderBy]) {
-  //     return 1;
-  //   }
-  //   return 0;
-  // }
-  //
-  // type Order = "asc" | "desc";
-  //
-  // function getComparator<Key extends keyof any>(
-  //   order: Order,
-  //   orderBy: Key,
-  // ): (
-  //   a: { [key in Key]: number | string },
-  //   b: { [key in Key]: number | string },
-  // ) => number {
-  //   return order === "desc"
-  //     ? (a, b) => descendingComparator(a, b, orderBy)
-  //     : (a, b) => -descendingComparator(a, b, orderBy);
-  // }
-
   return (
     <TableContainer component={Paper} sx={style} id={id}>
       <MuiTable stickyHeader={stickyHeader}>
@@ -104,7 +79,6 @@ export const Table = ({
                 key={column.id}
                 align={column.align || "inherit"}
                 size={column.size || "medium"}
-                padding={column.padding}
               >
                 {column.label}
               </TableCell>
@@ -123,7 +97,6 @@ export const Table = ({
                   key={item_index}
                   align={columns[item_index].align || "inherit"}
                   size={columns[item_index].size || "medium"}
-                  padding={columns[item_index].padding}
                 >
                   {item}
                 </TableCell>

chartlets.py/chartlets/components/table.py

@@ -15,17 +15,17 @@ class TableCellProps(TypedDict, total=False):
     align: Literal["inherit", "left", "center", "right", "justify"] | None
     """The alignment of the cell content."""
 
-    # sortDirection:
-
 
 class TableColumn(TableCellProps):
     """Defines a column in the table."""
 
     label: str
     """The display label for the column header."""
 
+
 type TableRow = list[list[str | int | float | bool | None]]
 
+
 @dataclass(frozen=True)
 class Table(Component):
     """A basic Table with configurable rows and columns."""