Non functional

client/src/routes/sections.jsx

@@ -1,8 +1,7 @@
 import { lazy, Suspense } from 'react';
 import { Outlet, Navigate, useRoutes, useParams } from 'react-router-dom';
 
-import { CircularProgress } from '@mui/material';
-import ReactLoading from 'react-loading';
+import CircularProgress from '@mui/material/CircularProgress';
 
 import DashboardLayout from 'src/layouts/dashboard';
 
@@ -72,7 +71,7 @@ export default function Router() {
       {
         path: 'profile/:id',
         element: <ProfilePage />
-      },
+      }
     ],
     Doctor: [
       { path: 'products', element: <ProductsPage /> },
@@ -89,7 +88,7 @@ export default function Router() {
       {
         path: 'profile/:id',
         element: <ProfilePage />
-      },
+      }
     ],
     Pharmacist: [
       { path: 'products', element: <ProductsPage /> },
@@ -103,7 +102,7 @@ export default function Router() {
       {
         path: 'profile/:id',
         element: <ProfilePage />
-      },
+      }
     ],
     Admin: [
       { path: 'requests', element: <RequestsPage /> },
@@ -114,7 +113,7 @@ export default function Router() {
       {
         path: 'profile/:id',
         element: <ProfilePage />
-      },
+      }
     ]
   };
 
@@ -130,12 +129,14 @@ export default function Router() {
       ) : (
         <Navigate to="/login" replace />
       ),
-      children: [{ index: true, element: <IndexPage /> },
-      {
-        path: 'reset-password',
-        element: <ResetPage />
-      },
-      ...(userRoutes[role] || [])]
+      children: [
+        { index: true, element: <IndexPage /> },
+        {
+          path: 'reset-password',
+          element: <ResetPage />
+        },
+        ...(userRoutes[role] || [])
+      ]
     },
     {
       path: 'login',
@@ -150,11 +151,6 @@ export default function Router() {
       path: 'forgot-password',
       element: <ForgotPage />
     },
-    {
-      path: '404',
-      element: <Page404 />
-    },
-
     {
       path: '*',
       element: <Navigate to="/404" replace />

client/src/sections/addSlotsOrAppointment/view-slots.jsx

@@ -1,27 +1,30 @@
-import { useState } from 'react';
-import { useQuery } from 'react-query';
-
+import React, { useState, useEffect } from 'react';
 import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
 import Divider from '@mui/material/Divider';
 import Button from '@mui/material/Button';
 import Box from '@mui/material/Box';
-
+import { useQuery, useMutation } from 'react-query';
+import CircularProgress from '@mui/material/CircularProgress';
+import Snackbar from '@mui/material/Snackbar';
 import { axiosInstance } from '../../utils/axiosInstance';
 
 export default function ViewSlots() {
+  const [message, setMessage] = useState('');
+  const [openSnackbar, setOpenSnackbar] = useState(false);
   const {
     isLoading,
     error,
     data: weeklySlots
   } = useQuery(`mySlots`, () => axiosInstance.get(`/me/weeklySlots`).then((res) => res.data.result), {
     refetchOnWindowFocus: false
   });
-
-  if (isLoading) return null;
-
-  if (error) return 'An error has occurred';
-
+  if (isLoading) return <CircularProgress style={{ position: 'absolute', top: '50%', left: '50%' }} />;
+  if (error) {
+    // setOpenSnackbar(true);
+    // setMessage(error.response?.data.message || 'Network error');
+    return <div>Something went wrong ...</div>;
+  }
   const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
 
   const daySlots = (slots, day) => {
@@ -49,9 +52,8 @@ export default function ViewSlots() {
             const from = `${slot.from.hours}:${slot.from.minutes}`;
             const to = `${slot.to.hours}:${slot.to.minutes}`;
 
-            let i = 0;
             return (
-              <Stack key={i++}>
+              <Stack key={slot.id}>
                 <Button color="inherit" underline="hover" variant="subtitle2">
                   {from} - {to}
                 </Button>
@@ -64,9 +66,21 @@ export default function ViewSlots() {
     );
   };
 
+  const handleCloseSnackBar = () => {
+    setOpenSnackbar(false);
+  };
+
   return (
     <Stack direction={'row'} spacing={1} alignItems="center" justifyContent="center" sx={{ width: '900px' }}>
-      {days.map((day) => daySlots(weeklySlots[day], day))}
+      {weeklySlots && days.map((day) => daySlots(weeklySlots[day], day))}
+
+      {/* <Snackbar
+        anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
+        open={openSnackbar}
+        autoHideDuration={5000}
+        onClose={handleCloseSnackBar}
+        message={message}
+      /> */}
     </Stack>
   );
 }

client/src/sections/doctors/doctor-card.jsx

@@ -38,17 +38,15 @@ export default function DoctorCard({ i, doctor }) {
 
   let ii = 0;
   return (
-
     <Card type="section">
-
-
       <Stack direction={'row'} spacing={0} mx={3} my={4}>
         <Button
           fullWidth
           onClick={() => {
-            console.log("fffff")
+            console.log('fffff');
             window.location.href = `http://localhost:3030/profile/${doctor._id}`;
-          }}>
+          }}
+        >
           <Stack alignItems="center" justifyContent="center">
             <Avatar
               alt="User Img"
@@ -98,7 +96,7 @@ export default function DoctorCard({ i, doctor }) {
                 setCheck((prev) => !prev);
               }, 400);
             }}
-            disabled={displayedDays === 0}
+            disabled={displayedDays <= 0}
             sx={{
               borderRadius: '50%',
               width: '40px',
@@ -139,7 +137,7 @@ export default function DoctorCard({ i, doctor }) {
                 setCheck((prev) => !prev);
               }, 400);
             }}
-            disabled={displayedDays === 6}
+            disabled={displayedDays >= 6}
             sx={{
               borderRadius: '50%',
               width: '40px',
@@ -155,7 +153,6 @@ export default function DoctorCard({ i, doctor }) {
           </Button>}
         </Stack>
       </Stack>
-
     </Card>
   );
 }

client/src/sections/doctors/doctor-slot.jsx

@@ -24,12 +24,17 @@ export default function DoctorDaySlots({ day, slots, doctorID, doctorName }) {
   const today = daysOfWeek[new Date().getDay()];
   if (today == day) day = 'Today';
 
-  const user = { _id: localStorage.getItem('userID'), name: localStorage.getItem('userName'), email: localStorage.getItem('userEmail') };
+  const user = {
+    _id: localStorage.getItem('userID'),
+    name: localStorage.getItem('userName'),
+    email: localStorage.getItem('userEmail')
+  };
 
   const [openModal, setOpenModal] = useState(false);
   const [slot, setSlot] = useState({});
   const [family, setFamily] = useState([]);
   const [selectedUser, setSelectedUser] = useState({ id: '', name: '', email: '' });
+  const [discount, setDiscount] = useState(0);
   const [alignment, setAlignment] = useState('');
   const [openSnackbar, setOpenSnackbar] = useState(false);
   const [message, setMessage] = useState('');
@@ -50,6 +55,22 @@ export default function DoctorDaySlots({ day, slots, doctorID, doctorName }) {
   const handleSelectUser = (e, option) => {
     if (option.nationalID) option._id = user._id;
     setSelectedUser({ id: option._id, name: option.name, email: user.email });
+
+    axiosInstance
+      .get('me/package')
+      .then((res) => res.data.result)
+      .then((res) => {
+        res.forEach((userPackage) => {
+          console.log('000000', userPackage.user._id == option._id);
+          console.log(userPackage.status != 'Unsubscribed');
+          if (userPackage.status != 'Unsubscribed' && userPackage.user._id == option._id) {
+            const discount = userPackage.package.familyDiscount;
+            setDiscount(discount);
+            console.log(discount);
+            console.log(slot.sessionPrice);
+          }
+        });
+      });
   };
 
   const createAppointment = async () => {
@@ -63,8 +84,8 @@ export default function DoctorDaySlots({ day, slots, doctorID, doctorName }) {
       patientName: selectedUser.name,
       startDate: slot.startDate,
       endDate: slot.endDate,
-      sessionPrice: slot.sessionPrice,
-      patientEmail: selectedUser.email,
+      sessionPrice: slot.sessionPrice - slot.sessionPrice * (discount / 100),
+      patientEmail: selectedUser.email
     });
   };
 
@@ -81,8 +102,8 @@ export default function DoctorDaySlots({ day, slots, doctorID, doctorName }) {
             {
               name: `Appointment with Dr. ${doctorName} on ${new Date(slot.startDate).toString().slice(0, 16)}
               from ${new Date(slot.startDate).toString().slice(16, 31)} to ${new Date(slot.endDate)
-                  .toString()
-                  .slice(16, 31)}`,
+                .toString()
+                .slice(16, 31)}`,
               price: slot.sessionPrice,
               quantity: 1
             }
@@ -94,7 +115,7 @@ export default function DoctorDaySlots({ day, slots, doctorID, doctorName }) {
         window.location.href = res.data.url;
       } else {
         await axiosInstance.put(`/me/wallet`, {
-          amount: -selectedPackage.sessionPrice
+          amount: -slot.sessionPrice
         });
 
         await createAppointment();
@@ -104,6 +125,7 @@ export default function DoctorDaySlots({ day, slots, doctorID, doctorName }) {
     } catch (err) {
       setMessage(err.response?.data.message || 'Network error');
       setOpenSnackbar(true);
+      console.log(err);
     }
   };
 
@@ -194,7 +216,12 @@ export default function DoctorDaySlots({ day, slots, doctorID, doctorName }) {
               sx={{ my: 3 }}
               required
             >
-              <MenuItem key={user.id} value={'Me'} onClick={(e) => handleSelectUser(e, user)} sx={{ fontSize: 16 }}>
+              <MenuItem
+                key={user._id}
+                value={user.name}
+                onClick={(e) => handleSelectUser(e, user)}
+                sx={{ fontSize: 16 }}
+              >
                 Me
               </MenuItem>
               <Divider sx={{ fontSize: 15 }}>Family</Divider>
@@ -224,7 +251,7 @@ export default function DoctorDaySlots({ day, slots, doctorID, doctorName }) {
               </ToggleButton>
             </ToggleButtonGroup>
             <Typography variant="h6" color={'green'} sx={{ mt: 5 }}>
-              Total Price: {slot.sessionPrice} USD
+              Total Price: {Number(slot.sessionPrice) - Number(slot.sessionPrice) * (discount / 100)} USD
             </Typography>
           </Stack>
         </DialogContent>

client/src/sections/family/member-card.jsx

@@ -13,7 +13,7 @@ export default function MemberCard({ member }) {
             Name: {member.name}
           </Typography>
           <Typography variant="subtitle1" mb={1} noWrap>
-            {isRegistered ? `Natioanl ID: ${member.nationalID}` : `UserID: ${member.userID}`}
+            {isRegistered ? `UserID: ${member.userID}` : `Natioanl ID: ${member.nationalID}`}
           </Typography>
           <Typography variant="subtitle1" fontSize={18} fontFamily={'Segoe UI'}>
             Relation: {member.relation}

client/src/sections/overview/view/app-view.jsx

@@ -26,20 +26,18 @@ export default function AppView() {
     fetchWallet();
   }, []);
 
-  console.log(wallet);
-
   return (
     <Container maxWidth="xl">
-      <Typography variant="h4" sx={{ mb: 5 }}>
-        Hi, Welcome back 👋
+      <Typography variant="h4" sx={{ mb: 3 }}>
+        Welcome back 👋
       </Typography>
 
       <Typography variant="h4" sx={{ mb: 5 }}>
         My Wallet: {wallet}
       </Typography>
 
       <Grid container spacing={3}>
-        <Grid xs={12} sm={6} md={3}>
+        <Grid xs={12} sm={6} md={4}>
           <AppWidgetSummary
             title="Weekly Sales"
             total={7100}
@@ -48,7 +46,7 @@ export default function AppView() {
           />
         </Grid>
 
-        <Grid xs={12} sm={6} md={3}>
+        <Grid xs={12} sm={6} md={4}>
           <AppWidgetSummary
             title="New Users"
             total={1331}
@@ -57,7 +55,7 @@ export default function AppView() {
           />
         </Grid>
 
-        <Grid xs={12} sm={6} md={3}>
+        <Grid xs={12} sm={6} md={4}>
           <AppWidgetSummary
             title="Item Orders"
             total={115}
@@ -66,15 +64,6 @@ export default function AppView() {
           />
         </Grid>
 
-        <Grid xs={12} sm={6} md={3}>
-          <AppWidgetSummary
-            title="Bug Reports"
-            total={8}
-            color="error"
-            icon={<img alt="icon" src="/assets/icons/glass/ic_glass_message.png" />}
-          />
-        </Grid>
-
         <Grid xs={12} md={6} lg={8}>
           <AppWebsiteVisits
             title="Website Visits"