fix: anti double submit in form

src/pages/backends/components/add-modal.tsx

@@ -1,5 +1,6 @@
 import { PageAction } from '@/config';
 import { PageActionType } from '@/config/types';
+import useSubmitLock from '@/hooks/use-submit-lock';
 import {
   AlertBlockInfo,
   GSDrawer,
@@ -63,6 +64,7 @@ const AddModal: React.FC<AddModalProps> = (props) => {
   const [yamlContent, setYamlContent] = useState<string>('');
   const [formContent, setFormContent] = useState<FormData>({} as FormData);
   const alertRef = useRef<HTMLDivElement>(null);
+  const { loading, guard, run, release } = useSubmitLock();
 
   const showVersionCustomSuffix =
     currentData?.backend_source === BackendSourceValueMap.BUILTIN ||
@@ -92,17 +94,22 @@ const AddModal: React.FC<AddModalProps> = (props) => {
   };
 
   const onOk = () => {
-    if (activeKey === 'yaml') {
-      const content = editorRef.current?.getContent();
-      if (content) {
-        onSubmitYaml({ content: content });
+    guard(() => {
+      if (activeKey === 'yaml') {
+        const content = editorRef.current?.getContent();
+        if (!content) {
+          // nothing to submit — drop the lock so the button stays usable
+          release();
+          return;
+        }
+        run(() => onSubmitYaml({ content: content }));
+        return;
       }
-    } else {
       formRef.current?.submit();
-    }
+    });
   };
 
-  const onFinish = (values: FormData) => {
+  const onFinish = async (values: FormData) => {
     const versionConfigs = values.version_configs?.reduce(
       (acc: Record<string, any>, curr) => {
         if (curr.version_no) {
@@ -117,16 +124,18 @@ const AddModal: React.FC<AddModalProps> = (props) => {
 
     const defaultVersion = values.version_configs?.find((v) => v.is_default);
 
-    onSubmit({
-      ...values,
-      parameter_format:
-        values.parameter_format === 'auto' || !values.parameter_format
-          ? null
-          : values.parameter_format,
-      default_version: defaultVersion?.version_no || '',
-      // @ts-ignore
-      version_configs: versionConfigs
-    });
+    await run(() =>
+      onSubmit({
+        ...values,
+        parameter_format:
+          values.parameter_format === 'auto' || !values.parameter_format
+            ? null
+            : values.parameter_format,
+        default_version: defaultVersion?.version_no || '',
+        // @ts-ignore
+        version_configs: versionConfigs
+      })
+    );
   };
 
   useEffect(() => {
@@ -279,6 +288,7 @@ const AddModal: React.FC<AddModalProps> = (props) => {
             <ModalFooter
               onCancel={onClose}
               onOk={onOk}
+              loading={loading}
               style={ModalFooterStyle}
             ></ModalFooter>
           </>
@@ -295,6 +305,7 @@ const AddModal: React.FC<AddModalProps> = (props) => {
               children: (
                 <BackendForm
                   onFinish={onFinish}
+                  onFinishFailed={release}
                   action={action}
                   currentData={formContent as ListItem}
                   ref={formRef}