From 67261cd1fc847251ca3fd24eb5b947ad86d81dcf Mon Sep 17 00:00:00 2001
From: josedario87 <jodarioel87@gmail.com>
Date: Thu, 16 Oct 2025 19:42:00 -0600
Subject: [PATCH] Fix: Corregir errores de TypeScript en componentes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Instalar @types/node para resolver referencias a process
- Corregir colores inválidos en componentes (orange→warning, purple→secondary, gray→neutral, etc.)
- Agregar tipos explícitos en GroupCheckButton y EditProfileButton
- Eliminar propiedad timeout inválida en toasts
---
 .../auth/BackendVerificationButton.vue         |  7 +++----
 .../auth/CheckAuthentikAdminsButton.vue        |  2 +-
 .../components/auth/CheckGrupoPruebaButton.vue |  2 +-
 nuxt4/app/components/auth/CheckLvl0Button.vue  |  2 +-
 .../auth/CheckPublicAccessButton.vue           |  2 +-
 .../app/components/auth/EditProfileButton.vue  | 10 +++++++---
 .../auth/FrontendVerificationButton.vue        |  7 +++----
 nuxt4/app/components/auth/GroupCheckButton.vue |  8 +++-----
 nuxt4/app/components/auth/UserMetadata.vue     |  2 +-
 nuxt4/package-lock.json                        | 18 ++++++++++++++++++
 nuxt4/package.json                             |  1 +
 11 files changed, 40 insertions(+), 21 deletions(-)

diff --git a/nuxt4/app/components/auth/BackendVerificationButton.vue b/nuxt4/app/components/auth/BackendVerificationButton.vue
index a3cf8c0..655bd93 100644
--- a/nuxt4/app/components/auth/BackendVerificationButton.vue
+++ b/nuxt4/app/components/auth/BackendVerificationButton.vue
@@ -1,6 +1,6 @@
 <template>
   <UButton
-    color="orange"
+    color="warning"
     size="lg"
     variant="outline"
     :loading="loading"
@@ -39,9 +39,8 @@ const handleClick = async () => {
         title: 'Verificación Backend',
         description: `Usuario: ${response.user.username}
 Grupos (${groupCount}): ${groupList}`,
-        color: 'orange',
-        icon: 'i-heroicons-server-stack',
-        timeout: 5000
+        color: 'warning',
+        icon: 'i-heroicons-server-stack'
       })
     } else {
       toast.add({
diff --git a/nuxt4/app/components/auth/CheckAuthentikAdminsButton.vue b/nuxt4/app/components/auth/CheckAuthentikAdminsButton.vue
index f5a016d..ade8d18 100644
--- a/nuxt4/app/components/auth/CheckAuthentikAdminsButton.vue
+++ b/nuxt4/app/components/auth/CheckAuthentikAdminsButton.vue
@@ -3,7 +3,7 @@
     group-name="authentik Admins"
     label="Authentik Admins"
     icon="i-heroicons-shield-check"
-    color="red"
+    color="error"
     variant="soft"
     :verify-backend="verifyBackend"
   />
diff --git a/nuxt4/app/components/auth/CheckGrupoPruebaButton.vue b/nuxt4/app/components/auth/CheckGrupoPruebaButton.vue
index b431160..ac788b7 100644
--- a/nuxt4/app/components/auth/CheckGrupoPruebaButton.vue
+++ b/nuxt4/app/components/auth/CheckGrupoPruebaButton.vue
@@ -3,7 +3,7 @@
     group-name="grupo-prueba"
     label="Grupo Prueba"
     icon="i-heroicons-beaker"
-    color="blue"
+    color="primary"
     variant="soft"
     :verify-backend="verifyBackend"
   />
diff --git a/nuxt4/app/components/auth/CheckLvl0Button.vue b/nuxt4/app/components/auth/CheckLvl0Button.vue
index 6591814..369113d 100644
--- a/nuxt4/app/components/auth/CheckLvl0Button.vue
+++ b/nuxt4/app/components/auth/CheckLvl0Button.vue
@@ -3,7 +3,7 @@
     group-name="lvl0"
     label="Level 0"
     icon="i-heroicons-key"
-    color="green"
+    color="success"
     variant="soft"
     :verify-backend="verifyBackend"
   />
diff --git a/nuxt4/app/components/auth/CheckPublicAccessButton.vue b/nuxt4/app/components/auth/CheckPublicAccessButton.vue
index 120f006..1c4adda 100644
--- a/nuxt4/app/components/auth/CheckPublicAccessButton.vue
+++ b/nuxt4/app/components/auth/CheckPublicAccessButton.vue
@@ -3,7 +3,7 @@
     group-name="public-access"
     label="Acceso Público"
     icon="i-heroicons-globe-alt"
-    color="gray"
+    color="neutral"
     variant="soft"
     :verify-backend="verifyBackend"
   />
diff --git a/nuxt4/app/components/auth/EditProfileButton.vue b/nuxt4/app/components/auth/EditProfileButton.vue
index fb2c200..78e2eb0 100644
--- a/nuxt4/app/components/auth/EditProfileButton.vue
+++ b/nuxt4/app/components/auth/EditProfileButton.vue
@@ -15,7 +15,7 @@
         <div class="flex items-center justify-between">
           <h3 class="text-lg font-semibold">Editar Perfil</h3>
           <UButton
-            color="gray"
+            color="neutral"
             variant="ghost"
             icon="i-heroicons-x-mark"
             @click="isOpen = false"
@@ -56,7 +56,7 @@
       <template #footer>
         <div class="flex justify-end gap-2">
           <UButton
-            color="gray"
+            color="neutral"
             variant="ghost"
             :disabled="isUpdating"
             @click="isOpen = false"
@@ -95,7 +95,11 @@ const openModal = async () => {
 
   try {
     // Obtener información del usuario desde Authentik
-    const userData = await $fetch('/api/authentik/user')
+    const userData = await $fetch<{
+      name?: string
+      email?: string
+      username?: string
+    }>('/api/authentik/user')
 
     formData.value = {
       name: userData.name || '',
diff --git a/nuxt4/app/components/auth/FrontendVerificationButton.vue b/nuxt4/app/components/auth/FrontendVerificationButton.vue
index ed93d56..a1a9ec4 100644
--- a/nuxt4/app/components/auth/FrontendVerificationButton.vue
+++ b/nuxt4/app/components/auth/FrontendVerificationButton.vue
@@ -1,6 +1,6 @@
 <template>
   <UButton
-    color="purple"
+    color="secondary"
     size="lg"
     variant="outline"
     @click="handleClick"
@@ -35,9 +35,8 @@ const handleClick = () => {
     title: 'Verificación Frontend',
     description: `Usuario: ${user.value.username}
 Grupos (${groupCount}): ${groupList}`,
-    color: 'purple',
-    icon: 'i-heroicons-check-badge',
-    timeout: 5000
+    color: 'secondary',
+    icon: 'i-heroicons-check-badge'
   })
 }
 </script>
diff --git a/nuxt4/app/components/auth/GroupCheckButton.vue b/nuxt4/app/components/auth/GroupCheckButton.vue
index bf44d05..f8f0831 100644
--- a/nuxt4/app/components/auth/GroupCheckButton.vue
+++ b/nuxt4/app/components/auth/GroupCheckButton.vue
@@ -15,15 +15,13 @@
 </template>
 
 <script setup lang="ts">
-import type { ButtonColor, ButtonVariant, ButtonSize } from '#ui/types'
-
 interface Props {
   groupName: string
   label?: string
   icon?: string
-  color?: ButtonColor
-  variant?: ButtonVariant
-  size?: ButtonSize
+  color?: 'neutral' | 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error'
+  variant?: 'solid' | 'outline' | 'soft' | 'ghost' | 'link'
+  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'
   verifyBackend?: boolean
 }
 
diff --git a/nuxt4/app/components/auth/UserMetadata.vue b/nuxt4/app/components/auth/UserMetadata.vue
index 2151c63..cbab6a0 100644
--- a/nuxt4/app/components/auth/UserMetadata.vue
+++ b/nuxt4/app/components/auth/UserMetadata.vue
@@ -58,7 +58,7 @@
             >
               {{ group }}
             </UBadge>
-            <UBadge v-if="user.groups.length === 0" color="gray" variant="soft">
+            <UBadge v-if="user.groups.length === 0" color="neutral" variant="soft">
               Sin grupos asignados
             </UBadge>
           </div>
diff --git a/nuxt4/package-lock.json b/nuxt4/package-lock.json
index fd43053..38d3d92 100644
--- a/nuxt4/package-lock.json
+++ b/nuxt4/package-lock.json
@@ -20,6 +20,7 @@
         "vue-router": "^4.5.1"
       },
       "devDependencies": {
+        "@types/node": "^24.8.0",
         "@vite-pwa/nuxt": "^1.0.4"
       }
     },
@@ -6246,6 +6247,16 @@
       "integrity": "sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA==",
       "license": "MIT"
     },
+    "node_modules/@types/node": {
+      "version": "24.8.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.8.0.tgz",
+      "integrity": "sha512-5x08bUtU8hfboMTrJ7mEO4CpepS9yBwAqcL52y86SWNmbPX8LVbNs3EP4cNrIZgdjk2NAlP2ahNihozpoZIxSg==",
+      "devOptional": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~7.14.0"
+      }
+    },
     "node_modules/@types/parse-path": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/@types/parse-path/-/parse-path-7.0.3.tgz",
@@ -19131,6 +19142,13 @@
         "node": ">=20.18.1"
       }
     },
+    "node_modules/undici-types": {
+      "version": "7.14.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.14.0.tgz",
+      "integrity": "sha512-QQiYxHuyZ9gQUIrmPo3IA+hUl4KYk8uSA7cHrcKd/l3p1OTpZcM0Tbp9x7FAtXdAYhlasd60ncPpgu6ihG6TOA==",
+      "devOptional": true,
+      "license": "MIT"
+    },
     "node_modules/unenv": {
       "version": "2.0.0-rc.21",
       "resolved": "https://registry.npmjs.org/unenv/-/unenv-2.0.0-rc.21.tgz",
diff --git a/nuxt4/package.json b/nuxt4/package.json
index 84f99e2..b716f39 100644
--- a/nuxt4/package.json
+++ b/nuxt4/package.json
@@ -23,6 +23,7 @@
     "vue-router": "^4.5.1"
   },
   "devDependencies": {
+    "@types/node": "^24.8.0",
     "@vite-pwa/nuxt": "^1.0.4"
   }
 }