added disable warning (#32414)

fixes: #30267

Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>

js/apps/admin-ui/cypress/e2e/users_enable_disable.spec.ts

@@ -1,11 +1,12 @@
-import { v4 as uuid } from "uuid";
 import UserRepresentation from "@keycloak/keycloak-admin-client/lib/defs/userRepresentation";
+import { v4 as uuid } from "uuid";
 import LoginPage from "../support/pages/LoginPage";
 import Masthead from "../support/pages/admin-ui/Masthead";
 import SidebarPage from "../support/pages/admin-ui/SidebarPage";
 import UsersPage from "../support/pages/admin-ui/manage/users/UsersPage";
 import UserDetailsPage from "../support/pages/admin-ui/manage/users/user_details/UserDetailsPage";
 import adminClient from "../support/util/AdminClient";
+import ModalUtils from "../support/util/ModalUtils";
 import { keycloakBefore } from "../support/util/keycloak_hooks";
 
 const loginPage = new LoginPage();
@@ -13,6 +14,7 @@ const sidebarPage = new SidebarPage();
 const usersPage = new UsersPage();
 const userDetailsPage = new UserDetailsPage();
 const masthead = new Masthead();
+const modal = new ModalUtils();
 
 const createUser = (fields: UserRepresentation) =>
   cy
@@ -35,6 +37,7 @@ describe("User enable/disable", () => {
       userDetailsPage.assertEnabled(username!);
 
       userDetailsPage.toggleEnabled(username!);
+      modal.confirmModal();
       masthead.checkNotificationMessage("The user has been saved");
       cy.wait(1000);
       userDetailsPage.assertDisabled(username!);
@@ -64,6 +67,7 @@ describe("User enable/disable", () => {
       userDetailsPage.assertEnabled(username!);
 
       userDetailsPage.toggleEnabled(username!);
+      modal.confirmModal();
       masthead.checkNotificationMessage("The user has been saved");
       cy.wait(1000);
       userDetailsPage.assertDisabled(username!);

js/apps/admin-ui/maven-resources/theme/keycloak.v2/admin/messages/messages_en.properties

@@ -3240,3 +3240,5 @@ temporaryAdmin=Temporary admin user account. Ensure it is replaced with a perman
 temporaryService=Temporary admin service account. Ensure it is replaced with a permanent admin service account as soon as possible.
 addOrganizationAttributes.label=Add organization attributes
 addOrganizationAttributes.help=If enabled, the organization attributes will be available for each organization mapped to the token.
+disableConfirmUserTitle=Disable user?
+disableConfirmUser=Are you sure you want to disable this user?

js/apps/admin-ui/src/user/EditUser.tsx

@@ -220,6 +220,18 @@ export default function EditUser() {
     }
   };
 
+  const [toggleDisableDialog, DisableConfirm] = useConfirmDialog({
+    titleKey: "disableConfirmUserTitle",
+    messageKey: "disableConfirmUser",
+    continueButtonLabel: "disable",
+    onConfirm: () => {
+      save({
+        ...toUserFormFields(user!),
+        enabled: false,
+      });
+    },
+  });
+
   const [toggleDeleteDialog, DeleteConfirm] = useConfirmDialog({
     titleKey: "deleteConfirm",
     messageKey: "deleteConfirmCurrentUser",
@@ -269,6 +281,7 @@ export default function EditUser() {
     <>
       <ImpersonateConfirm />
       <DeleteConfirm />
+      <DisableConfirm />
       <ViewHeader
         titleKey={user.username!}
         className="kc-username-view-header"
@@ -307,12 +320,16 @@ export default function EditUser() {
             {t("delete")}
           </DropdownItem>,
         ]}
-        onToggle={(value) =>
-          save({
-            ...toUserFormFields(user),
-            enabled: value,
-          })
-        }
+        onToggle={(value) => {
+          if (!value) {
+            toggleDisableDialog();
+          } else {
+            save({
+              ...toUserFormFields(user),
+              enabled: value,
+            });
+          }
+        }}
         isEnabled={user.enabled}
       />