From 3d7c7676701e5b8d2bddf6378c0dd0050385f965 Mon Sep 17 00:00:00 2001
From: Mark Reynolds <mreynolds@redhat.com>
Date: Tue, 15 Oct 2024 14:54:50 -0400
Subject: [PATCH] Improve log in page button handling

Disable the log in button while "logging in" is in progress, or if the
username and password are empty

Fixes: https://github.com/freeipa/freeipa-webui/issues/581

Signed-off-by: Mark Reynolds <mreynolds@redhat.com>
---
 src/login/LoginMainPage.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/login/LoginMainPage.tsx b/src/login/LoginMainPage.tsx
index 791a1203..dd890321 100644
--- a/src/login/LoginMainPage.tsx
+++ b/src/login/LoginMainPage.tsx
@@ -64,6 +64,7 @@ const LoginMainPage = () => {
   const [isValidUsername, setIsValidUsername] = React.useState(true);
   const [password, setPassword] = React.useState("");
   const [isValidPassword, setIsValidPassword] = React.useState(true);
+  const [authenticating, setAuthenticating] = React.useState(false);
 
   // Authentication method (assumes user + password by default)
   // - This will help to get the user credentials if the user is logged in via Kerberos
@@ -216,6 +217,7 @@ const LoginMainPage = () => {
     setIsValidPassword(!!password);
     setShowHelperText(!username || !password);
 
+    setAuthenticating(true);
     if (!username && isKerberosEnabled) {
       onKrbLogin().then((response) => {
         if ("error" in response) {
@@ -261,6 +263,7 @@ const LoginMainPage = () => {
         } else {
           onSuccessLogin();
         }
+        setAuthenticating(false);
       });
     }
   };
@@ -268,6 +271,7 @@ const LoginMainPage = () => {
   // Login using certificate
   const onLoginWithCertClick = (_event) => {
     _event.preventDefault();
+    setAuthenticating(true);
     onCertLogin(username).then((response) => {
       if ("error" in response) {
         const receivedError = response.error as MetaResponse;
@@ -284,6 +288,7 @@ const LoginMainPage = () => {
       } else {
         onSuccessLogin();
       }
+      setAuthenticating(false);
     });
   };
 
@@ -334,6 +339,7 @@ const LoginMainPage = () => {
       isValidPassword={isValidPassword}
       onLoginButtonClick={onLoginButtonClick}
       loginButtonLabel="Log in"
+      isLoginButtonDisabled={authenticating}
     />
   );