feat: generate uuid with human-id #918 (#1111)

### What problem does this PR solve?

feat: generate uuid with human-id #918

### Type of change


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

web/package-lock.json

@@ -19,6 +19,7 @@
         "dayjs": "^1.11.10",
         "elkjs": "^0.9.3",
         "eventsource-parser": "^1.1.2",
+        "human-id": "^4.1.1",
         "i18next": "^23.7.16",
         "i18next-browser-languagedetector": "^8.0.0",
         "js-base64": "^3.7.5",
@@ -13379,6 +13380,14 @@
         "node": ">= 6"
       }
     },
+    "node_modules/human-id": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmmirror.com/human-id/-/human-id-4.1.1.tgz",
+      "integrity": "sha512-3gKm/gCSUipeLsRYZbbdA1BD83lBoWUkZ7G9VFrhWPAU76KwYo5KR8V28bpoPm/ygy0x5/GCbpRQdY7VLYCoIg==",
+      "bin": {
+        "human-id": "dist/cli.js"
+      }
+    },
     "node_modules/human-signals": {
       "version": "2.1.0",
       "resolved": "https://registry.npmmirror.com/human-signals/-/human-signals-2.1.0.tgz",

web/package.json

@@ -24,6 +24,7 @@
     "dayjs": "^1.11.10",
     "elkjs": "^0.9.3",
     "eventsource-parser": "^1.1.2",
+    "human-id": "^4.1.1",
     "i18next": "^23.7.16",
     "i18next-browser-languagedetector": "^8.0.0",
     "js-base64": "^3.7.5",

web/src/pages/flow/chat/drawer.tsx

@@ -11,7 +11,7 @@ const ChatDrawer = ({ visible, hideModal }: IModalProps<any>) => {
       open={visible}
       getContainer={false}
       width={470}
-      zIndex={10000}
+      // zIndex={10000}
     >
       <FlowChatBox></FlowChatBox>
     </Drawer>

web/src/pages/flow/hooks.ts

@@ -15,9 +15,9 @@ import React, {
   useState,
 } from 'react';
 import { Node, Position, ReactFlowInstance } from 'reactflow';
-import { v4 as uuidv4 } from 'uuid';
 // import { shallow } from 'zustand/shallow';
 import { useDebounceEffect } from 'ahooks';
+import { humanId } from 'human-id';
 import { useParams } from 'umi';
 import useGraphStore, { RFState } from './store';
 import { buildDslComponentsByGraph } from './utils';
@@ -79,7 +79,7 @@ export const useHandleDrop = () => {
         y: event.clientY,
       });
       const newNode = {
-        id: uuidv4(),
+        id: `${type}:${humanId()}`,
         type: 'textUpdater',
         position: position || {
           x: 0,