fix: Use references to renderers instead of inline functions (#2584)

In order to be able to check if a column has a default renderer, we need them to be exposed constants instead of inline functions.

src/publicUtils.js

@@ -6,8 +6,11 @@ export const actions = {
   init: 'init',
 }
 
+export const defaultRenderer = ({ value = '' }) => value;
+export const emptyRenderer = () => <>&nbsp;</>;
+
 export const defaultColumn = {
-  Cell: ({ value = '' }) => value,
+  Cell: defaultRenderer,
   width: 150,
   minWidth: 0,
   maxWidth: Number.MAX_SAFE_INTEGER,

src/utils.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { defaultColumn } from './publicUtils'
+import { defaultColumn, emptyRenderer } from './publicUtils'
 
 // Find the depth of the columns
 export function findMaxDepth(columns, depth = 0) {
@@ -71,8 +71,8 @@ export function decorateColumn(column, userDefaultColumn) {
   }
   Object.assign(column, {
     // Make sure there is a fallback header, just in case
-    Header: () => <>&nbsp;</>,
-    Footer: () => <>&nbsp;</>,
+    Header: emptyRenderer,
+    Footer: emptyRenderer,
     ...defaultColumn,
     ...userDefaultColumn,
     ...column,