-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
11 changed files
with
1,103 additions
and
332 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,12 @@ | ||
import DashboardLayout from '@/components/Shared/DashboardLayout'; | ||
import { Suspense } from 'react'; | ||
import Loading from './loading'; | ||
|
||
// This is a Server Component | ||
export default function Layout({ children }: { children: any }) { | ||
return <DashboardLayout>{children}</DashboardLayout>; | ||
return ( | ||
<DashboardLayout> | ||
<Suspense fallback={<Loading />}>{children}</Suspense> | ||
</DashboardLayout> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
export default function Loading() { | ||
return ( | ||
// <div className="w-full h-full space-y-4"> | ||
// <div className="w-[200px] h-10 flex flex-col gap-2"> | ||
// <Skeleton className="h-4 w-3/5 rounded-lg" /> | ||
// <Skeleton className="h-4 w-4/5 rounded-lg bg-slate-200 animate-in" /> | ||
// </div> | ||
|
||
// <div className="w-full h-full"> | ||
// <Skeleton className="flex rounded-lg w-full h-full bg-slate-200" /> | ||
// </div> | ||
// </div> | ||
<div className="w-full h-full flex items-center justify-center"> | ||
<p>Loading...</p> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -81,15 +81,17 @@ const SideBar = () => { | |
}, []); | ||
return ( | ||
<div | ||
className={`fixed bg-white w-[50vw] h-[100dvh] z-50 md:h-full md:z-0 md:relative px-2 py-5 rounded-l-xl flex flex-col items-center gap-8 dark:bg-[#0c0c0d] transition-all duration-600 ${ | ||
className={`fixed bg-white w-[50vw] h-[100dvh] z-50 md:h-full md:z-0 md:relative px-4 py-5 rounded-l-xl flex flex-col items-start gap-8 dark:bg-[#0c0c0d] transition-all duration-600 ${ | ||
isOpen | ||
? '-translate-x-[100%] md:translate-x-0 md:w-[6vw]' | ||
: 'translate-x-0 md:w-[15vw]' | ||
? 'items-center -translate-x-[100%] md:translate-x-0 md:w-[6vw]' | ||
: 'items-start translate-x-0 md:w-[15vw]' | ||
} `} | ||
> | ||
<div className="flex items-center text-lg py-3 text-[#551fff]"> | ||
<div className="flex items-center gap-1 py-3 text-[#551fff]"> | ||
<BiAtom className="w-6 h-6" /> | ||
<h1 className={`${isOpen && 'md:hidden'}`}>Nucleus</h1> | ||
<h1 className={`${isOpen && 'md:hidden'} font-semibold text-base`}> | ||
Nucleus | ||
</h1> | ||
</div> | ||
|
||
<div | ||
|
@@ -102,45 +104,45 @@ const SideBar = () => { | |
<TbSquareRoundedChevronsLeftFilled className="w-10 h-10 md:w-6 md:h-6" /> | ||
)} | ||
</div> | ||
<div className="h-full flex flex-col justify-between"> | ||
<div className="w-full h-fit pb-4 border-b gap-1 flex flex-col justify-between"> | ||
{links.map((item, idx) => ( | ||
<Link | ||
href={item.links} | ||
key={idx} | ||
className={`flex items-center justify-center ${ | ||
isOpen ? ' rounded-full' : 'rounded-3xl' | ||
} p-3 gap-2 cursor-pointer hover:text-[#551FFF] hover:bg-[#F3F0FF] ${ | ||
className={`flex w-full items-center ${ | ||
isOpen | ||
? 'justify-center rounded-full' | ||
: 'justify-start rounded-lg' | ||
} p-3 cursor-pointer hover:text-[#551FFF] hover:bg-[#F3F0FF] ${ | ||
currentPath == item.links | ||
? 'bg-[#F3F0FF] text-[#551FFF]' | ||
: 'text-[#D0D2DA]' | ||
: 'text-[#9e9fa1]' | ||
}`} | ||
title={isOpen ? item.name : ''} | ||
> | ||
<span | ||
className={`flex items-center | ||
${isOpen ? ' justify-center' : 'justify-start w-20 gap-2'} | ||
className={`flex items-center | ||
${isOpen ? '' : ' w-20 gap-2'} | ||
`} | ||
> | ||
<div>{item.icon}</div> | ||
<div> | ||
{!isOpen && ( | ||
<h1 className={`leading-none w-full text-sm capitalize `}> | ||
{item.name} | ||
</h1> | ||
)} | ||
</div> | ||
{!isOpen && ( | ||
<h1 className={`leading-none w-full text-sm capitalize `}> | ||
{item.name} | ||
</h1> | ||
)} | ||
</span> | ||
</Link> | ||
))} | ||
<button | ||
className={`flex items-center justify-center ${ | ||
isOpen ? 'rounded-full' : 'rounded-3xl' | ||
} p-3 gap-2 cursor-pointer hover:text-[#551FFF] text-[#D0D2DA] hover:bg-[#F3F0FF] `} | ||
className={`flex w-full items-center ${ | ||
isOpen ? 'justify-center rounded-full' : ' justify-start rounded-lg' | ||
} p-3 cursor-pointer hover:text-[#551FFF] text-[#9e9fa1] hover:bg-[#F3F0FF] `} | ||
title={isOpen ? 'LogOut' : ''} | ||
onClick={() => handleLogout()} | ||
> | ||
<span | ||
className={`flex items-center | ||
className={`flex items-center | ||
${isOpen ? ' justify-center' : 'justify-start w-20 gap-2 '} | ||
`} | ||
> | ||
|
@@ -157,7 +159,9 @@ const SideBar = () => { | |
</span> | ||
</button> | ||
</div> | ||
<ToggleTheme /> | ||
<div className="w-full flex items-center justify-center"> | ||
<ToggleTheme /> | ||
</div> | ||
|
||
<div | ||
className={`"line-clamp-1 flex items-center justify-start gap-2 text-lg py-1 ${ | ||
|
@@ -166,18 +170,16 @@ const SideBar = () => { | |
> | ||
<div className="relative w-6 h-6 rounded-full overflow-hidden"> | ||
<Image | ||
src={ | ||
userDetails.avatar == '' ? '/corporate.jpg' : userDetails.avatar | ||
} | ||
src={userDetails.avatar ?? '/corporate.jpg'} | ||
layout="fill" | ||
alt="user" | ||
/> | ||
</div> | ||
<div className={`${isOpen && 'md:hidden'}`}> | ||
<h1 className="text-sm font-semibold line-clamp-1 capitalize"> | ||
{userDetails.fullName} | ||
{userDetails.fullName ?? 'John Doe'} | ||
</h1> | ||
<p className="text-xs">{userDetails.email}</p> | ||
<p className="text-xs">{userDetails.email ?? '[email protected]'}</p> | ||
</div> | ||
</div> | ||
</div> | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.