import { FC, useState } from "react";
import {
Box,
Grid,
Typography,
List,
ListItemButton,
ListItemIcon,
ListItemText,
ListItemSecondaryAction,
Drawer,
Collapse,
} from "@mui/material";
import {
FeaturedPlayList as FeaturedPlayListIcon,
Person as PersonIcon,
Analytics as AnalyticsIcon,
Logout as LogoutIcon,
Cottage as CottageIcon,
Settings as SettingsIcon,
ExpandCircleDown as ExpandCircleDownIcon,
} from "@mui/icons-material";
import { useRouter } from "next/router";
import Link from "next/link";
import Image from "next/image";
import LinkLogo from "public/link-logo-small.png";
import { useSession } from "next-auth/react";
const openWidth = 270;
const closedWidth = 100;
const MenuItem = ({
name,
href,
Icon,
iconSize,
inset = false,
selected = false,
open = true,
badge,
}: any) => (
{iconSize > 0 ? (
) : (
)}
{open && (
{name}
}
/>
)}
{badge && (
{badge}
)}
);
interface SidebarProps {
open: boolean;
setOpen: (open: boolean) => void;
}
export const Sidebar: FC = ({ open, setOpen }) => {
const { pathname } = useRouter();
const { data: session } = useSession();
const username = session?.user?.name || "User";
return (
{
setOpen!(!open);
}}
>
.
{open && (
CDR Link
)}
Hello
{open
? username
: username
.split(" ")
.map((name) => name.substring(0, 1))
.join("")}
{/*
*/ }
{/*
*/}
);
};