fix

nuxt4-app/app/pages/explorer.vue

@@ -277,8 +277,12 @@ const totalRowCount = computed(() => {
 })
 
 // Methods
-function selectTable(tableName: string) {
-  if (selectedTableName.value === tableName) return
+async function selectTable(tableName: string) {
+  console.log(`[Explorer] selectTable called with: ${tableName}`)
+  if (selectedTableName.value === tableName) {
+    console.log(`[Explorer] Table ${tableName} already selected, skipping`)
+    return
+  }
 
   selectedTableName.value = tableName
 
@@ -286,20 +290,31 @@ function selectTable(tableName: string) {
   if (typeof $getTableStore === 'function') {
     const store = $getTableStore(tableName)
     if (store) {
+      console.log(`[Explorer] Got store for ${tableName} via plugin`)
       currentTableStore.value = store
-      // Initialize the store (loads from cache or fetches)
-      store.initialize()
+
+      // Load from cache first (async from IndexedDB)
+      await store.loadFromCache()
+      console.log(`[Explorer] After loadFromCache, store has ${store.recordCount} records`)
+
+      // Note: We don't call initialize() here because MetadatosCard will handle loading
+      // initialize() would trigger a fetch, but we want manual control via the buttons
     }
   } else {
     // Fallback: create store directly
+    console.log(`[Explorer] Creating store for ${tableName} directly (fallback)`)
     currentTableStore.value = useTableDataStore(tableName)
-    currentTableStore.value.initialize()
+    await currentTableStore.value.loadFromCache()
+    console.log(`[Explorer] After loadFromCache, store has ${currentTableStore.value.recordCount} records`)
   }
 }
 
 async function refreshTableData() {
+  console.log('[Explorer] refreshTableData called')
   if (currentTableStore.value) {
+    console.log(`[Explorer] Refreshing data for current table (${selectedTableName.value})`)
     await currentTableStore.value.refreshData()
+    console.log(`[Explorer] After refresh, store has ${currentTableStore.value.recordCount} records`)
   }
 }
 
@@ -340,13 +355,15 @@ function formatCellValue(value: unknown): string {
 
 // Lifecycle
 onMounted(async () => {
+  console.log('[Explorer] onMounted: Initializing metadata store')
   await metadataStore.initialize()
 
   // Auto-select first table if available
   if (metadataStore.hasMetadata && !selectedTableName.value) {
     const firstTable = metadataStore.allTables[0]
     if (firstTable) {
-      selectTable(firstTable.table)
+      console.log(`[Explorer] Auto-selecting first table: ${firstTable.name}`)
+      selectTable(firstTable.name) // Use name instead of table
     }
   }
 })
@@ -354,7 +371,8 @@ onMounted(async () => {
 // Auto-select first table when metadata becomes available
 watch(() => metadataStore.hasMetadata, (hasMetadata) => {
   if (hasMetadata && !selectedTableName.value && metadataStore.allTables.length > 0) {
-    selectTable(metadataStore.allTables[0].table)
+    console.log('[Explorer] Metadata became available, auto-selecting first table')
+    selectTable(metadataStore.allTables[0].name) // Use name instead of table
   }
 })
 </script>