Feat: Initialize the data pipeline canvas. #9869 (#9870)

### What problem does this PR solve?
Feat: Initialize the data pipeline canvas. #9869

### Type of change


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

web/src/pages/data-flow/canvas/node/handle-icon.tsx

@@ -0,0 +1,20 @@
+import { PlusOutlined } from '@ant-design/icons';
+import { CSSProperties } from 'react';
+
+export const HandleIcon = () => {
+  return (
+    <PlusOutlined
+      style={{ fontSize: 6, color: 'white', position: 'absolute', zIndex: 10 }}
+    />
+  );
+};
+
+export const RightHandleStyle: CSSProperties = {
+  right: 0,
+};
+
+export const LeftHandleStyle: CSSProperties = {
+  left: 0,
+};
+
+export default HandleIcon;