diff --git a/src/SiteRoutes.jsx b/src/SiteRoutes.jsx
index a868b6f..e9a0064 100644
--- a/src/SiteRoutes.jsx
+++ b/src/SiteRoutes.jsx
@@ -1,4 +1,4 @@
-import { lazy, Suspense } from 'react'
+import { Suspense } from 'react'
 import { Routes, Route } from 'react-router-dom'
 import RouteLinks from './RouteLinks'
 
diff --git a/src/components/Icons.jsx b/src/components/Icons.jsx
index 5a4b03c..a946309 100644
--- a/src/components/Icons.jsx
+++ b/src/components/Icons.jsx
@@ -16,41 +16,41 @@ import { FaLongArrowAltRight, FaFilter } from "react-icons/fa";
 export default function Icons({name, className}) {
   return (
     <>
-    {name.toLowerCase() == 'dashboard' ?
+    {name.toLowerCase() === 'dashboard' ?
     <AiOutlineDashboard className={`text-base ${className}`} />
-    : name.toLowerCase() == 'money' ?
+    : name.toLowerCase() === 'money' ?
     <FaRegMoneyBill1 className={`text-base ${className}`} />
-    :name.toLowerCase() == 'dot' ?
+    :name.toLowerCase() === 'dot' ?
     <GoDotFill className={`text-base ${className}`} />
-    :name.toLowerCase() == 'people' ?
+    :name.toLowerCase() === 'people' ?
     <IoPeople className={`text-base ${className}`} />
-    :name.toLowerCase() == 'product' ?
+    :name.toLowerCase() === 'product' ?
     <AiFillProduct className={`text-base ${className}`} />
-    :name.toLowerCase() == 'trash' ?
+    :name.toLowerCase() === 'trash' ?
     <IoTrash className={`text-base ${className}`} />
-    :name.toLowerCase() == 'eye' ?
+    :name.toLowerCase() === 'eye' ?
     <FaEye className={`text-base ${className}`} />
-    :name.toLowerCase() == 'next' ?
+    :name.toLowerCase() === 'next' ?
     <TbPlayerTrackNext className={`text-base ${className}`} />
-    :name.toLowerCase() == 'prev' ?
+    :name.toLowerCase() === 'prev' ?
     <TbPlayerTrackPrev className={`text-base ${className}`} />
-    :name.toLowerCase() == 'edit' ?
+    :name.toLowerCase() === 'edit' ?
     <FaEdit className={`text-base ${className}`} />
-    :name.toLowerCase() == 'settings' ?
+    :name.toLowerCase() === 'settings' ?
     <IoMdSettings className={`text-base ${className}`} />
-    :name.toLowerCase() == 'message' ?
+    :name.toLowerCase() === 'message' ?
     <LuMessageSquareText className={`text-base ${className}`} />
-    :name.toLowerCase() == 'right-panel' ?
+    :name.toLowerCase() === 'right-panel' ?
     <LuPanelRight className={`text-base ${className}`} />
-    :name.toLowerCase() == 'google' ?
+    :name.toLowerCase() === 'google' ?
     <FcGoogle className={`text-base ${className}`} />
-    :name.toLowerCase() == 'apple' ?
+    :name.toLowerCase() === 'apple' ?
     <IoLogoApple className={`text-base ${className}`} />
-    :name.toLowerCase() == 'sales' ?
+    :name.toLowerCase() === 'sales' ?
     <FcSalesPerformance className={`text-base ${className}`} />
-    :name.toLowerCase() == 'arrow-right' ?
+    :name.toLowerCase() === 'arrow-right' ?
     <FaLongArrowAltRight className={`text-base ${className}`} />
-    :name.toLowerCase() == 'filter' ?
+    :name.toLowerCase() === 'filter' ?
     <FaFilter className={`text-base ${className}`} />
     :
     null
diff --git a/src/components/auth/LoginCom.jsx b/src/components/auth/LoginCom.jsx
index 7fed9db..f771d70 100644
--- a/src/components/auth/LoginCom.jsx
+++ b/src/components/auth/LoginCom.jsx
@@ -1,6 +1,6 @@
-import React, { useEffect, useState } from 'react'
+import React, { useState } from 'react'
 import { useDispatch } from 'react-redux'
-import { useLocation, useNavigate, Link } from 'react-router-dom'
+import { useNavigate, Link } from 'react-router-dom'
 import { useMutation } from '@tanstack/react-query'
 import {Formik, Form} from 'formik'
 import * as Yup from "yup";
@@ -10,7 +10,7 @@ import { updateUserDetails } from "../../store/UserDetails";
 import { loginUser } from '../../services/siteServices'
 
 import RouteLinks from '../../RouteLinks'
-import Icons from '../Icons'
+// import Icons from '../Icons'
 
 
 const initialValues = {
@@ -49,6 +49,7 @@ export default function LoginCom() {
             const data = {jwt_token}
             dispatch(updateUserDetails({ ...data, ...user }));
           }
+          setLoading(false)
           navigate(RouteLinks.homePage, {state:{proceed:'true'}}) // later add redux to dispatch state
     }
   })
diff --git a/src/components/breadcrumb/BreadcrumbCom.jsx b/src/components/breadcrumb/BreadcrumbCom.jsx
index d4b7b30..a5bbf88 100644
--- a/src/components/breadcrumb/BreadcrumbCom.jsx
+++ b/src/components/breadcrumb/BreadcrumbCom.jsx
@@ -1,25 +1,24 @@
-import { useEffect, useState } from 'react'
 import { MdKeyboardDoubleArrowRight } from 'react-icons/md'
 import { TiHomeOutline } from 'react-icons/ti'
 import DashboardHeader from '../layouts/DashboardHeader'
 
 export default function BreadcrumbCom({title, span, paths}) {
 
-  const [stickNav, setStickNav] = useState(false)
+  // const [stickNav, setStickNav] = useState(false)
 
-  useEffect(()=>{
-      // var rect = navRef?.current?.getBoundingClientRect()?.bottom;
-      var rect = 10;
-      window.addEventListener('scroll', ()=>{
-          if(window.scrollY >= rect + 20){
-              setStickNav(true)
-              console.log('tru')
-          }else{
-              setStickNav(false)
-              console.log('false')
-          }
-      })
-  },[])
+  // useEffect(()=>{
+  //     // var rect = navRef?.current?.getBoundingClientRect()?.bottom;
+  //     var rect = 10;
+  //     window.addEventListener('scroll', ()=>{
+  //         if(window.scrollY >= rect + 20){
+  //             setStickNav(true)
+  //             console.log('tru')
+  //         }else{
+  //             setStickNav(false)
+  //             console.log('false')
+  //         }
+  //     })
+  // },[])
 
   return (
     // ${stickNav ? 'sticky top-0 transition-[top] duration-1000 shadow-md shadow-black' : '-top-[100px] static'}
@@ -35,7 +34,7 @@ export default function BreadcrumbCom({title, span, paths}) {
               {paths.map((item, index) => (
                 <div className='flex gap-2 items-center text-black dark:text-white-body text-10 sm:text-sm' key={index}>
                   <MdKeyboardDoubleArrowRight />
-                  <p className={`${index + 1 == paths.length ? 'text-sky-600 dark:text-white-body/70' : ''}`}>{item}</p>
+                  <p className={`${index + 1 === paths.length ? 'text-sky-600 dark:text-white-body/70' : ''}`}>{item}</p>
                 </div>
               ))}
           </div>
diff --git a/src/components/customer/CustomerCom.jsx b/src/components/customer/CustomerCom.jsx
index 1ae1493..29100d3 100644
--- a/src/components/customer/CustomerCom.jsx
+++ b/src/components/customer/CustomerCom.jsx
@@ -6,9 +6,9 @@ import TablePaginatedWrapper from '../tableWrapper/TablePaginatedWrapper'
 import Icons from '../Icons'
 import { getCustomers } from '../../services/siteServices'
 import getDateFromDateString from '../../helpers/GetDateFromDateString';
-import getTimeFromDateString from '../../helpers/GetTimeFromDateString';
-import localImgLoader from '../../helpers/localImageLoader';
-import RouteLinks from '../../RouteLinks';
+// import getTimeFromDateString from '../../helpers/GetTimeFromDateString';
+// import localImgLoader from '../../helpers/localImageLoader';
+// import RouteLinks from '../../RouteLinks';
 
 export default function CustomerCom() {
 
diff --git a/src/components/home/HomeCom.jsx b/src/components/home/HomeCom.jsx
index b70ebec..b88233e 100644
--- a/src/components/home/HomeCom.jsx
+++ b/src/components/home/HomeCom.jsx
@@ -124,7 +124,7 @@ export default function HomeCom() {
                               </td>
                               <td className="px-2">
                                 <div className="text-left">
-                                    <div className="text-base font-semibold"><a href={`https://${item?.internal_url}`} target='_blank'>{item?.internal_url}</a></div>
+                                    <div className="text-base font-semibold"><a href={`https://${item?.internal_url}`} target='_blank' rel="noreferrer">{item?.internal_url}</a></div>
                                     <div className="font-normal text-gray-500">{item?.status}</div>
                                 </div> 
                               </td>
@@ -153,6 +153,8 @@ export default function HomeCom() {
                               </td>
                           </tr>
                         )
+                      }else{
+                        return null
                       }
                     }
                     )
diff --git a/src/components/layouts/DashboardHeader.jsx b/src/components/layouts/DashboardHeader.jsx
index 49a3a69..0b1785c 100644
--- a/src/components/layouts/DashboardHeader.jsx
+++ b/src/components/layouts/DashboardHeader.jsx
@@ -47,7 +47,7 @@ export default function DashboardHeader() {
 
                     {/* THEME SELECTION */}
                     <div onClick={handleTheme} className='w-10 h-10 border border-slate-300 text-slate-500 dark:text-white-body rounded-md px-2 flex justify-center items-center gap-2 cursor-pointer' title='Switch Color Mode'>
-                        {theme == 'dark' ?
+                        {theme === 'dark' ?
                         <IoMdSunny className="text-sm md:text-xl font-bold" />
                         :
                         <LuSunDim className="text-sm md:text-xl font-bold" />
@@ -56,7 +56,7 @@ export default function DashboardHeader() {
 
                     <div onClick={()=>handleActiveMenu('avatar')} className='relative cursor-pointer w-10 h-10 rounded shadow-round_black dark:shadow-round_white'>
                         <img src={UserAvatar} alt='user avatar' className='w-full h-full p-1 rounded-full' />
-                        {activeMenu == 'avatar' &&
+                        {activeMenu === 'avatar' &&
                             <div className="pop-modal z-[777] absolute p-4 w-52 sm:w-96 bg-white dark:bg-black-box right-0 top-16 rounded shadow-round_black dark:shadow-round_white">
                                 <div className="w-full h-full flex flex-col gap-4">
                                     <div className="flex flex-col text-black dark:text-white text-base sm:text-lg">
diff --git a/src/components/layouts/DashboardLayout.jsx b/src/components/layouts/DashboardLayout.jsx
index 4efdffb..5690604 100644
--- a/src/components/layouts/DashboardLayout.jsx
+++ b/src/components/layouts/DashboardLayout.jsx
@@ -17,8 +17,8 @@ export default function DashboardLayout() {
             <DashboardAside />
         </div>
 
-        <div className={`${showAsideDrawer =='aside' ? 'left-0' : '-left-full'} lg:hidden w-full fixed inset-0 z-[999]`}>
-            <div className={`${showAsideDrawer =='aside' ? 'fixed left-0 top-0 inset-0' : '-left-full'} w-full bg-[rgba(0,_0,_0,_0.2)] dark:bg-[rgba(0,_0,_0,_0.4)] transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')} ></div>
+        <div className={`${showAsideDrawer ==='aside' ? 'left-0' : '-left-full'} lg:hidden w-full fixed inset-0 z-[999]`}>
+            <div className={`${showAsideDrawer ==='aside' ? 'fixed left-0 top-0 inset-0' : '-left-full'} w-full bg-[rgba(0,_0,_0,_0.2)] dark:bg-[rgba(0,_0,_0,_0.4)] transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')} ></div>
             <div className={`fixed px-8 py-4 h-full w-4/5 sm:w-[400px] bg-white-aside dark:bg-black-aside dark:text-white-light`}>
                 <DashboardAside />
             </div>
@@ -45,9 +45,9 @@ export default function DashboardLayout() {
             <div className={`px-8 py-4 hidden large:flex fixed right-5 top-0 bottom-0 sm:w-[400px] bg-[#192440] dark:bg-[#1E1E2D] text-white-body`}>
                 <RightAsideBar />
             </div>
-            <div className={`${showAsideDrawer =='right-aside' ? 'right-0 w-full' : '-right-full w-0'} fixed inset-0 z-[999] large:hidden bg-[rgba(0,_0,_0,_0.2)] dark:bg-[rgba(0,_0,_0,_0.4)] transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')}>
-                {/* <div className={`${showAsideDrawer =='right-aside' ? 'right-0' : '-right-full'} fixed z-[999] right-0 top-0 inset-0 w-full bg-white/20 bg-red-400 transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')} ></div> */}
-                <div onClick={(e)=>e.stopPropagation()} className={`${showAsideDrawer =='right-aside' ? 'right-0' : '-right-full'} fixed z-[999] top-0 botom-0 px-8 py-4 h-full w-4/5 sm:w-[400px] bg-[#192440] dark:bg-[#1E1E2D] text-white-body`}>
+            <div className={`${showAsideDrawer ==='right-aside' ? 'right-0 w-full' : '-right-full w-0'} fixed inset-0 z-[999] large:hidden bg-[rgba(0,_0,_0,_0.2)] dark:bg-[rgba(0,_0,_0,_0.4)] transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')}>
+                {/* <div className={`${showAsideDrawer ==='right-aside' ? 'right-0' : '-right-full'} fixed z-[999] right-0 top-0 inset-0 w-full bg-white/20 bg-red-400 transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')} ></div> */}
+                <div onClick={(e)=>e.stopPropagation()} className={`${showAsideDrawer ==='right-aside' ? 'right-0' : '-right-full'} fixed z-[999] top-0 botom-0 px-8 py-4 h-full w-4/5 sm:w-[400px] bg-[#192440] dark:bg-[#1E1E2D] text-white-body`}>
                     <RightAsideBar />
                 </div>
             </div>
diff --git a/src/components/layouts/HandBurger.jsx b/src/components/layouts/HandBurger.jsx
index b3dbf14..79ef012 100644
--- a/src/components/layouts/HandBurger.jsx
+++ b/src/components/layouts/HandBurger.jsx
@@ -11,21 +11,21 @@ export default function HandBurger({showAside, barColor}) {
     ></div> */}
       <div
         className={`absolute left-0 w-5 h-1 rounded-md ${barColor ? barColor :'bg-black-box'} dark:bg-white-light ${
-        showAside =='aside'
+        showAside ==='aside'
             ? "bottom-1/2 translate-y-1/2 rotate-45"
             : ""
         }`}
     ></div>
     <div
         className={`absolute left-0 top-1/2 -translate-y-1/2 w-5 h-1 rounded-md ${barColor ? barColor :'bg-black-box/50'} dark:bg-white-light transition-all duration-300 ${
-        showAside =='aside'
+        showAside ==='aside'
             ? "rotate-[2000deg] opacity-0"
             : ""
         }`}
     ></div>
     <div
         className={`absolute left-0 w-5 h-1 rounded-md ${barColor ? barColor :'bg-black-box/50'} dark:bg-white-light ${
-        showAside =='aside'
+        showAside ==='aside'
             ? "top-1/2 -translate-y-1/2 -rotate-45"
             : "bottom-0"
         }`}
diff --git a/src/components/layouts/aside/AsideLink.jsx b/src/components/layouts/aside/AsideLink.jsx
index 6f7ba00..ba37753 100644
--- a/src/components/layouts/aside/AsideLink.jsx
+++ b/src/components/layouts/aside/AsideLink.jsx
@@ -10,7 +10,7 @@ export default function AsideLink({name, to, icon}) {
 
   return (
     <Link 
-        className={`w-full flex items-center gap-2 px-4 py-2 my-1 text-[13px] sm:text-sm font-semibold rounded-md hover:bg-white dark:hover:bg-black-box text-slate-500 dark:text-white-body/80 ${pathname == to ? 'bg-white-body dark:bg-black-box' : ''}`} 
+        className={`w-full flex items-center gap-2 px-4 py-2 my-1 text-[13px] sm:text-sm font-semibold rounded-md hover:bg-white dark:hover:bg-black-box text-slate-500 dark:text-white-body/80 ${pathname === to ? 'bg-white-body dark:bg-black-box' : ''}`} 
         to={to}
         onClick={()=>setShowAsideDrawer(false)}
     >   
diff --git a/src/components/layouts/aside/AsideLinkWithSubLinks.jsx b/src/components/layouts/aside/AsideLinkWithSubLinks.jsx
index 32f7aac..873c41b 100644
--- a/src/components/layouts/aside/AsideLinkWithSubLinks.jsx
+++ b/src/components/layouts/aside/AsideLinkWithSubLinks.jsx
@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { useLocation } from "react-router-dom"
+// import { useLocation } from "react-router-dom"
 import { FaCaretDown } from "react-icons/fa";
 import Icons from "../../Icons";
 import { GeneralLayoutContext } from "../../../context/GeneralLayoutContext";
@@ -9,9 +9,9 @@ export default function AsideLinkWithSubLinks({name, icon, to, children, isOpen}
 
     const {shrinkAside} = GeneralLayoutContext()
 
-  const {pathname} = useLocation()
+//   const {pathname} = useLocation()
 
-  const isMatchedPath = pathname.split('/').includes('')
+//   const isMatchedPath = pathname.split('/').includes('')
   // isMatchedPath.splice(0,1)
 
   const [hideSubMenu, setHideSubMenu] = useState(isOpen)
diff --git a/src/components/layouts/aside/DashboardAside.jsx b/src/components/layouts/aside/DashboardAside.jsx
index 61bfe0c..232e97f 100644
--- a/src/components/layouts/aside/DashboardAside.jsx
+++ b/src/components/layouts/aside/DashboardAside.jsx
@@ -4,7 +4,7 @@ import DummyLogo from "../../DummyLogo";
 import MainBtn from "../../MainBtn";
 import AsideLink from "./AsideLink";
 import AsideLinkWithSubLinks from "./AsideLinkWithSubLinks";
-import { useSelector } from "react-redux";
+// import { useSelector } from "react-redux";
 import { GeneralLayoutContext } from "../../../context/GeneralLayoutContext";
 import { TbLogout2 } from "react-icons/tb";
 import UserAvatar from '../../../assets/user_avatar.jpg'
@@ -14,10 +14,10 @@ export default function DashboardAside() {
 
     const {pathname} = useLocation()
 
-    const {setLogoutModal, activeMenu, handleActiveMenu} = GeneralLayoutContext()
+    const {setLogoutModal, handleActiveMenu} = GeneralLayoutContext()
 
-    const {userDetails} = useSelector((state) => state.userDetails) // GETS LOGGED IN USER ROLE DETAILS
-    const {role}= userDetails
+    // const {userDetails} = useSelector((state) => state.userDetails) // GETS LOGGED IN USER ROLE DETAILS
+    // const {role}= userDetails
 
   return (
     <div className='w-full h-full flex flex-col'>
@@ -28,7 +28,7 @@ export default function DashboardAside() {
 
         <div className="aside-scroll-design w-full flex flex-col gap-2 h-full overflow-y-auto">
             {asideNavLinks.map((link, index) => {
-                let active = link.status == 1 ? true : false
+                let active = link.status === 1 ? true : false
                 let hasSubLinks = (link.subLinks && link.subLinks.length > 0) ? true : false
                 if(active && !hasSubLinks){
                     return (
@@ -53,10 +53,10 @@ export default function DashboardAside() {
                         {link.title &&
                             <h1 className="px-4 py-2 text-sm sm:text-sm text-slate-500 dark:text-white font-semibold uppercase mt-3 mb-1 border-b border-slate-500 dark:border-white">{link.title}</h1>
                         }
-                        <AsideLinkWithSubLinks name={link.name} icon={link.icon} isOpen={subLinkList.includes(pathname) || index==1} >
+                        <AsideLinkWithSubLinks name={link.name} icon={link.icon} isOpen={subLinkList.includes(pathname) || index===1} >
                             <>
                             {link.subLinks.map((subItem, index)=>{
-                                let active = subItem.status == 1 ? true : false
+                                let active = subItem.status === 1 ? true : false
                                 let hasSubLinks = (subItem.subLinks && subItem.subLinks.length > 0) ? true : false
                                 if(active && !hasSubLinks){
                                     return (
@@ -74,13 +74,15 @@ export default function DashboardAside() {
                                         <AsideLinkWithSubLinks key={subItem.name} name={subItem.name} icon={subItem.icon} isOpen={subLinkList.includes(pathname)}>
                                             <>
                                             {subItem.subLinks.map((item, index)=>{
-                                                let active = item.status == 1 ? true : false
+                                                let active = item.status === 1 ? true : false
                                                 if(active){
                                                     return (
                                                     <div key={index}>
                                                         <AsideLink key={index} to={item.to} name={item.name} icon={item.icon} />
                                                     </div>
                                                 )
+                                                }else{
+                                                    return null
                                                 }
                                             })}
                                             </>
@@ -94,6 +96,8 @@ export default function DashboardAside() {
                         </AsideLinkWithSubLinks>
                     </div>
                     )
+                }else{
+                    return null
                 }
             })}
         </div>
diff --git a/src/components/layouts/rightaside/Orders.jsx b/src/components/layouts/rightaside/Orders.jsx
index 9d224c7..3322ec4 100644
--- a/src/components/layouts/rightaside/Orders.jsx
+++ b/src/components/layouts/rightaside/Orders.jsx
@@ -39,7 +39,7 @@ export default function Orders() {
                 <div className='flex flex-col gap-4'>
                     <div className='flex gap-3 items-center'>
                         <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                            <img src={Img} className='w-8' alt="Order Image" />
+                            <img src={Img} className='w-8' alt="Order" />
                         </div>
                         <div className='flex-col'>
                             <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -48,7 +48,7 @@ export default function Orders() {
                     </div>
                     <div className='flex gap-3 items-center'>
                         <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                            <img src={Img} className='w-8' alt="Order Image" />
+                            <img src={Img} className='w-8' alt="Order" />
                         </div>
                         <div className='flex-col'>
                             <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -57,7 +57,7 @@ export default function Orders() {
                     </div>
                     <div className='flex gap-3 items-center'>
                         <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                            <img src={Img} className='w-8' alt="Order Image" />
+                            <img src={Img} className='w-8' alt="Order" />
                         </div>
                         <div className='flex-col'>
                             <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -66,7 +66,7 @@ export default function Orders() {
                     </div>
                     <div className='flex gap-3 items-center'>
                         <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                            <img src={Img} className='w-8' alt="Order Image" />
+                            <img src={Img} className='w-8' alt="Order" />
                         </div>
                         <div className='flex-col'>
                             <p className='text-base font-bold text-white-body'>Project Briefing</p>
diff --git a/src/components/layouts/rightaside/RightAsideBar.jsx b/src/components/layouts/rightaside/RightAsideBar.jsx
index 73b34d2..714fcf4 100644
--- a/src/components/layouts/rightaside/RightAsideBar.jsx
+++ b/src/components/layouts/rightaside/RightAsideBar.jsx
@@ -17,21 +17,21 @@ export default function RightAsideBar() {
     <div className='w-full h-full flex flex-col gap-8'>
         {/* Menu */}
         <div className='grid grid-cols-3 gap-8'>
-            <button name='orders' onClick={() => handleActiveMenu('orders')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'orders' && 'scale-[1.2]'}`}>
+            <button name='orders' onClick={() => handleActiveMenu('orders')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active === 'orders' && 'scale-[1.2]'}`}>
                 <Icons name='dashboard' className='text-3xl' />
             </button>
-            <button name='tickets' onClick={() => handleActiveMenu('tickets')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'tickets' && 'scale-[1.2]'}`}>
+            <button name='tickets' onClick={() => handleActiveMenu('tickets')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active === 'tickets' && 'scale-[1.2]'}`}>
                 <Icons name='settings' className='text-3xl' />
             </button>
-            <button name='tasks' onClick={() => handleActiveMenu('tasks')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'tasks' && 'scale-[1.2]'}`}>
+            <button name='tasks' onClick={() => handleActiveMenu('tasks')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active === 'tasks' && 'scale-[1.2]'}`}>
                 <Icons name='dashboard' className='text-3xl' />
             </button>
         </div>
 
         {/* Body */}
-        {active == 'orders' && <Orders />}
-        {active == 'tickets' && <Tickets />}
-        {active == 'tasks' && <Tasks />}
+        {active === 'orders' && <Orders />}
+        {active === 'tickets' && <Tickets />}
+        {active === 'tasks' && <Tasks />}
     </div>
   )
 }
diff --git a/src/components/layouts/rightaside/Tasks.jsx b/src/components/layouts/rightaside/Tasks.jsx
index 61acbeb..a6d38fe 100644
--- a/src/components/layouts/rightaside/Tasks.jsx
+++ b/src/components/layouts/rightaside/Tasks.jsx
@@ -39,7 +39,7 @@ export default function Tasks() {
                 <div className='flex flex-col gap-4'>
                     <div className='flex gap-3 items-center'>
                         <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                            <img src={Img} className='w-8' alt="Order Image" />
+                            <img src={Img} className='w-8' alt="Order" />
                         </div>
                         <div className='flex-col'>
                             <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -48,7 +48,7 @@ export default function Tasks() {
                     </div>
                     <div className='flex gap-3 items-center'>
                         <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                            <img src={Img} className='w-8' alt="Order Image" />
+                            <img src={Img} className='w-8' alt="Order" />
                         </div>
                         <div className='flex-col'>
                             <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -57,7 +57,7 @@ export default function Tasks() {
                     </div>
                     <div className='flex gap-3 items-center'>
                         <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                            <img src={Img} className='w-8' alt="Order Image" />
+                            <img src={Img} className='w-8' alt="Order" />
                         </div>
                         <div className='flex-col'>
                             <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -66,7 +66,7 @@ export default function Tasks() {
                     </div>
                     <div className='flex gap-3 items-center'>
                         <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                            <img src={Img} className='w-8' alt="Order Image" />
+                            <img src={Img} className='w-8' alt="Order" />
                         </div>
                         <div className='flex-col'>
                             <p className='text-base font-bold text-white-body'>Project Briefing</p>
diff --git a/src/components/layouts/rightaside/Tickets.jsx b/src/components/layouts/rightaside/Tickets.jsx
index e5a8570..37d6d00 100644
--- a/src/components/layouts/rightaside/Tickets.jsx
+++ b/src/components/layouts/rightaside/Tickets.jsx
@@ -39,7 +39,7 @@ export default function Tickets() {
             <div className='flex flex-col gap-4'>
                 <div className='flex gap-3 items-center'>
                     <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                        <img src={Img} className='w-8' alt="Order Image" />
+                        <img src={Img} className='w-8' alt="Order" />
                     </div>
                     <div className='flex-col'>
                         <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -48,7 +48,7 @@ export default function Tickets() {
                 </div>
                 <div className='flex gap-3 items-center'>
                     <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                        <img src={Img} className='w-8' alt="Order Image" />
+                        <img src={Img} className='w-8' alt="Order" />
                     </div>
                     <div className='flex-col'>
                         <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -57,7 +57,7 @@ export default function Tickets() {
                 </div>
                 <div className='flex gap-3 items-center'>
                     <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                        <img src={Img} className='w-8' alt="Order Image" />
+                        <img src={Img} className='w-8' alt="Order" />
                     </div>
                     <div className='flex-col'>
                         <p className='text-base font-bold text-white-body'>Project Briefing</p>
@@ -66,7 +66,7 @@ export default function Tickets() {
                 </div>
                 <div className='flex gap-3 items-center'>
                     <div className='px-4 py-2 bg-[#0E172E] rounded-md'>
-                        <img src={Img} className='w-8' alt="Order Image" />
+                        <img src={Img} className='w-8' alt="Order" />
                     </div>
                     <div className='flex-col'>
                         <p className='text-base font-bold text-white-body'>Project Briefing</p>
diff --git a/src/components/loan_charges/BillingsCom.jsx b/src/components/loan_charges/BillingsCom.jsx
index 650f001..124c7d2 100644
--- a/src/components/loan_charges/BillingsCom.jsx
+++ b/src/components/loan_charges/BillingsCom.jsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 import { useQuery } from '@tanstack/react-query'
 import queryKeys from '../../services/queryKeys'
 
@@ -7,8 +7,8 @@ import TablePaginatedWrapper from '../tableWrapper/TablePaginatedWrapper'
 import Icons from '../Icons'
 import { getBillings } from '../../services/siteServices'
 import getDateTimeFromDateString from '../../helpers/getDateTimeFromDateString';
-import formatNumber from '../../helpers/formatNumber'
-import Avatar from '../../assets/user_avatar.jpg'
+// import formatNumber from '../../helpers/formatNumber'
+// import Avatar from '../../assets/user_avatar.jpg'
 
 
 export default function BillingsCom() {
diff --git a/src/components/loanscom/LoansCom.jsx b/src/components/loanscom/LoansCom.jsx
index 1d0b061..79ecad3 100644
--- a/src/components/loanscom/LoansCom.jsx
+++ b/src/components/loanscom/LoansCom.jsx
@@ -111,7 +111,7 @@ export default function LoansCom() {
                                         <tr key={index} className="py-2 border-t border-dashed border-slate-300">
                                             <td className="px-2 py-2">
                                                 <div className='w-full min-w-48 flex items-center gap-2 whitespace-nowrap'>
-                                                <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese image" />
+                                                <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese" />
                                                 <div className="text-left">
                                                     <div className="text-base font-semibold">{item?.account_id || ''}</div>
                                                     <div className="font-normal text-gray-500">{item?.id} : {item?.transaction_id}</div>
diff --git a/src/components/offers/OffersCom.jsx b/src/components/offers/OffersCom.jsx
index c2ad21a..79d6a99 100644
--- a/src/components/offers/OffersCom.jsx
+++ b/src/components/offers/OffersCom.jsx
@@ -8,7 +8,7 @@ import Icons from '../Icons'
 import Avatar from '../../assets/user_avatar.jpg'
 import queryKeys from '../../services/queryKeys'
 import { getOffers } from '../../services/siteServices'
-import getDateFromDateString from '../../helpers/GetDateFromDateString';
+// import getDateFromDateString from '../../helpers/GetDateFromDateString';
 import formatNumber from '../../helpers/formatNumber';
 
 export default function OffersCom() {
@@ -72,7 +72,7 @@ export default function OffersCom() {
                                         <tr key={index} className="py-2 border-t border-dashed border-slate-300">
                                             <td className="px-2 py-2">
                                                 <div className='w-full min-w-48 flex items-center gap-2 whitespace-nowrap'>
-                                                <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese image" />
+                                                <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese" />
                                                 <div className="text-left">
                                                     <div className="text-base font-semibold">{item?.product_id || ''}</div>
                                                     {/* <div className="font-normal text-gray-500 line-clamp-1">{item?.description}</div> */}
diff --git a/src/components/repayments/RepaymentsCom.jsx b/src/components/repayments/RepaymentsCom.jsx
index 3fd1749..da32dac 100644
--- a/src/components/repayments/RepaymentsCom.jsx
+++ b/src/components/repayments/RepaymentsCom.jsx
@@ -103,7 +103,7 @@ export default function RepaymentsCom() {
                                         <tr key={index} className="py-2 border-t border-dashed border-slate-300">
                                             <td className="px-2 py-2">
                                                 <div className='w-full min-w-48 flex items-center gap-2 whitespace-nowrap'>
-                                                <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese image" />
+                                                <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese" />
                                                 <div className="text-left">
                                                     <div className="text-base font-semibold">{item?.customer_id || ''}</div>
                                                     <div className="font-normal text-gray-500">{item?.loan_id} : {item?.transaction_id}</div>
diff --git a/src/components/tableWrapper/TablePaginatedWrapper.jsx b/src/components/tableWrapper/TablePaginatedWrapper.jsx
index d76c610..2e7f299 100644
--- a/src/components/tableWrapper/TablePaginatedWrapper.jsx
+++ b/src/components/tableWrapper/TablePaginatedWrapper.jsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+// import { useState } from "react";
 import MainBtn from "../MainBtn";
 import Icons from "../Icons";
 
diff --git a/src/components/transactionDetails/LoanChargeDetails.jsx b/src/components/transactionDetails/LoanChargeDetails.jsx
index 0f6f99b..ce7559f 100644
--- a/src/components/transactionDetails/LoanChargeDetails.jsx
+++ b/src/components/transactionDetails/LoanChargeDetails.jsx
@@ -1,7 +1,7 @@
 import React, { useState } from 'react'
 import { useQuery } from "@tanstack/react-query";
 
-import Icons from '../Icons'
+// import Icons from '../Icons'
 
 import Avatar from '../../assets/user_avatar.jpg'
 import queryKeys from '../../services/queryKeys'
@@ -58,7 +58,7 @@ export default function LoanChargeDetails({transactionID}) {
                             <tr key={index} className="py-2 border-t border-dashed border-slate-300">
                                 <td className="px-2 py-2">
                                     <div className='w-full min-w-48 flex items-center gap-2 whitespace-nowrap'>
-                                    <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese image" />
+                                    <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese" />
                                     <div className="text-left">
                                         <div className="text-base font-semibold">{item?.transaction_id || ''}</div>
                                         {/* <div className="font-normal text-gray-500 line-clamp-1">{item?.description}</div> */}
diff --git a/src/components/transactionDetails/LoanDetails.jsx b/src/components/transactionDetails/LoanDetails.jsx
index 04fbab5..e5e4b4d 100644
--- a/src/components/transactionDetails/LoanDetails.jsx
+++ b/src/components/transactionDetails/LoanDetails.jsx
@@ -62,7 +62,7 @@ export default function LoanDetails({transactionID}) {
                             <tr key={index} className="py-2 border-t border-dashed border-slate-300">
                                 <td className="px-2 py-2">
                                     <div className='w-full min-w-48 flex items-center gap-2 whitespace-nowrap'>
-                                    <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese image" />
+                                    <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese" />
                                     <div className="text-left">
                                         <div className="text-base font-semibold">{item?.account_id || ''}</div>
                                         <div className="font-normal text-gray-500">{item?.id} : {item?.transaction_id}</div>
diff --git a/src/components/transactionDetails/RepaymentScheduleDetails.jsx b/src/components/transactionDetails/RepaymentScheduleDetails.jsx
index 74fa97a..035a419 100644
--- a/src/components/transactionDetails/RepaymentScheduleDetails.jsx
+++ b/src/components/transactionDetails/RepaymentScheduleDetails.jsx
@@ -68,7 +68,7 @@ export default function RepaymentScheduleDetails({transactionID}) {
                             <tr key={index} className="py-2 border-t border-dashed border-slate-300">
                                 <td className="px-2 py-2">
                                     <div className='w-full min-w-48 flex items-center gap-2 whitespace-nowrap'>
-                                    <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese image" />
+                                    <img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese" />
                                     <div className="text-left">
                                         <div className="text-base font-semibold">{item?.loan_id || ''}</div>
                                         {/* <div className="font-normal text-gray-500 line-clamp-1">{item?.description}</div> */}
diff --git a/src/components/transactions/SubscriptionsCom.jsx b/src/components/transactions/SubscriptionsCom.jsx
index 6f176cf..4e0f077 100644
--- a/src/components/transactions/SubscriptionsCom.jsx
+++ b/src/components/transactions/SubscriptionsCom.jsx
@@ -1,5 +1,5 @@
-import { useEffect, useState } from 'react'
-import {Link} from 'react-router-dom'
+import { useState } from 'react'
+// import {Link} from 'react-router-dom'
 import { useQuery } from '@tanstack/react-query'
 import queryKeys from '../../services/queryKeys'
 
@@ -8,8 +8,8 @@ import TablePaginatedWrapper from '../tableWrapper/TablePaginatedWrapper'
 import Icons from '../Icons'
 import { getSubscriptions } from '../../services/siteServices'
 import getDateTimeFromDateString from '../../helpers/getDateTimeFromDateString';
-import localImgLoader from '../../helpers/localImageLoader';
-import RouteLinks from '../../RouteLinks';
+// import localImgLoader from '../../helpers/localImageLoader';
+// import RouteLinks from '../../RouteLinks';
 
 export default function SubscriptionsCom() {
 
diff --git a/src/context/GeneralLayoutContext.jsx b/src/context/GeneralLayoutContext.jsx
index 0be00e3..f2d792b 100644
--- a/src/context/GeneralLayoutContext.jsx
+++ b/src/context/GeneralLayoutContext.jsx
@@ -21,7 +21,7 @@ export default function GeneralLayoutContextInt({children}) {
     const [showAsideDrawer, setShowAsideDrawer] = useState('')
 
     const handleActiveMenu = (name) => {
-        if(activeMenu == name){
+        if(activeMenu === name){
             setActiveMenu('')
         }else{
             setActiveMenu(name)
@@ -32,7 +32,7 @@ export default function GeneralLayoutContextInt({children}) {
       setDrawer((prev)=>{
         if(!prev){
           return drawerToOpen
-        }else if(drawerToOpen == prev){
+        }else if(drawerToOpen === prev){
           return ''
         }else{
           return drawerToOpen
@@ -44,7 +44,7 @@ export default function GeneralLayoutContextInt({children}) {
       setBooking((prev)=>{
         if(!prev){
           return bookingToOpen
-        }else if(bookingToOpen == prev){
+        }else if(bookingToOpen === prev){
           return ''
         }else{
           return bookingToOpen
diff --git a/src/pages/TransactionDetailsPage.jsx b/src/pages/TransactionDetailsPage.jsx
index fcec4ed..b6901e1 100644
--- a/src/pages/TransactionDetailsPage.jsx
+++ b/src/pages/TransactionDetailsPage.jsx
@@ -11,7 +11,7 @@ export default function TransactionDetailsPage() {
     if(!state?.transactionID){
         navigate('/', {replace: true})
     }
-  },[])
+  },[state])
   return (
     <TransactionDetailsCom id={state?.transactionID} />
   )