Files
perfil/nuxt4/app/components/auth/StatusBadges.vue
josedario87 a0a31e8dce Fix: Move composables and components into app/ directory
- Resolve SSR error "useAuthentik is not defined"
- Follow Nuxt 4 directory structure conventions
- When app/ exists, all app directories must be inside it
- This enables proper auto-import of composables
2025-10-12 23:08:55 -06:00

47 lines
1.1 KiB
Vue

<template>
<UCard class="w-full">
<div class="flex flex-wrap gap-2">
<!-- Estado de autenticación -->
<UBadge
:color="isAuthenticated ? 'success' : 'error'"
size="lg"
variant="subtle"
>
<template #leading>
<UIcon :name="isAuthenticated ? 'i-heroicons-check-circle' : 'i-heroicons-x-circle'" />
</template>
{{ isAuthenticated ? 'Autenticado' : 'No autenticado' }}
</UBadge>
<!-- Estado de conexión -->
<UBadge
color="success"
size="lg"
variant="subtle"
>
<template #leading>
<UIcon name="i-heroicons-signal" />
</template>
Conectado
</UBadge>
<!-- Número de grupos -->
<UBadge
v-if="user"
color="primary"
size="lg"
variant="subtle"
>
<template #leading>
<UIcon name="i-heroicons-user-group" />
</template>
{{ user.groups.length }} {{ user.groups.length === 1 ? 'Grupo' : 'Grupos' }}
</UBadge>
</div>
</UCard>
</template>
<script setup lang="ts">
const { user, isAuthenticated } = useAuthentik()
</script>