Files
openmonetis/components/sidebar/app-sidebar.tsx
Felipe Coutinho e7cb9c9db1 chore: remover seções vazias de mudanças de código
Este commit remove seções vazias de mudanças de código do arquivo de
mudanças. Isso ajuda a manter o histórico de mudanças mais limpo e
organizado, facilitando a leitura e a compreensão das alterações
realizadas no projeto.
2025-12-16 23:20:47 +00:00

80 lines
2.1 KiB
TypeScript

"use client";
import { Logo } from "@/components/logo";
import { NavMain } from "@/components/sidebar/nav-main";
import { NavSecondary } from "@/components/sidebar/nav-secondary";
import { NavUser } from "@/components/sidebar/nav-user";
import {
Sidebar,
SidebarContent,
SidebarFooter,
SidebarHeader,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
useSidebar,
} from "@/components/ui/sidebar";
import * as React from "react";
import { createSidebarNavData, type PagadorLike } from "./nav-link";
type AppUser = {
id: string;
name: string;
email: string;
image: string | null;
};
interface AppSidebarProps extends React.ComponentProps<typeof Sidebar> {
user: AppUser;
pagadorAvatarUrl: string | null;
pagadores: PagadorLike[];
}
export function AppSidebar({
user,
pagadorAvatarUrl,
pagadores,
...props
}: AppSidebarProps) {
if (!user) {
throw new Error("AppSidebar requires a user but received undefined.");
}
const navigation = React.useMemo(
() => createSidebarNavData(pagadores),
[pagadores]
);
return (
<Sidebar collapsible="icon" {...props}>
<SidebarHeader>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton
asChild
className="data-[slot=sidebar-menu-button]:px-1.5! hover:bg-transparent active:bg-transparent pt-4 justify-center hover:scale-105 transition-all duration-200"
>
<a href="/dashboard">
<LogoContent />
</a>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarHeader>
<SidebarContent>
<NavMain sections={navigation.navMain} />
<NavSecondary items={navigation.navSecondary} className="mt-auto" />
</SidebarContent>
<SidebarFooter>
<NavUser user={user} pagadorAvatarUrl={pagadorAvatarUrl} />
</SidebarFooter>
</Sidebar>
);
}
function LogoContent() {
const { state } = useSidebar();
const isCollapsed = state === "collapsed";
return <Logo variant={isCollapsed ? "small" : "full"} />;
}