Fix drag and drop panels in rows #663
Conversation
mdvictor
added
patch
| // after sorting by position, the row should have the children in the correct order [a,b] | ||
| const row = layout.state.children[0] as SceneGridRow; | ||
|
|
||
| expect(row.state.children[0].state.key).toEqual('a'); |
There was a problem hiding this comment.
Should we test here the grid position too? It would help to understand the expected result :)
There was a problem hiding this comment.
Indeed it wouldn't hurt. This test is mainly to showcase and verify rearrangement in the children array, but will add those too to be more explicit.
| const targetRow = target.clone({ children: [...target.state.children, newChild] }); | ||
| const targetRow = target.clone(); | ||
| targetRow.setState({ children: [...targetRow.state.children, newChild] }); |
There was a problem hiding this comment.
Out of curiosity: Why this is different? Do we do something when updating the state that we don't do on creation?
There was a problem hiding this comment.
The problem is that we spread the old uncloned children, that have a parent( the target), with ...target.state.children instead of setting it's state with the cloned ones. Using those children threw a child already has a parent warning
|
🚀 PR was released in |
This fixes panel positioning glitching when drag/dropping a panel into a row.
There were 2 issues:
toggleRowthefirstPanelYPoshere would be wrongly selected becausesortChildrenByPositionwould not sort row children also, thus causing a glitch.Fixes grafana/grafana#83292
📦 Published PR as canary version:
4.1.1--canary.663.8521906375.0✨ Test out this PR locally via:
npm install @grafana/scenes@4.1.1--canary.663.8521906375.0 # or yarn add @grafana/scenes@4.1.1--canary.663.8521906375.0