8000 reload backup · codeonym/unilab-frontend@044e391 · GitHub
[go: up one dir, main page]
Skip to content

Commit 044e391

Browse files
codeonymcodeonym
committed
reload backup
1 parent 08f6765 commit 044e391

File tree

5 files changed

+208
-2
lines changed

5 files changed

+208
-2
lines changed

‎app/components/ui/NavLink.jsx

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
"use client"
2+
import React from 'react'
3+
import Link from "next/link"
4+
import { usePathname } from "next/navigation"
5+
import { cn } from "@lib/utils"
6+
7+
function NavLink({ bgColor, href, className, children }) {
8+
const currentPath = usePathname()
9+
return (
< 10000 /td>
10+
<Link
11+
href={href}
12+
className={cn(className, currentPath === href ? bgColor : '')}
13+
>
14+
{children}
15+
</Link>
16+
)
17+
}
18+
19+
export default NavLink

‎app/config/admin/navLinks.js

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import { MdDashboard, MdSettings, MdApps, MdBusiness, MdFileDownload, MdBarChart } from 'react-icons/md'
2+
export const navLinks = [
3+
{
4+
title: "dashboard",
5+
href: "/dashboard",
6+
icon: <MdDashboard />,
7+
},
8+
{
9+
title: "Gestion",
10+
href: "/dashboard/management",
11+
icon: <MdApps />,
12+
subMenu: [
13+
{
14+
title: "Fournisseurs",
15+
href: "/dashboard/management/providers",
16+
},
17+
{
18+
title: "Rubriques",
19+
href: "/dashboard/management/rubrics",
20+
},
21+
{
22+
title: "Personnes",
23+
href: "/dashboard/management/people",
24+
},
25+
{
26+
title: "Matériels",
27+
href: "/dashboard/management/materials",
28+
},
29+
{
30+
title: "Consommables",
31+
href: "/dashboard/management/consumables",
32+
},
33+
],
34+
},
35+
{
36+
title: "Budgets",
37+
href: "/dashboard/budgets",
38+
icon: <MdSettings />,
39+
},
40+
{
41+
title: "Structures",
42+
href: "/dashboard/structures",
43+
icon: <MdBusiness />,
44+
},
45+
{
46+
title: "Exportation",
47+
href: "/dashboard/export",
48+
icon: <MdFileDownload />,
49+
},
50+
{
51+
title: "Statistiques",
52+
href: "/dashboard/stats",
53+
icon: <MdBarChart />,
54+
},
55+
];

‎app/dashboard/@admin/components/Sidebar.jsx

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
"use client"
2+
3+
import React, { useState } from 'react'
4+
import Image from 'next/image'
5+
import { CgMenuGridO } from "react-icons/cg"
6+
import { RxCross2 } from "react-icons/rx";
7+
import NavLink from '@components/ui/NavLink'
8+
import { navLinks } from "@config/admin/navLinks"
9+
import { cn } from "@lib/utils"
10+
11+
12+
const DashboardSidebar = () => {
13+
14+
const [sidebarOpen, setSidebarOpen] = useState(true)
15+
return (
16+
<aside
17+
className={cn(
18+
`
19+
relative
20+
box-border
21+
transition-all
22+
duration-300
23+
min-h-screen
24+
border-r-2
25+
border-slate-50
26+
`,
27+
sidebarOpen
28+
? "w-0"
29+
: "w-80"
30+
)}>
31+
<label
32+
className="
33+
btn
34+
z-20
35+
text-slate-500
36+
btn-ghost
37+
hover:bg-transparent
38+
hover:text-slate-600
39+
swap
40+
swap-rotate
41+
absolute
42+
top-2
43+
left-full"
44+
>
45+
46+
{/* this hidden checkbox controls the state */}
47+
<input type="checkbox" className='hidden' onClick={() => setSidebarOpen((prev) => !prev)} />
48+
49+
{/* hamburger icon */}
50+
<CgMenuGridO className="swap-off text-2xl" />
51+
{/* close icon */}
52+
<RxCross2 className="swap-on text-2xl" />
53+
</label>
54+
<div
55+
className="
56+
pt-16
57+
max-h-screen
58+
overflow-y-auto
59+
scrollbar-thin
60+
scrollbar-thumb-slate-200
61+
scrollbar-track-slate-100
62+
scrollbar-rounded-md
63+
text-slate-500
64+
flex-shrink-0
65+
flex-col flex
66+
">
67+
{/* Logo */}
68+
<div
69+
className="
70+
pt-16
71+
flex
72+
items-center
73+
flex-col
74+
justify-between
75+
space-y-4
76+
">
77+
<Image
78+
src="/assets/images/logo.png"
79+
alt="Logo"
80+
width={120}
81+
height={30}
82+
className="" />
83+
</div>
84+
85+
<div className="divider"></div>
86+
87+
{/* Sidebar Links */}
88+
<nav className="p-4 mt-12">
89+
<ul className="menu w-full space-y-2 rounded-box">
90+
{
91+
navLinks && navLinks.map((navLink, idx) => (
92+
<li
93+
key={idx}
94+
>
95+
<NavLink bgColor="bg-slate-300" href={navLink.href}
96+
className="flex items-center p-2 font-bold hover:bg-slate-200 rounded gap-2">
97+
{navLink.icon}
98+
{navLink.title}
99+
</NavLink>
100+
{navLink?.subMenu && (
101+
<ul>
102+
{navLink.subMenu.map((subLink,idx) => (
103 6377 +
<li
104+
key={idx}
105+
>
106+
<NavLink bgColor="bg-slate-300" href={subLink.href}
107+
className="flex items-center p-2 font-bold hover:bg-slate-200 rounded gap-2">
108+
{subLink.title}
109+
</NavLink>
110+
</li>
111+
))}
112+
</ul>
113+
)}
114+
</li>
115+
))
116+
}
117+
</ul>
118+
</nav>
119+
</div>
120+
121+
</aside>
122+
)
123+
}
124+
125+
export default DashboardSidebar

‎app/dashboard/@admin/layout.jsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,16 @@
11
import React from 'react'
2+
import Sidebar from "./components/Sidebar";
3+
4+
const theme = "winter"
25
function layout({ children }) {
36
return (
4-
<main>
5-
7+
<main
8+
className='flex min-h-screen w-full'
9+
data-theme={theme}
10+
>
11+
<Sidebar />
612
<div>
13+
<input type="checkbox" value="sunset" className="toggle theme-controller" />
714
{children}
815
</div>
916
</main>

‎public/assets/images/logo.png

58.8 KB
Loading

0 commit comments

Comments
 (0)
0