fixed server issue on document

components/Authentication/SignInForm.js

@@ -25,6 +25,8 @@ const SignInForm = () => {
     password: false,
   });
   const [loading, setLoading] = useState(false);
+  const [errMsg, setErrMsg] = useState("");
+
   const api = new Fetcher();
   const router = useRouter();
 
@@ -68,6 +70,12 @@ const SignInForm = () => {
 
       if (res.status === 204 || res.length === 0) {
         setErrorHandlers({ ...errorHandlers, email: true, password: true });
+        setErrMsg("Wrong Credentials");
+        setTimeout(() => {
+          setErrorHandlers({ ...errorHandlers, email: false, password: false });
+          setLoading(false);
+          setErrMsg("");
+        }, 1500);
       }
 
       // Store the token in cookies
@@ -239,8 +247,9 @@ const SignInForm = () => {
                     variant="contained"
                     loading={loading}
                     disabled={loading}
-                    // loadingPosition="end"
+                    loadingIndicator="Signing in…"
                     sx={{
+                      backgroundColor: "#4687BA",
                       textTransform: "capitalize",
                       borderRadius: "8px",
                       fontWeight: "500",
@@ -252,7 +261,9 @@ const SignInForm = () => {
                       },
                     }}
                   >
-                    <span>Sign In</span>
+                    <span>
+                      {loading ? "Signing in…" : errMsg ? errMsg : "Sign In"}
+                    </span>
                   </LoadingButton>
                 </Box>
               </Box>