Fixed Bug 78630 - The default action for the Enter key in the Add Provider window does not work

ChromiumBasedEditors/plugins/ai-agent/src/components/manage-tool-dialog/index.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import useServersStore from "@/store/useServersStore";
@@ -24,10 +24,10 @@ const ManageToolDialog = ({
 
   const [isAllowAlways, setIsAllowAlways] = useState(false);
 
-  const onAllowAction = () => {
+  const onAllowAction = React.useCallback(() => {
     onAllow(isAllowAlways);
     onClose();
-  };
+  }, [onAllow, isAllowAlways, onClose]);
 
   const onDenyAction = () => {
     onDeny();
@@ -36,6 +36,21 @@ const ManageToolDialog = ({
 
   const toolCall = manageToolData?.message?.content[manageToolData.idx];
 
+  React.useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        onAllowAction();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [onAllowAction]);
+
   if (
     !toolCall ||
     typeof toolCall !== "object" ||

ChromiumBasedEditors/plugins/ai-agent/src/pages/settings/sub-components/providers/AddProviderDialog.tsx

@@ -62,8 +62,11 @@ const AddProviderDialog = ({ onClose }: AddProviderDialogProps) => {
     }));
   };
 
-  const onSubmitAction = async () => {
+  const isDisabled =
-    if (isRequestRunningRef.current) return;
+    !value.name || !value.url || !!error.key || !!error.url || !!error.name;
+
+  const onSubmitAction = React.useCallback(async () => {
+    if (isRequestRunningRef.current || isDisabled) return;
     isRequestRunningRef.current = true;
     setIsRequestRunning(true);
 
@@ -84,7 +87,7 @@ const AddProviderDialog = ({ onClose }: AddProviderDialogProps) => {
     }
     isRequestRunningRef.current = false;
     setIsRequestRunning(false);
-  };
+  }, [addProvider, selectedProviderInfo, value, onClose, isDisabled]);
 
   React.useEffect(() => {
     setValue((prevValue) => ({
@@ -100,8 +103,20 @@ const AddProviderDialog = ({ onClose }: AddProviderDialogProps) => {
     }
   }, [buttonWidth]);
 
-  const isDisabled =
+  React.useEffect(() => {
-    !value.name || !value.url || !!error.key || !!error.url || !!error.name;
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        onSubmitAction();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [onSubmitAction]);
 
   return (
     <Dialog open={true}>

ChromiumBasedEditors/plugins/ai-agent/src/pages/settings/sub-components/providers/DeleteProviderDialog.tsx

@@ -44,10 +44,25 @@ const DeleteProviderDialog = ({ name, onClose }: DeleteProviderDialogProps) => {
     setProvider(provider);
   }, [providers, name]);
 
-  const onSubmitAction = async () => {
+  const onSubmitAction = React.useCallback(async () => {
     await deleteProvider(provider);
     onClose();
-  };
+  }, [deleteProvider, provider, onClose]);
+
+  React.useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        onSubmitAction();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [onSubmitAction]);
 
   return (
     <Dialog open={true}>

ChromiumBasedEditors/plugins/ai-agent/src/pages/settings/sub-components/providers/EditProviderDialog.tsx

@@ -91,7 +91,20 @@ const EditProviderDialog = ({ name, onClose }: EditProviderDialogProps) => {
     }));
   };
 
-  const onSubmitAction = async () => {
+  const isSameUrlAndName =
+    value.name === provider.name && value.url === provider.baseUrl;
+
+  const isSameKey = value.key === provider.key;
+
+  const isDisabled =
+    (isSameKey && isSameUrlAndName) ||
+    !!error.key ||
+    !!error.url ||
+    !!error.name;
+
+  const onSubmitAction = React.useCallback(async () => {
+    if (isDisabled) return;
+
     const result = await editProvider(
       {
         type: provider!.type,
@@ -110,18 +123,22 @@ const EditProviderDialog = ({ name, onClose }: EditProviderDialogProps) => {
         [result.field]: result.message,
       }));
     }
-  };
+  }, [isDisabled, editProvider, provider, value, onClose]);
 
-  const isSameUrlAndName =
+  React.useEffect(() => {
-    value.name === provider.name && value.url === provider.baseUrl;
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        onSubmitAction();
+      }
+    };
 
-  const isSameKey = value.key === provider.key;
+    window.addEventListener("keydown", handleKeyDown);
 
-  const isDisabled =
+    return () => {
-    (isSameKey && isSameUrlAndName) ||
+      window.removeEventListener("keydown", handleKeyDown);
-    !!error.key ||
+    };
-    !!error.url ||
+  }, [onSubmitAction]);
-    !!error.name;
 
   return (
     <Dialog open={true}>

ChromiumBasedEditors/plugins/ai-agent/src/pages/settings/sub-components/servers/ConfigDialog.tsx

@@ -111,6 +111,29 @@ const ConfigDialog = ({ open, onClose }: ConfigDialogProps) => {
     };
   }, [open, getConfig]);
 
+  const onSubmitAction = React.useCallback(() => {
+    if (!isValidJson) return;
+    saveConfig(JSON.parse(value));
+    onClose();
+  }, [isValidJson, saveConfig, value, onClose]);
+
+  React.useEffect(() => {
+    if (!open) return;
+
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
+        e.preventDefault();
+        onSubmitAction();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [open, onSubmitAction]);
+
   return (
     <Dialog open={open} onOpenChange={() => {}}>
       <DialogContent
@@ -138,13 +161,7 @@ const ConfigDialog = ({ open, onClose }: ConfigDialogProps) => {
           <Button onClick={onClose} variant="default">
             {t("Cancel")}
           </Button>
-          <Button
+          <Button disabled={!isValidJson} onClick={onSubmitAction}>
-            disabled={!isValidJson}
-            onClick={() => {
-              saveConfig(JSON.parse(value));
-              onClose();
-            }}
-          >
             {t("Save")}
           </Button>
         </div>

ChromiumBasedEditors/plugins/ai-agent/src/pages/settings/sub-components/servers/DeleteServerDialog.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { useTranslation } from "react-i18next";
 
 import { Dialog, DialogContent } from "@/components/dialog";
@@ -15,10 +16,25 @@ const DeleteServerDialog = ({ name, onClose }: DeleteServerDialogProps) => {
 
   const { deleteCustomServer } = useServersStore();
 
-  const onSubmitAction = () => {
+  const onSubmitAction = React.useCallback(() => {
     deleteCustomServer(name);
     onClose();
-  };
+  }, [deleteCustomServer, name, onClose]);
+
+  React.useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        onSubmitAction();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [onSubmitAction]);
 
   return (
     <Dialog open={true}>

ChromiumBasedEditors/plugins/ai-agent/src/pages/settings/sub-components/web-search/index.tsx

@@ -25,14 +25,14 @@ const WebSearch = () => {
     }
   }, []);
 
-  const saveWebSearchData = () => {
+  const saveWebSearchData = React.useCallback(() => {
     if (!selectedProvider || !apiKey) return;
     client.setWebSearchData({
       provider: selectedProvider,
       key: apiKey,
     });
     setSaved(true);
-  };
+  }, [selectedProvider, apiKey]);
 
   const resetSettings = () => {
     setSelectedProvider("");
@@ -41,6 +41,21 @@ const WebSearch = () => {
     client.setWebSearchData(null);
   };
 
+  React.useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        saveWebSearchData();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [saveWebSearchData]);
+
   return (
     <>
       <div className="flex flex-col gap-[16px] mt-[16px]">