implemented reminders list api

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 usersService from "../../services/UsersService";
-import dataImage3 from "../../assets/images/data-table-user-3.png";
-import dataImage4 from "../../assets/images/data-table-user-4.png";
 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> */}
-                <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>
               </>
+            
             ) : selectedCategory === "Doctors Visit" ? (
               <>
                 <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">

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: {