GitLab Next

This issue to extend the nesting visualization and interaction by allowing drag and drop functionality on the tree view, allowing users to reorder epics and issues in the tree.

Note: this issue must ship with https://gitlab.com/gitlab-org/gitlab-ee/issues/10795 because we would be removing functionality without the ability to drag/drop. Drag/drop currently exists today in issue/epic lists and the tree view replaces it.

Continuation of &644 to have drag and drop.

Designs

• As soon as an item is in a dragging state, a banner appears fixed at the bottom of the screen
• A user can continue to drag items into whichever state they'd like; and the banner persists the entire time
• If user is unhappy with the changes they made (or made some mistakes) they can click Discard changes and the ordering will remain in the original state
• If user clicks Save changes, the new order will be saved
• The batch comment/MR review banner can be reused here (styling should be the same)

• Drag and drop should follow interaction we currently have for issue boards (dragging an item displays a sort of shadow, and other items shift up and down depending on where that shadow is
• If an issue or epic is hovered over another epic (user wants to place issues/epics within another epic) that epic should have a highlighted state (background-color: $blue-50;, border-color: $blue-200;)

• If an issue or epic is dragged into an epic that already has the maximum number of descendants, a toast should appear

Iteration 1

In the scope of this issue we will support only ordering within the same object type (See https://gitlab.com/gitlab-org/gitlab-ee/issues/9367#note_198844678). After every move in the UI there will be a request to backend and the state will be saved (see https://gitlab.com/gitlab-org/gitlab-ee/issues/9367#note_191270033)