Design widget - Allow user to reorder designs through drag & drop
Summary
This issue is to add re-ordering support for designs within the work items design management widget through the use of drag and drop.
Acceptance criteria
Dragging/reordering design images
-
Only users who have Reporter+ access to the work item should be able to reorder designs. -
The hover state should be used for items that are being dragged ( gray-400
border andtext-underline
) -
Reorder images based on our drag and drop library, where moving items before/after other items transitions the order (see legacy version) -
If an image is dragged outside of the design widget, return it to it's previous state before the drag was initiated (i.e. cancel the reorder action)
After items have been reordered
-
Ensure that the new ordering is saved for the design widget - The order should be preserved when refreshing the page or navigating away and back.
- This includes opening a design (the overlay) and returning.
BONUS
-
I noticed we now allow keyboard focus on the individual design items within the widget (which is a great improvement from legacy where it only allowed focus on the internal elements), and it would be great if we could support re-ordering using they arrow keys when a design item is focused. I'm guessing this may be best accounted for in a follow-up issue, but figured I would include this just in case it is something we can consider with this.
Resources
Edited by Anastasia Khomchenko