reset password implemented

.env

@@ -9,5 +9,6 @@ REACT_APP_APPSITE=" https://myfitapp.mermsemr.com"
 
 REACT_APP_AUX_ENDPOINT = "https://devapi.mermsemr.com/en/desktop/api/v2/myfit"
 REACT_APP_USERS_ENDPOINT = "https://devapi.mermsemr.com/en/desktop/api/v2/myfituser"
+# REACT_APP_PASSWORD_ENDPOINT = "https://devapi.mermsemr.com/en/desktop/api/v2/myfituser/resetpass"
 
 REACT_APP_SESSION_EXPIRE_MINUTES = 5

src/components/AuthPages/ForgotPassword/index.jsx

@@ -1,10 +1,40 @@
-import React from "react";
-import { Link } from 'react-router-dom';
+import React, { useState, useEffect } from "react";
+import { Link, useNavigate } from 'react-router-dom';
 import titleShape from "../../../assets/images/shape/title-shape-two.svg";
 import InputCom from "../../Helpers/Inputs/InputCom";
 import AuthLayout from "../AuthLayout";
 
 export default function ForgotPassword() {
+
+  const navigate = useNavigate();
+  const [validation, setValidation] = useState("")
+  const [buttonDisabled, setButtonDisabled] = useState(true)
+
+  // email
+  const [email, setEmail] = useState("");
+  const handleEmail = (e) => {
+    setEmail(e.target.value);
+  };
+
+
+  function validationChecker(email) {
+    const emailCheck = /^[^0-9][a-zA-Z0-9._%+-]+@[a-zA-Z]+(\.[a-zA-Z]+)+$/;
+    if (email === "") {
+      setValidation("email is required");
+
+    } else if (!email.match(emailCheck)) {
+      setValidation('Please input a valid email address');
+
+    } else {
+      setValidation("");
+      setButtonDisabled(false)
+    }
+  }
+
+  useEffect(() => {
+    validationChecker(email)
+  }, [email])
+
   return (
     <>
       <AuthLayout
@@ -28,19 +58,24 @@ export default function ForgotPassword() {
                   name="email"
                   type="email"
                   iconName="message"
+                  inputHandler={handleEmail}
+                  value={email}
                 />
+                {validation && <p className="my-5 font-bold  text-red-500">{validation}</p>}
               </div>
+
               <div className="signin-area mb-3.5">
-                <a
-                  href="/verify-you"
+
+                <button
                   className="w-full rounded-[50px] mb-5 h-[58px] text-xl text-white font-bold flex justify-center bg-purple items-center"
+                  disabled={buttonDisabled}
+                  onClick={() => navigate("/verify-you")}
                 >
                   Send Code
-                </a>
-
+                </button>
 
                 <Link to="/"
-                  className=" my-40 font-bold flex justify-center text-red-500 items-center"
+                  className="my-40 font-bold flex justify-center text-red-500 items-center"
                 >
                   Back to Home
                 </Link>

src/components/Partials/Layout.jsx

@@ -21,7 +21,7 @@ export default function Layout({ children }) {
   const navigate = useNavigate();
   const logOut = () => {
     localStorage.removeItem("email");
-    localStorage.removeItem('session_token');
+    localStorage.clear();
     toast.success("Come Back Soon", {
       icon: `🙂`,
     });

src/services/UsersService.js

@@ -15,6 +15,7 @@ class usersService {
         return this.postAuxEnd("/login", reqData);
     }
 
+
     getUserReminders(){
         return this.getAuxEnd("/reminders", null);
     }
@@ -55,14 +56,16 @@ class usersService {
             });
     }
 
+
     postAuxEnd(uri, reqData) {
         const endPoint = process.env.REACT_APP_USERS_ENDPOINT + uri;
-        const session_token = localStorage.getItem("session_token");
+        const token = '..your token..'
         let axiosConfig = {
             headers: {
                 'Accept': 'application/json',
+                'Access-Control-Allow-Origin': '*',
                 'Content-Type': 'application/json;charset=UTF-8',
-                'Authorization': `Basic ${session_token}`,
+                'Authorization': `Basic ${token}`,
             }
         };
         //Access-Control-Allow-Origin
@@ -72,7 +75,7 @@ class usersService {
         };
       //  Axios.defaults.headers.post['Content-Type'] ='application/json;charset=utf-8';
       //  Axios.defaults.headers.post['Access-Control-Allow-Origin'] = '*'; //,axiosConfig
-        return Axios.post(endPoint, reqData,axiosConfig)
+        return Axios.post(endPoint, reqData)
             .then((response) => {
                 console.log(response);
                 // res = response;

src/views/HomePages.jsx

@@ -1,29 +1,7 @@
-import React, {useEffect} from "react";
+import React from "react";
 import Home from "../components/Home";
-import { useNavigate } from "react-router-dom";
-import { useDispatch, useSelector } from "react-redux";
-import { toast } from "react-toastify";
 
 export default function HomePages() {
-
-  const { drawer } = useSelector((state) => state.drawer);
-  const dispatch = useDispatch();
-  const navigate = useNavigate();
-  const logOut = () => {
-    localStorage.removeItem("email");
-    localStorage.removeItem('session_token');
-    toast.success("Come Back Soon", {
-      icon: `🙂`,
-    });
-
-    navigate("/login", { replace: true });
-  };
-
-  useEffect(()=>{
-    setTimeout(()=>{
-      logOut()
-    }, 300000) //expires user login session after 5 minutes
-  },[])
   return (
     <>
       <Home />