implemented reminders list api

.vscode/settings.json

@@ -8,7 +8,7 @@
   },
   "[javascriptreact]": {
     "editor.formatOnSave": true,
-    "editor.defaultFormatter": null
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
   "javascript.validate.enable": false, //disable all built-in syntax checking
   "editor.codeActionsOnSave": {

src/components/AuthPages/Login/index.jsx

@@ -1,6 +1,6 @@
 import React, { useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { toast } from "react-toastify";
+// 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";
@@ -49,14 +49,12 @@ export default function Login() {
         localStorage.setItem("profile", `${JSON.stringify(loginResult.data.profile)}`);
         setLoginLoading(true);
          // userApi.getUserReminders(); //testing
-        setTimeout(() => {
-          toast.success("Login Successfully");
+        setTimeout(() => {         
           navigate("/", { replace: true });
           setLoginLoading(false);
           dispatch(updateUserInfo(loginResult.data.profile))
         }, 2000);
       } else {
-        // toast.error("Invalid Credential");
         setLoginError(true)
       }
     }

src/components/Helpers/Accordion.jsx

@@ -26,7 +26,7 @@ export default function Accordion({ datas }) {
             </span>
           </div>
           <div className="accordion-title w-full">
-            <p className="text-18 tracking-wide   text-dark-gray dark:text-white">
+            <p className="text-18 tracking-wide   text-dark-gray dark:text-white cursor-default">
               {datas.title}
             </p>
           </div>
@@ -35,7 +35,7 @@ export default function Accordion({ datas }) {
           <div className="accordion-body-content flex space-x-4 sm:pl-10 pl-5 pt-5">
             <div className="w-[3px] h-auto bg-purple rounded-[28px]"></div>
             <div className="flex-1">
-              <p className="text-base text-thin-light-gray tracking-wide">
+              <p className="text-base text-thin-light-gray tracking-wide cursor-default">
                 {datas.content}
               </p>
             </div>

src/components/Reminders/ReminderTable.jsx

@@ -1,11 +1,28 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import dataImage1 from "../../assets/images/data-table-user-1.png";
-import dataImage2 from "../../assets/images/data-table-user-2.png";
-import dataImage3 from "../../assets/images/data-table-user-3.png";
-import dataImage4 from "../../assets/images/data-table-user-4.png";
+import usersService from "../../services/UsersService";
 import SelectBox from "../Helpers/SelectBox";
 
 export default function ReminderTable({ className }) {
+  const [userReminders, setUserReminders] = useState([]);
+
+  const api = new usersService();
+  useEffect(() => {
+    getUserReminders();
+  }, []);
+
+  const getUserReminders = async () => {
+    try {
+      const res = await api.getUserReminders();
+     
+      setUserReminders(res.data.reminders);
+      console.log("res", res);
+      
+    } catch (error) {
+      console.log("Error from User Reminders", error);
+    }
+  };
+
   const filterCategories = ["All Categories", "Doctors Visit", "Medications"];
   const [selectedCategory, setCategory] = useState(filterCategories[0]);
   return (
@@ -39,8 +56,62 @@ export default function ReminderTable({ className }) {
             </tr>
 
             {selectedCategory === "All Categories" ? (
+
               <>
-                <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
+               {userReminders.map((reminders, index) => ( 
+
+                <tr key={reminders.id} className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
+                  <td className=" py-4">
+                    <div className="flex space-x-2 items-center">
+                      <div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
+                        <img
+                          src={dataImage1}
+                          alt="data"
+                          className="w-full h-full"
+                        />
+                      </div>
+                      <div className="flex flex-col">
+                        <h1 className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
+                          Pizza Testing Appointament
+                        </h1>
+                        <span className="text-sm text-thin-light-gray">
+                        
+                          Added <span className="text-purple">{reminders.added}</span>
+                        </span>
+                      </div>
+                    </div>
+                  </td>
+                  <td className="text-center py-4 px-2">
+                    <div className="flex space-x-1 items-center justify-center">
+           
+                      <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap">
+                      {reminders.start_date}
+                      </span>
+                    </div>
+                  </td>
+                  <td className="text-center py-4 px-2">
+                    <div className="flex space-x-1 items-center justify-center">
+                      <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap">
+                      {reminders.end_date}
+                      </span>
+                    </div>
+                  </td>
+                  <td className="text-right py-4 px-2">
+                    <span className="text-base text-thin-light-gray whitespace-nowrap">
+                     {reminders.reminder}
+                    </span>
+                  </td>
+                  <td className="text-right py-4 px-2">
+                    <button
+                      type="button"
+                      className="text-sm text-white bg-purple px-2.5 py-1.5 rounded-full"
+                    >
+                      Edit
+                    </button>
+                  </td>
+                </tr>
+              ))}
+                {/* <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
                   <td className=" py-4">
                     <div className="flex space-x-2 items-center">
                       <div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
@@ -186,57 +257,9 @@ export default function ReminderTable({ className }) {
                       Edit
                     </button>
                   </td>
-                </tr>
-                <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
-                  <td className=" py-4">
-                    <div className="flex space-x-2 items-center">
-                      <div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
-                        <img
-                          src={dataImage1}
-                          alt="data"
-                          className="w-full h-full"
-                        />
-                      </div>
-                      <div className="flex flex-col">
-                        <h1 className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
-                          Pizza Testing Appointament
-                        </h1>
-                        <span className="text-sm text-thin-light-gray">
-                          Added <span className="text-purple">10-10-2025</span>
-                        </span>
-                      </div>
-                    </div>
-                  </td>
-                  <td className="text-center py-4 px-2">
-                    <div className="flex space-x-1 items-center justify-center">
-           
-                      <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap">
-                        12-01-25 : 6:30 PM
-                      </span>
-                    </div>
-                  </td>
-                  <td className="text-center py-4 px-2">
-                    <div className="flex space-x-1 items-center justify-center">
-                      <span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap">
-                      12-01-28 : 6:30 PM
-                      </span>
-                    </div>
-                  </td>
-                  <td className="text-right py-4 px-2">
-                    <span className="text-base text-thin-light-gray whitespace-nowrap">
-                     4
-                    </span>
-                  </td>
-                  <td className="text-right py-4 px-2">
-                    <button
-                      type="button"
-                      className="text-sm text-white bg-purple px-2.5 py-1.5 rounded-full"
-                    >
-                      Edit
-                    </button>
-                  </td>
-                </tr>
+                </tr> */}
               </>
+            
             ) : selectedCategory === "Doctors Visit" ? (
               <>
                 <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">

src/components/Settings/index.jsx

@@ -95,7 +95,7 @@ export default function Settings() {
             <div className="content-container w-full pt-10 rounded-2xl bg-white dark:bg-dark-white  ">
               <div className="content-heading w-full mb-8 lg:px-10 px-4">
                 <h1 className="text-xl font-bold text-dark-gray dark:text-white antialiased">
-                  Parsonal Informaiton
+                  Personal Information
                 </h1>
               </div>
               <div className="content-body w-full lg:flex lg:px-10 px-4">
@@ -144,7 +144,7 @@ export default function Settings() {
                       </div>
                       <div>
                         <p className="text-18 tracking-wide">
-                          Notifiction Setting
+                          Notification Settings
                         </p>
                       </div>
                     </li>

src/data/faq.json

@@ -2,38 +2,33 @@
   "datas": [
     {
       "id": 0,
-      "title": "Can I resell an NFT?",
-      "content": "What you do own when you buy an NFT are the keys to a non-fungible – perhaps unique – token. That token is yours to trade or hold or display in Decentraland. But the digital file associated with an NFT is just as easy to copy and paste and download as any other – the Finally, players lose their NFTs sometimes according to the rules and regulations of the NFT game. What you do own when you buy an NFT are the keys to a non-fungible – perhaps unique – token. That token is yours to trade or hold or display in Decentraland. But the digital file associated with an NFT is just as easy to copy and paste and download as any other – the Finally, players lose their NFTs sometimes according to the rules and regulations of the NFT game"
+      "title": "What is myFit App?",
+      "content": "myFit is your personal health care concierge. this app helps you to manage the intricacies of your daily and long term health activities. With myFit, your health record is yours at all point, you decide your provider access as needed from time to time."
     },
     {
       "id": 1,
-      "title": "What can you do with an NFT after buying it?",
-      "content": "What you do own when you buy an NFT are the keys to a non-fungible – perhaps unique – token. That token is yours to trade or hold or display in Decentraland. But the digital file associated with an NFT is just as easy to copy and paste and download as any other – the Finally, players lose their NFTs sometimes according to the rules and regulations of the NFT game."
+      "title": "How can I manage my health plan with myFit?",
+      "content": "myFit learns and help You to keep track of all aspects of your health - physical, mental and emotional. It bestow your unique lifestyle, needs and comprehensive well-being."
     },
     {
       "id": 2,
-      "title": "Can you lose money on NFT?",
-      "content": "What you do own when you buy an NFT are the keys to a non-fungible – perhaps unique – token. That token is yours to trade or hold or display in Decentraland. But the digital file associated with an NFT is just as easy to copy and paste and download as any other – the Finally, players lose their NFTs sometimes according to the rules and regulations of the NFT game."
+      "title": "What can I track with myFit?",
+      "content": "myFit automatically keeps track of physical activities, medical status & visits , schedules ,view and cancel appointments. myFit keeps your health in one place and connects you to support a healthier lifestyle."
     },
     {
       "id": 3,
-      "title": "How does NFT prove ownership?",
-      "content": "What you do own when you buy an NFT are the keys to a non-fungible – perhaps unique – token. That token is yours to trade or hold or display in Decentraland. But the digital file associated with an NFT is just as easy to copy and paste and download as any other – the Finally, players lose their NFTs sometimes according to the rules and regulations of the NFT game."
+      "title": "How can I track with myFit?",
+      "content": "Open myFit app , add information about your health, goals and save.Under each category of your choosing, select Activity, set a goal , see your progress."
     },
     {
       "id": 4,
-      "title": "How can you tell if someone owns an NFT?",
-      "content": "What you do own when you buy an NFT are the keys to a non-fungible – perhaps unique – token. That token is yours to trade or hold or display in Decentraland. But the digital file associated with an NFT is just as easy to copy and paste and download as any other – the Finally, players lose their NFTs sometimes according to the rules and regulations of the NFT game."
+      "title": "How secure is myFit App?",
+      "content": "myFit technology works synchronously with information you choose to share and will be encrypted and stored on a dedicated server so that MyFit can provide you with personalized, healthy decisions. MyFit is built to keep your data secure and protect your privacy. Your data is encrypted and you are always in control of your information."
     },
     {
       "id": 5,
-      "title": "Can you lose more than you invest in NFTs?",
-      "content": "What you do own when you buy an NFT are the keys to a non-fungible – perhaps unique – token. That token is yours to trade or hold or display in Decentraland. But the digital file associated with an NFT is just as easy to copy and paste and download as any other – the Finally, players lose their NFTs sometimes according to the rules and regulations of the NFT game."
-    },
-    {
-      "id": 6,
-      "title": "What can you do with an NFT after buying it?",
-      "content": "What you do own when you buy an NFT are the keys to a non-fungible – perhaps unique – token. That token is yours to trade or hold or display in Decentraland. But the digital file associated with an NFT is just as easy to copy and paste and download as any other – the Finally, players lose their NFTs sometimes according to the rules and regulations of the NFT game."
+      "title": "What kind of device do I need?",
+      "content": "All you need is iPhone or Android device to enjoy all personalized metrics for personal use. Instant free download from apple and play store."
     }
   ]
 }

src/middleware/AuthRoute.jsx

@@ -1,9 +1,30 @@
-import { Navigate, Outlet } from "react-router-dom";
+import React, {useEffect} from "react";
+import { Navigate, Outlet, useNavigate } from "react-router-dom";
+import { toast } from "react-toastify";
 
 const AuthRoute = ({ redirectPath = "/login", children }) => {
   const isLogin = localStorage.getItem("email");
   const profile = localStorage.getItem("profile")
 
+  const navigate = useNavigate();
+
+  //FUNCTION TO EXPIRE SESSION AFETR 5 MINUTES
+  const expireSession = () => {
+    localStorage.removeItem("email");
+    localStorage.removeItem('session_token');
+    localStorage.removeItem('profile');
+    // navigate("/login", { replace: true });
+  };
+
+  useEffect(()=>{
+    setTimeout(()=>{
+      expireSession()
+      toast.success("Opps, session has expired", {
+        icon: `🙂`,
+      });
+    }, 300000) //expires user login session after 5 minutes
+  },[])
+
   if (!isLogin || !profile || (typeof JSON.parse(profile) == 'object' && JSON.parse(profile).firstname == undefined)) {
     return <Navigate to={redirectPath} replace />;
   }

src/services/UsersService.js

@@ -1,4 +1,3 @@
-import React from "react";
 import Axios from "axios";
 
 class usersService {
@@ -24,7 +23,7 @@ class usersService {
     //----------------------------------------  -----
     //----------------------------------------  -----
     getAuxEnd(uri, reqData) {
-        debugger;
+        // debugger;
         const session_token = localStorage.getItem("session_token");
         let axiosConfig = {
             headers: {

src/store/userInfo.js

@@ -1,7 +1,7 @@
 import { createSlice } from "@reduxjs/toolkit";
 
 const initialState = {
-  userInfo: JSON.parse(localStorage.getItem("profile"))
+  userInfo: localStorage.getItem('profile') && JSON.parse(localStorage.getItem("profile"))
 };
 
 export const userSlice = createSlice({

src/views/HomePages.jsx

@@ -1,29 +1,11 @@
 import React, {useEffect} from "react";
 import Home from "../components/Home";
-import { useNavigate } from "react-router-dom";
 import { useDispatch, useSelector } from "react-redux";
-import { toast } from "react-toastify";
+// 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 />

tailwind.config.js

@@ -19,6 +19,9 @@ module.exports = {
         "dark-light-purple":"#5356fb29"
       },
     },
+    listStyleType: {
+      roman: 'upper-roman'
+    },
   },
   plugins: [require("@tailwindcss/line-clamp")],
 };