<template>
  <div v-if="authStore.steeringUser" class="tw-w-full">
    <slot />
  </div>

  <div v-else class="tw-w-full tw-text-center">
    {{ t('loading') }}
  </div>
</template>

<script setup>
import { useAuthStore } from '@/stores/auth'
import { watchEffect } from 'vue'
import { useRouter } from 'vue-router'
import { useToast } from 'vue-toast-notification'
import { useI18n } from '@/i18n'

const router = useRouter()
const authStore = useAuthStore()
const toast = useToast()
const { t } = useI18n()

watchEffect(() => {
  if (authStore.steeringUser && !authStore.isSuperuser) {
    toast.error(t('auth.permissionError'))
    router.push({ name: 'home' })
  }
})
</script>