I am working on a web app that provides a visual programming environment to generate 3D models - Mobius
It involves creating a scripts by adding lines of coding and just editing parameters. We are using angular-tree-component to generate a tree to represent the code structure, like in the image below
The lines of code are draggable - but as the tree becomes bigger - dragging and dropping becomes cumbersome. Hence, we were thinking of adding a cut-paste functionality with which the user can select and cut lines of code and paste them somewhere else.
What would be the most user-friendly way of implementing this functionality?
Adding Ctrl+X, Ctrl+V shortcuts are one way - but I am not sure if it would be discoverable, given that this feature didn't exist before. What microinteractions should I be taking care of in this case?
Is there a better way to implement this other than keyboard shortcuts? Each line has a set of buttons that are visible when the line is focussed. Not sure if adding another button to that is a good idea?