Group by custom cell component losing the custom component

[ofirrifo]

Describe the bug

When I group by custom cell component it lose the custom component and it just show value.

To Reproduce

Take a look on the example There is custom cell that represent colors and once I group by this column I lose the custom cell component and just see the value

Link to code example: example

Expected behavior

Environment

• react-data-grid ^7.0.0-beta.36:
• react/react-dom 18.2.0:

Additional context

[RahulARanger]

you can try the renderGroupCell prop in columns. once you group by cell, grouped column will have grouped cell.

in your src.App.tsx you can add these lines (for example)

export function ColorGroupedCell(props: any) {
  return (
    <div style={{ backgroundColor: props.childRows[0].color }}>{props.childRows[0].color}</div>
  );
}

export const columns: Column<Row>[] = [
  { key: 'id', name: 'ID', sortable: true },
  { key: 'name', name: 'name' },
  { key: 'color', name: 'color', renderCell: ColorCell , renderGroupCell: ColorGroupedCell},
];