error message added

src/components/auth/Login.tsx

@@ -5,6 +5,7 @@ import { useNavigate, useLocation } from "react-router-dom";
 import { RouteHandler } from "../../router/routes";
 import { RequestStatus } from "../../core/models";
 import { employerLogin } from "../../core/apiRequest";
+import ErrorMsg from "../shared/ErrorMsg";
 
 
 type FormType = {
@@ -51,7 +52,7 @@ export default function Login() {
     employerLogin(reqData).then(res => {
       // console.log('RES', res)
       if(!res?.data?.call_return){
-        setRequestStatus({loading:false, status:false, message:'Email/Password is wrong', data:{}})
+        setRequestStatus({loading:false, status:false, message:res?.data?.status_message || 'Invalid Details', data:{}})
         return setTimeout(()=>{
           setRequestStatus({loading:false, status:null, message:'', data:{}})
         },4000)
@@ -138,6 +139,12 @@ export default function Login() {
                     </div>
                   </div>
                 </div>
+                <div className='w-full'>
+                  <ErrorMsg 
+                    message={requestStatus.message}
+                    status={requestStatus.status} 
+                  />
+                </div>
               </div>
             </div>
           </div>
@@ -150,7 +157,7 @@ export default function Login() {
             <div className="px-5 md:px-10 w-full flex justify-end">
               <button
                 className="font-bold text-[11px] lg:text-[13px] text-[#5A2C82]"
-                onClick={()=>{navigate(RouteHandler.otppage, { state: {verify_uid: requestStatus?.data?.verify_uid, application_uid: requestStatus?.data?.records?.application_uid }, replace:true })}}
+                onClick={()=>{navigate(RouteHandler.otppage, { state: {verify_uid: requestStatus?.data?.verify_uid, application_uid: state?.application_uid }, replace:true })}}
               >
                 Ok
               </button>

src/components/auth/OTP.tsx

@@ -6,6 +6,7 @@ import { updateUserDetails } from "../../store/UserDetails";
 import { useDispatch } from "react-redux";
 import { verifyOTP } from "../../core/apiRequest";
 import { RequestStatus } from "../../core/models";
+import ErrorMsg from "../shared/ErrorMsg";
 
 type FormType = {
   [index: string] : string
@@ -180,6 +181,13 @@ export default function Login() {
                   {/* <Link to='#' className='text-black text-sm'>Forget your password?</Link> */}
                 </div>
               </div>
+
+              <div className='w-full'>
+                <ErrorMsg 
+                  message={requestStatus.message}
+                  status={requestStatus.status} 
+                />
+              </div>
             </div>
           </div>
         </div>

src/components/shared/CustomSpinner.tsx

@@ -1,10 +1,10 @@
 type Props = {
-    size?: string
+    width?: string
+    height?: string
 }
 
-export default function CustomSpinner({size='8'}:Props) {
+export default function CustomSpinner({width='w-6', height='h-6'}:Props) {
-    let width = `w-${size}`
+  
-    let height = `h-${size}`
   return (
     <div role="status">
         <svg aria-hidden="true" className={`inline ${width} ${height} text-gray-200 animate-spin dark:text-gray-600 fill-blue-600`} viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg">

src/components/shared/ErrorMsg.tsx

@@ -0,0 +1,15 @@
+
+type Error = {
+    message?: string
+    status?: boolean
+}
+
+export default function ErrorMsg({message, status}:Error) {
+  return (
+    <div className={`${!message && 'hidden'} w-full`}>
+        <p className={`${status ? 'text-green-600' : 'text-red-500'} pt-2 text-base text-center`}>
+            {message && message}
+        </p>
+    </div>
+  )
+}