diff --git a/js/apps/admin-ui/src/clients/add/NewClientForm.tsx b/js/apps/admin-ui/src/clients/add/NewClientForm.tsx
index 8ad92a4d07..613a1277e5 100644
--- a/js/apps/admin-ui/src/clients/add/NewClientForm.tsx
+++ b/js/apps/admin-ui/src/clients/add/NewClientForm.tsx
@@ -21,6 +21,7 @@ import { toClients } from "../routes/Clients";
 import { CapabilityConfig } from "./CapabilityConfig";
 import { GeneralSettings } from "./GeneralSettings";
 import { LoginSettings } from "./LoginSettings";
+import { useState } from "react";
 
 const NewClientFooter = (newClientForm: any) => {
   const { t } = useTranslation();
@@ -54,6 +55,7 @@ export default function NewClientForm() {
   const { t } = useTranslation();
   const { realm } = useRealm();
   const navigate = useNavigate();
+  const [saving, setSaving] = useState<boolean>(false);
 
   const { addAlert, addError } = useAlerts();
   const form = useForm<FormFields>({
@@ -78,6 +80,8 @@ export default function NewClientForm() {
   const protocol = watch("protocol");
 
   const save = async () => {
+    if (saving) return;
+    setSaving(true);
     const client = convertFormValuesToObject(getValues());
     try {
       const newClient = await adminClient.clients.create({
@@ -88,6 +92,8 @@ export default function NewClientForm() {
       navigate(toClient({ realm, clientId: newClient.id, tab: "settings" }));
     } catch (error) {
       addError("createClientError", error);
+    } finally {
+      setSaving(false);
     }
   };