diff --git a/config-ui/src/plugins/components/connection-form/connection-form-modal.tsx b/config-ui/src/plugins/components/connection-form/connection-form-modal.tsx
index 4eccb09ae80..cf14c156435 100644
--- a/config-ui/src/plugins/components/connection-form/connection-form-modal.tsx
+++ b/config-ui/src/plugins/components/connection-form/connection-form-modal.tsx
@@ -30,6 +30,11 @@ interface Props {
 }
 
 export const ConnectionFormModal = ({ plugin, connectionId, open, onCancel, onSuccess }: Props) => {
+  const handleSuccess = (id: ID) => {
+    onSuccess?.(id);
+    onCancel();
+  };
+
   return (
     <Modal
       open={open}
@@ -45,7 +50,7 @@ export const ConnectionFormModal = ({ plugin, connectionId, open, onCancel, onSu
       footer={null}
       onCancel={() => onCancel()}
     >
-      <ConnectionForm plugin={plugin} connectionId={connectionId} onSuccess={onSuccess} />
+      <ConnectionForm plugin={plugin} connectionId={connectionId} onSuccess={handleSuccess} />
     </Modal>
   );
 };