made error message to display blow and disappears after 5secs

src/app/modules/auth/components/Login.tsx

@@ -49,18 +49,20 @@ export function Login() {
           setStatus('The login details are incorrect')
           setSubmitting(false)
           setLoading(false)
-          console.log(auth)  //remove later
           return
         }
         saveAuth(auth)
         setCurrentUser(auth.profile)
-        console.log(auth)  //remove later
       } catch (error) {
         console.error(error)
         saveAuth(undefined)
         setStatus('The login details are incorrect')
         setSubmitting(false)
         setLoading(false)
+      } finally {
+        setTimeout(()=>{
+          setStatus('')
+        }, 5000)
       }
     },
   })
@@ -130,14 +132,6 @@ export function Login() {
       </div>
       {/* end::Separator */}
 
-      {formik.status ? (
-        <div className='mb-lg-15 alert alert-danger'>
-          <div className='alert-text font-weight-bold'>{formik.status}</div>
-        </div>
-      ) : (
-        null
-      )}
-
       {/* begin::Form group */}
       <div className='fv-row mb-8'>
         <label className='form-label fs-6 fw-bolder text-dark'>Email</label>
@@ -221,6 +215,16 @@ export function Login() {
       </div>
       {/* end::Action */}
 
+      {/* error message */}
+      {formik.status ? (
+        <div className='mb-lg-15 alert alert-danger'>
+          <div className='alert-text font-weight-bold'>{formik.status}</div>
+        </div>
+      ) : (
+        null
+      )}
+      {/* end of error message */}
+
       <div className='text-gray-500 text-center fw-semibold fs-6'>
         Not a Member yet?{' '}
         <Link to='/auth/registration' className='link-primary'>