Analysis/report

package.json

@@ -28,6 +28,7 @@
     "react-router-dom": "^6.4.0",
     "react-scripts": "5.0.1",
     "react-toastify": "^9.0.8",
+    "recharts": "^2.2.0",
     "sass": "^1.56.1",
     "typescript": "^4.8.3",
     "uuid": "^9.0.0",
@@ -38,7 +39,8 @@
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "eject": "react-scripts eject",
+    "deploy" : " yarn build && scp -r build [email protected]:/www/providesk-frontend"
   },
   "eslintConfig": {
     "extends": [

src/apis/utils/date.utils.ts

@@ -1,10 +1,17 @@
 import moment from 'moment';
 
-export const DateFormate = (date: string) =>
-  date ? moment(date).format('lll') : '_';
+export const DateFormate = (date: string) => {
+  return date ? moment(date).format('lll') : '_';
+};
 
 export const getLastDaysFrom = (date: string) => {
   return moment().diff(moment(date), 'days') < 7
     ? moment(date).fromNow()
     : moment(date).format('ll');
 };
+
+export const dateDifferenceInDays = (first: string) => {
+  let date1 = moment(first);
+  let date2 = moment();
+  return date2.diff(date1, 'days');
+};

src/hooks/constants.ts

@@ -6,6 +6,9 @@ const API_CONSTANTS = {
   USER_LIST: 'USER_LIST',
   COMPLAINT_LIST: 'COMPLAINT_LIST',
   ORGANZIATION_LIST: 'ORGANZIATION_LIST',
+  ASK_FOR_UPDATE: 'ASK_FOR_UPDATE',
+  OVERDUE_TICKET_LIST: 'OVERDUE_TICKET_LIST',
+  ANALYTICAL_REPORTS: 'ANALYTICAL_REPORTS',
 };
 
 export default API_CONSTANTS;

src/layouts/sidebar/index.tsx

@@ -102,9 +102,10 @@ export default function Sidebar() {
             </IconButton>
             <Box display={'flex'} sx={{ cursor: 'pointer' }}>
               <img
-                src='./images/providesk-logo.svg'
+                src='/images/providesk-logo.svg'
                 alt='ProviDesk'
                 height={28}
+                onClick={() => navigate(ROUTE.DASHBOARD)}
               />
             </Box>
           </Box>

src/layouts/sidebar/sidebarConfig.tsx

@@ -6,6 +6,7 @@ import DomainIcon from '@mui/icons-material/Domain';
 import CategoryIcon from '@mui/icons-material/Category';
 import ApartmentIcon from '@mui/icons-material/Apartment';
 import ConfirmationNumberIcon from '@mui/icons-material/ConfirmationNumber';
+import TimelineRoundedIcon from '@mui/icons-material/TimelineRounded';
 import GroupIcon from '@mui/icons-material/Group';
 
 export const getSidebarConfig = (role: string) => {
@@ -15,11 +16,6 @@ export const getSidebarConfig = (role: string) => {
       icon: <DashboardIcon fontSize='small' />,
       path: ROUTE.DASHBOARD,
     },
-    {
-      label: 'Ticket',
-      icon: <ConfirmationNumberIcon fontSize='small' />,
-      path: ROUTE.TICKET,
-    },
   ];
 
   const adminAccessSidebar = [
@@ -39,6 +35,7 @@ export const getSidebarConfig = (role: string) => {
       icon: <GroupIcon fontSize='small' />,
       path: ROUTE.USERS,
     },
+    { label: 'Reports', path: ROUTE.REPORTS, icon: <TimelineRoundedIcon /> },
   ];
 
   const superAdminAccessSidebar = [
@@ -61,6 +58,11 @@ export const getSidebarConfig = (role: string) => {
       icon: <GroupIcon fontSize='small' />,
       path: ROUTE.USERS,
     },
+    { label: 'Reports', path: ROUTE.REPORTS, icon: <TimelineRoundedIcon /> },
+  ];
+  const resolverAccessSidebar = [
+    ...employeeAccessSidebar,
+    { label: 'Reports', path: ROUTE.REPORTS, icon: <TimelineRoundedIcon /> },
   ];
 
   switch (role) {
@@ -72,6 +74,8 @@ export const getSidebarConfig = (role: string) => {
       return departmentHeadAccessSidebar;
     case ROLES.EMPLOYEE:
       return employeeAccessSidebar;
+    case ROLES.RESOLVER:
+      return resolverAccessSidebar;
     default:
       return [];
   }

src/modules/Auth/auth.scss

@@ -1,60 +1,9 @@
 @import 'stylesheets/core';
 
-.auth-wrapper {
-  background-color: $primary-light;
-  flex-direction: column;
-  gap: 0;
-
-  @media (min-width: 992px) {
-    background-color: transparent;
-    flex-direction: row;
-  }
-}
-
-.img-box,
-.auth-box {
-  padding: 1rem;
-
-  @media (min-width: 992px) {
-    height: 100%;
-    flex: 1;
-  }
-}
-
-.img-box {
-
-
-  .auth-heading {
-    display: block;
-  }
-
-  @media (min-width: 992px) {
-
-    .auth-heading {
-      display: none;
-    }
-  }
-}
-
-.auth-box {
-
-  .auth-heading {
-    display: none;
-  }
-
-  @media (min-width: 992px) {
-    background-color: $primary-light;
-
-    .auth-heading {
-      display: block;
-    }
-  }
-}
-
 .img-auth {
-  width: 80%;
+  width: 18rem;
 
-  @media (min-width: 992px) {
-    width: 24rem;
+  @media (max-width: 575.98px) {
+    width: 100%;
   }
 }

src/modules/Auth/components/Loader.tsx

@@ -3,15 +3,16 @@ import CircularProgress from '@mui/material/CircularProgress';
 
 interface IProps {
   isLoading: boolean;
-  top?: string
+  top?: string;
 }
 
-const Loader: React.FC<IProps> = ({ isLoading, top='64' }) => (
+const Loader: React.FC<IProps> = ({ isLoading, top = '64' }) => (
   <Backdrop
     sx={{
-      color: '#fff',
+      // color: '#fff',
+      background: '#FFFFFF99',
       zIndex: (theme) => theme.zIndex.drawer + 1,
-      top: `${top}px`
+      top: `${top}px`,
     }}
     open={isLoading}
     onClick={() => {}}