<script setup lang="ts">
import 'vue-sonner/style.css'
import { RouterView } from 'vue-router'

import { useAppInitialization } from '@/composables/useAppInitialization'
import SidebarProvider from '@/components/ui/sidebar/SidebarProvider.vue'
import { Toaster } from '@/components/ui/sonner'
import AppHeader from '@/layout/AppHeader.vue'
import AppSidebar from '@/layout/sidebar/AppSidebar.vue'

// initialize app logic (loading traces from URL/LS)
useAppInitialization()
</script>

<template>
  <Toaster position="top-center" rich-colors :duration="4000" />
  <SidebarProvider>
    <AppSidebar />
    <main class="flex flex-col flex-1 min-w-0">
      <div class="flex flex-col h-screen">
        <AppHeader />

        <RouterView name="main" />
      </div>
    </main>
  </SidebarProvider>
</template>
