[refactor] Clean up Table component states (#2952)

aimhubio · Aug 14, 2023 · f64c2a1 · f64c2a1
1 parent 4e9635c
commit f64c2a1
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 31 deletions.
diff --git a/src/aimcore/web/ui/public/aim_ui_core.py b/src/aimcore/web/ui/public/aim_ui_core.py
@@ -460,18 +460,10 @@ def __init__(
 
         self.render()
 
-    @property
-    def active_line(self):
-        return self.state["active_line"] if "active_line" in self.state else None
-
     @property
     def focused_line(self):
         return self.state["focused_line"] if "focused_line" in self.state else None
 
-    @property
-    def active_point(self):
-        return self.state["active_point"] if "active_point" in self.state else None
-
     @property
     def focused_point(self):
         return self.state["focused_point"] if "focused_point" in self.state else None
@@ -487,13 +479,6 @@ async def on_active_point_change(self, point, is_active):
                         "focused_point": point,
                     }
                 )
-            else:
-                self.set_state(
-                    {
-                        "active_line": item,
-                        "active_point": point,
-                    }
-                )
 
 
 class NivoLineChart(AimSequenceComponent):
@@ -849,10 +834,35 @@ def focused_row(self):
         return self.state["focused_row"] if "focused_row" in self.state else None
 
     async def on_row_select(self, val):
-        self.set_state({"selected_rows": val.to_py()})
+        selected_indices = val.to_py()
+
+        if selected_indices is None:
+            self.set_state({"selected_rows": None})
+            return
+
+        rows = []
+
+        for i in selected_indices:
+            row = {}
+
+            for col in self.data:
+                row[col] = self.data[col][i]
+
+            rows.append(row)
+
+        self.set_state({"selected_rows": rows})
 
     async def on_row_focus(self, val):
-        self.set_state({"focused_row": val.to_py()})
+        if val is None:
+            self.set_state({"focused_row": None})
+            return
+
+        row = {}
+
+        for col in self.data:
+            row[col] = self.data[col][val]
+
+        self.set_state({"focused_row": row})
 
 
 class Text(Component):

diff --git a/src/aimcore/web/ui/src/components/kit_v2/Table/Table.d.ts b/src/aimcore/web/ui/src/components/kit_v2/Table/Table.d.ts
@@ -6,8 +6,8 @@ export interface TableProps {
   withSelect?: boolean;
   selectedIndices?: number[];
   focusedRowIndex?: number;
-  onRowSelect?: (rowDict: Record<string, any>[]) => void;
-  onRowFocus?: (focusedRow: Record<string, any>) => void;
+  onRowSelect?: (rowIndices: number[]) => void;
+  onRowFocus?: (focusedRowIndex: number | undefined) => void;
 }
 
 export interface TableRowProps

diff --git a/src/aimcore/web/ui/src/components/kit_v2/Table/Table.tsx b/src/aimcore/web/ui/src/components/kit_v2/Table/Table.tsx
@@ -63,31 +63,29 @@ function Table({
     const { index } = e.currentTarget.dataset;
     if (Number(index) === focusedRow) {
       setFocusedRow(undefined);
+
       if (onRowFocus) {
-        onRowFocus({});
+        onRowFocus(undefined);
       }
       return;
     } else {
       setFocusedRow(Number(index));
+
       if (onRowFocus) {
-        onRowFocus({ ...transformedData[Number(index)], rowIndex: index });
+        onRowFocus(Number(index));
       }
     }
   }
 
   function handleRowSelect(checked: CheckedState | undefined, index: number) {
-    let selectedList: number[] = [];
-    if (checked) {
-      selectedList = [...(selectedRows || []), index];
-    } else {
-      selectedList = selectedRows.filter((i) => i !== index);
-    }
+    let selectedList: number[] = checked
+      ? [...(selectedRows || []), index]
+      : selectedRows.filter((i) => i !== index);
+
     setSelectedRows(selectedList);
+
     if (onRowSelect) {
-      const selectedListDict = selectedList.map((i: number) => {
-        return { ...transformedData[i], rowIndex: i };
-      });
-      onRowSelect(selectedListDict);
+      onRowSelect(selectedList);
     }
   }