Dragging rows in a group creates rows without IDs and causes issues

[christian-konrad]

Describe the Bug

Dragging rows in a group creates rows without IDs and causes issues.

• On drag, it behaves strange, sometimes cloning the row
• It results in rows without IDs
• Moving the component out of the group and deleting the group, the component is deleted as well
  • Still visible in the editor, but already removed in the preview

Steps to Reproduce

See:

Bildschirmaufnahme.2023-10-21.um.10.36.40.mov

Expected Behavior

Environment

• Host (Browser/Node version), if applicable: [e.g. MS Edge 18, Chrome 69, Node 10 LTS]
• OS: [e.g. Windows 7]
• Library version: [e.g. 2.0.0]

[pinussilvestrus]

Thanks for reporting, that is really cumbersome! Moving this to ready so we follow up, soon!

[pinussilvestrus]

Thanks for reporting. Seems like our layout updater is not working properly (missing rows set). I will investigate.

[pinussilvestrus]

I looked a bit deeper and discovered that rendering issues only (or mostly?) occur for text views. The layout is rendered correctly, but the groups containing the dragged row with a text view disappear for some reason.

[pinussilvestrus]

Interestingly, the fields are still visible in the preact tree, but, for some reason, not rendered in the demo.

Also, the broken behavior is not visible in the Dynamic Lists branch (#808) where we changed some things in the rendering of a group. Let's evaluate this bug once we have dynamic list merged and before we release the next version.

[pinussilvestrus]

We pick up this again to prevent row: null from happening in the first place (cf. https://github.com/camunda/tasklist/issues/3752).

While moving fields, there might be no targetRow as we are on to create a new one. We should avoid that by creating a new row id already on move, similar we do that on create:

 row: targetRow ? targetRow.id : this._formLayouter.nextRowId()