Reorderable columns, with dynamic columns - example required.

[StephenDye1977]

Hi,

This is more my issue than a problem with the control. I'm a complete newby to React and Typescript and have found this control and the examples to be excellent. However, I have been going round in circles with an issue I am really struggling to solve.

Basically Users of my grid can choose their own columns to display using a panel to the right of the grid. This fires off a useMemo hook, to generate the columns and assign them to the columns array for the grid. However once these columns have been added, the users would like to reorder them without having to re-pick them.

I have been following the columnsreordering example, which has static/fixed columns, and can see how the memo works to update the column state.

The problem I have is that when I reorder the columns, the columns do not reorder. This is because I can't put the columns into a state variable, as they are generated in the memo. Is there an example that could be put together to show me how to do this please?

I can share my code offline if required.

Thanks

Steve

[emsi-iggy]

If i remember coorrectly to reorder columns and have them reordered u need to change something in the column property (just one is enough) E. g.
(Assuming there is always at least one column)

let newColumns =[...columns];
let firstColumn = [...newColumns[0]];
firstColumn.tmp = !firstColumn.tmp;
newColumns[0] = firstColumn;

Instead of picking always first column, you can add one additional column just for that purpose (e.g. at the beginning of columns array) and just dont display it (adding if statement in the column getter)

[amanmahajan7]

Changing this to a discussion