@innertia-solutions/innertia-nuxt 0.1.50 → 0.1.53

package/components/Files/Preview.vue

@@ -274,30 +274,88 @@ function buildSheet(ws, workbook) {
   return { name: ws.name, cols, rows, firstRow: 1, imageMap }
 }
 
+/** Detecta el delimitador más probable de un texto tabular (tab / ; / ,). */
+function detectDelimiter(text) {
+  const line = text.split(/\r?\n/).find(l => l.trim()) ?? ''
+  const counts = { '\t': (line.match(/\t/g) || []).length, ';': (line.match(/;/g) || []).length, ',': (line.match(/,/g) || []).length }
+  const max = Math.max(counts['\t'], counts[';'], counts[','])
+  if (max === 0) return null
+  return counts['\t'] === max ? '\t' : (counts[';'] === max ? ';' : ',')
+}
+
+/** Parser genérico de texto delimitado con soporte de comillas. */
+function parseDelimited(text, delim) {
+  const rows = []
+  let row = [], cell = '', inQ = false
+  for (let i = 0; i < text.length; i++) {
+    const c = text[i]
+    if (inQ) {
+      if (c === '"') { if (text[i + 1] === '"') { cell += '"'; i++ } else inQ = false }
+      else cell += c
+    } else {
+      if (c === '"') inQ = true
+      else if (c === delim) { row.push(cell); cell = '' }
+      else if (c === '\n') { row.push(cell); rows.push(row); row = []; cell = '' }
+      else if (c === '\r') continue
+      else cell += c
+    }
+  }
+  if (cell.length || row.length) { row.push(cell); rows.push(row) }
+  return rows
+}
+
+/** Construye una sheet (misma forma que buildSheet) desde texto delimitado. */
+function buildSheetFromDelimited(text, name = 'Hoja 1') {
+  const delim = detectDelimiter(text) ?? '\t'
+  const raw = parseDelimited(text, delim).filter(r => r.length && !(r.length === 1 && r[0] === ''))
+  const colCount = raw.reduce((m, r) => Math.max(m, r.length), 0)
+  const cols = []
+  for (let c = 0; c < colCount; c++) cols.push(colLetter(c))
+  const rows = raw.map((r, ri) => {
+    const rowData = []
+    for (let c = 0; c < colCount; c++) {
+      rowData.push({ v: r[c] ?? '', align: 'left', t: 'string', address: colLetter(c) + (ri + 1) })
+    }
+    return rowData
+  })
+  return { name, cols, rows, firstRow: 1, imageMap: {} }
+}
+
 const loadXlsx = async () => {
   if (viewerType.value !== 'xlsx') return
   isLoadingXlsx.value = true
   xlsxError.value = null
   xlsxActiveIdx.value = 0
+  let buf = null
   try {
+    const res = await fetch(src.value)
+    if (!res.ok) throw new Error(`HTTP ${res.status}`)
+    buf = await res.arrayBuffer()
+
     const mod = await import('exceljs').catch(() => null)
     const ExcelJS = pickModule(mod, 'Workbook')
                   ?? (mod?.default?.Workbook ? mod.default : null)
                   ?? mod
-    if (!ExcelJS?.Workbook) {
-      console.warn('[FilesPreview] exceljs module shape:', mod)
-      throw new Error('Para previsualizar .xlsx instalá la dep: pnpm add exceljs')
-    }
-    const res = await fetch(src.value)
-    if (!res.ok) throw new Error(`HTTP ${res.status}`)
-    const buf = await res.arrayBuffer()
+    if (!ExcelJS?.Workbook) throw new Error('exceljs no disponible')
+
     const wb = new ExcelJS.Workbook()
     await wb.xlsx.load(buf)
     const sheets = wb.worksheets.map(ws => buildSheet(ws, wb))
     xlsxWorkbook.value = { sheets }
   } catch (e) {
-    console.error('[FilesPreview] xlsx error', e)
-    xlsxError.value = e.message
+    // Fallback: el archivo no es un .xlsx OOXML válido (típico: un CSV/TSV exportado
+    // con extensión .xls, o mime mal detectado). Lo renderizamos como tabla delimitada.
+    try {
+      const text = new TextDecoder('utf-8').decode(buf ?? new ArrayBuffer(0))
+      if (text && text.trim()) {
+        xlsxWorkbook.value = { sheets: [buildSheetFromDelimited(text)] }
+      } else {
+        throw e
+      }
+    } catch (_) {
+      console.error('[FilesPreview] xlsx error', e)
+      xlsxError.value = 'No se pudo previsualizar la hoja de cálculo.'
+    }
   } finally {
     isLoadingXlsx.value = false
   }

package/components/Files/ProviderConnectButton.vue

@@ -0,0 +1,22 @@
+<script setup>
+const props = defineProps({
+  provider: { type: String, default: 'google_drive' },
+  label: { type: String, default: 'Google Drive' },
+})
+
+const { status, connect, disconnect } = useProviderConnection(props.provider)
+const { data, isLoading } = status()
+
+const connected = computed(() => data.value?.connected ?? data.value?.data?.connected ?? false)
+const email = computed(() => data.value?.email ?? data.value?.data?.email ?? null)
+</script>
+
+<template>
+  <div class="inline-flex items-center gap-2">
+    <template v-if="connected">
+      <span class="text-sm text-muted-foreground">{{ label }}: <span class="text-foreground font-medium">{{ email }}</span></span>
+      <AppButton text="Desconectar" severity="secondary" size="sm" @click="disconnect" />
+    </template>
+    <AppButton v-else text="Conectar Google Drive" severity="primary" size="sm" :loading="isLoading" @click="connect" />
+  </div>
+</template>

package/composables/useAuth.js

@@ -1,4 +1,4 @@
-// useAuthStore, useApi, useOrganizationStore, useInnertiaMode, useGymSelection, useGymStore auto-imported
+// useAuthStore, useApi, useOrganizationStore, useInnertiaMode, useTenantSelection, useActiveTenantStore auto-imported
 
 export function useAuth() {
   const authStore = useAuthStore()
@@ -21,12 +21,12 @@ export function useAuth() {
     queryClient.clear()
     await fetchMe()
 
-    // En modo 'open' el tenant se resuelve por selección: cargamos los gyms del
+    // En modo 'open' el tenant se resuelve por selección: cargamos los tenants del
     // usuario y devolvemos un destino (0/1/2+). saas/app conservan su return.
     if (useInnertiaMode().isOpen()) {
-      const { resolveAfterLogin } = useGymSelection()
-      const gymDestination = await resolveAfterLogin() // 'onboarding' | 'ready' | 'picker'
-      return { ...(data ?? {}), gymDestination }
+      const { resolveAfterLogin } = useTenantSelection()
+      const tenantDestination = await resolveAfterLogin() // 'onboarding' | 'ready' | 'picker'
+      return { ...(data ?? {}), tenantDestination }
     }
 
     return data
@@ -77,8 +77,8 @@ export function useAuth() {
     queryClient.clear()
     authStore.logout()
     organizationStore.reset()
-    // En open, limpiar también el gym seleccionado
-    if (useInnertiaMode().isOpen()) useGymStore().reset()
+    // En open, limpiar también el tenant seleccionado
+    if (useInnertiaMode().isOpen()) useActiveTenantStore().reset()
     await navigateTo(loginPath)
   }
 

package/composables/useGooglePicker.ts

@@ -0,0 +1,69 @@
+/**
+ * useGooglePicker — carga la Google API JS y abre el Google Picker. Client-only.
+ *
+ * Uso:
+ *   const { openPicker } = useGooglePicker()
+ *   const picked = await openPicker({ apiKey, token, appId, mode: 'file', mimeTypes })
+ *   // picked === { id, name, mimeType, url } o null si se cancela
+ */
+export function useGooglePicker() {
+  let pickerApiLoaded = false
+
+  function loadScript(src: string): Promise<void> {
+    return new Promise((resolve, reject) => {
+      if (document.querySelector(`script[src="${src}"]`)) return resolve()
+      const s = document.createElement('script')
+      s.src = src
+      s.onload = () => resolve()
+      s.onerror = reject
+      document.head.appendChild(s)
+    })
+  }
+
+  async function ensureLoaded() {
+    if (pickerApiLoaded) return
+    await loadScript('https://apis.google.com/js/api.js')
+    await new Promise<void>((res) => (window as any).gapi.load('picker', () => res()))
+    pickerApiLoaded = true
+  }
+
+  /**
+   * Abre el Google Picker. opts: { apiKey, token, appId, mode: 'file'|'folder', mimeTypes?: string }
+   * Resuelve con { id, name, mimeType, url } del item elegido, o null si se cancela.
+   */
+  async function openPicker(opts: {
+    apiKey: string
+    token: string
+    appId: string
+    mode: 'file' | 'folder'
+    mimeTypes?: string
+  }) {
+    if (typeof window === 'undefined') return null
+    await ensureLoaded()
+    return new Promise((resolve) => {
+      const google = (window as any).google
+      const view = opts.mode === 'folder'
+        ? new google.picker.DocsView(google.picker.ViewId.FOLDERS).setSelectFolderEnabled(true).setMimeTypes('application/vnd.google-apps.folder')
+        : new google.picker.DocsView(google.picker.ViewId.DOCS)
+      if (opts.mimeTypes && opts.mode !== 'folder') view.setMimeTypes(opts.mimeTypes)
+
+      const picker = new google.picker.PickerBuilder()
+        .setAppId(opts.appId)
+        .setOAuthToken(opts.token)
+        .setDeveloperKey(opts.apiKey)
+        .addView(view)
+        .setCallback((data: any) => {
+          if (data.action === google.picker.Action.PICKED) {
+            const doc = data.docs[0]
+            resolve({ id: doc.id, name: doc.name, mimeType: doc.mimeType, url: doc.url })
+          } else if (data.action === google.picker.Action.CANCEL) {
+            resolve(null)
+          }
+        })
+        .build()
+      picker.setVisible(true)
+    })
+  }
+
+  return { openPicker }
+}

package/composables/useInnertiaMode.ts

@@ -12,7 +12,7 @@ import type { InnertiaMode } from '../app.config'
  *   isApp()     → true si mode === 'app'
  *   isOpen()    → true si mode === 'open'
  *   hasTenant() → true si mode === 'saas' | 'open' (usan multitenancy;
- *                 saas resuelve por subdominio, open por gym seleccionado)
+ *                 saas resuelve por subdominio, open por tenant seleccionado)
  */
 export function useInnertiaMode() {
   const appConfig = useAppConfig()

package/composables/useLoginDestinations.js

@@ -0,0 +1,74 @@
+// useTenantSelection, useActiveTenantStore, useAppConfig auto-imported.
+//
+// Modo 'open' — login personal unificado.
+//
+// Tras autenticar NO conocemos el tenant ni el rol: la fuente de verdad es
+// `auth/my-gyms`, que devuelve tenants:[{key,name,status,contexts}] — un tenant
+// puede otorgar varios contextos (p.ej. backoffice + student = 2 destinos).
+//
+// Expande esos tenants en una lista plana de "destinos" (tenant × contexto) para
+// rutear post-login:
+//   0 destinos -> onboarding
+//   1 destino  -> entrar directo (fija tenant activo + navega a home del contexto)
+//   2+         -> selector
+//
+// Los contextos que participan del login personal se declaran por producto en
+// `appConfig.innertia.personalContexts` (p.ej. ['backoffice','student','coach']).
+// Un contexto con login dedicado (p.ej. kiosco 'attendance') NO debe listarse ahí.
+
+export function useLoginDestinations() {
+  const { load } = useTenantSelection()
+  const store = useActiveTenantStore()
+  const appConfig = useAppConfig()
+
+  const personalContexts = () => appConfig.innertia?.personalContexts ?? []
+  const contextDefs = () => appConfig.innertia?.contexts ?? {}
+
+  /** Home de un contexto (según app.config), con fallback razonable. */
+  function homeFor(context) {
+    const def = Object.values(contextDefs()).find((c) => c.context === context)
+    return def?.home || `/${context}`
+  }
+
+  /** Label legible de un contexto. */
+  function labelFor(context) {
+    const def = Object.values(contextDefs()).find((c) => c.context === context)
+    return def?.label || context
+  }
+
+  /**
+   * Carga los tenants del usuario y los expande a destinos tenant×contexto.
+   * Devuelve { destinations, tenants }.
+   *   destination = { tenantKey, tenantName, tenantStatus, context, contextLabel, home }
+   */
+  async function resolve() {
+    await load() // rellena store.tenants desde auth/my-gyms
+    const tenants = store.tenants || []
+
+    const destinations = []
+    for (const tenant of tenants) {
+      const ctxs = (tenant.contexts || []).filter((c) => personalContexts().includes(c))
+      for (const context of ctxs) {
+        destinations.push({
+          tenantKey: tenant.key,
+          tenantName: tenant.name || tenant.key,
+          tenantStatus: tenant.status,
+          context,
+          contextLabel: labelFor(context),
+          home: homeFor(context),
+        })
+      }
+    }
+
+    return { destinations, tenants }
+  }
+
+  /** Fija el tenant + contexto activos y navega a la home del contexto elegido. */
+  async function go(destination) {
+    store.setActive(destination.tenantKey)
+    store.setActiveContext(destination.context)
+    await navigateTo(destination.home)
+  }
+
+  return { resolve, go, homeFor, labelFor }
+}

package/composables/useProviderConnection.ts

@@ -0,0 +1,39 @@
+/**
+ * useProviderConnection — estado y flujo OAuth de un proveedor de archivos (ej. Google Drive).
+ *
+ * Consume los endpoints de conexión del backend innertia-laravel:
+ *   - GET    files/providers/{provider}/status                 → { connected, email }
+ *   - GET    files/providers/{provider}/connect?scope=user     → 302 al consent de Google (popup)
+ *   - DELETE files/providers/{provider}/connection?scope=user  → { connected: false }
+ *
+ * El popup del consent se cierra solo (el callback devuelve <script>window.close()</script>);
+ * al detectar el cierre invalidamos el status para reflejar la conexión.
+ *
+ * useApi / useQueryClient / useQuery / useRuntimeConfig se auto-importan en la capa.
+ */
+export function useProviderConnection(provider = 'google_drive') {
+  const api = useApi()
+  const queryClient = useQueryClient()
+
+  const status = () => useQuery({
+    queryKey: ['provider', provider, 'status'],
+    queryFn: () => api.get(`files/providers/${provider}/status`),
+  })
+
+  const invalidate = () => queryClient.invalidateQueries({ queryKey: ['provider', provider, 'status'] })
+
+  const connect = () => {
+    if (typeof window === 'undefined') return
+    const cfg  = useRuntimeConfig()
+    const base = (cfg.public.apiBaseUrl || '/api').replace(/\/$/, '')
+    const popup = window.open(`${base}/files/providers/${provider}/connect?scope=user`, 'provider-connect', 'width=520,height=680')
+    // cuando el popup se cierra (callback hizo window.close), refrescamos el estado
+    const timer = setInterval(() => {
+      if (!popup || popup.closed) { clearInterval(timer); invalidate() }
+    }, 800)
+  }
+
+  const disconnect = () => api.delete(`files/providers/${provider}/connection?scope=user`).then(invalidate)
+
+  return { status, connect, disconnect, invalidate }
+}

package/composables/useTenantSelection.ts

@@ -0,0 +1,35 @@
+// useApi, useActiveTenantStore auto-imported.
+// Selección de tenant en modo 'open': carga los tenants del usuario y resuelve
+// el destino post-login según cuántos tenga (0 / 1 / 2+).
+
+export function useTenantSelection() {
+  const api = useApi()
+  const store = useActiveTenantStore()
+
+  /** Carga los tenants del usuario autenticado y los guarda en el store. */
+  async function load() {
+    // El backend aún expone la ruta gym-flavored: { gyms: [{ key, name, status, contexts }] }
+    const data = await api.get('auth/my-gyms')
+    store.setTenants(data?.gyms || [])
+    return store.tenants
+  }
+
+  /**
+   * Resuelve a dónde llevar al usuario tras el login.
+   *   'onboarding' -> 0 tenants (debe crear/unirse a uno)
+   *   'ready'      -> 1 tenant (auto-seleccionado) o ya tenia uno activo valido
+   *   'picker'     -> 2+ tenants sin seleccion valida previa
+   */
+  async function resolveAfterLogin() {
+    await load()
+    if (store.tenants.length === 0) return 'onboarding'
+    if (store.tenants.length === 1) { store.setActive(store.tenants[0].key); return 'ready' }
+    if (store.activeKey && store.tenants.some((t) => t.key === store.activeKey)) return 'ready'
+    return 'picker'
+  }
+
+  /** Cambia el tenant activo (switcher). */
+  function switchTo(key) { store.setActive(key) }
+
+  return { load, resolveAfterLogin, switchTo }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@innertia-solutions/innertia-nuxt",
-  "version": "0.1.50",
+  "version": "0.1.53",
   "description": "Innertia Solutions — Nuxt layer unificada: core, auth, multitenancy, theme y app contexts",
   "keywords": [
     "nuxt",

package/plugins/api-tenant.client.ts

@@ -2,9 +2,9 @@
 // El backend (ResolveTenantFromHeader) identifica el tenant por su key/slug, no por UUID.
 //   - saas: slug del tenant resuelto por subdominio (tenantStore); solo se envía
 //     cuando el tenant está validado (tenantId != null) para evitar el 'local' de dev.
-//   - open: key del gym seleccionado in-app (gymStore.activeKey).
+//   - open: key del tenant seleccionado in-app (activeTenant.activeKey).
 // useRequestInterceptors auto-imported desde nuxt-core.
-// useTenantStore / useGymStore auto-imported desde stores.
+// useTenantStore / useActiveTenantStore auto-imported desde stores.
 // Activo en mode === 'saas' | 'open'.
 export default defineNuxtPlugin(() => {
   const { isOpen, hasTenant } = useInnertiaMode()
@@ -15,10 +15,10 @@ export default defineNuxtPlugin(() => {
   const { add } = useRequestInterceptors()
 
   add((headers: Record<string, string>) => {
-    // open: tenant por gym seleccionado
+    // open: tenant por selección in-app
     if (isOpen()) {
-      const gymStore = useGymStore()
-      if (gymStore.activeKey) headers['X-Tenant'] = gymStore.activeKey
+      const activeTenant = useActiveTenantStore()
+      if (activeTenant.activeKey) headers['X-Tenant'] = activeTenant.activeKey
       return
     }
 

package/stores/active-tenant.js

@@ -0,0 +1,27 @@
+import { defineStore } from 'pinia'
+
+/**
+ * Tenant activo en modo 'open'.
+ * A diferencia de saas (tenant por subdominio), open resuelve el tenant por
+ * selección in-app: el usuario elige entre sus tenants y esa key viaja como X-Tenant.
+ * tenants: [{ key, name, status, contexts }]
+ */
+export const useActiveTenantStore = defineStore('activeTenant', {
+  state: () => ({ activeKey: null, activeContext: null, tenants: [] }),
+
+  getters: {
+    active: (s) => s.tenants.find((t) => t.key === s.activeKey) || null,
+    hasMultiple: (s) => s.tenants.length > 1,
+  },
+
+  actions: {
+    setTenants(tenants) { this.tenants = tenants || [] },
+    setActive(key) { this.activeKey = key },
+    setActiveContext(context) { this.activeContext = context },
+    reset() { this.activeKey = null; this.activeContext = null; this.tenants = [] },
+  },
+
+  persist: {
+    pick: ['activeKey', 'activeContext'],
+  },
+})

package/composables/useGymSelection.ts

@@ -1,35 +0,0 @@
-// useApi, useGymStore auto-imported.
-// Selección de gym en modo 'open': carga los gyms del usuario y resuelve
-// el destino post-login según cuántos tenga (0 / 1 / 2+).
-
-export function useGymSelection() {
-  const api = useApi()
-  const gym = useGymStore()
-
-  /** Carga los gyms del usuario autenticado y los guarda en el store. */
-  async function load() {
-    // Shape esperado: { gyms: [{ key, name, status, contexts }] }
-    const data = await api.get('auth/my-gyms')
-    gym.setGyms(data?.gyms || [])
-    return gym.gyms
-  }
-
-  /**
-   * Resuelve a dónde llevar al usuario tras el login.
-   *   'onboarding' → 0 gyms (debe crear/unirse a uno)
-   *   'ready'      → 1 gym (auto-seleccionado) o ya tenía uno activo válido
-   *   'picker'     → 2+ gyms sin selección válida previa
-   */
-  async function resolveAfterLogin() {
-    await load()
-    if (gym.gyms.length === 0) return 'onboarding'
-    if (gym.gyms.length === 1) { gym.setActive(gym.gyms[0].key); return 'ready' }
-    if (gym.activeKey && gym.gyms.some((g) => g.key === gym.activeKey)) return 'ready'
-    return 'picker'
-  }
-
-  /** Cambia el gym activo (switcher). */
-  function switchTo(key) { gym.setActive(key) }
-
-  return { load, resolveAfterLogin, switchTo }
-}

package/stores/gym.js

@@ -1,29 +0,0 @@
-import { defineStore } from 'pinia'
-
-/**
- * Gym activo en modo 'open'.
- * A diferencia de saas (tenant por subdominio), open resuelve el tenant por
- * selección in-app: el usuario elige entre sus gyms y esa key viaja como X-Tenant.
- * gyms: [{ key, name, status, contexts }]
- */
-export const useGymStore = defineStore('gym', {
-  state: () => ({ activeKey: null, activeContext: null, gyms: [] }),
-
-  getters: {
-    active: (s) => s.gyms.find((g) => g.key === s.activeKey) || null,
-    hasMultiple: (s) => s.gyms.length > 1,
-  },
-
-  actions: {
-    setGyms(gyms) { this.gyms = gyms || [] },
-    setActive(key) { this.activeKey = key },
-    // Contexto elegido (backoffice/student/…) — un gym puede otorgar varios.
-    setActiveContext(context) { this.activeContext = context },
-    reset() { this.activeKey = null; this.activeContext = null; this.gyms = [] },
-  },
-
-  persist: {
-    // Key + contexto activos sobreviven el refresh; la lista se recarga del backend.
-    pick: ['activeKey', 'activeContext'],
-  },
-})