Drag-drop nested tree with collapsable form with CodeMirror in Angular 6

Angular 6 Project We need a workflow tree just as shown in the video demonstration, it should have drag drop nodes in which we can indent other nodes if certain criteria is matched. Each node in the tree contains a collapsable form, inside which there are dropdowns, text areas and text fields. All of these elements are CodeMirror instances, which need to be the same, as look the same as shown in the video. Also please note that there is a sequence number, next to each element of the tree, please ensure that you persist that sequence number, even if you change the order of the elements of the tree by dragging and dropping. Please ensure to create those drag-drop data pills shown in the video exactly as they are, and highlight them as shown in the video. Functionalities such as delete a node from the tree should be present as stated in the video. Video Link: [login to view URL] Please note: 1. Create everything using JSON data structure, and no hardcoded HTML elements in the DOM. 2. The UI Should be exactly the same as shown in the video. 3. I will award bonus if you write very clean and scalable code.