From ce69a623361922cddcf8c71cf3aed5712a3b1c50 Mon Sep 17 00:00:00 2001
From: josedario87 <jodarioel87@gmail.com>
Date: Mon, 13 Oct 2025 18:41:16 -0600
Subject: [PATCH] fix: replace USelect with USelectMenu for better
 compatibility

- Change from USelect to USelectMenu for database and table selection
- Add value-attribute and option-attribute props for proper rendering
- Improves dropdown functionality and user experience
---
 nuxt4-app/app/pages/explorer.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/nuxt4-app/app/pages/explorer.vue b/nuxt4-app/app/pages/explorer.vue
index 4e2893e..c11924c 100644
--- a/nuxt4-app/app/pages/explorer.vue
+++ b/nuxt4-app/app/pages/explorer.vue
@@ -14,23 +14,27 @@
       <div class="flex flex-col gap-4">
         <!-- Database Selector -->
         <UFieldGroup label="Base de datos">
-          <USelect
+          <USelectMenu
             v-model="selectedDatabaseId"
             :options="databaseOptions"
             placeholder="Seleccionar base de datos"
             :loading="loadingDatabases"
             :disabled="loadingDatabases"
+            value-attribute="value"
+            option-attribute="label"
           />
         </UFieldGroup>
 
         <!-- Table Selector -->
         <UFieldGroup label="Tabla" v-if="selectedDatabaseId">
-          <USelect
+          <USelectMenu
             v-model="selectedTableId"
             :options="tableOptions"
             placeholder="Seleccionar tabla"
             :loading="loadingTables"
             :disabled="loadingTables || !selectedDatabaseId"
+            value-attribute="value"
+            option-attribute="label"
           />
         </UFieldGroup>