From 6363e3d32ef1275315e80d634764a82759718b90 Mon Sep 17 00:00:00 2001
From: Manuel Stahl <manuel.stahl@awesome-technologies.de>
Date: Mon, 5 Feb 2024 10:18:25 +0100
Subject: [PATCH] Use icon as loading spinner in login page

Change-Id: Ie0e8d0a9e1242849fb8b18875d752dd15facaaf9
---
 src/components/LoginPage.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/LoginPage.js b/src/components/LoginPage.js
index 33eb6be..8585f69 100644
--- a/src/components/LoginPage.js
+++ b/src/components/LoginPage.js
@@ -307,9 +307,13 @@ const LoginPage = () => {
       <FormBox>
         <Card className="card">
           <Box className="avatar">
-            <Avatar className="icon">
-              <LockIcon />
-            </Avatar>
+            {loading ? (
+              <CircularProgress size={25} thickness={2} />
+            ) : (
+              <Avatar className="icon">
+                <LockIcon />
+              </Avatar>
+            )}
           </Box>
           <Box className="hint">{translate("synapseadmin.auth.welcome")}</Box>
           <Box className="form">
@@ -339,7 +343,6 @@ const LoginPage = () => {
                 disabled={loading || !supportPassAuth}
                 fullWidth
               >
-                {loading && <CircularProgress size={25} thickness={2} />}
                 {translate("ra.auth.sign_in")}
               </Button>
               <Button
@@ -349,7 +352,6 @@ const LoginPage = () => {
                 disabled={loading || ssoBaseUrl === ""}
                 fullWidth
               >
-                {loading && <CircularProgress size={25} thickness={2} />}
                 {translate("synapseadmin.auth.sso_sign_in")}
               </Button>
             </CardActions>