[BUG][Grid] Grid with empty grouping and selection causes scroll issue

[InaGlushkova]

I'm submitting a...

Bug report

Current behavior

When we have a selection available and we add grouping=[{}] the scroll moves to the top.

Expected behavior

When we have a selection available and we add grouping=[{}] we should stay at the newly selected item.

Minimal reproduction of the problem with instructions

1. Open the following Stackblitz EXAMPLE
2. Scroll
3. Select a row
4. The scroll moves to the top, and the row stays selected

Reported in ticket ID: 1667668

[evanron]

Just to be clear, this bug is evident for any grouping, grouping heirachy, and as demonstrated - the simplisit incarnation of the bug is to add a plain "empty group" to the grid.

Note - In the above bug, the prop's name grouping is a typo, the actual prop for the grid is group as far as I know.

<Grid group={[]} ...

Thank you, Evan

[ivanchev]

Hello,

We are using a useMemo internally in the grid to reset the scroll position and some other related properties, when some of the grid props (like group, sort, filter etc.) are changed. This is the cause of the issue here, since passing an empty array to the prop is treated as a new instance each time (which it is), and the memo triggers and clears up the internal state.

In order to properly pass a group and persist the value you should use a state variable, like so:

    const [group] = React.useState([]);

    <Grid
        group={group}
        ...