diff --git a/webapp/packages/plugin-ag-grid/src/AgGridTable/AgGridTableController.ts b/webapp/packages/plugin-ag-grid/src/AgGridTable/AgGridTableController.ts
index 14cee6fe0c..c7f48a8990 100644
--- a/webapp/packages/plugin-ag-grid/src/AgGridTable/AgGridTableController.ts
+++ b/webapp/packages/plugin-ag-grid/src/AgGridTable/AgGridTableController.ts
@@ -16,6 +16,7 @@ import {
   ValueGetterParams,
   GridOptions,
   CellEditingStoppedEvent,
+  CellClassParams,
 } from 'ag-grid-community';
 import { SortChangedEvent } from 'ag-grid-community/dist/lib/events';
 import { computed, observable } from 'mobx';
@@ -303,16 +304,18 @@ function mapDataToColumns(columns?: IAgGridCol[]): ColDef[] {
           return getObjectValue(params);
         }
 
-        const value = params.data[params.colDef.field || 'node.id'];
-        if (typeof value === 'string' && value.length > 1000) {
-          return value.split('').map(v => (v.charCodeAt(0) < 32 ? ' ' : v)).join('');
-        }
-
-        return value;
+        return params.data[params.colDef.field || 'node.id'];
       },
       headerComponentParams: {
         icon: v.icon,
       },
+      cellRenderer: (params: CellClassParams) => {
+        if (typeof params.value === 'string' && params.value.length > 1000) {
+          return params.value.split('').map(v => (v.charCodeAt(0) < 32 ? ' ' : v)).join('');
+        }
+
+        return params.value;
+      },
       cellClass: (params: any) => {
         const context: AgGridContext = params.context;
         if (context.isCellEdited(params.node.rowIndex, params.colDef.colId)) {