From a3be679acfc8dc1a2ffb881be0c556faa9c1f45e Mon Sep 17 00:00:00 2001
From: SergeantPanda <chester.cullen@gmail.com>
Date: Fri, 14 Nov 2025 16:52:26 -0600
Subject: [PATCH] Enhancement: Add loading state to login button for better
 user feedback

---
 frontend/src/components/forms/LoginForm.jsx | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/forms/LoginForm.jsx b/frontend/src/components/forms/LoginForm.jsx
index 20df3595..9d284319 100644
--- a/frontend/src/components/forms/LoginForm.jsx
+++ b/frontend/src/components/forms/LoginForm.jsx
@@ -32,6 +32,7 @@ const LoginForm = () => {
   const [savePassword, setSavePassword] = useState(false);
   const [forgotPasswordOpened, setForgotPasswordOpened] = useState(false);
   const [version, setVersion] = useState(null);
+  const [isLoading, setIsLoading] = useState(false);
 
   // Simple base64 encoding/decoding for localStorage
   // Note: This is obfuscation, not encryption. Use browser's password manager for real security.
@@ -100,6 +101,7 @@ const LoginForm = () => {
 
   const handleSubmit = async (e) => {
     e.preventDefault();
+    setIsLoading(true);
 
     try {
       await login(formData);
@@ -130,6 +132,7 @@ const LoginForm = () => {
     } catch (e) {
       console.log(`Failed to login: ${e}`);
       await logout();
+      setIsLoading(false);
     }
   };
 
@@ -239,8 +242,14 @@ const LoginForm = () => {
               )}
             </div>
 
-            <Button type="submit" fullWidth>
-              Login
+            <Button
+              type="submit"
+              fullWidth
+              loading={isLoading}
+              disabled={isLoading}
+              loaderProps={{ type: 'dots' }}
+            >
+              {isLoading ? 'Logging you in...' : 'Login'}
             </Button>
           </Stack>
         </form>