chore(release): 0.28.6 [skip ci]

## [0.28.6](https://github.com/sasjs/server/compare/v0.28.5...v0.28.6) (2023-01-26)

### Bug Fixes

* show loading spinner on login screen while request is in process ([69f2576](69f2576ee6))

CHANGELOG.md

@@ -1,3 +1,10 @@
+## [0.28.6](https://github.com/sasjs/server/compare/v0.28.5...v0.28.6) (2023-01-26)
+
+
+### Bug Fixes
+
+* show loading spinner on login screen while request is in process ([69f2576](https://github.com/sasjs/server/commit/69f2576ee6d3d7b7f3325922a88656d511e3ac88))
+
 ## [0.28.5](https://github.com/sasjs/server/compare/v0.28.4...v0.28.5) (2023-01-01)
 
 

api/package.json

@@ -92,7 +92,7 @@
     "dotenv": "^10.0.0",
     "http-headers-validation": "^0.0.1",
     "jest": "^27.0.6",
-    "mongodb-memory-server": "^8.0.0",
+    "mongodb-memory-server": "8.11.4",
     "nodejs-file-downloader": "4.10.2",
     "nodemon": "^2.0.7",
     "pkg": "5.6.0",

web/src/components/login.tsx

@@ -2,7 +2,14 @@ import axios from 'axios'
 import React, { useState, useContext } from 'react'
 import PropTypes from 'prop-types'
 
-import { CssBaseline, Box, TextField, Button } from '@mui/material'
+import {
+  Backdrop,
+  CircularProgress,
+  CssBaseline,
+  Box,
+  TextField,
+  Button
+} from '@mui/material'
 import { AppContext } from '../context/appContext'
 
 const login = async (payload: { username: string; password: string }) =>
@@ -10,21 +17,27 @@ const login = async (payload: { username: string; password: string }) =>
 
 const Login = () => {
   const appContext = useContext(AppContext)
+  const [isLoading, setIsLoading] = useState(false)
   const [username, setUsername] = useState('')
   const [password, setPassword] = useState('')
   const [errorMessage, setErrorMessage] = useState('')
 
   const handleSubmit = async (e: any) => {
+    setIsLoading(true)
     setErrorMessage('')
     e.preventDefault()
 
     const { loggedIn, user } = await login({
       username,
       password
-    }).catch((err: any) => {
+    })
+      .catch((err: any) => {
         setErrorMessage(err.response?.data || err.toString())
         return {}
       })
+      .finally(() => {
+        setIsLoading(false)
+      })
 
     if (loggedIn) {
       appContext.setUserId?.(user.id)
@@ -37,6 +50,14 @@ const Login = () => {
   }
 
   return (
+    <>
+      <Backdrop
+        sx={{ color: '#fff', zIndex: (theme) => theme.zIndex.drawer + 1 }}
+        open={isLoading}
+      >
+        <CircularProgress color="inherit" />
+      </Backdrop>
+
       <Box
         className="container"
         component="form"
@@ -73,6 +94,7 @@ const Login = () => {
           Submit
         </Button>
       </Box>
+    </>
   )
 }