From 60f8ce26af9f476337153b4b0d071c30ec4952b4 Mon Sep 17 00:00:00 2001
From: mike12345567 <me@michaeldrury.co.uk>
Date: Thu, 9 May 2024 16:18:43 +0100
Subject: [PATCH 1/8] Fixing an issue with ID/Rev not being copyable from
 context menu due to the way IDs were split/handled in the grid.

---
 .../src/components/grid/stores/ui.js              | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/frontend-core/src/components/grid/stores/ui.js b/packages/frontend-core/src/components/grid/stores/ui.js
index 928f93f3e1..b75b9aeb0f 100644
--- a/packages/frontend-core/src/components/grid/stores/ui.js
+++ b/packages/frontend-core/src/components/grid/stores/ui.js
@@ -8,6 +8,15 @@ import {
   NewRowID,
 } from "../lib/constants"
 
+function splitRowId(rowId) {
+  if (!rowId) {
+    return undefined
+  }
+  const parts = rowId.split("-")
+  const field = parts.pop()
+  return { id: parts.join("-"), field }
+}
+
 export const createStores = context => {
   const { props } = context
   const focusedCellId = writable(null)
@@ -25,7 +34,7 @@ export const createStores = context => {
   const focusedRowId = derived(
     focusedCellId,
     $focusedCellId => {
-      return $focusedCellId?.split("-")[0]
+      return splitRowId($focusedCellId)?.id
     },
     null
   )
@@ -72,7 +81,7 @@ export const deriveStores = context => {
   const focusedRow = derived(
     [focusedCellId, rowLookupMap, rows],
     ([$focusedCellId, $rowLookupMap, $rows]) => {
-      const rowId = $focusedCellId?.split("-")[0]
+      const rowId = splitRowId($focusedCellId)?.id
 
       // Edge case for new rows
       if (rowId === NewRowID) {
@@ -152,7 +161,7 @@ export const initialise = context => {
     const hasRow = rows.actions.hasRow
 
     // Check selected cell
-    const selectedRowId = $focusedCellId?.split("-")[0]
+    const selectedRowId = splitRowId($focusedCellId)?.id
     if (selectedRowId && !hasRow(selectedRowId)) {
       focusedCellId.set(null)
     }

From 076c7db3510fb727462a87c7e9a4fb184a75cbf6 Mon Sep 17 00:00:00 2001
From: mike12345567 <me@michaeldrury.co.uk>
Date: Thu, 9 May 2024 16:55:04 +0100
Subject: [PATCH 2/8] Updating everywhere that the combination was done, to
 make sure it all goes through one location, using a new character to
 join/split.

---
 .../src/components/grid/layout/GridRow.svelte     |  3 ++-
 .../src/components/grid/layout/NewRow.svelte      |  7 ++++---
 .../components/grid/layout/StickyColumn.svelte    |  3 ++-
 .../src/components/grid/lib/utils.js              | 15 +++++++++++++++
 .../grid/overlays/KeyboardManager.svelte          | 12 ++++++------
 .../components/grid/overlays/MenuOverlay.svelte   |  3 ++-
 .../src/components/grid/stores/rows.js            | 14 ++++++++------
 .../src/components/grid/stores/scroll.js          |  3 ++-
 .../src/components/grid/stores/ui.js              | 10 +---------
 .../src/components/grid/stores/validation.js      |  7 ++++---
 10 files changed, 46 insertions(+), 31 deletions(-)

diff --git a/packages/frontend-core/src/components/grid/layout/GridRow.svelte b/packages/frontend-core/src/components/grid/layout/GridRow.svelte
index d6c8c3d87b..0b1b4195b2 100644
--- a/packages/frontend-core/src/components/grid/layout/GridRow.svelte
+++ b/packages/frontend-core/src/components/grid/layout/GridRow.svelte
@@ -1,6 +1,7 @@
 <script>
   import { getContext } from "svelte"
   import DataCell from "../cells/DataCell.svelte"
+  import { combineRowId } from "../lib/utils"
 
   export let row
   export let top = false
@@ -38,7 +39,7 @@
   on:click={() => dispatch("rowclick", rows.actions.cleanRow(row))}
 >
   {#each $visibleColumns as column, columnIdx}
-    {@const cellId = `${row._id}-${column.name}`}
+    {@const cellId = combineRowId(row._id, column.name)}
     <DataCell
       {cellId}
       {column}
diff --git a/packages/frontend-core/src/components/grid/layout/NewRow.svelte b/packages/frontend-core/src/components/grid/layout/NewRow.svelte
index f5de870f7e..41604bec39 100644
--- a/packages/frontend-core/src/components/grid/layout/NewRow.svelte
+++ b/packages/frontend-core/src/components/grid/layout/NewRow.svelte
@@ -7,6 +7,7 @@
   import { GutterWidth, NewRowID } from "../lib/constants"
   import GutterCell from "../cells/GutterCell.svelte"
   import KeyboardShortcut from "./KeyboardShortcut.svelte"
+  import { combineRowId } from "../lib/utils"
 
   const {
     hoveredRowId,
@@ -70,7 +71,7 @@
 
       // Select the first cell if possible
       if (firstColumn) {
-        $focusedCellId = `${savedRow._id}-${firstColumn.name}`
+        $focusedCellId = combineRowId(savedRow._id, firstColumn.name)
       }
     }
     isAdding = false
@@ -118,7 +119,7 @@
     visible = true
     $hoveredRowId = NewRowID
     if (firstColumn) {
-      $focusedCellId = `${NewRowID}-${firstColumn.name}`
+      $focusedCellId = combineRowId(NewRowID, firstColumn.name)
     }
 
     // Attach key listener
@@ -194,7 +195,7 @@
         {/if}
       </GutterCell>
       {#if $stickyColumn}
-        {@const cellId = `${NewRowID}-${$stickyColumn.name}`}
+        {@const cellId = combineRowId(NewRowID, $stickyColumn.name)}
         <DataCell
           {cellId}
           rowFocused
diff --git a/packages/frontend-core/src/components/grid/layout/StickyColumn.svelte b/packages/frontend-core/src/components/grid/layout/StickyColumn.svelte
index 6a388f8014..ce25a59b38 100644
--- a/packages/frontend-core/src/components/grid/layout/StickyColumn.svelte
+++ b/packages/frontend-core/src/components/grid/layout/StickyColumn.svelte
@@ -8,6 +8,7 @@
   import { GutterWidth, BlankRowID } from "../lib/constants"
   import GutterCell from "../cells/GutterCell.svelte"
   import KeyboardShortcut from "./KeyboardShortcut.svelte"
+  import { combineRowId } from "../lib/utils"
 
   const {
     rows,
@@ -71,7 +72,7 @@
         {@const rowSelected = !!$selectedRows[row._id]}
         {@const rowHovered = $hoveredRowId === row._id}
         {@const rowFocused = $focusedRow?._id === row._id}
-        {@const cellId = `${row._id}-${$stickyColumn?.name}`}
+        {@const cellId = combineRowId(row._id, $stickyColumn?.name)}
         <div
           class="row"
           on:mouseenter={$isDragging ? null : () => ($hoveredRowId = row._id)}
diff --git a/packages/frontend-core/src/components/grid/lib/utils.js b/packages/frontend-core/src/components/grid/lib/utils.js
index 02e6d66e0e..8e65e8a43f 100644
--- a/packages/frontend-core/src/components/grid/lib/utils.js
+++ b/packages/frontend-core/src/components/grid/lib/utils.js
@@ -1,5 +1,20 @@
 import { TypeIconMap } from "../../../constants"
 
+const JOINING_CHARACTER = "——"
+
+export const splitRowId = rowId => {
+  if (!rowId) {
+    return undefined
+  }
+  const parts = rowId.split(JOINING_CHARACTER)
+  const field = parts.pop()
+  return { id: parts.join(JOINING_CHARACTER), field }
+}
+
+export const combineRowId = (rowId, fieldName) => {
+  return `${rowId}${JOINING_CHARACTER}${fieldName}`
+}
+
 export const getColor = (idx, opacity = 0.3) => {
   if (idx == null || idx === -1) {
     idx = 0
diff --git a/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte b/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
index cef4144833..e689b4e11a 100644
--- a/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
+++ b/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
@@ -2,6 +2,7 @@
   import { getContext, onMount } from "svelte"
   import { debounce } from "../../../utils/utils"
   import { NewRowID } from "../lib/constants"
+  import { combineRowId, splitRowId } from "../lib/utils"
 
   const {
     rows,
@@ -154,7 +155,7 @@
     if (!firstColumn) {
       return
     }
-    focusedCellId.set(`${firstRow._id}-${firstColumn.name}`)
+    focusedCellId.set(combineRowId(firstRow._id, firstColumn.name))
   }
 
   // Changes the focused cell by moving it left or right to a different column
@@ -163,8 +164,7 @@
       return
     }
     const cols = $visibleColumns
-    const split = $focusedCellId.split("-")
-    const columnName = split[1]
+    const { id, field: columnName } = splitRowId($focusedCellId)
     let newColumnName
     if (columnName === $stickyColumn?.name) {
       const index = delta - 1
@@ -178,7 +178,7 @@
       }
     }
     if (newColumnName) {
-      $focusedCellId = `${split[0]}-${newColumnName}`
+      $focusedCellId = combineRowId(id, newColumnName)
     }
   }
 
@@ -189,8 +189,8 @@
     }
     const newRow = $rows[$focusedRow.__idx + delta]
     if (newRow) {
-      const split = $focusedCellId.split("-")
-      $focusedCellId = `${newRow._id}-${split[1]}`
+      const { field } = splitRowId($focusedCellId)
+      $focusedCellId = combineRowId(newRow._id, field)
     }
   }
 
diff --git a/packages/frontend-core/src/components/grid/overlays/MenuOverlay.svelte b/packages/frontend-core/src/components/grid/overlays/MenuOverlay.svelte
index b11d42f52d..64f0f13c80 100644
--- a/packages/frontend-core/src/components/grid/overlays/MenuOverlay.svelte
+++ b/packages/frontend-core/src/components/grid/overlays/MenuOverlay.svelte
@@ -3,6 +3,7 @@
   import { getContext } from "svelte"
   import { NewRowID } from "../lib/constants"
   import GridPopover from "./GridPopover.svelte"
+  import { combineRowId } from "../lib/utils"
 
   const {
     focusedRow,
@@ -41,7 +42,7 @@
     const newRow = await rows.actions.duplicateRow($focusedRow)
     if (newRow) {
       const column = $stickyColumn?.name || $columns[0].name
-      $focusedCellId = `${newRow._id}-${column}`
+      $focusedCellId = combineRowId(newRow._id, column)
     }
   }
 
diff --git a/packages/frontend-core/src/components/grid/stores/rows.js b/packages/frontend-core/src/components/grid/stores/rows.js
index 6193b59d1d..4ba396d895 100644
--- a/packages/frontend-core/src/components/grid/stores/rows.js
+++ b/packages/frontend-core/src/components/grid/stores/rows.js
@@ -1,6 +1,7 @@
 import { writable, derived, get } from "svelte/store"
 import { fetchData } from "../../../fetch"
 import { NewRowID, RowPageSize } from "../lib/constants"
+import { combineRowId, splitRowId } from "../lib/utils"
 import { tick } from "svelte"
 import { Helpers } from "@budibase/bbui"
 
@@ -206,7 +207,7 @@ export const createActions = context => {
     // If the server doesn't reply with a valid error, assume that the source
     // of the error is the focused cell's column
     if (!error?.json?.validationErrors && errorString) {
-      const focusedColumn = get(focusedCellId)?.split("-")[1]
+      const { field: focusedColumn } = splitRowId(get(focusedCellId))
       if (focusedColumn) {
         error = {
           json: {
@@ -245,7 +246,7 @@ export const createActions = context => {
         }
         // Set error against the cell
         validation.actions.setError(
-          `${rowId}-${column}`,
+          combineRowId(rowId, column),
           Helpers.capitalise(err)
         )
         // Ensure the column is visible
@@ -265,7 +266,7 @@ export const createActions = context => {
 
       // Focus the first cell with an error
       if (erroredColumns.length) {
-        focusedCellId.set(`${rowId}-${erroredColumns[0]}`)
+        focusedCellId.set(combineRowId(rowId, erroredColumns[0]))
       }
     } else {
       get(notifications).error(errorString || "An unknown error occurred")
@@ -571,9 +572,10 @@ export const initialise = context => {
       return
     }
     // Stop if we changed row
-    const oldRowId = id.split("-")[0]
-    const oldColumn = id.split("-")[1]
-    const newRowId = get(focusedCellId)?.split("-")[0]
+    const split = splitRowId(id)
+    const oldRowId = split.id
+    const oldColumn = split.field
+    const { id: newRowId } = splitRowId(get(focusedCellId))
     if (oldRowId !== newRowId) {
       return
     }
diff --git a/packages/frontend-core/src/components/grid/stores/scroll.js b/packages/frontend-core/src/components/grid/stores/scroll.js
index 88a676f078..94b0b574a9 100644
--- a/packages/frontend-core/src/components/grid/stores/scroll.js
+++ b/packages/frontend-core/src/components/grid/stores/scroll.js
@@ -1,6 +1,7 @@
 import { writable, derived, get } from "svelte/store"
 import { tick } from "svelte"
 import { Padding, GutterWidth, FocusedCellMinOffset } from "../lib/constants"
+import { splitRowId } from "../lib/utils"
 
 export const createStores = () => {
   const scroll = writable({
@@ -176,7 +177,7 @@ export const initialise = context => {
     // Ensure horizontal position is viewable
     // Check horizontal position of columns next
     const $visibleColumns = get(visibleColumns)
-    const columnName = $focusedCellId?.split("-")[1]
+    const { field: columnName } = splitRowId($focusedCellId)
     const column = $visibleColumns.find(col => col.name === columnName)
     if (!column) {
       return
diff --git a/packages/frontend-core/src/components/grid/stores/ui.js b/packages/frontend-core/src/components/grid/stores/ui.js
index b75b9aeb0f..a492f67702 100644
--- a/packages/frontend-core/src/components/grid/stores/ui.js
+++ b/packages/frontend-core/src/components/grid/stores/ui.js
@@ -7,15 +7,7 @@ import {
   MediumRowHeight,
   NewRowID,
 } from "../lib/constants"
-
-function splitRowId(rowId) {
-  if (!rowId) {
-    return undefined
-  }
-  const parts = rowId.split("-")
-  const field = parts.pop()
-  return { id: parts.join("-"), field }
-}
+import { splitRowId } from "../lib/utils"
 
 export const createStores = context => {
   const { props } = context
diff --git a/packages/frontend-core/src/components/grid/stores/validation.js b/packages/frontend-core/src/components/grid/stores/validation.js
index 70db076593..85082a1162 100644
--- a/packages/frontend-core/src/components/grid/stores/validation.js
+++ b/packages/frontend-core/src/components/grid/stores/validation.js
@@ -1,4 +1,5 @@
 import { writable, get, derived } from "svelte/store"
+import { combineRowId, splitRowId } from "../lib/utils"
 
 // Normally we would break out actions into the explicit "createActions"
 // function, but for validation all these actions are pure so can go into
@@ -12,7 +13,7 @@ export const createStores = () => {
     Object.entries($validation).forEach(([key, error]) => {
       // Extract row ID from all errored cell IDs
       if (error) {
-        map[key.split("-")[0]] = true
+        map[splitRowId(key).id] = true
       }
     })
     return map
@@ -53,10 +54,10 @@ export const initialise = context => {
       const $stickyColumn = get(stickyColumn)
       validation.update(state => {
         $columns.forEach(column => {
-          state[`${id}-${column.name}`] = null
+          state[combineRowId(id, column.name)] = null
         })
         if ($stickyColumn) {
-          state[`${id}-${$stickyColumn.name}`] = null
+          state[combineRowId(id, stickyColumn.name)] = null
         }
         return state
       })

From cf440cc39d19883a11c438f822002cf99c756ed3 Mon Sep 17 00:00:00 2001
From: mike12345567 <me@michaeldrury.co.uk>
Date: Thu, 9 May 2024 16:56:51 +0100
Subject: [PATCH 3/8] Switching to a more obvious joining character.

---
 packages/frontend-core/src/components/grid/lib/utils.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/frontend-core/src/components/grid/lib/utils.js b/packages/frontend-core/src/components/grid/lib/utils.js
index 8e65e8a43f..b6bbd76c04 100644
--- a/packages/frontend-core/src/components/grid/lib/utils.js
+++ b/packages/frontend-core/src/components/grid/lib/utils.js
@@ -1,6 +1,8 @@
 import { TypeIconMap } from "../../../constants"
 
-const JOINING_CHARACTER = "——"
+// we can't use "-" for joining the ID/field, as this can be present in the ID or column name
+// using something very unusual to avoid this problem
+const JOINING_CHARACTER = "‽‽"
 
 export const splitRowId = rowId => {
   if (!rowId) {

From 910ec6446bea1318be60fa73e6fafbebca57404b Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Thu, 9 May 2024 18:03:46 +0200
Subject: [PATCH 4/8] Prevent spamming the column config save button

---
 .../DataTable/modals/CreateEditColumn.svelte  | 25 +++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte b/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte
index 81d5545c40..8f91796f6c 100644
--- a/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte
+++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte
@@ -12,6 +12,7 @@
     OptionSelectDnD,
     Layout,
     AbsTooltip,
+    ProgressCircle,
   } from "@budibase/bbui"
   import { SWITCHABLE_TYPES, ValidColumnNameRegex } from "@budibase/shared-core"
   import { createEventDispatcher, getContext, onMount } from "svelte"
@@ -245,11 +246,11 @@
   }
 
   async function saveColumn() {
-    savingColumn = true
     if (errors?.length) {
       return
     }
 
+    savingColumn = true
     let saveColumn = cloneDeep(editableColumn)
 
     delete saveColumn.fieldId
@@ -289,6 +290,8 @@
       }
     } catch (err) {
       notifications.error(`Error saving column: ${err.message}`)
+    } finally {
+      savingColumn = false
     }
   }
 
@@ -739,7 +742,20 @@
     <Button quiet warning text on:click={confirmDelete}>Delete</Button>
   {/if}
   <Button secondary newStyles on:click={cancelEdit}>Cancel</Button>
-  <Button disabled={invalid} newStyles cta on:click={saveColumn}>Save</Button>
+  <Button
+    disabled={invalid || savingColumn}
+    newStyles
+    cta
+    on:click={saveColumn}
+  >
+    {#if savingColumn}
+      <div class="save-loading">
+        <ProgressCircle overBackground={true} size="S" />
+      </div>
+    {:else}
+      Save
+    {/if}
+  </Button>
 </div>
 <Modal bind:this={jsonSchemaModal}>
   <JSONSchemaModal
@@ -804,4 +820,9 @@
     cursor: pointer;
     color: var(--spectrum-global-color-gray-900);
   }
+
+  .save-loading {
+    display: flex;
+    justify-content: center;
+  }
 </style>

From 10df6277447ee81548d06ff2fc5b6cca77580ad1 Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Thu, 9 May 2024 18:44:07 +0200
Subject: [PATCH 5/8] Keep headers

---
 packages/server/src/integrations/googlesheets.ts | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/packages/server/src/integrations/googlesheets.ts b/packages/server/src/integrations/googlesheets.ts
index 7215c337d7..b1b372b4f5 100644
--- a/packages/server/src/integrations/googlesheets.ts
+++ b/packages/server/src/integrations/googlesheets.ts
@@ -430,14 +430,6 @@ class GoogleSheetsIntegration implements DatasourcePlus {
         }
       }
 
-      // clear out deleted columns
-      for (let key of sheet.headerValues) {
-        if (!Object.keys(table.schema).includes(key)) {
-          const idx = updatedHeaderValues.indexOf(key)
-          updatedHeaderValues.splice(idx, 1)
-        }
-      }
-
       try {
         await sheet.setHeaderRow(updatedHeaderValues)
       } catch (err) {

From 5a45ebcebc97108958ff4896a474302c999d96c0 Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Thu, 9 May 2024 19:13:20 +0200
Subject: [PATCH 6/8] Lint anys

---
 packages/server/src/integrations/googlesheets.ts | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/server/src/integrations/googlesheets.ts b/packages/server/src/integrations/googlesheets.ts
index b1b372b4f5..889adfc544 100644
--- a/packages/server/src/integrations/googlesheets.ts
+++ b/packages/server/src/integrations/googlesheets.ts
@@ -371,9 +371,11 @@ class GoogleSheetsIntegration implements DatasourcePlus {
   }
 
   buildRowObject(headers: string[], values: string[], rowNumber: number) {
-    const rowObject: { rowNumber: number; [key: string]: any } = { rowNumber }
+    const rowObject: { rowNumber: number } & Row = {
+      rowNumber,
+      _id: rowNumber.toString(),
+    }
     for (let i = 0; i < headers.length; i++) {
-      rowObject._id = rowNumber
       rowObject[headers[i]] = values[i]
     }
     return rowObject
@@ -450,7 +452,7 @@ class GoogleSheetsIntegration implements DatasourcePlus {
     }
   }
 
-  async create(query: { sheet: string; row: any }) {
+  async create(query: { sheet: string; row: Row }) {
     try {
       await this.connect()
       const sheet = this.client.sheetsByTitle[query.sheet]
@@ -466,7 +468,7 @@ class GoogleSheetsIntegration implements DatasourcePlus {
     }
   }
 
-  async createBulk(query: { sheet: string; rows: any[] }) {
+  async createBulk(query: { sheet: string; rows: Row[] }) {
     try {
       await this.connect()
       const sheet = this.client.sheetsByTitle[query.sheet]

From c0a2482a4ecdbcef442ef4af0617c818fa609391 Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Thu, 9 May 2024 19:57:27 +0200
Subject: [PATCH 7/8] Fix test

---
 .../server/src/integrations/tests/googlesheets.spec.ts   | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/server/src/integrations/tests/googlesheets.spec.ts b/packages/server/src/integrations/tests/googlesheets.spec.ts
index c6e073d602..97ac35787d 100644
--- a/packages/server/src/integrations/tests/googlesheets.spec.ts
+++ b/packages/server/src/integrations/tests/googlesheets.spec.ts
@@ -129,10 +129,11 @@ describe("Google Sheets Integration", () => {
       })
       expect(sheet.loadHeaderRow).toHaveBeenCalledTimes(1)
       expect(sheet.setHeaderRow).toHaveBeenCalledTimes(1)
-      expect(sheet.setHeaderRow).toHaveBeenCalledWith(["name"])
-
-      // No undefined are sent
-      expect((sheet.setHeaderRow as any).mock.calls[0][0]).toHaveLength(1)
+      expect(sheet.setHeaderRow).toHaveBeenCalledWith([
+        "name",
+        "description",
+        "location",
+      ])
     })
   })
 

From 582ed1d75b745e350d23b56a09c68c2b0f513a6f Mon Sep 17 00:00:00 2001
From: mike12345567 <me@michaeldrury.co.uk>
Date: Fri, 10 May 2024 12:09:17 +0100
Subject: [PATCH 8/8] PR comments.

---
 .../src/components/grid/layout/GridRow.svelte        |  4 ++--
 .../src/components/grid/layout/NewRow.svelte         |  8 ++++----
 .../src/components/grid/layout/StickyColumn.svelte   |  4 ++--
 .../frontend-core/src/components/grid/lib/utils.js   |  4 ++--
 .../components/grid/overlays/KeyboardManager.svelte  | 12 ++++++------
 .../src/components/grid/overlays/MenuOverlay.svelte  |  4 ++--
 .../frontend-core/src/components/grid/stores/rows.js | 12 ++++++------
 .../src/components/grid/stores/scroll.js             |  4 ++--
 .../frontend-core/src/components/grid/stores/ui.js   |  8 ++++----
 .../src/components/grid/stores/validation.js         |  8 ++++----
 10 files changed, 34 insertions(+), 34 deletions(-)

diff --git a/packages/frontend-core/src/components/grid/layout/GridRow.svelte b/packages/frontend-core/src/components/grid/layout/GridRow.svelte
index 0b1b4195b2..88a6fc488f 100644
--- a/packages/frontend-core/src/components/grid/layout/GridRow.svelte
+++ b/packages/frontend-core/src/components/grid/layout/GridRow.svelte
@@ -1,7 +1,7 @@
 <script>
   import { getContext } from "svelte"
   import DataCell from "../cells/DataCell.svelte"
-  import { combineRowId } from "../lib/utils"
+  import { getCellID } from "../lib/utils"
 
   export let row
   export let top = false
@@ -39,7 +39,7 @@
   on:click={() => dispatch("rowclick", rows.actions.cleanRow(row))}
 >
   {#each $visibleColumns as column, columnIdx}
-    {@const cellId = combineRowId(row._id, column.name)}
+    {@const cellId = getCellID(row._id, column.name)}
     <DataCell
       {cellId}
       {column}
diff --git a/packages/frontend-core/src/components/grid/layout/NewRow.svelte b/packages/frontend-core/src/components/grid/layout/NewRow.svelte
index 41604bec39..4a4979f535 100644
--- a/packages/frontend-core/src/components/grid/layout/NewRow.svelte
+++ b/packages/frontend-core/src/components/grid/layout/NewRow.svelte
@@ -7,7 +7,7 @@
   import { GutterWidth, NewRowID } from "../lib/constants"
   import GutterCell from "../cells/GutterCell.svelte"
   import KeyboardShortcut from "./KeyboardShortcut.svelte"
-  import { combineRowId } from "../lib/utils"
+  import { getCellID } from "../lib/utils"
 
   const {
     hoveredRowId,
@@ -71,7 +71,7 @@
 
       // Select the first cell if possible
       if (firstColumn) {
-        $focusedCellId = combineRowId(savedRow._id, firstColumn.name)
+        $focusedCellId = getCellID(savedRow._id, firstColumn.name)
       }
     }
     isAdding = false
@@ -119,7 +119,7 @@
     visible = true
     $hoveredRowId = NewRowID
     if (firstColumn) {
-      $focusedCellId = combineRowId(NewRowID, firstColumn.name)
+      $focusedCellId = getCellID(NewRowID, firstColumn.name)
     }
 
     // Attach key listener
@@ -195,7 +195,7 @@
         {/if}
       </GutterCell>
       {#if $stickyColumn}
-        {@const cellId = combineRowId(NewRowID, $stickyColumn.name)}
+        {@const cellId = getCellID(NewRowID, $stickyColumn.name)}
         <DataCell
           {cellId}
           rowFocused
diff --git a/packages/frontend-core/src/components/grid/layout/StickyColumn.svelte b/packages/frontend-core/src/components/grid/layout/StickyColumn.svelte
index ce25a59b38..b5cf3dbe59 100644
--- a/packages/frontend-core/src/components/grid/layout/StickyColumn.svelte
+++ b/packages/frontend-core/src/components/grid/layout/StickyColumn.svelte
@@ -8,7 +8,7 @@
   import { GutterWidth, BlankRowID } from "../lib/constants"
   import GutterCell from "../cells/GutterCell.svelte"
   import KeyboardShortcut from "./KeyboardShortcut.svelte"
-  import { combineRowId } from "../lib/utils"
+  import { getCellID } from "../lib/utils"
 
   const {
     rows,
@@ -72,7 +72,7 @@
         {@const rowSelected = !!$selectedRows[row._id]}
         {@const rowHovered = $hoveredRowId === row._id}
         {@const rowFocused = $focusedRow?._id === row._id}
-        {@const cellId = combineRowId(row._id, $stickyColumn?.name)}
+        {@const cellId = getCellID(row._id, $stickyColumn?.name)}
         <div
           class="row"
           on:mouseenter={$isDragging ? null : () => ($hoveredRowId = row._id)}
diff --git a/packages/frontend-core/src/components/grid/lib/utils.js b/packages/frontend-core/src/components/grid/lib/utils.js
index b6bbd76c04..0d9915149e 100644
--- a/packages/frontend-core/src/components/grid/lib/utils.js
+++ b/packages/frontend-core/src/components/grid/lib/utils.js
@@ -4,7 +4,7 @@ import { TypeIconMap } from "../../../constants"
 // using something very unusual to avoid this problem
 const JOINING_CHARACTER = "‽‽"
 
-export const splitRowId = rowId => {
+export const parseCellID = rowId => {
   if (!rowId) {
     return undefined
   }
@@ -13,7 +13,7 @@ export const splitRowId = rowId => {
   return { id: parts.join(JOINING_CHARACTER), field }
 }
 
-export const combineRowId = (rowId, fieldName) => {
+export const getCellID = (rowId, fieldName) => {
   return `${rowId}${JOINING_CHARACTER}${fieldName}`
 }
 
diff --git a/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte b/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
index e689b4e11a..78cb186f29 100644
--- a/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
+++ b/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
@@ -2,7 +2,7 @@
   import { getContext, onMount } from "svelte"
   import { debounce } from "../../../utils/utils"
   import { NewRowID } from "../lib/constants"
-  import { combineRowId, splitRowId } from "../lib/utils"
+  import { getCellID, parseCellID } from "../lib/utils"
 
   const {
     rows,
@@ -155,7 +155,7 @@
     if (!firstColumn) {
       return
     }
-    focusedCellId.set(combineRowId(firstRow._id, firstColumn.name))
+    focusedCellId.set(getCellID(firstRow._id, firstColumn.name))
   }
 
   // Changes the focused cell by moving it left or right to a different column
@@ -164,7 +164,7 @@
       return
     }
     const cols = $visibleColumns
-    const { id, field: columnName } = splitRowId($focusedCellId)
+    const { id, field: columnName } = parseCellID($focusedCellId)
     let newColumnName
     if (columnName === $stickyColumn?.name) {
       const index = delta - 1
@@ -178,7 +178,7 @@
       }
     }
     if (newColumnName) {
-      $focusedCellId = combineRowId(id, newColumnName)
+      $focusedCellId = getCellID(id, newColumnName)
     }
   }
 
@@ -189,8 +189,8 @@
     }
     const newRow = $rows[$focusedRow.__idx + delta]
     if (newRow) {
-      const { field } = splitRowId($focusedCellId)
-      $focusedCellId = combineRowId(newRow._id, field)
+      const { field } = parseCellID($focusedCellId)
+      $focusedCellId = getCellID(newRow._id, field)
     }
   }
 
diff --git a/packages/frontend-core/src/components/grid/overlays/MenuOverlay.svelte b/packages/frontend-core/src/components/grid/overlays/MenuOverlay.svelte
index 64f0f13c80..4a413d7dde 100644
--- a/packages/frontend-core/src/components/grid/overlays/MenuOverlay.svelte
+++ b/packages/frontend-core/src/components/grid/overlays/MenuOverlay.svelte
@@ -3,7 +3,7 @@
   import { getContext } from "svelte"
   import { NewRowID } from "../lib/constants"
   import GridPopover from "./GridPopover.svelte"
-  import { combineRowId } from "../lib/utils"
+  import { getCellID } from "../lib/utils"
 
   const {
     focusedRow,
@@ -42,7 +42,7 @@
     const newRow = await rows.actions.duplicateRow($focusedRow)
     if (newRow) {
       const column = $stickyColumn?.name || $columns[0].name
-      $focusedCellId = combineRowId(newRow._id, column)
+      $focusedCellId = getCellID(newRow._id, column)
     }
   }
 
diff --git a/packages/frontend-core/src/components/grid/stores/rows.js b/packages/frontend-core/src/components/grid/stores/rows.js
index 4ba396d895..c73dae8991 100644
--- a/packages/frontend-core/src/components/grid/stores/rows.js
+++ b/packages/frontend-core/src/components/grid/stores/rows.js
@@ -1,7 +1,7 @@
 import { writable, derived, get } from "svelte/store"
 import { fetchData } from "../../../fetch"
 import { NewRowID, RowPageSize } from "../lib/constants"
-import { combineRowId, splitRowId } from "../lib/utils"
+import { getCellID, parseCellID } from "../lib/utils"
 import { tick } from "svelte"
 import { Helpers } from "@budibase/bbui"
 
@@ -207,7 +207,7 @@ export const createActions = context => {
     // If the server doesn't reply with a valid error, assume that the source
     // of the error is the focused cell's column
     if (!error?.json?.validationErrors && errorString) {
-      const { field: focusedColumn } = splitRowId(get(focusedCellId))
+      const { field: focusedColumn } = parseCellID(get(focusedCellId))
       if (focusedColumn) {
         error = {
           json: {
@@ -246,7 +246,7 @@ export const createActions = context => {
         }
         // Set error against the cell
         validation.actions.setError(
-          combineRowId(rowId, column),
+          getCellID(rowId, column),
           Helpers.capitalise(err)
         )
         // Ensure the column is visible
@@ -266,7 +266,7 @@ export const createActions = context => {
 
       // Focus the first cell with an error
       if (erroredColumns.length) {
-        focusedCellId.set(combineRowId(rowId, erroredColumns[0]))
+        focusedCellId.set(getCellID(rowId, erroredColumns[0]))
       }
     } else {
       get(notifications).error(errorString || "An unknown error occurred")
@@ -572,10 +572,10 @@ export const initialise = context => {
       return
     }
     // Stop if we changed row
-    const split = splitRowId(id)
+    const split = parseCellID(id)
     const oldRowId = split.id
     const oldColumn = split.field
-    const { id: newRowId } = splitRowId(get(focusedCellId))
+    const { id: newRowId } = parseCellID(get(focusedCellId))
     if (oldRowId !== newRowId) {
       return
     }
diff --git a/packages/frontend-core/src/components/grid/stores/scroll.js b/packages/frontend-core/src/components/grid/stores/scroll.js
index 94b0b574a9..b071c1fc38 100644
--- a/packages/frontend-core/src/components/grid/stores/scroll.js
+++ b/packages/frontend-core/src/components/grid/stores/scroll.js
@@ -1,7 +1,7 @@
 import { writable, derived, get } from "svelte/store"
 import { tick } from "svelte"
 import { Padding, GutterWidth, FocusedCellMinOffset } from "../lib/constants"
-import { splitRowId } from "../lib/utils"
+import { parseCellID } from "../lib/utils"
 
 export const createStores = () => {
   const scroll = writable({
@@ -177,7 +177,7 @@ export const initialise = context => {
     // Ensure horizontal position is viewable
     // Check horizontal position of columns next
     const $visibleColumns = get(visibleColumns)
-    const { field: columnName } = splitRowId($focusedCellId)
+    const { field: columnName } = parseCellID($focusedCellId)
     const column = $visibleColumns.find(col => col.name === columnName)
     if (!column) {
       return
diff --git a/packages/frontend-core/src/components/grid/stores/ui.js b/packages/frontend-core/src/components/grid/stores/ui.js
index a492f67702..8bc295cb74 100644
--- a/packages/frontend-core/src/components/grid/stores/ui.js
+++ b/packages/frontend-core/src/components/grid/stores/ui.js
@@ -7,7 +7,7 @@ import {
   MediumRowHeight,
   NewRowID,
 } from "../lib/constants"
-import { splitRowId } from "../lib/utils"
+import { parseCellID } from "../lib/utils"
 
 export const createStores = context => {
   const { props } = context
@@ -26,7 +26,7 @@ export const createStores = context => {
   const focusedRowId = derived(
     focusedCellId,
     $focusedCellId => {
-      return splitRowId($focusedCellId)?.id
+      return parseCellID($focusedCellId)?.id
     },
     null
   )
@@ -73,7 +73,7 @@ export const deriveStores = context => {
   const focusedRow = derived(
     [focusedCellId, rowLookupMap, rows],
     ([$focusedCellId, $rowLookupMap, $rows]) => {
-      const rowId = splitRowId($focusedCellId)?.id
+      const rowId = parseCellID($focusedCellId)?.id
 
       // Edge case for new rows
       if (rowId === NewRowID) {
@@ -153,7 +153,7 @@ export const initialise = context => {
     const hasRow = rows.actions.hasRow
 
     // Check selected cell
-    const selectedRowId = splitRowId($focusedCellId)?.id
+    const selectedRowId = parseCellID($focusedCellId)?.id
     if (selectedRowId && !hasRow(selectedRowId)) {
       focusedCellId.set(null)
     }
diff --git a/packages/frontend-core/src/components/grid/stores/validation.js b/packages/frontend-core/src/components/grid/stores/validation.js
index 85082a1162..34efde9180 100644
--- a/packages/frontend-core/src/components/grid/stores/validation.js
+++ b/packages/frontend-core/src/components/grid/stores/validation.js
@@ -1,5 +1,5 @@
 import { writable, get, derived } from "svelte/store"
-import { combineRowId, splitRowId } from "../lib/utils"
+import { getCellID, parseCellID } from "../lib/utils"
 
 // Normally we would break out actions into the explicit "createActions"
 // function, but for validation all these actions are pure so can go into
@@ -13,7 +13,7 @@ export const createStores = () => {
     Object.entries($validation).forEach(([key, error]) => {
       // Extract row ID from all errored cell IDs
       if (error) {
-        map[splitRowId(key).id] = true
+        map[parseCellID(key).id] = true
       }
     })
     return map
@@ -54,10 +54,10 @@ export const initialise = context => {
       const $stickyColumn = get(stickyColumn)
       validation.update(state => {
         $columns.forEach(column => {
-          state[combineRowId(id, column.name)] = null
+          state[getCellID(id, column.name)] = null
         })
         if ($stickyColumn) {
-          state[combineRowId(id, stickyColumn.name)] = null
+          state[getCellID(id, stickyColumn.name)] = null
         }
         return state
       })