From 3d2a50e1e9de4a6b2110dd3191817727e84e7346 Mon Sep 17 00:00:00 2001
From: Kai Rohwer <rohwer.kai@icloud.com>
Date: Thu, 14 Dec 2023 10:56:33 +0100
Subject: [PATCH] Convert process modals to RSC + refactor

---
 .../components/process-copy.tsx               |  66 ----
 .../components/process-creation-button.tsx    |  48 ++-
 .../components/process-creation.tsx           | 334 ------------------
 .../components/process-edit-button.tsx        |  57 +--
 .../components/process-import.tsx             |  35 +-
 .../components/process-list.tsx               |  16 +-
 .../components/process-modal.tsx              | 193 ++++++----
 .../components/processes.tsx                  |  29 +-
 .../components/version-toolbar.tsx            |  50 ++-
 .../lib/data/processes.ts                     |  84 -----
 .../lib/data/processes.tsx                    | 149 ++++++++
 .../lib/helpers/processHelpers.ts             |  31 ++
 src/management-system-v2/lib/user-error.ts    |  37 ++
 src/management-system-v2/package.json         |   2 +-
 yarn.lock                                     | 269 +++++++-------
 15 files changed, 609 insertions(+), 791 deletions(-)
 delete mode 100644 src/management-system-v2/components/process-copy.tsx
 delete mode 100644 src/management-system-v2/components/process-creation.tsx
 delete mode 100644 src/management-system-v2/lib/data/processes.ts
 create mode 100644 src/management-system-v2/lib/data/processes.tsx
 create mode 100644 src/management-system-v2/lib/user-error.ts

diff --git a/src/management-system-v2/components/process-copy.tsx b/src/management-system-v2/components/process-copy.tsx
deleted file mode 100644
index 1f1994920..000000000
--- a/src/management-system-v2/components/process-copy.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import { Dispatch, FC, Key, SetStateAction, useMemo } from 'react';
-
-import ProcessCreationModal from './process-creation';
-import { useGetAsset } from '@/lib/fetch-data';
-
-import { generateDefinitionsId } from '@proceed/bpmn-helper';
-
-type ProcessCopyModalType = {
-  onClose: () => void;
-  open: boolean;
-  processKeys: React.Key[] | String[];
-  setSelection: Dispatch<SetStateAction<Key[]>>;
-};
-
-const ProcessCopyModal: FC<ProcessCopyModalType> = ({
-  onClose,
-  open,
-  processKeys,
-  setSelection,
-}) => {
-  const { data } = useGetAsset('/process', {
-    params: {
-      query: { noBpmn: false },
-    },
-  });
-
-  // get the process data that is needed to create copies of the processes
-  const blueprintForProcesses = useMemo(() => {
-    return (data || [])
-      .filter((process) => processKeys.includes(process.definitionId))
-      .map((process) => ({
-        definitionId: generateDefinitionsId(),
-        definitionName: `${process.definitionName} (Copy)`,
-        description: process.description,
-        bpmn: process.bpmn!,
-        originalId: process.definitionId,
-      }));
-    /* 
-    Do not include data as dependency
-    The Blue-Print should only be determined by the processKeys
-    */
-  }, [processKeys]);
-
-  // change the selection from the processes to be copied to the newly created process copies
-  const handleCopyCreated = (definitionId: string) => {
-    const blueprint = blueprintForProcesses.find((bp) => bp.definitionId === definitionId);
-    if (blueprint) {
-      setSelection((prev) => [
-        ...prev.filter((definitionId) => definitionId !== blueprint.originalId),
-        definitionId,
-      ]);
-    }
-  };
-
-  return (
-    <ProcessCreationModal
-      processesData={open ? blueprintForProcesses : []}
-      creationType="Copy"
-      title={`Copy Process${processKeys.length > 1 ? 'es' : ''}`}
-      onCancel={onClose}
-      onCreated={handleCopyCreated}
-    ></ProcessCreationModal>
-  );
-};
-
-export default ProcessCopyModal;
diff --git a/src/management-system-v2/components/process-creation-button.tsx b/src/management-system-v2/components/process-creation-button.tsx
index 559c7619e..ab13c6e3e 100644
--- a/src/management-system-v2/components/process-creation-button.tsx
+++ b/src/management-system-v2/components/process-creation-button.tsx
@@ -1,42 +1,43 @@
 'use client';
 
-import React, { ReactNode, useState, useTransition } from 'react';
+import React, { ReactNode, useState } from 'react';
 import { Button } from 'antd';
 import type { ButtonProps } from 'antd';
 import ProcessModal from './process-modal';
-import { createProcess } from '@/lib/helpers/processHelpers';
-import { addProcess } from '@/lib/data/processes';
+import { addProcesses } from '@/lib/data/processes';
 import { useRouter } from 'next/navigation';
 
 type ProcessCreationButtonProps = ButtonProps & {
-  createProcess?: (values: { name: string; description?: string }) => any;
+  customAction?: (values: { definitionName: string; description: string }) => Promise<any>;
   wrapperElement?: ReactNode;
 };
 
 /**
  *
  * Button to create Processes including a Modal for inserting needed values. Alternatively, a custom wrapper element can be used instead of a button.
- * Custom function for creation of process using inserted values can be applied
  */
 const ProcessCreationButton: React.FC<ProcessCreationButtonProps> = ({
-  createProcess: customCreateProcess,
   wrapperElement,
+  customAction,
   ...props
 }) => {
   const [isProcessModalOpen, setIsProcessModalOpen] = useState(false);
-  const [isPending, startTransition] = useTransition();
   const router = useRouter();
 
-  const createNewProcess = async (values: { name: string; description?: string }) => {
-    const { metaInfo, bpmn } = await createProcess(values);
-    startTransition(async () => {
-      try {
-        await addProcess({ bpmn: bpmn, departments: [] });
-      } catch (error) {
-        console.error(error);
-      }
+  const createNewProcess = async (values: { definitionName: string; description: string }[]) => {
+    // Invoke the custom handler otherwise use the default server action.
+    const process = await (customAction?.(values[0]) ??
+      addProcesses(values).then((res) => (Array.isArray(res) ? res[0] : res)));
+    if (process && 'error' in process) {
+      return process;
+    }
+    setIsProcessModalOpen(false);
+
+    if (process && 'definitionId' in process) {
+      router.push(`/processes/${process.definitionId}`);
+    } else {
       router.refresh();
-    });
+    }
   };
 
   return (
@@ -58,15 +59,12 @@ const ProcessCreationButton: React.FC<ProcessCreationButtonProps> = ({
         ></Button>
       )}
       <ProcessModal
-        close={(values) => {
-          setIsProcessModalOpen(false);
-
-          if (values) {
-            customCreateProcess ? customCreateProcess(values) : createNewProcess(values);
-          }
-        }}
-        show={isProcessModalOpen}
-      ></ProcessModal>
+        open={isProcessModalOpen}
+        title="Create Process"
+        okText="Create"
+        onCancel={() => setIsProcessModalOpen(false)}
+        onSubmit={createNewProcess}
+      />
     </>
   );
 };
diff --git a/src/management-system-v2/components/process-creation.tsx b/src/management-system-v2/components/process-creation.tsx
deleted file mode 100644
index 4ee230638..000000000
--- a/src/management-system-v2/components/process-creation.tsx
+++ /dev/null
@@ -1,334 +0,0 @@
-import React, { Key, useEffect, useMemo, useState } from 'react';
-
-import { produce } from 'immer';
-
-import {
-  Modal,
-  Button,
-  Tooltip,
-  Switch,
-  Checkbox,
-  Collapse,
-  Spin,
-  CollapseProps,
-  Input,
-} from 'antd';
-import TextArea from 'antd/es/input/TextArea';
-import { LoadingOutlined } from '@ant-design/icons';
-
-import styles from './process-creation.module.scss';
-
-import { useUserPreferences } from '@/lib/user-preferences';
-
-import {
-  toBpmnObject,
-  toBpmnXml,
-  setDefinitionsId,
-  setDefinitionsName,
-  setDefinitionsVersionInformation,
-  setTargetNamespace,
-  addDocumentation,
-  getDefinitionsId,
-} from '@proceed/bpmn-helper';
-import { asyncForEach } from '@/lib/helpers/javascriptHelpers';
-import { useGetAsset, usePostAsset } from '@/lib/fetch-data';
-
-export type ProcessData = {
-  definitionId: string;
-  definitionName: string;
-  description: string;
-  bpmn: string;
-};
-
-type ProcessDataOverwrite = {
-  definitionName?: string;
-  description?: string;
-  successful?: boolean;
-  failed?: boolean;
-};
-
-type ProcessCreationProps = {
-  creationType: string;
-  title: string;
-  processesData: ProcessData[];
-  onCancel: () => void;
-  onCreated?: (definitionId: string) => void;
-};
-
-// TODO: check the validity of the process data and maybe show hints if data is missing
-
-const ProcessCreationModal: React.FC<ProcessCreationProps> = ({
-  creationType,
-  title,
-  processesData,
-  onCancel,
-  onCreated,
-}) => {
-  const [loading, setLoading] = useState(false);
-
-  // the data that is overwritten by the user before the processes are created (e.g. the user wants a different definition name that provided in the processesData)
-  const [dataChanges, setDataChanges] = useState<{ [definitionId: string]: ProcessDataOverwrite }>(
-    {},
-  );
-
-  const { refetch: refreshData } = useGetAsset('/process', {
-    params: {
-      query: { noBpmn: true },
-    },
-  });
-
-  const { mutateAsync: addProcess } = usePostAsset('/process', {
-    onError: async (error, variables) => {
-      const id = (await getDefinitionsId(variables.body.bpmn)) as string;
-      setDataChanges(
-        produce((draft) => {
-          if (draft[id]) draft[id].failed = true;
-          else draft[id] = { failed: true };
-        }),
-      );
-    },
-    onSuccess: (data) => {
-      if (onCreated) onCreated(data.definitionId as string);
-
-      setDataChanges(
-        produce((draft) => {
-          if (draft[data.definitionId as string]) {
-            draft[data.definitionId as string].successful = true;
-          } else {
-            draft[data.definitionId as string] = { successful: true };
-          }
-        }),
-      );
-    },
-  });
-
-  const numSuccesses = useMemo(() => {
-    return Object.values(dataChanges).reduce((acc, { successful }) => {
-      if (successful) return acc + 1;
-      else return acc;
-    }, 0);
-  }, [dataChanges]);
-
-  const numFails = useMemo(() => {
-    return Object.values(dataChanges).reduce((acc, { failed }) => {
-      if (failed) return acc + 1;
-      else return acc;
-    }, 0);
-  }, [dataChanges]);
-
-  const handleCancel = () => {
-    setDataChanges({});
-    onCancel();
-  };
-
-  useEffect(() => {
-    /* All done */
-    if (processesData.length && numSuccesses + numFails === processesData.length) {
-      setLoading(false);
-
-      /* All Successful */
-      if (numSuccesses === processesData.length) {
-        setTimeout(() => {
-          handleCancel();
-          refreshData();
-        }, 2_000);
-      }
-    }
-  }, [dataChanges, processesData, refreshData]);
-
-  const addPreferences = useUserPreferences.use.addPreferences();
-  const isAccordion = useUserPreferences(
-    (store) => store.preferences[`${creationType.toLowerCase()}-modal-accordion`],
-  ) as boolean;
-
-  const getFinalBpmn = async ({ definitionId, definitionName, description, bpmn }: ProcessData) => {
-    // write the necessary meta info into the bpmn to create the final bpmn that is sent to the backend
-    const bpmnObj = await toBpmnObject(bpmn);
-    await setDefinitionsId(bpmnObj, definitionId);
-    await setDefinitionsName(bpmnObj, dataChanges[definitionId]?.definitionName || definitionName);
-    await addDocumentation(bpmnObj, dataChanges[definitionId]?.description || description);
-    await setTargetNamespace(bpmnObj, definitionId);
-
-    await setDefinitionsVersionInformation(bpmnObj, {
-      version: undefined,
-      versionName: undefined,
-      versionDescription: undefined,
-      versionBasedOn: undefined,
-    });
-
-    return await toBpmnXml(bpmnObj);
-  };
-
-  const handleSubmit = () => {
-    setLoading(true);
-
-    asyncForEach(processesData, async (processData) => {
-      // only (re-)submit processes that were not yet submitted succesfully
-      if (dataChanges[processData.definitionId]?.successful) return;
-      // remove potential failed flags from previous runs
-      setDataChanges(
-        produce((draft) => {
-          if (draft[processData.definitionId]) draft[processData.definitionId].failed = false;
-        }),
-      );
-
-      const bpmn = await getFinalBpmn(processData);
-
-      addProcess({
-        body: {
-          bpmn,
-          departments: [],
-          variables: [],
-        },
-      });
-    });
-  };
-
-  // create the ui that allows users to change some of the meta data (e.g. definitionName,description) of the process
-  const items: CollapseProps['items'] = processesData.map(
-    ({ definitionId, definitionName, description }) => {
-      /* Initial */
-      return {
-        key: definitionId,
-        label: <span className={styles.ClippedProcessTitle}>{definitionName}</span>,
-        children: (
-          <>
-            <h5>
-              <b>Process-Name:</b>
-            </h5>
-            <Input
-              placeholder="Give your process a name"
-              required
-              value={dataChanges[definitionId]?.definitionName ?? definitionName}
-              onChange={(e) => {
-                setDataChanges({
-                  ...dataChanges,
-                  [definitionId]: {
-                    ...(dataChanges[definitionId] || {}),
-                    definitionName: e.target.value,
-                  },
-                });
-              }}
-            />
-            <h5 style={{ marginTop: '8px' }}>
-              <b>Process-Description:</b>
-            </h5>
-
-            <TextArea
-              rows={4}
-              placeholder="Add a description here"
-              value={dataChanges[definitionId]?.description ?? description}
-              onChange={(e) => {
-                setDataChanges({
-                  ...dataChanges,
-                  [definitionId]: {
-                    ...(dataChanges[definitionId] || {}),
-                    description: e.target.value,
-                  },
-                });
-              }}
-            />
-          </>
-        ),
-      };
-    },
-  );
-
-  return (
-    <>
-      <Modal
-        width={600}
-        title={
-          <div style={{ display: 'flex' }}>
-            <span>{title}</span>
-            <div style={{ flex: 19 }}></div>
-            <Tooltip
-              placement="left"
-              title={
-                <>
-                  <div>Auto-Close: Only one panel open</div>
-                  <div>Keep-Open: Close panels manually</div>
-                </>
-              }
-            >
-              <Switch
-                checkedChildren="Auto-Close"
-                unCheckedChildren="Keep-Open"
-                checked={isAccordion}
-                onChange={(checked) => {
-                  addPreferences({ [`${creationType.toLowerCase()}-modal-accordion`]: checked });
-                }}
-              />
-            </Tooltip>
-            <div style={{ flex: 1 }}></div>
-          </div>
-        }
-        centered
-        open={processesData.length > 0}
-        onCancel={handleCancel}
-        footer={[
-          <Tooltip
-            key={`tooltip-${creationType}-modal`}
-            placement="top"
-            title={<>{`${creationType}`} processes without editing</>}
-          >
-            <Checkbox
-              key="checkbox"
-              className={styles.Checkbox}
-              onChange={(e) => {
-                addPreferences({ [`${creationType.toLowerCase()}-ask-before`]: !e.target.checked });
-              }}
-            >
-              Don&apos;t show again
-            </Checkbox>
-          </Tooltip>,
-          <span style={{ display: 'inline-block', width: '34%' }} key={'filler'}></span>,
-          <Button loading={loading} key="back" onClick={handleCancel}>
-            Cancel
-          </Button>,
-          <Button key="submit" type="primary" loading={loading} onClick={handleSubmit}>
-            {numFails ? 'Retry' : 'Ok'}
-          </Button>,
-        ]}
-      >
-        {!numSuccesses && !numFails && !loading ? (
-          // before submit => show the different processes to create with the option to edit some meta data
-          <Collapse
-            style={{ maxHeight: '60vh', overflowY: 'scroll' }}
-            accordion={isAccordion}
-            items={items}
-          ></Collapse>
-        ) : (
-          // after submit => show a list of processes with symbols showing the state of their creation
-          <ul>
-            {processesData.map(({ definitionId, definitionName }) => {
-              let symbol = '';
-              let indicator = null;
-
-              if (dataChanges[definitionId]?.successful) {
-                symbol = '✔';
-              } else if (dataChanges[definitionId]?.failed) {
-                symbol = '✖';
-              } else if (loading) {
-                indicator = <Spin indicator={<LoadingOutlined style={{ fontSize: 24 }} spin />} />;
-              }
-
-              return (
-                <li key={definitionId as Key}>
-                  {symbol}
-                  {indicator}
-                  <span className={styles.ClippedProcessTitle}>
-                    {' '}
-                    {dataChanges[definitionId]?.definitionName || definitionName}
-                  </span>
-                </li>
-              );
-            })}
-          </ul>
-        )}
-      </Modal>
-    </>
-  );
-};
-
-export default ProcessCreationModal;
diff --git a/src/management-system-v2/components/process-edit-button.tsx b/src/management-system-v2/components/process-edit-button.tsx
index 7ced90fb5..a46a50372 100644
--- a/src/management-system-v2/components/process-edit-button.tsx
+++ b/src/management-system-v2/components/process-edit-button.tsx
@@ -1,17 +1,17 @@
 'use client';
 
-import React, { ReactNode, useState, useTransition } from 'react';
+import React, { ReactNode, useMemo, useState } from 'react';
 
 import { Button } from 'antd';
 import type { ButtonProps } from 'antd';
 import ProcessModal from './process-modal';
-import { useGetAsset, usePutAsset } from '@/lib/fetch-data';
 import { updateProcess } from '@/lib/data/processes';
+import { useRouter } from 'next/navigation';
+import { ProcessListProcess } from './processes';
 
 type ProcessEditButtonProps = ButtonProps & {
-  process: { definitionId: string; description: string; definitionName: string };
+  process: ProcessListProcess;
   wrapperElement?: ReactNode;
-  onEdited?: () => any;
 };
 
 /**
@@ -20,18 +20,20 @@ type ProcessEditButtonProps = ButtonProps & {
 const ProcessEditButton: React.FC<ProcessEditButtonProps> = ({
   process,
   wrapperElement,
-  onEdited,
   ...props
 }) => {
   const [isProcessModalOpen, setIsProcessModalOpen] = useState(false);
-  const [isPending, startTransition] = useTransition();
-
-  const editProcess = async (values: { name: string; description?: string }) => {
-    startTransition(async () => {
-      await updateProcess(process.definitionId, undefined, values.description, values.name);
-      onEdited && onEdited();
-    });
-  };
+  const router = useRouter();
+  const data = useMemo(
+    () => [
+      {
+        ...process,
+        definitionName: process.definitionName.value,
+        description: process.description.value,
+      },
+    ],
+    [process],
+  );
 
   return (
     <>
@@ -52,19 +54,26 @@ const ProcessEditButton: React.FC<ProcessEditButtonProps> = ({
         ></Button>
       )}
       <ProcessModal
-        initialProcessData={{
-          name: process.definitionName,
-          description: process.description,
-        }}
-        close={(values) => {
-          setIsProcessModalOpen(false);
-
-          if (values) {
-            editProcess(values);
+        open={isProcessModalOpen}
+        title="Edit Process"
+        initialData={data}
+        okText="Save"
+        onCancel={() => setIsProcessModalOpen(false)}
+        onSubmit={async (values) => {
+          const res = await updateProcess(
+            process.definitionId,
+            undefined,
+            values[0].description,
+            values[0].definitionName,
+          );
+          // Let modal handle errors
+          if ('error' in res) {
+            return res;
           }
+          setIsProcessModalOpen(false);
+          router.refresh();
         }}
-        show={isProcessModalOpen}
-      ></ProcessModal>
+      />
     </>
   );
 };
diff --git a/src/management-system-v2/components/process-import.tsx b/src/management-system-v2/components/process-import.tsx
index 37e72d3f0..06e738ef2 100644
--- a/src/management-system-v2/components/process-import.tsx
+++ b/src/management-system-v2/components/process-import.tsx
@@ -3,7 +3,6 @@
 import React, { useState } from 'react';
 
 import { Upload } from 'antd';
-import ProcessCreationModal, { ProcessData } from './process-creation';
 
 import {
   getDefinitionsId,
@@ -11,11 +10,21 @@ import {
   getProcessDocumentation,
   toBpmnObject,
 } from '@proceed/bpmn-helper';
+import ProcessModal from './process-modal';
+import { addProcesses } from '@/lib/data/processes';
+import { useRouter } from 'next/navigation';
+
+export type ProcessData = {
+  definitionName: string;
+  description: string;
+  bpmn: string;
+};
 
 // TODO: maybe show import errors and warnings like in the old MS (e.g. id collisions if an existing process is reimported or two imports use the same id)
 
 const ProcessImportButton: React.FC = () => {
   const [importProcessData, setImportProcessData] = useState<ProcessData[]>([]);
+  const router = useRouter();
 
   return (
     <>
@@ -23,8 +32,8 @@ const ProcessImportButton: React.FC = () => {
         accept=".bpmn"
         multiple
         showUploadList={false}
-        beforeUpload={(_, fileList) => {
-          Promise.all(
+        beforeUpload={async (_, fileList) => {
+          const processesData = await Promise.all(
             fileList.map(async (file) => {
               // get the bpmn from the file and then extract relevant process meta data from the bpmn
               const bpmn = await file.text();
@@ -32,23 +41,33 @@ const ProcessImportButton: React.FC = () => {
               const bpmnObj = await toBpmnObject(bpmn);
 
               return {
-                definitionId: (await getDefinitionsId(bpmnObj)) || '',
                 definitionName: (await getDefinitionsName(bpmnObj)) || '',
                 description: await getProcessDocumentation(bpmn),
                 bpmn,
               };
             }),
-          ).then((processesData) => setImportProcessData(processesData));
+          );
+          setImportProcessData(processesData);
           return false;
         }}
       >
         <span>Import Process</span>
       </Upload>
-      <ProcessCreationModal
-        processesData={importProcessData}
-        creationType="Import"
+      <ProcessModal
+        open={importProcessData.length > 0}
         title={`Import Process${importProcessData.length > 1 ? 'es' : ''}`}
+        okText="Import"
         onCancel={() => setImportProcessData([])}
+        onSubmit={async (processesData) => {
+          const res = await addProcesses(processesData);
+          // Let modal handle errors
+          if ('error' in res) {
+            return res;
+          }
+          setImportProcessData([]);
+          router.refresh();
+        }}
+        initialData={importProcessData}
       />
     </>
   );
diff --git a/src/management-system-v2/components/process-list.tsx b/src/management-system-v2/components/process-list.tsx
index 46bfce94a..b1e8742e1 100644
--- a/src/management-system-v2/components/process-list.tsx
+++ b/src/management-system-v2/components/process-list.tsx
@@ -31,7 +31,6 @@ import ProcessEditButton from './process-edit-button';
 import { toCaslResource } from '@/lib/ability/caslAbility';
 import { useDeleteAsset, useInvalidateAsset, usePostAsset } from '@/lib/fetch-data';
 import { useUserPreferences } from '@/lib/user-preferences';
-import ProcessDeleteSingleModal from './process-delete-single';
 import { useAbilityStore } from '@/lib/abilityStore';
 import { AuthCan } from '@/components/auth-can';
 import { ProcessListProcess } from './processes';
@@ -113,7 +112,11 @@ const ProcessList: FC<ProcessListProps> = ({
               onClick={() => {
                 createProcess({
                   body: {
-                    ...record,
+                    ...{
+                      ...record,
+                      description: record.description.value,
+                      definitionName: record.definitionName.value,
+                    },
                     bpmn: record.bpmn || '',
                     variables: [
                       {
@@ -135,19 +138,12 @@ const ProcessList: FC<ProcessListProps> = ({
           </Tooltip>
           <AuthCan resource={toCaslResource('Process', record)} action="update">
             <ProcessEditButton
-              process={{
-                definitionId: record.definitionId,
-                description: record.description.value,
-                definitionName: record.definitionName.value,
-              }}
+              process={record}
               wrapperElement={
                 <Tooltip placement="top" title={'Edit'}>
                   <EditOutlined />
                 </Tooltip>
               }
-              onEdited={() => {
-                router.refresh();
-              }}
             />
           </AuthCan>
           {ability.can('delete', 'Process') && (
diff --git a/src/management-system-v2/components/process-modal.tsx b/src/management-system-v2/components/process-modal.tsx
index 768e303f5..b2392a9fb 100644
--- a/src/management-system-v2/components/process-modal.tsx
+++ b/src/management-system-v2/components/process-modal.tsx
@@ -1,97 +1,136 @@
 'use client';
 
 import React, { useState } from 'react';
+import { Modal, Form, Input, App, Collapse, CollapseProps, Typography } from 'antd';
+import { UserError } from '@/lib/user-error';
 
-import { Button, Modal, Form, Input } from 'antd';
-
-type ProcessModalProps = {
-  show: boolean;
-  close: (values?: { name: string; description?: string }) => void;
-  initialProcessData?: { name?: string; description?: string };
+type ProcessModalProps<T extends { definitionName: string; description: string }> = {
+  open: boolean;
+  title: string;
+  okText?: string;
+  onCancel: () => void;
+  onSubmit: (values: T[]) => Promise<{ error?: UserError } | void>;
+  initialData?: T[];
 };
-const ProcessModal: React.FC<ProcessModalProps> = ({ show, close, initialProcessData }) => {
-  const [submittable, setSubmittable] = useState(false);
-  const [form] = Form.useForm();
-
-  // Watch all values
-  const values = Form.useWatch([], form);
-
-  React.useEffect(() => {
-    form.setFieldsValue(initialProcessData);
-  }, [form, initialProcessData]);
 
-  React.useEffect(() => {
-    // Only allow to submit in modal if any of the values was changed
-    const initialFieldValuesModified =
-      form.isFieldsTouched() &&
-      (form.getFieldValue('name') !== initialProcessData?.name ||
-        form.getFieldValue('description') !== initialProcessData?.description);
+const ProcessModal = <T extends { definitionName: string; description: string }>({
+  open,
+  title,
+  okText,
+  onCancel,
+  onSubmit,
+  initialData,
+}: ProcessModalProps<T>) => {
+  const [form] = Form.useForm();
+  const [submitting, setSubmitting] = useState(false);
+  const { message } = App.useApp();
 
-    if (initialFieldValuesModified) {
-      form.validateFields({ validateOnly: true }).then(
-        () => {
-          setSubmittable(true);
-        },
-        () => {
-          setSubmittable(false);
-        },
-      );
-    } else {
-      setSubmittable(false);
+  /*useEffect(() => {
+    if (open) {
+      // form.resetFields is not working, because initialData has not been
+      // updated in the internal form store, eventhough the prop has.
+      //form.setFieldsValue(initialData);
     }
-  }, [form, initialProcessData, values]);
+  }, [form, open]);*/
+
+  const items: CollapseProps['items'] =
+    (initialData?.length ?? 0) > 1
+      ? initialData?.map((data, index) => ({
+          label: data.definitionName,
+          children: <ProcessInputs index={index} />,
+        }))
+      : undefined;
 
   return (
     <Modal
-      title={initialProcessData ? 'Edit Process' : 'Create new Process'}
-      open={show}
+      title={title}
+      open={open}
+      width={600}
+      centered
       onCancel={() => {
-        close();
-        form.resetFields();
+        onCancel();
+      }}
+      // IMPORTANT: This prevents a modal being stored for every row in the
+      // table.
+      destroyOnClose
+      okButtonProps={{ loading: submitting }}
+      okText={okText}
+      wrapProps={{ onDoubleClick: (e: MouseEvent) => e.stopPropagation() }}
+      onOk={async () => {
+        try {
+          // form.validateFields() only contains field values (that have been
+          // rendered), so we have to merge with initalData. If you only open
+          // the third accordion item, the object would look like this:
+          // { 2: { definitionName: 'test', description: 'test' } }
+          const values = Object.entries(await form.validateFields()) as any[];
+          const mergedValues = (initialData ?? [{}]).map((value, index) => ({
+            ...value,
+            ...values.find(([key]) => key === index.toString())?.[1],
+          }));
+
+          // Let the parent of this modal handle the submission.
+          setSubmitting(true);
+          try {
+            const res = await onSubmit(mergedValues);
+            if (res?.error) {
+              // UserError was thrown by the server
+              message.open({ type: 'error', content: res.error.message });
+            }
+          } catch (e) {
+            // Unkown server error or was not sent from server (e.g. network error)
+            message.open({
+              type: 'error',
+              content: 'Someting went wrong while submitting the data',
+            });
+          }
+          setSubmitting(false);
+        } catch (info) {
+          // Validate Failed
+        }
       }}
-      footer={[
-        <Button
-          key="cancel"
-          onClick={() => {
-            close();
-            form.resetFields();
-          }}
-        >
-          Cancel
-        </Button>,
-        <Button
-          key="submit"
-          type="primary"
-          htmlType="submit"
-          disabled={!submittable}
-          onClick={() => {
-            close(values);
-            form.resetFields();
-          }}
-        >
-          {initialProcessData ? 'Edit Process' : 'Create Process'}
-        </Button>,
-      ]}
     >
-      <Form form={form} name="name" wrapperCol={{ span: 24 }} autoComplete="off">
-        <Form.Item
-          name="name"
-          initialValue={initialProcessData?.name}
-          rules={[{ required: true, message: 'Please input the Process Name!' }]}
-        >
-          <Input placeholder="Process Name" />
-        </Form.Item>
-        <Form.Item name="description" initialValue={initialProcessData?.description}>
-          <Input.TextArea
-            showCount
-            maxLength={150}
-            style={{ height: 100 }}
-            placeholder="Process Description"
-          />
-        </Form.Item>
+      <Form
+        form={form}
+        layout="vertical"
+        name="process_form"
+        initialValues={initialData}
+        autoComplete="off"
+        // This resets the fields when the modal is opened again.
+        preserve={false}
+      >
+        {!initialData || initialData.length === 1 ? (
+          <ProcessInputs index={0} />
+        ) : (
+          <Collapse style={{ maxHeight: '60vh', overflowY: 'scroll' }} accordion items={items} />
+        )}
       </Form>
     </Modal>
   );
 };
 
+type ProcessInputsProps = {
+  index: number;
+};
+
+const ProcessInputs = ({ index }: ProcessInputsProps) => {
+  return (
+    <>
+      <Form.Item
+        name={[index, 'definitionName']}
+        label="Process Name"
+        rules={[{ required: true, message: 'Please fill out the Process name' }]}
+      >
+        <Input />
+      </Form.Item>
+      <Form.Item
+        name={[index, 'description']}
+        label="Process Description"
+        rules={[{ required: true, message: 'Please fill out the Process description' }]}
+      >
+        <Input.TextArea showCount rows={4} maxLength={150} />
+      </Form.Item>
+    </>
+  );
+};
+
 export default ProcessModal;
diff --git a/src/management-system-v2/components/processes.tsx b/src/management-system-v2/components/processes.tsx
index 3e3baddbd..769d2289c 100644
--- a/src/management-system-v2/components/processes.tsx
+++ b/src/management-system-v2/components/processes.tsx
@@ -29,11 +29,11 @@ import {
 } from '@proceed/bpmn-helper';
 import ProcessDeleteModal from './process-delete';
 import ProcessDeleteSingleModal from './process-delete-single';
-import ProcessCopyModal from './process-copy';
 import { useAbilityStore } from '@/lib/abilityStore';
 import useFuzySearch, { ReplaceKeysWithHighlighted } from '@/lib/useFuzySearch';
 import { useRouter } from 'next/navigation';
-import { deleteProcesses } from '@/lib/data/processes';
+import { copyProcesses, deleteProcesses } from '@/lib/data/processes';
+import ProcessModal from './process-modal';
 
 type Processes = ApiData<'/process', 'get'>;
 export type ProcessListProcess = ReplaceKeysWithHighlighted<
@@ -327,12 +327,27 @@ const Processes = ({ processes }: ProcessesProps) => {
         setSelection={setSelectedRowKeys}
         open={openDeleteModal && selectedRowKeys.length === 1}
       />
-      <ProcessCopyModal
-        onClose={() => setOpenCopyModal(false)}
-        setSelection={setSelectedRowKeys}
-        processKeys={selectedRowKeys}
+      <ProcessModal
         open={openCopyModal}
-      ></ProcessCopyModal>
+        title={`Copy Process${selectedRowKeys.length > 1 ? 'es' : ''}`}
+        onCancel={() => setOpenCopyModal(false)}
+        initialData={filteredData
+          .filter((process) => selectedRowKeys.includes(process.definitionId))
+          .map((process) => ({
+            definitionName: `${process.definitionName.value} (Copy)`,
+            description: process.description.value,
+            originalId: process.definitionId,
+          }))}
+        onSubmit={async (values) => {
+          const res = await copyProcesses(values);
+          // Errors are handled in the modal.
+          if ('error' in res) {
+            return res;
+          }
+          setOpenCopyModal(false);
+          router.refresh();
+        }}
+      />
     </>
   );
 };
diff --git a/src/management-system-v2/components/version-toolbar.tsx b/src/management-system-v2/components/version-toolbar.tsx
index 772730890..3618107ab 100644
--- a/src/management-system-v2/components/version-toolbar.tsx
+++ b/src/management-system-v2/components/version-toolbar.tsx
@@ -17,19 +17,23 @@ import { Tooltip, Space } from 'antd';
 import { FormOutlined, PlusOutlined } from '@ant-design/icons';
 
 import useModelerStateStore from '@/lib/use-modeler-state-store';
-import { useParams, useRouter } from 'next/navigation';
+import { useParams, useRouter, useSearchParams } from 'next/navigation';
 import { get, del, put, usePostAsset } from '@/lib/fetch-data';
 import { convertToEditableBpmn } from '@/lib/helpers/processVersioning';
 import { asyncForEach, asyncMap } from '@/lib/helpers/javascriptHelpers';
 import ProcessCreationButton from './process-creation-button';
 import { AuthCan } from '@/components/auth-can';
 import ConfirmationButton from './confirmation-button';
+import { copyProcesses } from '@/lib/data/processes';
 
 type VersionToolbarProps = {};
 const VersionToolbar: React.FC<VersionToolbarProps> = () => {
   const router = useRouter();
   const modeler = useModelerStateStore((state) => state.modeler);
   const selectedElementId = useModelerStateStore((state) => state.selectedElementId);
+  const query = useSearchParams();
+  // This component should only be rendered when a version is selected
+  const selectedVersionId = query.get('version') as string;
   const { mutateAsync: postProcess } = usePostAsset('/process');
 
   // const [index, setIndex] = useState(0);
@@ -45,34 +49,6 @@ const VersionToolbar: React.FC<VersionToolbarProps> = () => {
       : elementRegistry.getAll().filter((el) => el.businessObject.$type === 'bpmn:Process')[0];
   }
 
-  const createNewProcess = async (values: { name: string; description?: string }) => {
-    const saveXMLResult = await modeler?.saveXML({ format: true });
-    if (saveXMLResult?.xml) {
-      try {
-        const bpmn = saveXMLResult.xml;
-        const defId = generateDefinitionsId();
-        let newBpmn = await setDefinitionsId(bpmn, defId);
-        newBpmn = await setDefinitionsName(newBpmn, values.name);
-        newBpmn = (await manipulateElementsByTagName(
-          newBpmn,
-          'bpmn:Definitions',
-          (definitions: any) => {
-            delete definitions.version;
-            delete definitions.versionName;
-            delete definitions.versionDescription;
-            delete definitions.versionBasedOn;
-          },
-        )) as string;
-
-        await postProcess({
-          body: { bpmn: newBpmn, departments: [] },
-        });
-      } catch (err) {
-        console.log(err);
-      }
-    }
-  };
-
   const getUsedFileNames = async (bpmn: string) => {
     const userTaskFileNameMapping = await getUserTaskFileNameMapping(bpmn);
 
@@ -173,7 +149,21 @@ const VersionToolbar: React.FC<VersionToolbarProps> = () => {
           <Tooltip title="Create a new Process using this Version">
             <ProcessCreationButton
               icon={<PlusOutlined />}
-              createProcess={createNewProcess}
+              customAction={async (values) => {
+                const result = await copyProcesses([
+                  {
+                    ...values,
+                    originalId: processId as string,
+                    originalVersion: selectedVersionId,
+                  },
+                ]);
+                if (Array.isArray(result)) {
+                  return result[0];
+                } else {
+                  // UserError was thrown by the server
+                  return result;
+                }
+              }}
             ></ProcessCreationButton>
           </Tooltip>
         </AuthCan>
diff --git a/src/management-system-v2/lib/data/processes.ts b/src/management-system-v2/lib/data/processes.ts
deleted file mode 100644
index 8633164a4..000000000
--- a/src/management-system-v2/lib/data/processes.ts
+++ /dev/null
@@ -1,84 +0,0 @@
-'use server';
-
-import { getCurrentUser } from '@/components/auth';
-import { toCaslResource } from '../ability/caslAbility';
-// Workaround because top-level await is not supported in server action modules.
-// The rest of the app can import from process.ts directly, where init is
-// awaited. Since this will always run AFTER init was run and we cache with
-// global, we can ignore init here.
-import {
-  removeProcess,
-  getProcessMetaObjects,
-  toExternalFormat,
-  addProcess as _addProcess,
-  getProcessBpmn,
-  updateProcess as _updateProcess,
-} from './legacy/_process';
-import { addDocumentation, setDefinitionsName } from '@proceed/bpmn-helper';
-
-export const deleteProcesses = async (definitionIds: string[]) => {
-  const processMetaObjects: any = getProcessMetaObjects();
-
-  // Get ability again since it might have changed.
-  const { ability } = await getCurrentUser();
-
-  await Promise.all(
-    definitionIds.map(async (definitionId) => {
-      const process = processMetaObjects[definitionId];
-      if (process && ability.can('delete', toCaslResource('Process', process))) {
-        await removeProcess(definitionId);
-      }
-    }),
-  );
-};
-
-export const addProcess = async (newProcess: any) => {
-  const { ability, session } = await getCurrentUser();
-
-  newProcess.owner = session?.user.id || '';
-
-  if (!ability.can('create', toCaslResource('Process', newProcess))) {
-    throw new Error('Not allowed to create this process');
-  }
-  // bpmn prop gets deleted in addProcess()
-  const { bpmn } = newProcess;
-  const process = await _addProcess(newProcess);
-
-  if (typeof process !== 'object') {
-    throw new Error('A process with this id does already exist');
-  }
-
-  return toExternalFormat({ ...process, bpmn });
-};
-
-export const updateProcess = async (
-  definitionsId: string,
-  bpmn?: string,
-  description?: string,
-  name?: string,
-) => {
-  const { ability } = await getCurrentUser();
-
-  const processMetaObjects: any = getProcessMetaObjects();
-  const process = processMetaObjects[definitionsId];
-
-  if (!process) {
-    throw new Error('A process with this id does not exist.');
-  }
-
-  if (!ability.can('update', toCaslResource('Process', process))) {
-    throw new Error('Forbidden.');
-  }
-
-  // Either replace or update the old BPMN.
-  let newBpmn = bpmn ?? (await getProcessBpmn(definitionsId));
-  if (description !== undefined) {
-    newBpmn = (await addDocumentation(newBpmn, description)) as string;
-  }
-  if (name !== undefined) {
-    newBpmn = (await setDefinitionsName(newBpmn, name)) as string;
-  }
-
-  const newProcessInfo = await _updateProcess(definitionsId, { bpmn: newBpmn });
-  return toExternalFormat({ ...newProcessInfo, bpmn: newBpmn });
-};
diff --git a/src/management-system-v2/lib/data/processes.tsx b/src/management-system-v2/lib/data/processes.tsx
new file mode 100644
index 000000000..8436278a2
--- /dev/null
+++ b/src/management-system-v2/lib/data/processes.tsx
@@ -0,0 +1,149 @@
+'use server';
+
+import { getCurrentUser } from '@/components/auth';
+import { toCaslResource } from '../ability/caslAbility';
+// Workaround because top-level await is not supported in server action modules.
+// The rest of the app can import from process.ts directly, where init is
+// awaited. Since this will always run AFTER init was run and we cache with
+// global, we can ignore init here.
+import {
+  removeProcess,
+  getProcessMetaObjects,
+  toExternalFormat,
+  addProcess as _addProcess,
+  getProcessBpmn,
+  updateProcess as _updateProcess,
+  getProcessVersionBpmn,
+} from './legacy/_process';
+import { addDocumentation, generateDefinitionsId, setDefinitionsName } from '@proceed/bpmn-helper';
+import { createProcess, getFinalBpmn } from '../helpers/processHelpers';
+import { UserErrorType, userError } from '../user-error';
+import { ApiData } from '../fetch-data';
+
+export const deleteProcesses = async (definitionIds: string[]) => {
+  const processMetaObjects: any = getProcessMetaObjects();
+
+  // Get ability again since it might have changed.
+  const { ability } = await getCurrentUser();
+
+  await Promise.all(
+    definitionIds.map(async (definitionId) => {
+      const process = processMetaObjects[definitionId];
+      if (process && ability.can('delete', toCaslResource('Process', process))) {
+        await removeProcess(definitionId);
+      }
+    }),
+  );
+};
+
+export const addProcesses = async (
+  values: { definitionName: string; description: string; bpmn?: string }[],
+) => {
+  const { ability, session } = await getCurrentUser();
+
+  const newProcesses: ApiData<'/process/{definitionId}', 'get'>[] = [];
+
+  for (const value of values) {
+    const { bpmn } = await createProcess({
+      name: value.definitionName,
+      description: value.description,
+      bpmn: value.bpmn,
+    });
+
+    const newProcess = {
+      bpmn,
+      owner: session?.user.id || '',
+    };
+
+    if (!ability.can('create', toCaslResource('Process', newProcess))) {
+      return userError('Not allowed to create this process', UserErrorType.PermissionError);
+    }
+    // bpmn prop gets deleted in addProcess()
+    const process = await _addProcess(newProcess);
+
+    if (typeof process !== 'object') {
+      return userError('A process with this id does already exist');
+    }
+
+    newProcesses.push(toExternalFormat({ ...process, bpmn }));
+  }
+
+  return newProcesses;
+};
+
+export const updateProcess = async (
+  definitionsId: string,
+  bpmn?: string,
+  description?: string,
+  name?: string,
+) => {
+  const { ability } = await getCurrentUser();
+
+  const processMetaObjects: any = getProcessMetaObjects();
+  const process = processMetaObjects[definitionsId];
+
+  if (!process) {
+    return userError('A process with this id does not exist.', UserErrorType.NotFoundError);
+  }
+
+  if (!ability.can('update', toCaslResource('Process', process))) {
+    return userError('Not allowed to update this process', UserErrorType.PermissionError);
+  }
+
+  // Either replace or update the old BPMN.
+  let newBpmn = bpmn ?? (await getProcessBpmn(definitionsId));
+  if (description !== undefined) {
+    newBpmn = (await addDocumentation(newBpmn, description)) as string;
+  }
+  if (name !== undefined) {
+    newBpmn = (await setDefinitionsName(newBpmn, name)) as string;
+  }
+
+  const newProcessInfo = await _updateProcess(definitionsId, { bpmn: newBpmn });
+  return toExternalFormat({ ...newProcessInfo, bpmn: newBpmn });
+};
+
+export const copyProcesses = async (
+  processes: {
+    definitionName: string;
+    description: string;
+    originalId: string;
+    originalVersion?: string;
+  }[],
+) => {
+  const { ability, session } = await getCurrentUser();
+
+  const copiedProcesses: ApiData<'/process/{definitionId}', 'get'>[] = [];
+
+  for (const cpyProcess of processes) {
+    // Copy the original BPMN and update it for the new process.
+    const newId = generateDefinitionsId();
+    // Copy either a process or a specific version.
+    const originalBpmn = cpyProcess.originalVersion
+      ? await getProcessVersionBpmn(cpyProcess.originalId, cpyProcess.originalVersion)
+      : await getProcessBpmn(cpyProcess.originalId);
+
+    // TODO: Does createProcess() do the same as this function?
+    const newBpmn = await getFinalBpmn({ ...cpyProcess, definitionId: newId, bpmn: originalBpmn });
+
+    // TODO: include variables in copy?
+    const newProcess = {
+      owner: session?.user.id || '',
+      definitionId: newId,
+      bpmn: newBpmn,
+    };
+
+    if (!ability.can('create', toCaslResource('Process', newProcess))) {
+      return userError('Not allowed to create this process', UserErrorType.PermissionError);
+    }
+    const process = await _addProcess(newProcess);
+
+    if (typeof process !== 'object') {
+      return userError('A process with this id does already exist');
+    }
+
+    copiedProcesses.push(toExternalFormat({ ...process, bpmn: newBpmn }));
+  }
+
+  return copiedProcesses;
+};
diff --git a/src/management-system-v2/lib/helpers/processHelpers.ts b/src/management-system-v2/lib/helpers/processHelpers.ts
index f67a8cce2..5c0af86bf 100644
--- a/src/management-system-v2/lib/helpers/processHelpers.ts
+++ b/src/management-system-v2/lib/helpers/processHelpers.ts
@@ -1,3 +1,4 @@
+import { ProcessData } from '@/components/process-import';
 import {
   toBpmnObject,
   toBpmnXml,
@@ -17,6 +18,8 @@ import {
   getOriginalDefinitionsId,
   generateProcessId,
   getIdentifyingInfos,
+  addDocumentation,
+  setDefinitionsVersionInformation,
 } from '@proceed/bpmn-helper';
 
 interface ProceedProcess {
@@ -179,3 +182,31 @@ export async function getProcessInfo(bpmn: string) {
 
   return metadata;
 }
+
+export const getFinalBpmn = async ({
+  definitionId,
+  definitionName,
+  description,
+  bpmn,
+}: {
+  definitionId: string;
+  definitionName: string;
+  description: string;
+  bpmn: string;
+}) => {
+  // write the necessary meta info into the bpmn to create the final bpmn that is sent to the backend
+  const bpmnObj = await toBpmnObject(bpmn);
+  await setDefinitionsId(bpmnObj, definitionId);
+  await setDefinitionsName(bpmnObj, definitionName);
+  await addDocumentation(bpmnObj, description);
+  await setTargetNamespace(bpmnObj, definitionId);
+
+  await setDefinitionsVersionInformation(bpmnObj, {
+    version: undefined,
+    versionName: undefined,
+    versionDescription: undefined,
+    versionBasedOn: undefined,
+  });
+
+  return await toBpmnXml(bpmnObj);
+};
diff --git a/src/management-system-v2/lib/user-error.ts b/src/management-system-v2/lib/user-error.ts
new file mode 100644
index 000000000..e77461000
--- /dev/null
+++ b/src/management-system-v2/lib/user-error.ts
@@ -0,0 +1,37 @@
+import { ReactNode } from 'react';
+
+export enum UserErrorType {
+  /** ID already exists, illegal input, malformed input, etc. (default) */
+  ConstraintError = 'ConstraintError',
+  /** User lacks permission to perform this action. */
+  PermissionError = 'PermissionError',
+  /** User is not logged in. */
+  NotLoggedInError = 'NotLoggedInError',
+  /** Resource could not be found. */
+  NotFoundError = 'NotFoundError',
+  /** Resource is locked. */
+  LockedResourceError = 'LockedResourceError',
+}
+
+/**
+ * These are errors that are caused directly by the user's actions and can
+ * potentially be fixed by the user. The message is displayed to the user and
+ * should be as helpful as possible.
+ */
+export interface UserError {
+  message: ReactNode;
+  type: UserErrorType;
+}
+
+/**
+ * Creates a new user error inside an object for server responses.
+ *
+ * @param message The error message to display to the user.
+ * @param type The error type.
+ */
+export const userError = (
+  message: ReactNode,
+  type: UserErrorType = UserErrorType.ConstraintError,
+) => {
+  return { error: { message, type } as UserError };
+};
diff --git a/src/management-system-v2/package.json b/src/management-system-v2/package.json
index 7e5f6c901..313cc6fe7 100644
--- a/src/management-system-v2/package.json
+++ b/src/management-system-v2/package.json
@@ -24,7 +24,7 @@
     "@monaco-editor/react": "^4.5.2",
     "@proceed/bpmn-helper": "1.0.0",
     "@tanstack/react-query": "4.35.7",
-    "antd": "5.10.0",
+    "antd": "5.12.2",
     "bpmn-js": "13.2.0",
     "bpmn-js-differ": "2.0.2",
     "classnames": "2.3.2",
diff --git a/yarn.lock b/yarn.lock
index 759e19243..13a375d3e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -45,16 +45,16 @@
   dependencies:
     "@ctrl/tinycolor" "^3.4.0"
 
-"@ant-design/cssinjs@^1.17.0":
-  version "1.18.0"
-  resolved "https://registry.yarnpkg.com/@ant-design/cssinjs/-/cssinjs-1.18.0.tgz#92701684cab5fc67bb62bc813ec1b4a33258018d"
-  integrity sha512-NXzfnNjJgpn+L6d0cD2cS14Tsqs46Bsua6PwVMlmN+F0OEoa9PhJRwUWmI+HyIrc4cgVZVfQTDpXC0p07Jmglw==
+"@ant-design/cssinjs@^1.18.1":
+  version "1.18.1"
+  resolved "https://registry.yarnpkg.com/@ant-design/cssinjs/-/cssinjs-1.18.1.tgz#ebb0aa28c751ce2203f149554d4a09b2c09174c0"
+  integrity sha512-1JURAPrsjK1GwpqByTq3bJ7nF7lbMKDZpehqeR2n8/IR5O58/W1U4VcOeaw5ZyTHri3tEMcom7dyP2tvxpW54g==
   dependencies:
     "@babel/runtime" "^7.11.1"
     "@emotion/hash" "^0.8.0"
     "@emotion/unitless" "^0.7.5"
     classnames "^2.3.1"
-    csstype "^3.0.10"
+    csstype "3.1.2"
     rc-util "^5.35.0"
     stylis "^4.0.13"
 
@@ -1296,6 +1296,13 @@
   dependencies:
     regenerator-runtime "^0.14.0"
 
+"@babel/runtime@^7.23.4":
+  version "7.23.6"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.6.tgz#c05e610dc228855dc92ef1b53d07389ed8ab521d"
+  integrity sha512-zHd0eUrf5GZoOWVCXp6koAKQTfZV07eit6bGPmJgnZdnSAvvZee6zniW2XMF7Cmc4ISOOnPy3QaSiIJGJkVEDQ==
+  dependencies:
+    regenerator-runtime "^0.14.0"
+
 "@babel/template@^7.22.15", "@babel/template@^7.3.3":
   version "7.22.15"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.22.15.tgz#09576efc3830f0430f4548ef971dde1350ef2f38"
@@ -2168,10 +2175,10 @@
     classnames "^2.3.2"
     rc-util "^5.24.4"
 
-"@rc-component/tour@~1.10.0":
-  version "1.10.0"
-  resolved "https://registry.yarnpkg.com/@rc-component/tour/-/tour-1.10.0.tgz#b05bc327438f1c583439e2d2dcc10ec0530aea19"
-  integrity sha512-voV0BKaTJbewB9LLgAHQ7tAGG7rgDkKQkZo82xw2gIk542hY+o7zwoqdN16oHhIKk7eG/xi+mdXrONT62Dt57A==
+"@rc-component/tour@~1.11.1":
+  version "1.11.1"
+  resolved "https://registry.yarnpkg.com/@rc-component/tour/-/tour-1.11.1.tgz#bb47af908fb6fcaf395402901a1fb505ef8fb1e6"
+  integrity sha512-c9Lw3/oVinj5D64Rsp8aDLOXcgdViE+hq7bj0Qoo8fTuQEh9sSpUw5OZcum943JkjeIE4hLcc5FD4a5ANtMJ4w==
   dependencies:
     "@babel/runtime" "^7.18.0"
     "@rc-component/portal" "^1.0.0-9"
@@ -2179,7 +2186,7 @@
     classnames "^2.3.2"
     rc-util "^5.24.4"
 
-"@rc-component/trigger@^1.17.0", "@rc-component/trigger@^1.18.0", "@rc-component/trigger@^1.3.6", "@rc-component/trigger@^1.5.0", "@rc-component/trigger@^1.7.0":
+"@rc-component/trigger@^1.17.0", "@rc-component/trigger@^1.18.0", "@rc-component/trigger@^1.18.2", "@rc-component/trigger@^1.3.6", "@rc-component/trigger@^1.5.0", "@rc-component/trigger@^1.7.0":
   version "1.18.2"
   resolved "https://registry.yarnpkg.com/@rc-component/trigger/-/trigger-1.18.2.tgz#dc52c4c66fa8aaccaf0710498f2429fc05454e3b"
   integrity sha512-jRLYgFgjLEPq3MvS87fIhcfuywFSRDaDrYw1FLku7Cm4esszvzTbA0JBsyacAyLrK9rF3TiHFcvoEDMzoD3CTA==
@@ -3965,58 +3972,58 @@ ansi-styles@^6.0.0, ansi-styles@^6.1.0:
   resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-6.2.1.tgz#0e62320cf99c21afff3b3012192546aacbfb05c5"
   integrity sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==
 
-antd@5.10.0:
-  version "5.10.0"
-  resolved "https://registry.yarnpkg.com/antd/-/antd-5.10.0.tgz#723660643e308da8342c41a799417f077ff89ec6"
-  integrity sha512-qeyfMhcDK2QeuKaC/OCjNCPrJb+3vrBHvVK2swRHsxJvKFSpRerMCShOn/I3CXogrVJazPMluGhy0FQlcHQ4pw==
+antd@5.12.2:
+  version "5.12.2"
+  resolved "https://registry.yarnpkg.com/antd/-/antd-5.12.2.tgz#85ede9a9ee810c8c77bb8952ddcf4349bdabd29a"
+  integrity sha512-lJ4pdBRboN2Tl5hXTqgxUjGIercB2YIK7Z8fVDushgrJ55RhywJjvcQVnBmuxcSPuWEF2Yu8SNBVAnaV4EqzWA==
   dependencies:
     "@ant-design/colors" "^7.0.0"
-    "@ant-design/cssinjs" "^1.17.0"
+    "@ant-design/cssinjs" "^1.18.1"
     "@ant-design/icons" "^5.2.6"
     "@ant-design/react-slick" "~1.0.2"
-    "@babel/runtime" "^7.18.3"
+    "@babel/runtime" "^7.23.4"
     "@ctrl/tinycolor" "^3.6.1"
     "@rc-component/color-picker" "~1.4.1"
     "@rc-component/mutate-observer" "^1.1.0"
-    "@rc-component/tour" "~1.10.0"
-    "@rc-component/trigger" "^1.17.0"
-    classnames "^2.2.6"
-    copy-to-clipboard "^3.2.0"
+    "@rc-component/tour" "~1.11.1"
+    "@rc-component/trigger" "^1.18.2"
+    classnames "^2.3.2"
+    copy-to-clipboard "^3.3.3"
     dayjs "^1.11.1"
     qrcode.react "^3.1.0"
-    rc-cascader "~3.18.1"
+    rc-cascader "~3.20.0"
     rc-checkbox "~3.1.0"
-    rc-collapse "~3.7.1"
-    rc-dialog "~9.3.3"
+    rc-collapse "~3.7.2"
+    rc-dialog "~9.3.4"
     rc-drawer "~6.5.2"
     rc-dropdown "~4.1.0"
-    rc-field-form "~1.38.2"
-    rc-image "~7.3.1"
-    rc-input "~1.2.1"
-    rc-input-number "~8.1.0"
-    rc-mentions "~2.8.0"
-    rc-menu "~9.12.2"
+    rc-field-form "~1.41.0"
+    rc-image "~7.5.1"
+    rc-input "~1.3.6"
+    rc-input-number "~8.4.0"
+    rc-mentions "~2.9.1"
+    rc-menu "~9.12.4"
     rc-motion "^2.9.0"
-    rc-notification "~5.2.0"
-    rc-pagination "~3.6.1"
-    rc-picker "~3.14.5"
+    rc-notification "~5.3.0"
+    rc-pagination "~4.0.3"
+    rc-picker "~3.14.6"
     rc-progress "~3.5.1"
     rc-rate "~2.12.0"
-    rc-resize-observer "^1.3.1"
+    rc-resize-observer "^1.4.0"
     rc-segmented "~2.2.2"
-    rc-select "~14.9.0"
-    rc-slider "~10.3.0"
+    rc-select "~14.10.0"
+    rc-slider "~10.5.0"
     rc-steps "~6.0.1"
     rc-switch "~4.1.0"
-    rc-table "~7.34.4"
-    rc-tabs "~12.12.1"
-    rc-textarea "~1.4.0"
-    rc-tooltip "~6.1.0"
-    rc-tree "~5.7.12"
-    rc-tree-select "~5.13.0"
+    rc-table "~7.36.0"
+    rc-tabs "~12.14.1"
+    rc-textarea "~1.5.3"
+    rc-tooltip "~6.1.2"
+    rc-tree "~5.8.2"
+    rc-tree-select "~5.15.0"
     rc-upload "~4.3.5"
-    rc-util "^5.37.0"
-    scroll-into-view-if-needed "^3.0.3"
+    rc-util "^5.38.1"
+    scroll-into-view-if-needed "^3.1.0"
     throttle-debounce "^5.0.0"
 
 any-promise@^1.0.0:
@@ -6778,7 +6785,7 @@ copy-descriptor@^0.1.0:
   resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d"
   integrity sha512-XgZ0pFcakEUlbwQEVNg3+QAis1FyTL3Qel9FYy8pSkQqoG3PNoT0bOCQtOXcOkur21r2Eq2kI+IE+gsmAEVlYw==
 
-copy-to-clipboard@^3.2.0:
+copy-to-clipboard@^3.3.3:
   version "3.3.3"
   resolved "https://registry.yarnpkg.com/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz#55ac43a1db8ae639a4bd99511c148cdd1b83a1b0"
   integrity sha512-2KV8NhB5JqC3ky0r9PMCAZKbUHSwtEo4CwCs0KXgruG43gX5PMqDEBbVU4OUzw2MuAWUfsuFmWvEKG5QRfSnJA==
@@ -7233,7 +7240,7 @@ cssstyle@^1.0.0:
   dependencies:
     cssom "0.3.x"
 
-csstype@^3.0.10, csstype@^3.0.2, csstype@^3.1.0:
+csstype@3.1.2, csstype@^3.0.2, csstype@^3.1.0:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.2.tgz#1d4bf9d572f11c14031f0436e1c10bc1f571f50b"
   integrity sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==
@@ -16975,17 +16982,17 @@ raw-body@2.5.2, raw-body@^2.3.3:
     iconv-lite "0.4.24"
     unpipe "1.0.0"
 
-rc-cascader@~3.18.1:
-  version "3.18.1"
-  resolved "https://registry.yarnpkg.com/rc-cascader/-/rc-cascader-3.18.1.tgz#e488e9cd9ace1617e06ee4c8eadf435a11de2d29"
-  integrity sha512-M7Xr5Fs/E87ZGustfObtBYQjsvBCET0UX2JYXB2GmOP+2fsZgjaRGXK+CJBmmWXQ6o4OFinpBQBXG4wJOQ5MEg==
+rc-cascader@~3.20.0:
+  version "3.20.0"
+  resolved "https://registry.yarnpkg.com/rc-cascader/-/rc-cascader-3.20.0.tgz#b270f9d84ed83417ee7309ef5e56e415f1586076"
+  integrity sha512-lkT9EEwOcYdjZ/jvhLoXGzprK1sijT3/Tp4BLxQQcHDZkkOzzwYQC9HgmKoJz0K7CukMfgvO9KqHeBdgE+pELw==
   dependencies:
     "@babel/runtime" "^7.12.5"
     array-tree-filter "^2.1.0"
     classnames "^2.3.1"
-    rc-select "~14.9.0"
-    rc-tree "~5.7.0"
-    rc-util "^5.35.0"
+    rc-select "~14.10.0"
+    rc-tree "~5.8.1"
+    rc-util "^5.37.0"
 
 rc-checkbox@~3.1.0:
   version "3.1.0"
@@ -16996,7 +17003,7 @@ rc-checkbox@~3.1.0:
     classnames "^2.3.2"
     rc-util "^5.25.2"
 
-rc-collapse@~3.7.1:
+rc-collapse@~3.7.2:
   version "3.7.2"
   resolved "https://registry.yarnpkg.com/rc-collapse/-/rc-collapse-3.7.2.tgz#d11538ff9c705a5c988d9a4dfcc051a919692fe3"
   integrity sha512-ZRw6ipDyOnfLFySxAiCMdbHtb5ePAsB9mT17PA6y1mRD/W6KHRaZeb5qK/X9xDV1CqgyxMpzw0VdS74PCcUk4A==
@@ -17006,7 +17013,7 @@ rc-collapse@~3.7.1:
     rc-motion "^2.3.4"
     rc-util "^5.27.0"
 
-rc-dialog@~9.3.3, rc-dialog@~9.3.4:
+rc-dialog@~9.3.4:
   version "9.3.4"
   resolved "https://registry.yarnpkg.com/rc-dialog/-/rc-dialog-9.3.4.tgz#e0decb3d4a0dbe36524a67ed2f8fe2daa4b7b73c"
   integrity sha512-975X3018GhR+EjZFbxA2Z57SX5rnu0G0/OxFgMMvZK4/hQWEm3MHaNvP4wXpxYDoJsp+xUvVW+GB9CMMCm81jA==
@@ -17038,19 +17045,19 @@ rc-dropdown@~4.1.0:
     classnames "^2.2.6"
     rc-util "^5.17.0"
 
-rc-field-form@~1.38.2:
-  version "1.38.2"
-  resolved "https://registry.yarnpkg.com/rc-field-form/-/rc-field-form-1.38.2.tgz#1eafac98eb84d47dc3b55de98ed50751d9852dd2"
-  integrity sha512-O83Oi1qPyEv31Sg+Jwvsj6pXc8uQI2BtIAkURr5lvEYHVggXJhdU/nynK8wY1gbw0qR48k731sN5ON4egRCROA==
+rc-field-form@~1.41.0:
+  version "1.41.0"
+  resolved "https://registry.yarnpkg.com/rc-field-form/-/rc-field-form-1.41.0.tgz#660ed8691fdabbc1e5b1ee6b5e0e4f534b295cf0"
+  integrity sha512-k9AS0wmxfJfusWDP/YXWTpteDNaQ4isJx9UKxx4/e8Dub4spFeZ54/EuN2sYrMRID/+hUznPgVZeg+Gf7XSYCw==
   dependencies:
     "@babel/runtime" "^7.18.0"
     async-validator "^4.1.0"
     rc-util "^5.32.2"
 
-rc-image@~7.3.1:
-  version "7.3.2"
-  resolved "https://registry.yarnpkg.com/rc-image/-/rc-image-7.3.2.tgz#fd92ab9994552d4f42638af0810039d34ad32dba"
-  integrity sha512-ICEF6SWv9YKhDXxy1vrXcmf0TVvEcQWIww5Yg+f+mn7e4oGX7FNP4+FExwMjNO5UHBEuWrigbGhlCgI6yZZ1jg==
+rc-image@~7.5.1:
+  version "7.5.1"
+  resolved "https://registry.yarnpkg.com/rc-image/-/rc-image-7.5.1.tgz#39a93354e14fe3e5eaafd9c9464e8fe3c6c171a0"
+  integrity sha512-Z9loECh92SQp0nSipc0MBuf5+yVC05H/pzC+Nf8xw1BKDFUJzUeehYBjaWlxly8VGBZJcTHYri61Fz9ng1G3Ag==
   dependencies:
     "@babel/runtime" "^7.11.2"
     "@rc-component/portal" "^1.0.2"
@@ -17059,40 +17066,40 @@ rc-image@~7.3.1:
     rc-motion "^2.6.2"
     rc-util "^5.34.1"
 
-rc-input-number@~8.1.0:
-  version "8.1.0"
-  resolved "https://registry.yarnpkg.com/rc-input-number/-/rc-input-number-8.1.0.tgz#c6f304b80d0caa8da948f39a41bf04793bbfd0c1"
-  integrity sha512-bdHgduOxuN0lrhzgPmoKbhRD4GLIzVcddVz972/JHPHr7oLwPX5xDb9w4bXhuMzyT2VzQy7nggRCfH3yAl09oA==
+rc-input-number@~8.4.0:
+  version "8.4.0"
+  resolved "https://registry.yarnpkg.com/rc-input-number/-/rc-input-number-8.4.0.tgz#f0d0caa2ce3a4e37f062556f9cb4c08c8c23322d"
+  integrity sha512-B6rziPOLRmeP7kcS5qbdC5hXvvDHYKV4vUxmahevYx2E6crS2bRi0xLDjhJ0E1HtOWo8rTmaE2EBJAkTCZOLdA==
   dependencies:
     "@babel/runtime" "^7.10.1"
     "@rc-component/mini-decimal" "^1.0.1"
     classnames "^2.2.5"
-    rc-input "~1.2.1"
+    rc-input "~1.3.5"
     rc-util "^5.28.0"
 
-rc-input@~1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/rc-input/-/rc-input-1.2.1.tgz#446843225348d99c78a0967299cb74e385ce8fb0"
-  integrity sha512-nQRmBvEFoGi+SNRDavccZ8ueyhFgmxkWqIt4aDyuNJgUZF12HJKIwDhAafUM7N+g7PyuW9FH3pf3zPHzdiCWbA==
+rc-input@~1.3.5, rc-input@~1.3.6:
+  version "1.3.11"
+  resolved "https://registry.yarnpkg.com/rc-input/-/rc-input-1.3.11.tgz#08f25d6d65b418dc9001e8f36432fe323bde37fa"
+  integrity sha512-jhH7QP5rILanSHCGSUkdoFE5DEtpv8FIseYhuYkOZzUBeiVAiwM3q26YqZ6xBB0QFEZ/yUAgms4xW4iuub3xFQ==
   dependencies:
     "@babel/runtime" "^7.11.1"
     classnames "^2.2.1"
     rc-util "^5.18.1"
 
-rc-mentions@~2.8.0:
-  version "2.8.0"
-  resolved "https://registry.yarnpkg.com/rc-mentions/-/rc-mentions-2.8.0.tgz#e96cdf331e7bf1a8944ee4c6801b13f33d9b70c8"
-  integrity sha512-LBMkO6bSGhEvS1CvMK978qGN82tI+mzk7l/uTiQJH+UDiwpvq+pxK4DxU5b6Q1T5LW6bn2pSua9RaZKZrDoBOw==
+rc-mentions@~2.9.1:
+  version "2.9.1"
+  resolved "https://registry.yarnpkg.com/rc-mentions/-/rc-mentions-2.9.1.tgz#cfe55913fd5bc156ef9814f38c1a2ceefee032ce"
+  integrity sha512-cZuElWr/5Ws0PXx1uxobxfYh4mqUw2FitfabR62YnWgm+WAfDyXZXqZg5DxXW+M1cgVvntrQgDDd9LrihrXzew==
   dependencies:
     "@babel/runtime" "^7.22.5"
     "@rc-component/trigger" "^1.5.0"
     classnames "^2.2.6"
-    rc-input "~1.2.1"
+    rc-input "~1.3.5"
     rc-menu "~9.12.0"
-    rc-textarea "~1.4.0"
+    rc-textarea "~1.5.0"
     rc-util "^5.34.1"
 
-rc-menu@~9.12.0, rc-menu@~9.12.2:
+rc-menu@~9.12.0:
   version "9.12.2"
   resolved "https://registry.yarnpkg.com/rc-menu/-/rc-menu-9.12.2.tgz#1bab34646421224eff5c5b7de993f8ea1238418e"
   integrity sha512-NzloFH2pRUYmQ3S/YbJAvRkgCZaLvq0sRa5rgJtuIHLfPPprNHNyepeSlT64+dbVqI4qRWL44VN0lUCldCbbfg==
@@ -17104,6 +17111,18 @@ rc-menu@~9.12.0, rc-menu@~9.12.2:
     rc-overflow "^1.3.1"
     rc-util "^5.27.0"
 
+rc-menu@~9.12.4:
+  version "9.12.4"
+  resolved "https://registry.yarnpkg.com/rc-menu/-/rc-menu-9.12.4.tgz#4959b5eeb780be7ff52aac31952b35efca46b9a3"
+  integrity sha512-t2NcvPLV1mFJzw4F21ojOoRVofK2rWhpKPx69q2raUsiHPDP6DDevsBILEYdsIegqBeSXoWs2bf6CueBKg3BFg==
+  dependencies:
+    "@babel/runtime" "^7.10.1"
+    "@rc-component/trigger" "^1.17.0"
+    classnames "2.x"
+    rc-motion "^2.4.3"
+    rc-overflow "^1.3.1"
+    rc-util "^5.27.0"
+
 rc-motion@^2.0.0, rc-motion@^2.0.1, rc-motion@^2.3.0, rc-motion@^2.3.4, rc-motion@^2.4.3, rc-motion@^2.4.4, rc-motion@^2.6.1, rc-motion@^2.6.2, rc-motion@^2.9.0:
   version "2.9.0"
   resolved "https://registry.yarnpkg.com/rc-motion/-/rc-motion-2.9.0.tgz#9e18a1b8d61e528a97369cf9a7601e9b29205710"
@@ -17113,10 +17132,10 @@ rc-motion@^2.0.0, rc-motion@^2.0.1, rc-motion@^2.3.0, rc-motion@^2.3.4, rc-motio
     classnames "^2.2.1"
     rc-util "^5.21.0"
 
-rc-notification@~5.2.0:
-  version "5.2.0"
-  resolved "https://registry.yarnpkg.com/rc-notification/-/rc-notification-5.2.0.tgz#d63f4ec98fe297a15b495f62b800074636aabbf6"
-  integrity sha512-HwUSypEW4mfOpiakJ7dm6TAKf+3zuSR2xm0I0XMes493rtA3n4EVMvQyldrp23hUwCE3RFj8oncyU1E8iNC4ag==
+rc-notification@~5.3.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/rc-notification/-/rc-notification-5.3.0.tgz#e31c86fe2350598ade8cff383babd1befa7a94fe"
+  integrity sha512-WCf0uCOkZ3HGfF0p1H4Sgt7aWfipxORWTPp7o6prA3vxwtWhtug3GfpYls1pnBp4WA+j8vGIi5c2/hQRpGzPcQ==
   dependencies:
     "@babel/runtime" "^7.10.1"
     classnames "2.x"
@@ -17133,16 +17152,16 @@ rc-overflow@^1.3.1:
     rc-resize-observer "^1.0.0"
     rc-util "^5.37.0"
 
-rc-pagination@~3.6.1:
-  version "3.6.1"
-  resolved "https://registry.yarnpkg.com/rc-pagination/-/rc-pagination-3.6.1.tgz#2db6678a57cd2f4f29d6c0416e282543af52d0df"
-  integrity sha512-R/sUnKKXx1Nm4kZfUKS3YKa7yEPF1ZkVB/AynQaHt+nMER7h9wPTfliDJFdYo+RM/nk2JD4Yc5QpUq8fIQHeug==
+rc-pagination@~4.0.3:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/rc-pagination/-/rc-pagination-4.0.3.tgz#6d35314e8e24468cd2c3e8c00dab89c515a85d08"
+  integrity sha512-s1MNwyU83AgycikYckRdpmkN+4ZZuul0E0YdDp7dMgcjg/d2fak767ZIbLP4Q5YPPla7NDorfVFTvGQAPj6jXA==
   dependencies:
     "@babel/runtime" "^7.10.1"
-    classnames "^2.2.1"
-    rc-util "^5.32.2"
+    classnames "^2.3.2"
+    rc-util "^5.38.0"
 
-rc-picker@~3.14.5:
+rc-picker@~3.14.6:
   version "3.14.6"
   resolved "https://registry.yarnpkg.com/rc-picker/-/rc-picker-3.14.6.tgz#60fc34f9883272e10f6c593fa6d82e7e7a70781b"
   integrity sha512-AdKKW0AqMwZsKvIpwUWDUnpuGKZVrbxVTZTNjcO+pViGkjC1EBcjMgxVe8tomOEaIHJL5Gd13vS8Rr3zzxWmag==
@@ -17170,7 +17189,7 @@ rc-rate@~2.12.0:
     classnames "^2.2.5"
     rc-util "^5.0.1"
 
-rc-resize-observer@^1.0.0, rc-resize-observer@^1.1.0, rc-resize-observer@^1.3.1:
+rc-resize-observer@^1.0.0, rc-resize-observer@^1.1.0, rc-resize-observer@^1.3.1, rc-resize-observer@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/rc-resize-observer/-/rc-resize-observer-1.4.0.tgz#7bba61e6b3c604834980647cce6451914750d0cc"
   integrity sha512-PnMVyRid9JLxFavTjeDXEXo65HCRqbmLBw9xX9gfC4BZiSzbLXKzW3jPz+J0P71pLbD5tBMTT+mkstV5gD0c9Q==
@@ -17190,10 +17209,10 @@ rc-segmented@~2.2.2:
     rc-motion "^2.4.4"
     rc-util "^5.17.0"
 
-rc-select@~14.9.0:
-  version "14.9.2"
-  resolved "https://registry.yarnpkg.com/rc-select/-/rc-select-14.9.2.tgz#24c4673e21b1d5a4a126b9a934609cce5c39d1a5"
-  integrity sha512-VQ15sRFgPURHb8ZcZNSDtb2rAw3+C9xlL0nDziwNHTEW1KvEpZ8y+0v5w24X/Bpl9b3cW1BOyW1F5UqSAq+7Dg==
+rc-select@~14.10.0:
+  version "14.10.0"
+  resolved "https://registry.yarnpkg.com/rc-select/-/rc-select-14.10.0.tgz#5f60e61ed7c9a83c8591616b1174a1c4ab2de0cd"
+  integrity sha512-TsIJTYafTTapCA32LLNpx/AD6ntepR1TG8jEVx35NiAAWCPymhUfuca8kRcUNd3WIGVMDcMKn9kkphoxEz+6Ag==
   dependencies:
     "@babel/runtime" "^7.10.1"
     "@rc-component/trigger" "^1.5.0"
@@ -17203,10 +17222,10 @@ rc-select@~14.9.0:
     rc-util "^5.16.1"
     rc-virtual-list "^3.5.2"
 
-rc-slider@~10.3.0:
-  version "10.3.1"
-  resolved "https://registry.yarnpkg.com/rc-slider/-/rc-slider-10.3.1.tgz#345e818975f4bb61b66340799af8cfccad7c8ad7"
-  integrity sha512-XszsZLkbjcG9ogQy/zUC0n2kndoKUAnY/Vnk1Go5Gx+JJQBz0Tl15d5IfSiglwBUZPS9vsUJZkfCmkIZSqWbcA==
+rc-slider@~10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/rc-slider/-/rc-slider-10.5.0.tgz#1bd4853d114cb3403b67c485125887adb6a2a117"
+  integrity sha512-xiYght50cvoODZYI43v3Ylsqiw14+D7ELsgzR40boDZaya1HFa1Etnv9MDkQE8X/UrXAffwv2AcNAhslgYuDTw==
   dependencies:
     "@babel/runtime" "^7.10.1"
     classnames "^2.2.5"
@@ -17230,22 +17249,22 @@ rc-switch@~4.1.0:
     classnames "^2.2.1"
     rc-util "^5.30.0"
 
-rc-table@~7.34.4:
-  version "7.34.4"
-  resolved "https://registry.yarnpkg.com/rc-table/-/rc-table-7.34.4.tgz#027a1052846fffb1ff38b2e0df95acb0ac508254"
-  integrity sha512-os+i88Y2AO/6dNkOgJkKSHgXYaZZGnuOEEe+nyaq5IRgvAQNhLysUjXt2objtBeFDEZR8TqXrajwBNRUwunmdw==
+rc-table@~7.36.0:
+  version "7.36.0"
+  resolved "https://registry.yarnpkg.com/rc-table/-/rc-table-7.36.0.tgz#95e50805392b6a723105c3eb77eefb1e14ba1ced"
+  integrity sha512-3xVcdCC5OLeOOhaCg+5Lps2oPreM/GWXmUXWTSX4p6vF7F76ABM4dfPpMJ9Dnf5yGRyh+8pe7FRyhRVnWw2H/w==
   dependencies:
     "@babel/runtime" "^7.10.1"
     "@rc-component/context" "^1.4.0"
     classnames "^2.2.5"
     rc-resize-observer "^1.1.0"
-    rc-util "^5.36.0"
+    rc-util "^5.37.0"
     rc-virtual-list "^3.11.1"
 
-rc-tabs@~12.12.1:
-  version "12.12.1"
-  resolved "https://registry.yarnpkg.com/rc-tabs/-/rc-tabs-12.12.1.tgz#8639297bfcbbf77ca05f71d73fc3d31bd05e04d8"
-  integrity sha512-e10VBjEkECdPl4XZSs9to81SE+mgclBTM7J8/LMsFqmJoi05Tci91bRnmeeDtrcOCx2PuZdJv57XUlC4d8PEIw==
+rc-tabs@~12.14.1:
+  version "12.14.1"
+  resolved "https://registry.yarnpkg.com/rc-tabs/-/rc-tabs-12.14.1.tgz#1fe4c0bd54550c216f9612b76eff7fbe750f4d2b"
+  integrity sha512-1xlE7JQNYxD5RwBsM7jf2xSdUrkmTSDFLFEm2gqAgnsRlOGydEzXXNAVTOT6QcgM1G/gCm+AgG+FYPUGb4Hs4g==
   dependencies:
     "@babel/runtime" "^7.11.2"
     classnames "2.x"
@@ -17255,18 +17274,18 @@ rc-tabs@~12.12.1:
     rc-resize-observer "^1.0.0"
     rc-util "^5.34.1"
 
-rc-textarea@~1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/rc-textarea/-/rc-textarea-1.4.0.tgz#5833676f81f71a842220a0311c48caab07643349"
-  integrity sha512-CiqK+uyoJlnfufbC0kwfHJpfElhQacuDSNyNQ/xGnA/QMaJLDbgmqRT8QmX0T0KD/ws/hy6qqRaGJSsrRR5uiQ==
+rc-textarea@~1.5.0, rc-textarea@~1.5.3:
+  version "1.5.3"
+  resolved "https://registry.yarnpkg.com/rc-textarea/-/rc-textarea-1.5.3.tgz#513e837d308584996c05f540f4f58645a3a8c89a"
+  integrity sha512-oH682ghHx++stFNYrosPRBfwsypywrTXpaD0/5Z8MPkUOnyOQUaY9ueL9tMu6BP1LfsuYQ1VLpg5OtshViLNgA==
   dependencies:
     "@babel/runtime" "^7.10.1"
     classnames "^2.2.1"
-    rc-input "~1.2.1"
+    rc-input "~1.3.5"
     rc-resize-observer "^1.0.0"
     rc-util "^5.27.0"
 
-rc-tooltip@~6.1.0:
+rc-tooltip@~6.1.2:
   version "6.1.2"
   resolved "https://registry.yarnpkg.com/rc-tooltip/-/rc-tooltip-6.1.2.tgz#33923ecfb2cf24347975093cbd0b048ab33c9567"
   integrity sha512-89zwvybvCxGJu3+gGF8w5AXd4HHk6hIN7K0vZbkzjilVaEAIWPqc1fcyeUeP71n3VCcw7pTL9LyFupFbrx8gHw==
@@ -17275,21 +17294,21 @@ rc-tooltip@~6.1.0:
     "@rc-component/trigger" "^1.18.0"
     classnames "^2.3.1"
 
-rc-tree-select@~5.13.0:
-  version "5.13.0"
-  resolved "https://registry.yarnpkg.com/rc-tree-select/-/rc-tree-select-5.13.0.tgz#ca332f08476c2fdf7fe2154a6320f8f686ef34c8"
-  integrity sha512-g01JU9EdE7j/9KfDKtmvFqJ7ZDNIYDzkpmAXllbTBFoRNhWJBjW1x/dCZLVG+IdZeIz8SKJkgZzCf1CUZrzV/Q==
+rc-tree-select@~5.15.0:
+  version "5.15.0"
+  resolved "https://registry.yarnpkg.com/rc-tree-select/-/rc-tree-select-5.15.0.tgz#8591f1dd28b043dde6fa1ca30c7acb198b160a42"
+  integrity sha512-YJHfdO6azFnR0/JuNBZLDptGE4/RGfVeHAafUIYcm2T3RBkL1O8aVqiHvwIyLzdK59ry0NLrByd+3TkfpRM+9Q==
   dependencies:
     "@babel/runtime" "^7.10.1"
     classnames "2.x"
-    rc-select "~14.9.0"
-    rc-tree "~5.7.0"
+    rc-select "~14.10.0"
+    rc-tree "~5.8.1"
     rc-util "^5.16.1"
 
-rc-tree@~5.7.0, rc-tree@~5.7.12:
-  version "5.7.12"
-  resolved "https://registry.yarnpkg.com/rc-tree/-/rc-tree-5.7.12.tgz#6910e551390963708936c2cbf925f9deff4a6d76"
-  integrity sha512-LXA5nY2hG5koIAlHW5sgXgLpOMz+bFRbnZZ+cCg0tQs4Wv1AmY7EDi1SK7iFXhslYockbqUerQan82jljoaItg==
+rc-tree@~5.8.1, rc-tree@~5.8.2:
+  version "5.8.2"
+  resolved "https://registry.yarnpkg.com/rc-tree/-/rc-tree-5.8.2.tgz#ed3a3f7c56597bbeab3303407a9e1739bbf15621"
+  integrity sha512-xH/fcgLHWTLmrSuNphU8XAqV7CdaOQgm4KywlLGNoTMhDAcNR3GVNP6cZzb0GrKmIZ9yae+QLot/cAgUdPRMzg==
   dependencies:
     "@babel/runtime" "^7.10.1"
     classnames "2.x"
@@ -17306,7 +17325,7 @@ rc-upload@~4.3.5:
     classnames "^2.2.5"
     rc-util "^5.2.0"
 
-rc-util@^5.0.1, rc-util@^5.16.1, rc-util@^5.17.0, rc-util@^5.18.1, rc-util@^5.2.0, rc-util@^5.20.1, rc-util@^5.21.0, rc-util@^5.24.4, rc-util@^5.25.2, rc-util@^5.27.0, rc-util@^5.28.0, rc-util@^5.30.0, rc-util@^5.31.1, rc-util@^5.32.2, rc-util@^5.34.1, rc-util@^5.35.0, rc-util@^5.36.0, rc-util@^5.37.0, rc-util@^5.38.0:
+rc-util@^5.0.1, rc-util@^5.16.1, rc-util@^5.17.0, rc-util@^5.18.1, rc-util@^5.2.0, rc-util@^5.20.1, rc-util@^5.21.0, rc-util@^5.24.4, rc-util@^5.25.2, rc-util@^5.27.0, rc-util@^5.28.0, rc-util@^5.30.0, rc-util@^5.31.1, rc-util@^5.32.2, rc-util@^5.34.1, rc-util@^5.35.0, rc-util@^5.36.0, rc-util@^5.37.0, rc-util@^5.38.0, rc-util@^5.38.1:
   version "5.38.1"
   resolved "https://registry.yarnpkg.com/rc-util/-/rc-util-5.38.1.tgz#4915503b89855f5c5cd9afd4c72a7a17568777bb"
   integrity sha512-e4ZMs7q9XqwTuhIK7zBIVFltUtMSjphuPPQXHoHlzRzNdOwUxDejo0Zls5HYaJfRKNURcsS/ceKVULlhjBrxng==
@@ -18162,7 +18181,7 @@ schema-utils@^3.0.0, schema-utils@^3.1.1, schema-utils@^3.2.0:
     ajv "^6.12.5"
     ajv-keywords "^3.5.2"
 
-scroll-into-view-if-needed@^3.0.3:
+scroll-into-view-if-needed@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/scroll-into-view-if-needed/-/scroll-into-view-if-needed-3.1.0.tgz#fa9524518c799b45a2ef6bbffb92bcad0296d01f"
   integrity sha512-49oNpRjWRvnU8NyGVmUaYG4jtTkNonFZI86MmGRDqBphEK2EXT9gdEUoQPZhuBM8yWHxCWbobltqYO5M4XrUvQ==