KevinVandy/material-react-table

React Material Table v2-> columnVisibility attribute accepts wrong type in initialState

speedywpm opened this issue · 0 comments

material-react-table version

v2.13.1

react & react-dom versions

React v18.3.3 & React-Dom v18.3.0

Describe the bug and the steps to reproduce it

Using React Typescript.
The bug is in parameters the useMaterialReactTable takes in, explicitly columnVisibility attribute:

const table = useMaterialReactTable({ columns, data, initialState: { columnVisibility: undefined, }, });

On hover of columnVisibility we can see that it takes in such datatypes (property) columnVisibility?: VisibilityState | undefined

VisibilityState OR undefined.

Let's give it undefined, yes the table works perfectly, but with one exception Column Actions button will crash the whole table.

image

Click on dots below green highlighted arrows:
image
image

Workaround is: we set {} instead of undefined
image

Overall I came around this bug when my colleague decided it would be a great idea to set columnVisibility directly from an optional prop which can be undefined, and this did break the table, hence the columnVisibility takes in undefined as a value.

Minimal, Reproducible Example - (Optional, but Recommended)

I have reproduced this issue in StackBlitz, file: TS.tsx, lines 105 and 106, one of which is commented, one is not.
Uncommented line currently breaks the table as it should.
Commented line works.

https://stackblitz.com/edit/github-udeni6?file=src%2FTS.tsx

Launch the box and when the table will load up click on
image

Screenshots or Videos (Optional)

No response

Do you intend to try to help solve this bug with your own PR?

No, because I do not have time to dig into it

Terms

  • I understand that if my bug cannot be reliably reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.