FrontOps/UserDashboard
5
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

✨ sidebar include customer view

Browse Source
This commit is contained in:
sam 2025-02-26 15:27:38 +08:00
parent b7d144bb66
commit c49c61dd2a
1 changed files with 51 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
components/layouts/sidebar.tsx
View File

@ -11,6 +11,7 @@ import IconMenuComponents from '@/components/icon/menu/icon-menu-components';
import { usePathname } from 'next/navigation';
import { getTranslation } from '@/i18n';
import IconCaretDown from '../icon/icon-caret-down';
import IconMinus from '../icon/icon-minus';
const Sidebar = () => {
const dispatch = useDispatch();
@ -82,6 +83,54 @@ const Sidebar = () => {
</div>
<PerfectScrollbar className="relative h-[calc(100vh-80px)]">
<ul className="relative space-y-0.5 p-4 py-0 font-semibold">
<h2 className="-mx-4 mb-1 flex items-center bg-white-light/30 px-7 py-3 font-extrabold uppercase dark:bg-dark dark:bg-opacity-[0.08]">
<IconMinus className="hidden h-5 w-4 flex-none" />
<span>Customer</span>
</h2>
<li className="menu nav-item">
<Link href="#" className="nav-link group">
<div className="flex items-center">
<IconMenuComponents className="shrink-0 group-hover:!text-primary" />
<span className="text-black ltr:pl-3 rtl:pr-3 dark:text-[#506690] dark:group-hover:text-white-dark">Sites</span>
</div>
</Link>
</li>
<li className="menu nav-item">
<Link href="#" className="nav-link group">
<div className="flex items-center">
<IconMenuComponents className="shrink-0 group-hover:!text-primary" />
<span className="text-black ltr:pl-3 rtl:pr-3 dark:text-[#506690] dark:group-hover:text-white-dark">Inverters</span>
</div>
</Link>
</li>
<li className="menu nav-item">
<button type="button" className={`nav-link group w-full`} onClick={() => toggleMenu('setting')}>
<div className="flex items-center">
<IconMenuComponents className="shrink-0 group-hover:!text-primary" />
<span className="text-black ltr:pl-3 rtl:pr-3 dark:text-[#506690] dark:group-hover:text-white-dark">Setting</span>
</div>
<div className={currentMenu !== 'setting' ? '-rotate-90 rtl:rotate-90' : ''}>
<IconCaretDown />
</div>
</button>
<AnimateHeight duration={300} height={currentMenu === 'setting' ? 'auto' : 0}>
<ul className="sub-menu text-gray-500">
<li>
<Link href="#">Profile</Link>
</li>
</ul>
</AnimateHeight>
</li>
<h2 className="-mx-4 mb-1 flex items-center bg-white-light/30 px-7 py-3 font-extrabold uppercase dark:bg-dark dark:bg-opacity-[0.08]">
<IconMinus className="hidden h-5 w-4 flex-none" />
<span>Admin</span>
</h2>
<li className="menu nav-item">
<Link href="#" className="nav-link group">
<div className="flex items-center">
@ -161,6 +210,8 @@ const Sidebar = () => {
</ul>
</AnimateHeight>
</li>
</ul>
</PerfectScrollbar>
</div>