feat: add CategorizeHandle #918 (#1282)

### What problem does this PR solve?

feat: add CategorizeHandle #918

### Type of change


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

web/src/pages/flow/store.ts

@@ -34,10 +34,12 @@ export type RFState = {
   onSelectionChange: OnSelectionChangeFunc;
   addNode: (nodes: Node) => void;
   getNode: (id: string) => Node | undefined;
+  addEdge: (connection: Connection) => void;
   duplicateNode: (id: string) => void;
   deleteEdge: () => void;
   deleteEdgeById: (id: string) => void;
   deleteNodeById: (id: string) => void;
+  deleteEdgeBySourceAndTarget: (source: string, target: string) => void;
   findNodeByName: (operatorName: Operator) => Node | undefined;
   findNodeById: (id: string) => Node | undefined;
 };
@@ -83,6 +85,14 @@ const useGraphStore = create<RFState>()(
       getNode: (id: string) => {
         return get().nodes.find((x) => x.id === id);
       },
+      addEdge: (connection: Connection) => {
+        set({
+          edges: addEdge(connection, get().edges),
+        });
+      },
+      // addOnlyOneEdgeBetweenTwoNodes: (connection: Connection) => {
+
+      // },
       duplicateNode: (id: string) => {
         const { getNode, addNode } = get();
         const node = getNode(id);
@@ -114,6 +124,14 @@ const useGraphStore = create<RFState>()(
           edges: edges.filter((edge) => edge.id !== id),
         });
       },
+      deleteEdgeBySourceAndTarget: (source: string, target: string) => {
+        const { edges } = get();
+        set({
+          edges: edges.filter(
+            (edge) => edge.target !== target && edge.source !== source,
+          ),
+        });
+      },
       deleteNodeById: (id: string) => {
         const { nodes, edges } = get();
         set({