Use unique user edit modal for editing users in sheets

packages/builder/src/components/backend/DataTable/DataTable.svelte

@@ -6,7 +6,8 @@
   import { API } from "api"
 
   import SheetAddColumnModal from "components/backend/DataTable/modals/sheet/SheetCreateColumnModal.svelte"
-  import SheetAddRowModal from "components/backend/DataTable/modals/sheet/SheetCreateRowModal.svelte"
+  import SheetCreateEditRowModal from "components/backend/DataTable/modals/sheet/SheetCreateEditRowModal.svelte"
+  import SheetEditUserModal from "components/backend/DataTable/modals/sheet/SheetEditUserModal.svelte"
   import SheetCreateViewButton from "components/backend/DataTable/buttons/sheet/SheetCreateViewButton.svelte"
   import SheetImportButton from "components/backend/DataTable/buttons/sheet/SheetImportButton.svelte"
   import SheetExportButton from "components/backend/DataTable/buttons/sheet/SheetExportButton.svelte"
@@ -44,7 +45,11 @@
       <SheetFilterButton />
       <SheetAddColumnModal />
       <SheetEditColumnModal />
-      <SheetAddRowModal />
+      {#if isUsersTable}
+        <SheetEditUserModal />
+      {:else}
+        <SheetCreateEditRowModal />
+      {/if}
     </svelte:fragment>
   </Sheet>
 </div>

packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte

@@ -55,9 +55,9 @@
     }
 
     try {
-      await API.saveRow({ ...row, tableId: table._id })
+      const res = await API.saveRow({ ...row, tableId: table._id })
       notifications.success("User saved successfully")
-      dispatch("updaterows")
+      dispatch("updaterows", res.id)
     } catch (error) {
       if (error.handled) {
         const response = error.json

packages/builder/src/components/backend/DataTable/modals/sheet/SheetEditUserModal.svelte

@@ -0,0 +1,25 @@
+<script>
+  import CreateEditUser from "../../modals/CreateEditUser.svelte"
+  import { getContext, onMount } from "svelte"
+  import { Modal } from "@budibase/bbui"
+  import { cloneDeep } from "lodash/fp"
+
+  const { subscribe, rows } = getContext("sheet")
+
+  let modal
+  let row
+
+  onMount(() =>
+    subscribe("edit-row", rowToEdit => {
+      row = cloneDeep(rowToEdit)
+      modal.show()
+    })
+  )
+</script>
+
+<Modal bind:this={modal}>
+  <CreateEditUser
+    {row}
+    on:updaterows={e => rows.actions.refreshRow(e.detail)}
+  />
+</Modal>

packages/frontend-core/src/components/sheet/cells/DataCell.svelte

@@ -28,7 +28,10 @@
   $: error = getErrorStore(rowFocused, cellId)
 
   // Determine if the cell is editable
-  $: readonly = column.schema.autocolumn || (!$config.allowEditRows && row._id)
+  $: readonly =
+    column.schema.autocolumn ||
+    column.schema.readonly ||
+    (!$config.allowEditRows && row._id)
 
   // Register this cell API if the row is focused
   $: {

packages/frontend-core/src/components/sheet/stores/columns.js

@@ -142,7 +142,7 @@ export const initialise = context => {
     columns.set(
       fields
         .map(field => ({
-          name: field,
+          name: schema[field].name || field,
           schema: schema[field],
           width: schema[field].width || DefaultColumnWidth,
           visible: schema[field].visible ?? true,