reset password implemented

.env

@@ -8,4 +8,7 @@ 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/myfitusers"
+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

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "nft-max-react",
+  "name": "myFit-App",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
@@ -8,8 +8,10 @@
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
+    "axios": "^0.24.0",
     "chart.js": "^3.7.1",
     "chartjs": "^0.3.24",
+    "cors": "^2.8.5",
     "faker": "^6.6.6",
     "react": "^18.0.0",
     "react-chartjs-2": "^4.1.0",

src/components/AuthPages/AuthProfile/index.jsx

@@ -145,6 +145,7 @@ export default function AuthProfile() {
             </div>
 
           </div>
+          <ActivitiesTab />
         </div>
       </Layout>
     </>

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/AuthPages/Login/index.jsx

@@ -4,6 +4,7 @@ import { toast } from "react-toastify";
 import googleLogo from "../../../assets/images/google-logo.svg";
 // import titleShape from "../../../assets/images/shape/title-shape.svg";
 import titleShape from "../../../assets/images/shape/login_straight_underline.svg";
+import usersService from "../../../services/UsersService";
 import InputCom from "../../Helpers/Inputs/InputCom";
 import AuthLayout from "../AuthLayout";
 
@@ -19,21 +20,30 @@ export default function Login() {
   };
 
   // email
-  const [email, setMail] = useState("support@chiefsoft.com");
+  const [email, setMail] = useState("");
   const handleEmail = (e) => {
     setMail(e.target.value);
   };
   // password
-  const [password, setPassword] = useState("123456");
+  const [password, setPassword] = useState("");
   const handlePassword = (e) => {
     setPassword(e.target.value);
   };
   const navigate = useNavigate();
-  const doLogin = () => {
+  const userApi = new usersService();
+  const doLogin = async () => {
     if (email !== "" && password !== "") {
-      if (email === "support@chiefsoft.com") {
+      var postData = {
+        username: email,
+        password: password
+      };
+      const loginResult = await userApi.logInUser(postData);  // just for a test
+      // if (email === "support@mermsemr.com") {
+      if (loginResult.data.status > 0 && loginResult.data.session_token !='') { // just for a start
         localStorage.setItem("email", `${email}`);
+        localStorage.setItem("session_token", `${loginResult.data.session_token}`);
         setLoginLoading(true);
+         // userApi.getUserReminders(); //testing
         setTimeout(() => {
           toast.success("Login Successfully");
           navigate("/", { replace: true });
@@ -57,7 +67,7 @@ export default function Login() {
               <h1 className="text-5xl font-bold leading-[74px]   text-dark-gray dark:text-white">
                 Log In
               </h1>
-              <div className="shape -mt-2">
+              <div className="shape mb-[10px]">
                 <img src={titleShape} alt="shape" />
               </div>
             </div>
@@ -66,7 +76,7 @@ export default function Login() {
                 <InputCom
                   value={email}
                   inputHandler={handleEmail}
-                  placeholder="support@chiefsoft.com"
+                  placeholder="support@mermsemr.com"
                   label="Email Address"
                   name="email"
                   type="email"

src/components/AuthPages/SignUp/index.jsx

@@ -22,11 +22,11 @@ export default function SignUp() {
               </div>
               */}
               <div className="thumbnail flex justify-center">
-               {/*<img src={loginThumb} alt="login-thumb" /> */} 
+                {/*<img src={loginThumb} alt="login-thumb" /> */}
               </div>
               <div className="article w-[600px]">
                 <p className="text-[60px] font-bold leading-[72px] text-white">
-                Welcome to myFit
+                  Welcome to myFit
                 </p>
               </div>
             </div>
@@ -37,7 +37,7 @@ export default function SignUp() {
                     <h1 className="sm:text-5xl text-4xl font-bold  text-dark-gray dark:text-white leading-2">
                       Create Account
                     </h1>
-                    <div className="shape sm:w-[377px] w-[280px] -mt-2.5 ml-5">
+                    <div className="shape sm:w-[377px] w-[280px] mb-[10px] ml-5">
                       <img src={titleShape} alt="shape" />
                     </div>
                   </div>

src/components/Home/SellHistoryMarketVisitorAnalytic.jsx

@@ -104,9 +104,7 @@ export default function SellHistoryMarketVisitorAnalytic({ className }) {
       }`}
     >
       <div className="content-wrapper w-full  lg:flex xl:space-x-8 lg:space-x-4">
-        <div className="lg:w-1/2 w-full mb-10 lg:mb-0">
-          <SellHistoryWidget />
-        </div>
+
         <div className="flex-1 ">
           <div className="market-visitor w-full  md:p-8 p-4 h-full bg-white dark:bg-dark-white   overflow-hidden rounded-2xl  section-shadow">
             <div className="flex flex-col justify-between h-full">
@@ -127,6 +125,11 @@ export default function SellHistoryMarketVisitorAnalytic({ className }) {
             </div>
           </div>
         </div>
+        
+        <div className="lg:w-1/2 w-full mb-10 lg:mb-0">
+          <SellHistoryWidget />
+        </div>
+
       </div>
     </div>
   );

src/components/Reminders/index.jsx

@@ -1,12 +1,29 @@
-import React from "react";
-import HistoryAnalyticsCard from "../Cards/HistoryAnalyticsCard";
-import Layout from "../Partials/Layout";
-import ReminderTable from "./ReminderTable";
+import React from 'react'
+import HistoryAnalyticsCard from '../Cards/HistoryAnalyticsCard'
+import Layout from '../Partials/Layout'
+import ReminderTable from './ReminderTable'
+import { Link } from 'react-router-dom'
 
 export default function Reminders() {
   return (
     <>
       <Layout>
+        <div className="content-wrapper-profile-only w-full mb-6">
+          <div className="auth-tab-content relative mb-10">
+            <div className="lg:flex justify-between">
+              <div className="tab-items"></div>
+              <div style={{ transform: 'translateY(-22px)' }}>
+                <Link
+                  to="/add-reminder"
+                  className="btn-gradient lg:flex hidden w-[153px] h-[46px] rounded-full text-white justify-center items-center"
+                >
+                  Add Reminder
+                </Link>
+              </div>
+            </div>
+            <div className="hidden lg:block w-full h-[1px] bg-[#DCD5FE] dark:bg-[#5356fb29] absolute top-[42px] left-0"></div>
+          </div>
+        </div>
         <div className="history-wrapper w-full mb-10">
           <div className="main-wrapper w-full">
             <ReminderTable />
@@ -14,5 +31,5 @@ export default function Reminders() {
         </div>
       </Layout>
     </>
-  );
+  )
 }

src/components/Settings/Tabs/LoginActivityTab.jsx

@@ -8,246 +8,135 @@ export default function LoginActivityTab() {
         <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
           <tbody>
             <tr className="text-base text-thin-light-gray border-b dark:border-[#5356fb29]  default-border-b dark:border-[#5356fb29] ottom ">
-              <td className="py-4 text-center">OS</td>
-              <td className="py-4 text-center">Browser</td>
+              <td className="py-4 text-center">Channel</td>
+              <td className="py-4 text-center">Date</td>
               <td className="py-4 text-center">Location</td>
-              <td className="py-4 text-center">Last session</td>
-              <td className="py-4 text-center">Status</td>
-              <td className="py-4 text-center"></td>
             </tr>
             <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
               <td className="text-center py-4">
                 <div className="flex items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    Windows
+                    Desktop
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <div className="flex space-x-1 items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    Google Chrome
+                    10-10-2035
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <span className="text-base text-dark-gray dark:text-white whitespace-nowrap px-2">
-                  Dhaka , Bangladesh
+                  10.0.0.1000
                 </span>
               </td>
-              <td className="text-center py-4">
-                <span className="text-base text-thin-light-gray font-medium whitespace-nowrap px-2">
-                  2 days ago
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <span className="text-sm px-[10px]  py-[6px] rounded-full bg-light-green text-white capitalize">
-                  active
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <button
-                  type="button"
-                  className=" text-thin-light-gray hover:text-red-400"
-                >
-                  <Icons name="deep-delete" />
-                </button>
-              </td>
             </tr>
             <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
               <td className="text-center py-4">
                 <div className="flex items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    Mac
+                    Desktop
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <div className="flex space-x-1 items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    Firefox
+                    10-10-2035
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <span className="text-base text-dark-gray dark:text-white whitespace-nowrap px-2">
-                  Tokyo,japan
+                  10.0.0.1000
                 </span>
               </td>
-              <td className="text-center py-4">
-                <span className="text-base text-thin-light-gray font-medium whitespace-nowrap px-2">
-                  5 days ago
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <span className="text-sm px-[10px]  py-[6px] rounded-full bg-light-red text-white capitalize">
-                  Inactive
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <button
-                  type="button"
-                  className=" text-thin-light-gray hover:text-red-400"
-                >
-                  <Icons name="deep-delete" />
-                </button>
-              </td>
             </tr>
             <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
               <td className="text-center py-4">
                 <div className="flex items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    App
+                    Desktop
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <div className="flex space-x-1 items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    App
+                    10-10-2035
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <span className="text-base text-dark-gray dark:text-white whitespace-nowrap px-2">
-                  Barhin,Dubai
+                  10.0.0.1000
                 </span>
               </td>
-              <td className="text-center py-4">
-                <span className="text-base text-thin-light-gray font-medium whitespace-nowrap px-2">
-                  2 days ago
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <span className="text-sm px-[10px]  py-[6px] rounded-full bg-light-green text-white capitalize">
-                  active
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <button
-                  type="button"
-                  className=" text-thin-light-gray hover:text-red-400"
-                >
-                  <Icons name="deep-delete" />
-                </button>
-              </td>
             </tr>
             <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
               <td className="text-center py-4">
                 <div className="flex items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    Windows
+                    Desktop
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <div className="flex space-x-1 items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    Google Chrome
+                    10-10-2035
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <span className="text-base text-dark-gray dark:text-white whitespace-nowrap px-2">
-                  Dhaka , Bangladesh
+                  10.0.0.1000
                 </span>
               </td>
-              <td className="text-center py-4">
-                <span className="text-base text-thin-light-gray font-medium whitespace-nowrap px-2">
-                  2 days ago
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <span className="text-sm px-[10px]  py-[6px] rounded-full bg-light-green text-white capitalize">
-                  active
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <button
-                  type="button"
-                  className=" text-thin-light-gray hover:text-red-400"
-                >
-                  <Icons name="deep-delete" />
-                </button>
-              </td>
             </tr>
             <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
               <td className="text-center py-4">
                 <div className="flex items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    Mac
+                    Desktop
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <div className="flex space-x-1 items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    Firefox
+                    10-10-2035
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <span className="text-base text-dark-gray dark:text-white whitespace-nowrap px-2">
-                  Tokyo,japan
+                  10.0.0.1000
                 </span>
               </td>
-              <td className="text-center py-4">
-                <span className="text-base text-thin-light-gray font-medium whitespace-nowrap px-2">
-                  5 days ago
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <span className="text-sm px-[10px]  py-[6px] rounded-full bg-light-red text-white capitalize">
-                  Inactive
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <button
-                  type="button"
-                  className=" text-thin-light-gray hover:text-red-400"
-                >
-                  <Icons name="deep-delete" />
-                </button>
-              </td>
             </tr>
             <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
               <td className="text-center py-4">
                 <div className="flex items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    App
+                    Mobile
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <div className="flex space-x-1 items-center justify-center">
                   <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap px-2">
-                    App
+                    10-10-2035
                   </span>
                 </div>
               </td>
               <td className="text-center py-4">
                 <span className="text-base text-dark-gray dark:text-white whitespace-nowrap px-2">
-                  Barhin,Dubai
+                  10.0.0.1000
                 </span>
               </td>
-              <td className="text-center py-4">
-                <span className="text-base text-thin-light-gray font-medium whitespace-nowrap px-2">
-                  2 days ago
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <span className="text-sm px-[10px]  py-[6px] rounded-full bg-light-green text-white capitalize">
-                  active
-                </span>
-              </td>
-              <td className="text-center py-4">
-                <button
-                  type="button"
-                  className=" text-thin-light-gray hover:text-red-400"
-                >
-                  <Icons name="deep-delete" />
-                </button>
-              </td>
             </tr>
           </tbody>
         </table>

src/services/SiteService.js

@@ -0,0 +1,83 @@
+import React from "react";
+import Axios from "axios";
+
+class SiteService {
+    constructor() {
+        console.log("Er are here anyway");
+    }
+    // Blog Data {Get}
+    blogData() {
+        return this.getAuxEnd("/blogdata", null);
+    }
+
+    // Country Data {GET}
+    countryData() {
+        return this.getAuxEnd("/country", null);
+    }
+
+    // Contact Data{POST}
+    contactData() {
+        return this.postAuxEnd("/contact", null)
+    }
+
+    faqData() {
+        return this.getAuxEnd("/faq", null);
+    }
+
+    priceData() {
+        return this.getAuxEnd("/pricing", null);
+    }
+
+    //----------------------------------------  -----
+    //----------------------------------------  -----
+    // Unified call below
+    //----------------------------------------  -----
+    //----------------------------------------  -----
+    getAuxEnd(uri, reqData) {
+        const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
+        return Axios.get(endPoint)
+            .then((response) => {
+                // console.log(response);
+                // res = response;
+                // console.log("~~~~~~~ Toks2 GET ~~~~~~~~");
+                return response;
+            })
+            .catch((error) => {
+                if (error.response) {
+                    //response status is an error code
+                    console.log(error.response.status);
+                } else if (error.request) {
+                    //response not received though the request was sent
+                    console.log(error.request);
+                } else {
+                    //an error occurred when setting up the request
+                    console.log(error.message);
+                }
+            });
+    }
+
+    postAuxEnd(uri, reqData) {
+        const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
+        return Axios.post(endPoint, reqData)
+            .then((response) => {
+                console.log(response);
+                // res = response;
+                console.log("~~~~~~~ Toks2 POST ~~~~~~~~");
+                return response;
+            })
+            .catch((error) => {
+                if (error.response) {
+                    //response status is an error code
+                    console.log(error.response.status);
+                } else if (error.request) {
+                    //response not received though the request was sent
+                    console.log(error.request);
+                } else {
+                    //an error occurred when setting up the request
+                    console.log(error.message);
+                }
+            });
+    }
+}
+
+export default SiteService;

src/services/UsersService.js

@@ -0,0 +1,106 @@
+import React from "react";
+import Axios from "axios";
+
+class usersService {
+    constructor() {
+        console.log("Er are here anyway");
+    }
+
+    logInUser(reqData) {
+       // debugger;
+        /*
+        clean up the request data here
+         */
+        localStorage.setItem("session_token", ``);
+        return this.postAuxEnd("/login", reqData);
+    }
+
+
+    getUserReminders(){
+        return this.getAuxEnd("/reminders", null);
+    }
+    //----------------------------------------  -----
+    //----------------------------------------  -----
+    // Unified call below
+    //----------------------------------------  -----
+    //----------------------------------------  -----
+    getAuxEnd(uri, reqData) {
+        debugger;
+        const session_token = localStorage.getItem("session_token");
+        let axiosConfig = {
+            headers: {
+                'Accept': 'application/json',
+                'Content-Type': 'application/json;charset=UTF-8',
+                'Authorization': `Basic ${session_token}`,
+            }
+        };
+        const endPoint = process.env.REACT_APP_USERS_ENDPOINT + uri;
+        return Axios.get(endPoint,axiosConfig)
+            .then((response) => {
+                // console.log(response);
+                // res = response;
+                // console.log("~~~~~~~ Toks2 GET ~~~~~~~~");
+                return response;
+            })
+            .catch((error) => {
+                if (error.response) {
+                    //response status is an error code
+                    console.log(error.response.status);
+                } else if (error.request) {
+                    //response not received though the request was sent
+                    console.log(error.request);
+                } else {
+                    //an error occurred when setting up the request
+                    console.log(error.message);
+                }
+            });
+    }
+
+
+    postAuxEnd(uri, reqData) {
+        const endPoint = process.env.REACT_APP_USERS_ENDPOINT + uri;
+        const token = '..your token..'
+        let axiosConfig = {
+            headers: {
+                'Accept': 'application/json',
+                'Access-Control-Allow-Origin': '*',
+                'Content-Type': 'application/json;charset=UTF-8',
+                'Authorization': `Basic ${token}`,
+            }
+        };
+        //Access-Control-Allow-Origin
+        var postData = {
+            email: "test@test.com",
+            password: "password"
+        };
+      //  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)
+            .then((response) => {
+                console.log(response);
+                // res = response;
+                console.log("~~~~~~~ Toks2 POST ~~~~~~~~");
+                return response;
+            })
+            .catch((error) => {
+                if (error.response) {
+                    //response status is an error code
+                    console.log("ERROR-------------------------------------------------------");
+                    console.log(error.response.status);
+                    console.log("ERROR-------------------------------------------------------");
+                } else if (error.request) {
+                    //response not received though the request was sent
+                    console.log("ERROR2-------------------------------------------------------");
+                    console.log(error.request);
+                    console.log("ERROR2-------------------------------------------------------");
+                } else {
+                    //an error occurred when setting up the request
+                    console.log("ERROR3-------------------------------------------------------");
+                    console.log(error.message);
+                    console.log("ERROR3-------------------------------------------------------");
+                }
+            });
+    }
+}
+
+export default usersService;