Cursor on table (non edit mode) (#974)

* Cursor on table (non edit mode) (#971) * fx tests * fx tests --------- Co-authored-by: Fred Lefévère-Laoide <[email protected]>
Avaiga · Oct 13, 2023 · 41cab80 · 41cab80
1 parent 442001a
commit 41cab80
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 8 deletions.
diff --git a/gui/src/components/Taipy/AutoLoadingTable.spec.tsx b/gui/src/components/Taipy/AutoLoadingTable.spec.tsx
@@ -213,7 +213,7 @@ describe("AutoLoadingTable Component", () => {
         );
         const elts = getAllByText("Austria");
         expect(elts.length).toBeGreaterThan(1);
-        expect(elts[0].tagName).toBe("DIV");
+        expect(elts[0].tagName).toBe("SPAN");
     });
     it("selects the rows", async () => {
         const dispatch = jest.fn();
@@ -238,8 +238,8 @@ describe("AutoLoadingTable Component", () => {
         const elts = getAllByText("Austria");
         elts.forEach((elt: HTMLElement, idx: number) =>
             selected.indexOf(idx) == -1
-                ? expect(elt.parentElement?.parentElement).not.toHaveClass("Mui-selected")
-                : expect(elt.parentElement?.parentElement).toHaveClass("Mui-selected")
+                ? expect(elt.parentElement?.parentElement?.parentElement).not.toHaveClass("Mui-selected")
+                : expect(elt.parentElement?.parentElement?.parentElement).toHaveClass("Mui-selected")
         );
         expect(document.querySelectorAll(".Mui-selected")).toHaveLength(selected.length);
     });

diff --git a/gui/src/components/Taipy/PaginatedTable.spec.tsx b/gui/src/components/Taipy/PaginatedTable.spec.tsx
@@ -280,7 +280,7 @@ describe("PaginatedTable Component", () => {
         );
         const elts = getAllByText("Austria");
         expect(elts.length).toBeGreaterThan(1);
-        expect(elts[0].tagName).toBe("DIV");
+        expect(elts[0].tagName).toBe("SPAN");
     });
     it("selects the rows", async () => {
         const dispatch = jest.fn();
@@ -299,8 +299,8 @@ describe("PaginatedTable Component", () => {
         const elts = await waitFor(() => findAllByText("Austria"));
         elts.forEach((elt: HTMLElement, idx: number) =>
             selected.indexOf(idx) == -1
-                ? expect(elt.parentElement?.parentElement).not.toHaveClass("Mui-selected")
-                : expect(elt.parentElement?.parentElement).toHaveClass("Mui-selected")
+                ? expect(elt.parentElement?.parentElement?.parentElement).not.toHaveClass("Mui-selected")
+                : expect(elt.parentElement?.parentElement?.parentElement).toHaveClass("Mui-selected")
         );
         expect(document.querySelectorAll(".Mui-selected")).toHaveLength(selected.length);
     });

diff --git a/gui/src/components/Taipy/tableUtils.tsx b/gui/src/components/Taipy/tableUtils.tsx
@@ -195,11 +195,14 @@ const VALID_BOOLEAN_STRINGS = ["true", "1", "t", "y", "yes", "yeah", "sure"];
 const isBooleanTrue = (val: RowValue) =>
     typeof val == "string" ? VALID_BOOLEAN_STRINGS.some((s) => s == val.trim().toLowerCase()) : !!val;
 
+const defaultCursor = { cursor: "default" };
+const defaultCursorIcon = { ...iconInRowSx, "& .MuiSwitch-input": defaultCursor };
+
 const renderCellValue = (val: RowValue | boolean, col: ColumnDesc, formatConf: FormatConfig, nanValue?: string) => {
     if (val !== null && val !== undefined && col.type && col.type.startsWith("bool")) {
-        return <Switch checked={val as boolean} size="small" title={val ? "True" : "False"} sx={iconInRowSx} />;
+        return <Switch checked={val as boolean} size="small" title={val ? "True" : "False"} sx={defaultCursorIcon} />;
     }
-    return <>{formatValue(val as RowValue, col, formatConf, nanValue)}</>;
+    return <span style={defaultCursor}>{formatValue(val as RowValue, col, formatConf, nanValue)}</span>;
 };
 
 const getCellProps = (col: ColumnDesc, base: Partial<TableCellProps> = {}): Partial<TableCellProps> => {