fix(plugin-data-spreadsheet): CB-419 special null cells displaying

webapp/packages/plugin-data-spreadsheet/src/AgGridTable/AgGridTableController.ts

@@ -230,7 +230,7 @@ export class AgGridTableController implements IInitializableController, IDestruc
   }
 
   private cloneRows(rows: AgGridRow[]): AgGridRow[] {
-    return rows.map(row => [...row].map(v => (v === null ? '' : v))); // TODO: temporary fix dbeaver-corp/dbeaver-web#663
+    return rows.map(row => [...row]);
   }
 }
 
@@ -291,14 +291,22 @@ function mapDataToColumns(columns?: IAgGridCol[]): ColDef[] {
           return params.value.split('').map(v => (v.charCodeAt(0) < 32 ? ' ' : v)).join('');
         }
 
+        if (params.value === 'null') {
+          return '[null]';
+        }
+
         return params.value;
       },
       cellClass: (params: any) => {
+        const classes: string[] = [];
         const context: AgGridContext = params.context;
         if (context.isCellEdited(params.node.rowIndex, params.colDef.colId)) {
-          return 'cell-edited';
+          classes.push('cell-edited');
         }
-        return '';
+        if (params.value === 'null') {
+          classes.push('cell-null');
+        }
+        return classes.join(' ');
       },
     })),
   ];

webapp/packages/plugin-data-spreadsheet/src/styles/themes/_base-ag-grid.scss

@@ -43,6 +43,11 @@
         background-color: #ff99006b;
       }
 
+      .cell-null > :global(span) {
+        text-transform: uppercase;
+        opacity: 0.65;
+      }
+
       .ag-row.ag-row-hover {
         background-color: transparent;
         @include stripes-background($mdc-theme-secondary);