diff --git a/packages/frontend-core/src/components/grid/lib/renderers.js b/packages/frontend-core/src/components/grid/lib/renderers.ts
similarity index 82%
rename from packages/frontend-core/src/components/grid/lib/renderers.js
rename to packages/frontend-core/src/components/grid/lib/renderers.ts
index a860d01b53..b009806cc4 100644
--- a/packages/frontend-core/src/components/grid/lib/renderers.js
+++ b/packages/frontend-core/src/components/grid/lib/renderers.ts
@@ -1,4 +1,4 @@
-import { FieldType } from "@budibase/types"
+import { FieldType, UIColumn } from "@budibase/types"
 
 import OptionsCell from "../cells/OptionsCell.svelte"
 import DateCell from "../cells/DateCell.svelte"
@@ -40,13 +40,23 @@ const TypeComponentMap = {
   // Custom types for UI only
   role: RoleCell,
 }
-export const getCellRenderer = column => {
+
+function getCellRendererByType(type: FieldType | "role" | undefined) {
+  if (!type) {
+    return
+  }
+
+  return TypeComponentMap[type as keyof typeof TypeComponentMap]
+}
+
+export const getCellRenderer = (column: UIColumn) => {
   if (column.calculationType) {
     return NumberCell
   }
+
   return (
-    TypeComponentMap[column?.schema?.cellRenderType] ||
-    TypeComponentMap[column?.schema?.type] ||
+    getCellRendererByType(column.schema?.cellRenderType) ||
+    getCellRendererByType(column.schema?.type) ||
     TextCell
   )
 }
diff --git a/packages/types/src/ui/stores/grid/columns.ts b/packages/types/src/ui/stores/grid/columns.ts
index 7f20145246..2517d2a3e0 100644
--- a/packages/types/src/ui/stores/grid/columns.ts
+++ b/packages/types/src/ui/stores/grid/columns.ts
@@ -14,6 +14,7 @@ export type UIColumn = FieldSchema & {
     type: FieldType
     readonly: boolean
     autocolumn: boolean
+    cellRenderType?: FieldType | "role"
   }
   calculationType: CalculationType
   __idx: number