[WIP] Reactflow migration

[sumengwang]

[WIP] Reactflow migration

Description

The major development has been finished. The main reactflow component is located at Canvas/index.tsx, then injected into the angular template my-dag.html since it's reusing some of the methods from my-dag-ctrl.html. Then the PluginNode.tsx is responsible for displaying the nodes under different situations (preview, studio, deployed mode, etc.)

my-dag.html
|    Canvas/index.tsx
     |    PluginNode.tsx  

Here are the completed features:

• [x] pipeline nodes and connections
• [x] node metadata (name, version, icon)
• [x] link property config form
• [x] multiple selection box (behavior changes, require pressing shift)
• [x] zoom in, zoom out, fit view, align nodes
• [x] redo & undo
• [x] copy, paste & delete
• [x] add plugin comments & pipeline comments
• [x] plugin & pipeline context menu
• [x] preview mode metrics
• [x] pipeline run metrics
• [x] existing import, duplicate, edit, export all work

Pending tasks are:

• [ ] dependency fix (blocker). Waiting for webpack v5 build migration
• [ ] ensure tests pass (blocker)
• [ ] code refactor
• [ ] styles improvement

PR Type

• [ ] Bug Fix
• [x] Feature
• [ ] Build Fix
• [ ] Testing
• [ ] General Improvement
• [ ] Cherry Pick