How to format table head cell individually (cells with labels)?

Hey everyone,

Using mui-datatables 2.0.0-beta.59 and I’m wondering: is there a way to format the table head cells individually (the label cells)?

Use case: I want to left-align the content of certain columns and right-align others. I can do that because I can display JSX in the table cells. But then the column title is out of alignment with the content.

I can only specify column labels as text. If I use JSX as a label, the app crashes if I click on the table head cell (might have to do something with the sorting arrow being added at that time).

Any solution? Thanks!

[zeeshansafdar48]

@dandrei Thanks. I really need this.

[dandrei]

Turns out it was really easy to do:

customHeadRender: (o, updateDirection) => {
    return <th onClick={() => updateDirection(o.index)} style={{fontWeight: 400, cursor: "pointer"}}>
        {o.label}
        <TableSortLabel active={o.sortDirection !== null} direction={o.sortDirection || "asc"}/>
    </th>;
}