feat: add custom edge (#1061)

### What problem does this PR solve?
feat: add custom edge
feat: add flow card
feat: add store for canvas
#918 

### Type of change

- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/flow/canvas/node/index.tsx

@@ -1,3 +1,4 @@
+import classNames from 'classnames';
 import { Handle, NodeProps, Position } from 'reactflow';
 
 import styles from './index.less';
@@ -5,19 +6,30 @@ import styles from './index.less';
 export function TextUpdaterNode({
   data,
   isConnectable = true,
+  selected,
 }: NodeProps<{ label: string }>) {
   return (
-    <div className={styles.textUpdaterNode}>
+    <div
+      className={classNames(styles.textUpdaterNode, {
+        [styles.selectedNode]: selected,
+      })}
+    >
       <Handle
         type="target"
         position={Position.Left}
         isConnectable={isConnectable}
-      />
+        className={styles.handle}
+      >
+        {/* <PlusCircleOutlined style={{ fontSize: 10 }} /> */}
+      </Handle>
       <Handle
         type="source"
         position={Position.Right}
         isConnectable={isConnectable}
-      />
+        className={styles.handle}
+      >
+        {/* <PlusCircleOutlined style={{ fontSize: 10 }} /> */}
+      </Handle>
       <div>{data.label}</div>
     </div>
   );