File size: 2,408 Bytes
cc276cc | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 | import Link from "next/link";
import {
MessageSquare,
Phone,
Settings,
ShieldCheck,
} from 'lucide-react';
import { cn } from '@/lib/utils';
import { Button } from '@/components/ui/button';
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from '@/components/ui/tooltip';
import { UserData } from "@/lib/types";
import { UserNav } from "./user-nav";
interface SidebarProps {
isCollapsed: boolean;
loggedInUser: UserData;
}
export function Sidebar({ isCollapsed, loggedInUser }: SidebarProps) {
return (
<div
data-collapsed={isCollapsed}
className="relative flex h-full w-16 flex-col justify-between border-r bg-card p-2"
>
<TooltipProvider delayDuration={0}>
<div className="flex flex-col items-center gap-2">
<div className="p-2">
<ShieldCheck className="h-8 w-8 text-primary" />
</div>
<nav className="grid gap-2 place-content-center">
<Tooltip>
<TooltipTrigger asChild>
<Link href="/">
<Button
variant="ghost"
size="icon"
className="rounded-lg bg-muted"
aria-label="Chats"
>
<MessageSquare className="size-5" />
</Button>
</Link>
</TooltipTrigger>
<TooltipContent side="right" sideOffset={5}>
Chats
</TooltipContent>
</Tooltip>
{/* <Tooltip>
<TooltipTrigger asChild>
<Link href="/calls">
<Button
variant="ghost"
size="icon"
className="rounded-lg"
aria-label="Calls"
>
<Phone className="size-5" />
</Button>
</Link>
</TooltipTrigger>
<TooltipContent side="right" sideOffset={5}>
Calls
</TooltipContent>
</Tooltip> */}
</nav>
</div>
</TooltipProvider>
<div className="flex flex-col items-center gap-2">
<UserNav user={loggedInUser} />
</div>
</div>
);
}
|