Caramel-CRM/resources/js/components/NavFooter.vue

<script setup lang="ts">
import { SidebarGroup, SidebarGroupContent, SidebarMenu, SidebarMenuButton, SidebarMenuItem } from '@/components/ui/crm-sidebar';
import { User } from '@/types';
import UserInfo from '@/components/UserInfo.vue';
import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
import UserMenuContent from '@/components/UserMenuContent.vue';

const props = defineProps<{
    user: User;
    class?: string;
}>()

</script>

<template>
    <SidebarGroup class="p-0">
        <SidebarGroupContent>
            <SidebarMenu>
                <DropdownMenu>
                    <DropdownMenuTrigger as-child>
                        <SidebarMenuItem>
                            <SidebarMenuButton
                                class="pl-0 rounded-[1rem_var(--radius-md)_var(--radius-md)_1rem] group-data-[state=collapsed]:rounded-full">
                                <UserInfo :user="props.user" />
                            </SidebarMenuButton>
                        </SidebarMenuItem>
                    </DropdownMenuTrigger>
                    <DropdownMenuContent align="start">
                        <UserMenuContent />
                    </DropdownMenuContent>
                </DropdownMenu>
            </SidebarMenu>
        </SidebarGroupContent>
    </SidebarGroup>
</template>