[v8] Determine if column has custom Cell render

[mcongrove]

Hey all,

I'm trying to determine if a column has a custom cell render defined. For instance, in the code below, I want to know that firstName is just the default renderer while lastName is wrapped in a custom component I've made.

The goal here is to determine firstName isn't wrapped and needs some default styling, i.e. padding.

const CustomComponent = (children: React.ReactNode) => (
	<span className="padding-10 text-red bg-blue">
		{children}
	</span>
);

const columns = [
	columnHelper.accessor("firstName", {
		header: () => "First Name"
	}),
	columnHelper.accessor("lastName", {
		header: () => "Last Name",
		cell: (info) => <CustomComponent>{info.getValue()}</CustomComponent>
	})
];

return (
	...
	<td>
		{flexRender(
			cell.column.columnDef.cell,
			cell.getContext()
		)}
	</td>
	...
);

What I'd like to do is something akin to:

return (
	...
	<td className={cell.column.columnDef.IS_CUSTOM_RENDER ? 'padding-10' : ''}>
		{flexRender(
			cell.column.columnDef.cell,
			cell.getContext()
		)}
	</td>
	...
);

Note: The above is dummy code so forgive any little nits.

[evbo]

@mcongrove There is a way to accomplish this but it is a tad bit error prone:

Option 1: You can store data, such as a boolean, in ColumnDef.meta, but now you need to ensure meta accurately reflects the cell render, which could lead to bugs:

table/packages/table-core/src/types.ts

Line 202 in c5cf4e7

meta?: ColumnMeta<TData, TValue>

Option 2:
If instead your ColumnDef.cell could control the className styling, then you can also store in ColumnDef.meta (if fixed) or (if dynamic/changes between renders) even just define a function/Dictionary, Int => Object, that takes a Column id and outputs additional custom Context based on the column id to render. Then, your ColumnDef.cell would receive Props including what you just merged and so it would be responsible for determining what gets rendered - in doing so the two would never fall out of sync and there'd be much lesser chance of bugs. However, you'd need to re-architect it so that cell did the conditional rendering - not like you're currently doing.

That said, I think a huge opportunity for improvement exists by having ColumnDef support specifying custom Context such that it is enforced by the type of Props in ColumnDef.cell and updated on each render (so they don't fall out of sync) as well as a Boolean reference whether cell ever got defined to serve your use-case.