From 78429866bde7477df29787ba3c64a611bcbc1341 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thomas=20Brand=C3=A9ho?= <thomas.brandeho@gmail.com>
Date: Thu, 28 Dec 2023 09:09:07 +0100
Subject: [PATCH] fix editable property of columns being ignored in data_editor
 (#2338)

---
 .../web/utils/helpers/dataeditor.js           | 110 +++++++++---------
 1 file changed, 56 insertions(+), 54 deletions(-)

diff --git a/reflex/.templates/web/utils/helpers/dataeditor.js b/reflex/.templates/web/utils/helpers/dataeditor.js
index 5861d60bf..9ff3682e8 100644
--- a/reflex/.templates/web/utils/helpers/dataeditor.js
+++ b/reflex/.templates/web/utils/helpers/dataeditor.js
@@ -1,67 +1,69 @@
-import { GridCellKind } from "@glideapps/glide-data-grid"
+import { GridCellKind } from "@glideapps/glide-data-grid";
 
 export function getDEColumn(columns, col) {
-    let c = columns[col];
-    c.pos = col;
-    return c;
+  let c = columns[col];
+  c.pos = col;
+  return c;
 }
 
 export function getDERow(data, row) {
-    return data[row];
+  return data[row];
 }
 
 export function locateCell(row, column) {
-    if (Array.isArray(row)) {
-        return row[column.pos];
-    } else {
-        return row[column.id];
-    }
+  if (Array.isArray(row)) {
+    return row[column.pos];
+  } else {
+    return row[column.id];
+  }
 }
 
 export function formatCell(value, column) {
-    const editable = column.editable || true
-    switch (column.type) {
-        case "int":
-        case "float":
-            return {
-                kind: GridCellKind.Number,
-                data: value,
-                displayData: value + "",
-                readonly: !editable,
-                allowOverlay: editable,
-            }
-        case "datetime":
-        // value = moment format?
-        case "str":
-            return {
-                kind: GridCellKind.Text,
-                data: value,
-                displayData: value,
-                readonly: !editable,
-                allowOverlay: editable,
-            }
-        case "bool":
-            return {
-                kind: GridCellKind.Boolean,
-                data: value,
-                readonly: !editable,
-            }
-        default:
-            console.log("Warning: column.type is undefined for column.title=" + column.title)
-            return {
-                kind: GridCellKind.Text,
-                data: value,
-                displayData: column.type
-            }
-    };
-};
+  const editable = column.editable ?? true;
+  switch (column.type) {
+    case "int":
+    case "float":
+      return {
+        kind: GridCellKind.Number,
+        data: value,
+        displayData: value + "",
+        readonly: !editable,
+        allowOverlay: editable,
+      };
+    case "datetime":
+    // value = moment format?
+    case "str":
+      return {
+        kind: GridCellKind.Text,
+        data: value,
+        displayData: value,
+        readonly: !editable,
+        allowOverlay: editable,
+      };
+    case "bool":
+      return {
+        kind: GridCellKind.Boolean,
+        data: value,
+        readonly: !editable,
+      };
+    default:
+      console.log(
+        "Warning: column.type is undefined for column.title=" + column.title
+      );
+      return {
+        kind: GridCellKind.Text,
+        data: value,
+        displayData: column.type,
+      };
+  }
+}
 
 export function formatDataEditorCells(col, row, columns, data) {
-    if (row < data.length && col < columns.length) {
-        const column = getDEColumn(columns, col);
-        const rowData = getDERow(data, row);
-        const cellData = locateCell(rowData, column);
-        return formatCell(cellData, column);
-    }
-    return { kind: GridCellKind.Loading };
-}
\ No newline at end of file
+  if (row < data.length && col < columns.length) {
+    const column = getDEColumn(columns, col);
+    const rowData = getDERow(data, row);
+    const cellData = locateCell(rowData, column);
+    return formatCell(cellData, column);
+  }
+  return { kind: GridCellKind.Loading };
+}