MERMS/MermsFirstOffice
1
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

removed some build warnings

Browse Source
This commit was merged in pull request #5.
This commit is contained in:
victorAnumudu
2025-09-09 19:09:41 +01:00
parent b303af13f0
commit 0d9fb7976d
27 changed files with 108 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/layouts/DashboardHeader.jsx
+2 -2
View File
@@ -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">
src/components/layouts/DashboardLayout.jsx
+5 -5
View File
@@ -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>
src/components/layouts/HandBurger.jsx
+3 -3
View File
@@ -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"
}`}
src/components/layouts/aside/AsideLink.jsx
+1 -1
View File
@@ -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)}
>
src/components/layouts/aside/AsideLinkWithSubLinks.jsx
+3 -3
View File
@@ -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)
src/components/layouts/aside/DashboardAside.jsx
+12 -8
View File
@@ -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>
src/components/layouts/rightaside/Orders.jsx
+4 -4
View File
@@ -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>
src/components/layouts/rightaside/RightAsideBar.jsx
+6 -6
View File
@@ -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>
)
}
src/components/layouts/rightaside/Tasks.jsx
+4 -4
View File
@@ -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>
src/components/layouts/rightaside/Tickets.jsx
+4 -4
View File
@@ -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>