how can I get the expand level in ag-grid?

Question

I'm using AgGrid React with Row Grouping and SSRM. I want to update the header in the Group column that AG Grid creates For example let's say my (4) columns are named A B C & D. I would like the header to display A when nothing is expanded A->B when first level is expanded and so on. The tricky parts:

• when the group is collapsed from the first level, because when you reopen it, it remembers the other nested levels opened (I want to keep this feature)
• when more groups are expanded & collapsed

Looking for a solution within ag-grid, not React state. Any help will be appreciated

Will try to create a plunker later. (sorry for no code example)

I did not find any help in their docs on this topic. I've tried making use of onRowGroupOpened, api.getGridOption('autoGroupColumnDef') but except the current level, which is kind of wrong because it is related to the triggered level event (expand/collapse)

What I would like to know is if it is possible to get the "real" level at update time. So when I open first level it would be 1 When I open second level it would be 2, and so on. Then if I collapse directly to 0, it would be 0. Then if I expand back to 1, it would be actually 2, because I never collapsed that.

Answer 1

To have the header contain dynamic text, I would recommend using a custom Header Component. You set a Header Component for the Auto Group Column using autoGroupColumnDef.headerComponent, creating a Header Component is covered here: https://ag-grid.com/react-data-grid/column-headers/

Secondly to register for group open/closed, listen for the grid event rowGroupOpened

Answer 2

found what I needed - it was in the grid state api.getState().rowGroupExpansion?.expandedRowGroupIds this lets me know the current expanded rows, and their "depths"