<template>
  <v-app>
    <AppLayout v-if="authStore.isAuthenticated">
      <router-view />
    </AppLayout>
    <router-view v-else />
  </v-app>
</template>

<script setup lang="ts">
import { watch } from 'vue'
import { useAuthStore } from '@/stores/auth'
import { useNotifications } from '@/composables/useNotifications'
import AppLayout from '@/components/layout/AppLayout.vue'

const authStore = useAuthStore()
authStore.initialize()

const { connect, disconnect } = useNotifications()

watch(() => authStore.isAuthenticated, (authenticated) => {
  if (authenticated) {
    connect()
  } else {
    disconnect()
  }
}, { immediate: true })
</script>
