<script lang="ts" setup>
import { useSidebarData } from './data/sidebar-data'
import NavFooter from './nav-footer.vue'
import NavMain from './nav-main.vue'
import TeamSwitcher from './team-switcher.vue'

const { sidebarData } = useSidebarData()
</script>

<template>
  <UiSidebar collapsible="icon" class="z-50">
    <UiSidebarHeader>
      <TeamSwitcher />
    </UiSidebarHeader>

    <UiSidebarContent>
      <NavMain :nav-main="sidebarData.navMain" />
    </UiSidebarContent>

    <UiSidebarFooter>
      <NavFooter :user="sidebarData.user" />
    </UiSidebarFooter>

    <UiSidebarRail />
  </UiSidebar>
</template>
