diff options
| author | MohamedBassem <me@mbassem.com> | 2024-02-08 15:14:23 +0000 |
|---|---|---|
| committer | MohamedBassem <me@mbassem.com> | 2024-02-08 15:15:21 +0000 |
| commit | 80bb8a108f29331cdb2f2695f6801beee104dc89 (patch) | |
| tree | b1ae2a512963a9c916c4bfed71f7633f508de131 /packages/web/app/dashboard/components/Sidebar.tsx | |
| parent | 333429adbaaa592cc96b480a5228f0e3f1de4cc2 (diff) | |
| download | karakeep-80bb8a108f29331cdb2f2695f6801beee104dc89.tar.zst | |
[refactor] Move the different packages to the package subdir
Diffstat (limited to 'packages/web/app/dashboard/components/Sidebar.tsx')
| -rw-r--r-- | packages/web/app/dashboard/components/Sidebar.tsx | 56 |
1 files changed, 56 insertions, 0 deletions
diff --git a/packages/web/app/dashboard/components/Sidebar.tsx b/packages/web/app/dashboard/components/Sidebar.tsx new file mode 100644 index 00000000..0ed87daf --- /dev/null +++ b/packages/web/app/dashboard/components/Sidebar.tsx @@ -0,0 +1,56 @@ +import { Button } from "@/components/ui/button"; +import { authOptions } from "@/lib/auth"; +import { Archive, MoreHorizontal, Star, Tag, Home, Brain} from "lucide-react"; +import { getServerSession } from "next-auth"; +import Link from "next/link"; +import { redirect } from "next/navigation"; + +function SidebarItem({ + name, + logo, + path, +}: { + name: string; + logo: React.ReactNode; + path: string; +}) { + return ( + <li className="rounded-lg px-3 py-2 hover:bg-slate-100"> + <Link href={path} className="flex w-full space-x-2"> + {logo} + <span className="my-auto"> {name} </span> + </Link> + </li> + ); +} + +export default async function Sidebar() { + const session = await getServerSession(authOptions); + if (!session) { + redirect("/"); + } + + return ( + <aside className="flex flex-col h-full w-60 border-r p-4"> + <div className="flex px-1 mb-5 items-center rounded-lg text-slate-900"> + <Brain /> + <span className="ml-2 text-base font-semibold">Remember</span> + </div> + <hr /> + <div> + <ul className="space-y-2 mt-5 text-sm font-medium"> + <SidebarItem logo={<Home />} name="Home" path="#" /> + <SidebarItem logo={<Star />} name="Favourites" path="#" /> + <SidebarItem logo={<Archive />} name="Archived" path="#" /> + <SidebarItem logo={<Tag />} name="Tags" path="#" /> + </ul> + </div> + <div className="mt-auto flex justify-between"> + <div className="my-auto"> {session.user.name} </div> + <Button variant="ghost" className="h-10 w-30"> + <MoreHorizontal /> + </Button> + </div> + </aside> + ); +} |
