import { IconDotsVertical } from '@tabler/icons-react';
import { SidebarMenuButton } from '../ui/sidebar';
import { Skeleton } from '../ui/skeleton';

export function NavUserSkeleton() {
  return (
    <SidebarMenuButton
      size="lg"
    >
      <Skeleton className="h-8 w-8 rounded-lg" />
      <div className="flex flex-col flex-1 gap-1">
        <Skeleton className="h-3 w-16" />
        <Skeleton className="h-3 w-24" />
      </div>
      <IconDotsVertical className="ml-auto size-4" />
    </SidebarMenuButton>
  );
}