Merge branch 'capability-to-hide-history' of MyFit/users-myfit into master

.env

@@ -18,7 +18,8 @@ REACT_APP_RESOURCES="Resources"
 REACT_APP_HISTORY="History"
 
 REACT_APP_TRACKING_SHOW=1
+REACT_APP_HISTORY_SHOW=1
 
 REACT_APP_RESOURCES_SHOW=1
 
-REACT_APP_VERSION_NO="DEF-CONFIG"
+REACT_APP_VERSION_NO="DEF-CONFIG"

.env.development

@@ -18,6 +18,7 @@ REACT_APP_RESOURCES="Resources"
 REACT_APP_HISTORY="History"
 
 REACT_APP_TRACKING_SHOW=1
+REACT_APP_HISTORY_SHOW=1
 
 REACT_APP_RESOURCES_SHOW=1
 

.env.production

@@ -18,6 +18,7 @@ REACT_APP_RESOURCES="Resources"
 REACT_APP_HISTORY="History"
 
 REACT_APP_TRACKING_SHOW=0
+REACT_APP_HISTORY_SHOW=0
 
 REACT_APP_RESOURCES_SHOW=0
 

src/components/Calendar/CalendarTable.jsx

@@ -21,11 +21,11 @@ export default function CalendarTable({ className }) {
   const [value, onChange] = useState(new Date()); // value of calendar date and onchange handler for calendar
   const [remDate, setRemDate] = useState([]) // for holding dates on reminders to display on calendar
 
-  const reminderApi = new usersService(); // instantiating the API SERVICE
+  const calenderApi = new usersService(); // instantiating the API SERVICE
 
   const getUserReminders = async () => {
     try {
-      const res = await reminderApi.getUserReminders();
+      const res = await calenderApi.getUserReminders();
       if(res.status == 200 && res.data.status > 0){
         setRemDate(res.data.reminders)
         setIsLoading(false)
@@ -117,32 +117,46 @@ export default function CalendarTable({ className }) {
   );
 }
 
-const ReminderThumbnail = ({reminders}) => {
+/**
+ * Renders a list of reminder thumbnails.
+ * Each thumbnail displays the reminder's category image, description, and start date.
+ 
+ * Each object should have the following properties:
+ * - category (string): The category of the reminder.
+ * - description (string): The description of the reminder.
+ * - start_date (string): The start date of the reminder.
+ */
+const ReminderThumbnail = ({ reminders }) => {
+  const getThumbnailImage = (category) => {
+    if (!category) {
+      return dataImage1;
+    }
+    return localImgLoad(`images/${category}.png`);
+  };
+
   return (
     <div className="w-full h-full overflow-y-auto overflow-x-hidden pb-1">
       {reminders.map((reminder, index) => (
         <div key={index} className="flex space-x-2 items-center bg-slate-300 hover:bg-white mb-1 p-1 transition-all duration-500">
-        <div className="w-[30px] h-[30px] rounded-full overflow-hidden flex justify-center items-center">
-          <img
-            src={(reminder.category == null || reminder.category == '')? dataImage1: localImgLoad(`images/${reminder.category}.png`)}
-            alt="data"
-            className="w-full h-full"
-          />
-        </div>
-        <div className="flex flex-col justify-start items-start">
-          <h1 className="font-bold text-[10px] text-dark-gray dark:text-white whitespace-nowrap">
-          {reminder.description?.substring(0, 20)+ ' ...'}
-          </h1>
-          <span className="text-[8px] text-thin-light-gray">
-          
-            Added <span className="text-purple">
-              {reminder.start_date.split(' ')[0]}
+          <div className="w-[30px] h-[30px] rounded-full overflow-hidden flex justify-center items-center">
+            <img
+              src={getThumbnailImage(reminder.category)}
+              alt="data"
+              className="w-full h-full"
+            />
+          </div>
+          <div className="flex flex-col justify-start items-start">
+            <h1 className="font-bold text-[10px] text-dark-gray dark:text-white whitespace-nowrap">
+              {reminder.description?.substring(0, 20) + ' ...'}
+            </h1>
+            <span className="text-[8px] text-thin-light-gray">
+              Added <span className="text-purple">
+                {reminder.start_date.split(' ')[0]}
               </span>
-          </span>
+            </span>
+          </div>
         </div>
-      </div>
       ))}
-
     </div>
-  )
-}
+  );
+};

src/components/Partials/MobileSideBar.jsx

@@ -1,7 +1,6 @@
 import React, { useContext } from "react";
 import { NavLink } from "react-router-dom";
-import logo from "../../assets/images/myfit-logo-2.png"; //logo-2.svg";
-import logo3 from "../../assets/images/myfit-logo-2.png"; //logo-3.svg";
+import { default as logo, default as logo3 } from "../../assets/images/myfit-logo-2.png"; //logo-2.svg";
 import DarkModeContext from "../Contexts/DarkModeContext";
 import Icons from "../Helpers/Icons";
 
@@ -130,25 +129,9 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
                   </span>
                 </NavLink>
               </li>
-
-              {process.env.REACT_APP_RESOURCES_SHOW == true ?
-              <li className="item group">
-                <NavLink
-                  to="/resources"
-                  className="nav-item flex items-center justify-start space-x-3.5"
-                >
-                  <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out  bg-light-purple dark:bg-dark-light-purple  rounded-full   text-dark-gray dark:text-white">
-                    <Icons name="star" />
-                  </span>
-                  <span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
-                    {process.env.REACT_APP_RESOURCES}
-                  </span>
-                </NavLink>
-              </li>
-              :
-              <></>
-              }
-              <li className="item group">
+              
+              {(process.env.REACT_APP_HISTORY_SHOW == true) ? 
+              (<li className="item group">
                 <NavLink
                   to="/history"
                   className="nav-item flex items-center justify-start space-x-3.5"
@@ -157,10 +140,11 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
                     <Icons name="history" />
                   </span>
                   <span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
-                    History
+                  {process.env.REACT_APP_HISTORY}
                   </span>
                 </NavLink>
-              </li>
+              </li>)
+              : ''}
             </ul>
           </div>
         </div>

src/components/Partials/Sidebar.jsx

@@ -235,7 +235,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
                       sidebar ? "active flex-1" : "w-0"
                     }`}
                   >
-                    History
+                    {process.env.REACT_APP_HISTORY}
                   </span>
                 </NavLink>
               </li>

src/views/CalendarPage.jsx

@@ -2,9 +2,9 @@ import React from "react";
 import Calendar from "../components/Calendar";
 
 export default function CalendarPage() {
-    return (
-        <>
-            <Calendar />
-        </>
-    );
+  return (
+    <>
+      <Calendar />
+    </>
+  );
 }