<script setup>
import MenuDefault from "@/components/menus/MenuDefault.vue";
import {ref} from "vue";
import {SessionUser} from "@/components/session/token/SessionUser.vue";

// Define the isLoaded function
// This is here, because the departments need to be loaded before the menu is shown,
// otherwise the menu will look for a department with an id not defined.
const isLoaded = ref(true);


const menu_items = ref([
  {
    name: 'Hjem',
    route: '/user',
    icon: 'fas fa-home',
    children: []
  },
  {
    name: 'Mine vaske',
    route: '/user/orders',
    icon: 'fas fa-shopping-basket',
    children: [],
  },
  {
    name: 'Mine køretøjer',
    route: '/user/vehicles',
    icon: 'fas fa-car',
    children: [],
  },
  {
    name: 'Mine bookinger',
    route: '/user/bookings',
    icon: 'fas fa-calendar-alt',
    children: [],
  },
  {
    name: 'Mine fakturaer',
    route: '/user/invoices',
    icon: 'fas fa-file-invoice',
    children: [],
    permissions: [
      'user_invoices'
    ]
  },
]);

</script>

<template>
  <MenuDefault v-if="isLoaded"
      v-bind="{menu_items}"
      :show_icons="false"
  />
</template>

<style scoped>

</style>