@innertia-solutions/innertia-nuxt 0.1.11 → 0.1.12

package/CHANGELOG.md

@@ -0,0 +1,38 @@
+# Changelog
+
+All notable changes to `@innertia-solutions/innertia-nuxt` are documented here.
+
+## [Unreleased]
+
+### BREAKING CHANGES
+
+#### apps → contexts rename
+
+Aligns frontend with innertia-laravel which already renamed the concept.
+
+**Config (`nuxt.config.ts` in your product):**
+```diff
+- innertia.apps: { backoffice: { ... }, technician: { ... } }
++ innertia.contexts: { backoffice: { ... }, technician: { ... } }
+```
+
+**Types:**
+```diff
+- import type { AppDefinition } from '@innertia-solutions/innertia-nuxt/app.config'
++ import type { ContextDefinition } from '@innertia-solutions/innertia-nuxt/app.config'
+
+- import type { AppMobileMode } from '@innertia-solutions/innertia-nuxt/app.config'
++ import type { ContextMobileMode } from '@innertia-solutions/innertia-nuxt/app.config'
+```
+
+**Composables:**
+```diff
+- const { current, all, accessible, canAccess } = useApp()
++ const { current, all, accessible, canAccess } = useContext()
+```
+
+`useApp()` has been removed. Use `useContext()` for all context/app logic. `useContext()` now also exposes: `contexts` (dict), `currentContext`, `availableContexts`, `switchContext()`, `confirmSwitch()`, `hasAccessToContext()`.
+
+**Login body field:**
+
+`performLogin()` now sends `context` instead of `app` in the POST body — matching what innertia-laravel now expects.

package/app.config.ts

@@ -2,12 +2,12 @@
 //
 //   appConfig: {
 //     innertia: {
-//       apps: { backoffice: {...}, technician: {...} },
+//       contexts: { backoffice: {...}, technician: {...} },
 //       mobile: { breakpoint: 1024 },
 //     },
 //   }
 //
-// Si el producto no declara `apps`, el feature de contextos queda inactivo
+// Si el producto no declara `contexts`, el feature de contextos queda inactivo
 // (middleware no redirige, picker no se muestra).
 export default defineAppConfig({
   innertia: {
@@ -121,11 +121,11 @@ export default defineAppConfig({
     },
 
     /**
-     * Declaración de "apps" (contextos) del producto.
-     * Cada app define un prefijo de URL que mapea a un contexto del backend
+     * Declaración de contextos del producto.
+     * Cada contexto define un prefijo de URL que mapea a un contexto del backend
      * (matching con `availableContexts` que devuelve `auth/me`).
      */
-    apps: {} as Record<string, AppDefinition>,
+    contexts: {} as Record<string, ContextDefinition>,
 
     /**
      * Política mobile global. Se aplica si una `app` no tiene `mobile.mode` propio.
@@ -144,7 +144,7 @@ export default defineAppConfig({
 
 export type InnertiaMode = 'saas' | 'app'
 
-export type AppMobileMode = 'allow' | 'block' | 'redirect'
+export type ContextMobileMode = 'allow' | 'block' | 'redirect'
 
 /** Color: nombre de paleta Tailwind o scale custom 50→950. */
 export type ColorScale = Partial<Record<50 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 950, string>>
@@ -175,8 +175,8 @@ export interface MenuItem {
   pattern?: string
 }
 
-export interface AppDefinition {
-  /** Prefijo de URL — la ruta debe empezar con esto para considerarse "dentro" del app. */
+export interface ContextDefinition {
+  /** Prefijo de URL — la ruta debe empezar con esto para considerarse "dentro" del contexto. */
   path: string
   /** Clave del contexto que matchea con `availableContexts` del backend. */
   context: string
@@ -186,13 +186,13 @@ export interface AppDefinition {
   description?: string
   /** Nombre del icono de @tabler/icons-vue (sin "Icon"). */
   icon?: string
-  /** Ruta de login del app. */
+  /** Ruta de login del contexto. */
   loginPath: string
   /** Ruta home (post-login). */
   home: string
   /** Política de uso en mobile. */
   mobile: {
-    mode: AppMobileMode
+    mode: ContextMobileMode
     /** Solo si mode === 'redirect' — adónde mandar desde mobile. */
     redirectTo?: string
   }

package/components/Auth/LoginForm.vue

@@ -99,7 +99,7 @@ async function handleOauth(provider: OAuthProvider) {
 
 // ── Cross-links a otros contextos mobile-friendly (opcional) ───────────────
 const { isMobile } = useMobileGuard()
-const { all } = useApp()
+const { all } = useContext()
 const otherMobileApps = computed(() => {
   if (!props.showCrossLinks) return []
   return all.value.filter((a: any) => a.path !== `/${props.context}` && a.mobile?.mode === 'allow')

package/components/MobileBlocker.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
 import { IconDeviceDesktop, IconArrowRight, IconCopy, IconCheck } from '@tabler/icons-vue'
-import type { AppDefinition } from '~/configs/apps'
+import type { ContextDefinition } from '~/configs/apps'
 
 const props = defineProps<{
-  /** App al que se intentó acceder (para el copy contextual). */
-  blockedApp?: AppDefinition | null
-  /** App mobile-friendly al que el usuario puede continuar (opcional). */
-  fallbackApp?: AppDefinition | null
+  /** Context al que se intentó acceder (para el copy contextual). */
+  blockedApp?: ContextDefinition | null
+  /** Context mobile-friendly al que el usuario puede continuar (opcional). */
+  fallbackApp?: ContextDefinition | null
 }>()
 
 const route = useRoute()

package/components/MobileLoginPicker.vue

@@ -1,18 +1,18 @@
 <script setup lang="ts">
 import * as TablerIcons from '@tabler/icons-vue'
 import { IconArrowRight } from '@tabler/icons-vue'
-import type { AppDefinition } from '~/configs/apps'
+import type { ContextDefinition } from '~/configs/apps'
 
 const props = defineProps<{
-  /** Apps a mostrar como opciones de login. */
-  options: AppDefinition[]
+  /** Contexts a mostrar como opciones de login. */
+  options: ContextDefinition[]
   /** Título personalizable. */
   title?: string
 }>()
 
 const emit = defineEmits<{
-  /** Emitido cuando el usuario elige un app — el padre se encarga de navegar y recordar la elección. */
-  pick: [app: AppDefinition]
+  /** Emitido cuando el usuario elige un context — el padre se encarga de navegar y recordar la elección. */
+  pick: [context: ContextDefinition]
 }>()
 
 const heading = computed(() => props.title ?? '¿Cómo quieres ingresar?')
@@ -46,25 +46,25 @@ function resolveIcon(name?: string) {
         <!-- Opciones -->
         <div class="space-y-3">
           <button
-            v-for="app in options"
-            :key="app.path"
+            v-for="context in options"
+            :key="context.path"
             type="button"
             class="group w-full flex items-center gap-4 rounded-2xl border border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 px-4 py-4 text-left hover:border-violet-300 dark:hover:border-violet-700 hover:bg-violet-50/50 dark:hover:bg-violet-900/10 transition-colors"
-            @click="emit('pick', app)"
+            @click="emit('pick', context)"
           >
             <div class="shrink-0 size-11 rounded-xl bg-violet-100 dark:bg-violet-900/30 flex items-center justify-center group-hover:bg-violet-200 dark:group-hover:bg-violet-900/50 transition-colors">
               <component
-                v-if="resolveIcon(app.icon)"
-                :is="resolveIcon(app.icon)"
+                v-if="resolveIcon(context.icon)"
+                :is="resolveIcon(context.icon)"
                 class="size-5 text-violet-600 dark:text-violet-400"
               />
             </div>
             <div class="flex-1 min-w-0">
               <div class="text-base font-semibold text-slate-900 dark:text-white">
-                {{ app.label }}
+                {{ context.label }}
               </div>
-              <div v-if="app.description" class="text-xs text-slate-500 dark:text-slate-400 mt-0.5 line-clamp-2">
-                {{ app.description }}
+              <div v-if="context.description" class="text-xs text-slate-500 dark:text-slate-400 mt-0.5 line-clamp-2">
+                {{ context.description }}
               </div>
             </div>
             <IconArrowRight class="shrink-0 size-5 text-slate-400 group-hover:text-violet-600 dark:group-hover:text-violet-400 transition-colors" />

package/components/Organization/Picker.vue

@@ -10,12 +10,12 @@
  */
 import { IconBuildingSkyscraper, IconArrowRight } from '@tabler/icons-vue'
 
-const { current: currentApp } = useApp()
+const { current: currentContext } = useContext()
 const { available, switchTo } = useOrganization()
 
 const title = computed(() =>
-  currentApp.value
-    ? `Elige una organización para continuar en ${currentApp.value.label}`
+  currentContext.value
+    ? `Elige una organización para continuar en ${currentContext.value.label}`
     : 'Elige una organización'
 )
 

package/composables/useAuth.js

@@ -14,7 +14,7 @@ export function useAuth() {
    */
   async function performLogin(context, email, password, remember = false) {
     authStore.rememberUser = remember
-    const data = await api.post(`${context}/auth/login`, { email, password, app: context })
+    const data = await api.post(`${context}/auth/login`, { email, password, context })
     authStore.saveToken(data.token ?? data.access_token)
     authStore.setCurrentContext(context)
     queryClient.clear()

package/composables/useContext.js

@@ -1,11 +1,46 @@
-// useAuthStore, useApi, useAuth auto-imported
+// useAuthStore, useApi, useAuth, useRoute, useAppConfig auto-imported
 import { computed } from 'vue'
+import type { ContextDefinition } from '../app.config'
 
 export function useContext() {
+  const route = useRoute()
   const authStore = useAuthStore()
+  const appConfig = useAppConfig()
   const api = useApi()
   const { fetchMe } = useAuth()
 
+  // ── Config-level: definiciones declaradas en appConfig.innertia.contexts ───
+
+  /** Diccionario de contextos declarados por el producto. */
+  const contexts = computed<Record<string, ContextDefinition>>(() =>
+    (appConfig.innertia?.contexts ?? {}) as Record<string, ContextDefinition>
+  )
+
+  /** Todos los contextos declarados, en orden de declaración. */
+  const all = computed<ContextDefinition[]>(() => Object.values(contexts.value))
+
+  /** Contexto actual según URL. `null` si la URL no cae en ningún contexto declarado. */
+  const current = computed<ContextDefinition | null>(() => {
+    return all.value.find(ctx =>
+      route.path === ctx.path || route.path.startsWith(ctx.path + '/')
+    ) ?? null
+  })
+
+  /** Contextos a los que el usuario autenticado tiene acceso (filtrado por `availableContexts`). */
+  const accessible = computed<ContextDefinition[]>(() => {
+    const ctxs = (authStore.availableContexts ?? []) as string[]
+    return all.value.filter(ctx => ctxs.includes(ctx.context))
+  })
+
+  /** Helper: ¿el usuario puede acceder a este contexto (por clave de config)? */
+  function canAccess(key: string): boolean {
+    const ctx = contexts.value[key]
+    if (!ctx) return false
+    return ((authStore.availableContexts ?? []) as string[]).includes(ctx.context)
+  }
+
+  // ── Runtime: contexto activo + switching ───────────────────────────────────
+
   const currentContext = computed(() => authStore.currentContext)
   const availableContexts = computed(() => authStore.availableContexts)
 
@@ -15,7 +50,7 @@ export function useContext() {
    *   { success: false, reason: 'no_permission' }  — user cannot switch
    *   { success: true, requiresConfirmation: true } — show confirmation UI
    */
-  async function switchContext(targetContext) {
+  async function switchContext(targetContext: string) {
     const data = await api.get(`auth/context/${targetContext}/check`)
     if (!data.hasAccess) {
       return { success: false, reason: 'no_permission' }
@@ -27,7 +62,7 @@ export function useContext() {
    * Execute the context switch after user confirmation.
    * Updates store and reloads permissions via fetchMe.
    */
-  async function confirmSwitch(targetContext) {
+  async function confirmSwitch(targetContext: string) {
     authStore.setCurrentContext(targetContext)
     await fetchMe()
     return { success: true }
@@ -36,9 +71,22 @@ export function useContext() {
   /**
    * Quick synchronous check — is this context in the available list?
    */
-  function hasAccessToContext(context) {
+  function hasAccessToContext(context: string) {
     return authStore.availableContexts.includes(context)
   }
 
-  return { currentContext, availableContexts, switchContext, confirmSwitch, hasAccessToContext }
+  return {
+    // config-level
+    contexts,
+    all,
+    current,
+    accessible,
+    canAccess,
+    // runtime
+    currentContext,
+    availableContexts,
+    switchContext,
+    confirmSwitch,
+    hasAccessToContext,
+  }
 }

package/composables/useMobileGuard.ts

@@ -1,61 +1,61 @@
 import { useMediaQuery } from '@vueuse/core'
-import type { AppDefinition } from '../app.config'
+import type { ContextDefinition } from '../app.config'
 
-const PICKER_CHOICE_COOKIE = 'innertia_mobile_app_choice'
+const PICKER_CHOICE_COOKIE = 'innertia_mobile_context_choice'
 const PICKER_COOKIE_MAX_AGE = 60 * 60 * 24 * 30  // 30 días
 
 /**
  * Detección reactiva de viewport mobile + lógica de landing.
  *
  * Reglas para `landing` (qué mostrar cuando el usuario entra a `/` en mobile):
- *   - 0 apps mobile-friendly  → blocker "abre en escritorio"
- *   - 1 app mobile-friendly   → redirect directo al login de ese app
- *   - 2+ apps mobile-friendly → picker (con cookie para recordar última elección)
+ *   - 0 contextos mobile-friendly  → blocker "abre en escritorio"
+ *   - 1 contexto mobile-friendly   → redirect directo al login de ese contexto
+ *   - 2+ contextos mobile-friendly → picker (con cookie para recordar última elección)
  *
  * El breakpoint se lee desde `appConfig.innertia.mobile.breakpoint` (default 1024).
  */
 export function useMobileGuard() {
-  const { all, current, accessible } = useApp()
+  const { all, current, accessible } = useContext()
   const authStore = useAuthStore()
   const appConfig = useAppConfig()
 
   const breakpoint: number = appConfig.innertia?.mobile?.breakpoint ?? 1024
   const isMobile = useMediaQuery(`(max-width: ${breakpoint - 1}px)`)
 
-  /** Apps con mode 'allow' en mobile. */
-  const mobileApps = computed<AppDefinition[]>(() =>
+  /** Contextos con mode 'allow' en mobile. */
+  const mobileContexts = computed<ContextDefinition[]>(() =>
     all.value.filter(a => a.mobile?.mode === 'allow')
   )
 
-  /** Apps mobile-friendly + accesibles para el usuario autenticado. */
-  const mobileAccessibleApps = computed<AppDefinition[]>(() =>
+  /** Contextos mobile-friendly + accesibles para el usuario autenticado. */
+  const mobileAccessibleContexts = computed<ContextDefinition[]>(() =>
     accessible.value.filter(a => a.mobile?.mode === 'allow')
   )
 
-  /** ¿El app actual está bloqueado en mobile? */
-  const isCurrentAppBlocked = computed<boolean>(() => {
+  /** ¿El contexto actual está bloqueado en mobile? */
+  const isCurrentContextBlocked = computed<boolean>(() => {
     if (!isMobile.value) return false
     if (!current.value) return false
     return current.value.mobile?.mode === 'block'
   })
 
   /**
-   * Para el blocker: si el usuario está autenticado y tiene OTRO app mobile-friendly,
+   * Para el blocker: si el usuario está autenticado y tiene OTRO contexto mobile-friendly,
    * lo ofrecemos como fallback ("continuar en X").
    */
-  const mobileFallbackApp = computed<AppDefinition | null>(() => {
+  const mobileFallbackContext = computed<ContextDefinition | null>(() => {
     if (!authStore.isAuthenticated()) return null
-    return mobileAccessibleApps.value[0] ?? null
+    return mobileAccessibleContexts.value[0] ?? null
   })
 
   // ── Cookie helpers para recordar última elección del picker ─────────────────
-  function rememberPickerChoice(appKey: string) {
+  function rememberPickerChoice(contextKey: string) {
     if (!(appConfig.innertia?.mobile?.rememberChoice ?? true)) return
     const cookie = useCookie<string | null>(PICKER_CHOICE_COOKIE, {
       maxAge: PICKER_COOKIE_MAX_AGE,
       sameSite: 'lax',
     })
-    cookie.value = appKey
+    cookie.value = contextKey
   }
 
   function getRememberedPickerChoice(): string | null {
@@ -70,10 +70,10 @@ export function useMobileGuard() {
 
   return {
     isMobile,
-    mobileApps,
-    mobileAccessibleApps,
-    isCurrentAppBlocked,
-    mobileFallbackApp,
+    mobileContexts,
+    mobileAccessibleContexts,
+    isCurrentContextBlocked,
+    mobileFallbackContext,
     rememberPickerChoice,
     getRememberedPickerChoice,
     clearRememberedPickerChoice,

package/composables/useOrganization.ts

@@ -1,7 +1,7 @@
 /**
  * Composable de organizaciones (sub-tenant scoping).
  *
- * Lee el contexto actual del usuario (via useApp) y expone su org activa + lista
+ * Lee el contexto actual del usuario (via useContext) y expone su org activa + lista
  * de accesibles para ese contexto. Cambiar de contexto rota la org automáticamente.
  *
  * Uso típico:
@@ -10,7 +10,7 @@
  *   <OrganizationSwitcher v-if="available.length > 1" />
  */
 export function useOrganization() {
-  const { current: currentApp } = useApp()
+  const { current: currentApp } = useContext()
   const organizationStore = useOrganizationStore()
   const appConfig = useAppConfig()
   const { fetchMe } = useAuth()
@@ -19,7 +19,7 @@ export function useOrganization() {
   const allowConsolidated = computed(() => !!appConfig.innertia?.organizations?.allowConsolidated)
   const required = computed(() => !!appConfig.innertia?.organizations?.required)
 
-  /** Contexto actual (key) — desde useApp. */
+  /** Contexto actual (key) — desde useContext. */
   const currentContext = computed<string | null>(() => currentApp.value?.context ?? null)
 
   /** Lista de orgs accesibles para el contexto actual. */

package/docs/superpowers/plans/2026-05-27-nuxt-apps-to-contexts-rename.md

@@ -0,0 +1,630 @@
+# innertia-nuxt: apps → contexts Rename — Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Rename the "apps" concept to "contexts" throughout innertia-nuxt, aligning the frontend library with the already-renamed innertia-laravel backend.
+
+**Architecture:** Pure rename — zero behavior changes. Config key `innertia.apps` → `innertia.contexts`, types `AppDefinition`/`AppMobileMode` → `ContextDefinition`/`ContextMobileMode`, composable `useApp()` merged into `useContext()`, middleware file renamed, login body field corrected. No backward-compat aliases.
+
+**Tech Stack:** Nuxt 4, Vue 3, TypeScript, Pinia. No test suite in this repo — verification is via `grep` for stale references.
+
+**Working directory:** `/Users/guillermofarias/Innertia/Dev/workspace/libraries/innertia-nuxt`
+
+**Spec:** `docs/superpowers/specs/2026-05-27-nuxt-apps-to-contexts-rename-design.md`
+
+---
+
+## File Map
+
+| File | Action |
+|------|--------|
+| `app.config.ts` | Rename type `AppDefinition` → `ContextDefinition`, `AppMobileMode` → `ContextMobileMode`, config key `innertia.apps` → `innertia.contexts` |
+| `composables/useContext.js` | Absorb all logic from `useApp.ts`; now also reads from `innertia.contexts` and returns `current`, `all`, `accessible`, `canAccess`, `contexts` |
+| `composables/useApp.ts` | **Delete** |
+| `composables/useAuth.js` | Fix login body: `{ app: context }` → `{ context }` |
+| `middleware/03.apps.global.ts` | **Rename** to `03.contexts.global.ts`; update import + internal variable references |
+| `composables/useOrganization.ts` | `useApp()` → `useContext()` |
+| `composables/useMobileGuard.ts` | `useApp()` → `useContext()`, `AppDefinition` → `ContextDefinition`, cookie key renamed |
+| `CHANGELOG.md` | Create — document BREAKING CHANGES |
+
+---
+
+### Task 1: `app.config.ts` — rename types and config key
+
+**Files:**
+- Modify: `app.config.ts`
+
+- [ ] **Step 1: Replace `innertia.apps` config key with `innertia.contexts`**
+
+Find line (currently ~128):
+```ts
+    apps: {} as Record<string, AppDefinition>,
+```
+Replace with:
+```ts
+    /**
+     * Declaración de contextos del producto.
+     * Cada contexto define un prefijo de URL que mapea a un contexto del backend
+     * (matching con `availableContexts` que devuelve `auth/me`).
+     */
+    contexts: {} as Record<string, ContextDefinition>,
+```
+
+Also update the comment block just above it (currently ~122–127):
+```ts
+    /**
+     * Declaración de "apps" (contextos) del producto.
+     * Cada app define un prefijo de URL que mapea a un contexto del backend
+     * (matching con `availableContexts` que devuelve `auth/me`).
+     */
+    apps: {} as Record<string, AppDefinition>,
+```
+
+- [ ] **Step 2: Rename `AppMobileMode` type**
+
+Find line (~147):
+```ts
+export type AppMobileMode = 'allow' | 'block' | 'redirect'
+```
+Replace with:
+```ts
+export type ContextMobileMode = 'allow' | 'block' | 'redirect'
+```
+
+- [ ] **Step 3: Rename `AppDefinition` interface and update its internal reference to `AppMobileMode`**
+
+Find (~178–199):
+```ts
+export interface AppDefinition {
+  /** Prefijo de URL — la ruta debe empezar con esto para considerarse "dentro" del app. */
+  path: string
+  /** Clave del contexto que matchea con `availableContexts` del backend. */
+  context: string
+  /** Label visible en pickers, dropdowns, etc. */
+  label: string
+  /** Descripción opcional para el picker mobile. */
+  description?: string
+  /** Nombre del icono de @tabler/icons-vue (sin "Icon"). */
+  icon?: string
+  /** Ruta de login del app. */
+  loginPath: string
+  /** Ruta home (post-login). */
+  home: string
+  /** Política de uso en mobile. */
+  mobile: {
+    mode: AppMobileMode
+    /** Solo si mode === 'redirect' — adónde mandar desde mobile. */
+    redirectTo?: string
+  }
+}
+```
+Replace with:
+```ts
+export interface ContextDefinition {
+  /** Prefijo de URL — la ruta debe empezar con esto para considerarse "dentro" del contexto. */
+  path: string
+  /** Clave del contexto que matchea con `availableContexts` del backend. */
+  context: string
+  /** Label visible en pickers, dropdowns, etc. */
+  label: string
+  /** Descripción opcional para el picker mobile. */
+  description?: string
+  /** Nombre del icono de @tabler/icons-vue (sin "Icon"). */
+  icon?: string
+  /** Ruta de login del contexto. */
+  loginPath: string
+  /** Ruta home (post-login). */
+  home: string
+  /** Política de uso en mobile. */
+  mobile: {
+    mode: ContextMobileMode
+    /** Solo si mode === 'redirect' — adónde mandar desde mobile. */
+    redirectTo?: string
+  }
+}
+```
+
+- [ ] **Step 4: Verify no remaining `AppDefinition` or `AppMobileMode` references in `app.config.ts`**
+
+Run:
+```bash
+grep -n "AppDefinition\|AppMobileMode" app.config.ts
+```
+Expected: no output (zero matches).
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add app.config.ts
+git commit -m "refactor(contexts): rename AppDefinition→ContextDefinition, AppMobileMode→ContextMobileMode, innertia.apps→innertia.contexts in app.config"
+```
+
+---
+
+### Task 2: `useContext.js` — absorb `useApp` logic
+
+**Files:**
+- Modify: `composables/useContext.js`
+
+The current `useContext.js` handles runtime context switching. We extend it to also expose the config-level definitions (previously in `useApp.ts`), reading from `appConfig.innertia.contexts`.
+
+- [ ] **Step 1: Replace the full contents of `composables/useContext.js`**
+
+```js
+// useAuthStore, useApi, useAuth auto-imported
+import { computed } from 'vue'
+import type { ContextDefinition } from '../app.config'
+
+export function useContext() {
+  const route = useRoute()
+  const authStore = useAuthStore()
+  const appConfig = useAppConfig()
+  const api = useApi()
+  const { fetchMe } = useAuth()
+
+  // ── Config-level: definiciones declaradas en appConfig.innertia.contexts ───
+
+  /** Diccionario de contextos declarados por el producto. */
+  const contexts = computed<Record<string, ContextDefinition>>(() =>
+    (appConfig.innertia?.contexts ?? {}) as Record<string, ContextDefinition>
+  )
+
+  /** Todos los contextos declarados, en orden de declaración. */
+  const all = computed<ContextDefinition[]>(() => Object.values(contexts.value))
+
+  /** Contexto actual según URL. `null` si la URL no cae en ningún contexto declarado. */
+  const current = computed<ContextDefinition | null>(() => {
+    return all.value.find(ctx =>
+      route.path === ctx.path || route.path.startsWith(ctx.path + '/')
+    ) ?? null
+  })
+
+  /** Contextos a los que el usuario autenticado tiene acceso (filtrado por `availableContexts`). */
+  const accessible = computed<ContextDefinition[]>(() => {
+    const ctxs = (authStore.availableContexts ?? []) as string[]
+    return all.value.filter(ctx => ctxs.includes(ctx.context))
+  })
+
+  /** Helper: ¿el usuario puede acceder a este contexto (por clave de config)? */
+  function canAccess(key: string): boolean {
+    const ctx = contexts.value[key]
+    if (!ctx) return false
+    return ((authStore.availableContexts ?? []) as string[]).includes(ctx.context)
+  }
+
+  // ── Runtime: contexto activo + switching ───────────────────────────────────
+
+  const currentContext = computed(() => authStore.currentContext)
+  const availableContexts = computed(() => authStore.availableContexts)
+
+  /**
+   * Check whether user has permission to switch to targetContext.
+   * Returns:
+   *   { success: false, reason: 'no_permission' }  — user cannot switch
+   *   { success: true, requiresConfirmation: true } — show confirmation UI
+   */
+  async function switchContext(targetContext) {
+    const data = await api.get(`auth/context/${targetContext}/check`)
+    if (!data.hasAccess) {
+      return { success: false, reason: 'no_permission' }
+    }
+    return { success: true, requiresConfirmation: true }
+  }
+
+  /**
+   * Execute the context switch after user confirmation.
+   * Updates store and reloads permissions via fetchMe.
+   */
+  async function confirmSwitch(targetContext) {
+    authStore.setCurrentContext(targetContext)
+    await fetchMe()
+    return { success: true }
+  }
+
+  /**
+   * Quick synchronous check — is this context in the available list?
+   */
+  function hasAccessToContext(context) {
+    return authStore.availableContexts.includes(context)
+  }
+
+  return {
+    // config-level
+    contexts,
+    all,
+    current,
+    accessible,
+    canAccess,
+    // runtime
+    currentContext,
+    availableContexts,
+    switchContext,
+    confirmSwitch,
+    hasAccessToContext,
+  }
+}
+```
+
+- [ ] **Step 2: Verify the file saved correctly**
+
+```bash
+grep -n "innertia.contexts\|ContextDefinition\|contexts\|current\|accessible" composables/useContext.js | head -20
+```
+Expected: lines showing `innertia.contexts`, `ContextDefinition`, and all the returned properties.
+
+- [ ] **Step 3: Commit**
+
+```bash
+git add composables/useContext.js
+git commit -m "refactor(contexts): useContext absorbs useApp — exposes current, all, accessible, canAccess, contexts from innertia.contexts config"
+```
+
+---
+
+### Task 3: Delete `useApp.ts`
+
+**Files:**
+- Delete: `composables/useApp.ts`
+
+- [ ] **Step 1: Delete the file**
+
+```bash
+git rm composables/useApp.ts
+```
+
+- [ ] **Step 2: Commit**
+
+```bash
+git commit -m "refactor(contexts): remove useApp.ts — functionality merged into useContext"
+```
+
+---
+
+### Task 4: `useAuth.js` — fix login body field
+
+**Files:**
+- Modify: `composables/useAuth.js`
+
+The `performLogin` function currently sends `app: context` in the POST body. The backend (innertia-laravel) now expects the field to be named `context`.
+
+- [ ] **Step 1: Fix the `performLogin` call**
+
+Find line (~17):
+```js
+    const data = await api.post(`${context}/auth/login`, { email, password, app: context })
+```
+Replace with:
+```js
+    const data = await api.post(`${context}/auth/login`, { email, password, context })
+```
+
+- [ ] **Step 2: Verify**
+
+```bash
+grep -n "app:" composables/useAuth.js
+```
+Expected: no output (zero matches — the old `app: context` field is gone).
+
+- [ ] **Step 3: Commit**
+
+```bash
+git add composables/useAuth.js
+git commit -m "fix(contexts): send context field instead of app in performLogin body"
+```
+
+---
+
+### Task 5: Rename and update middleware
+
+**Files:**
+- Delete: `middleware/03.apps.global.ts`
+- Create: `middleware/03.contexts.global.ts`
+
+- [ ] **Step 1: Create `middleware/03.contexts.global.ts` with updated content**
+
+```ts
+/**
+ * Middleware global que se ejecuta en cada navegación.
+ *
+ * Lee la declaración de contextos desde `appConfig.innertia.contexts`. Si el
+ * producto no declara contextos, este middleware no hace nada (feature inactivo).
+ *
+ * Cuando hay contextos declarados, resuelve qué contexto está intentando acceder
+ * el usuario según el prefijo de URL y:
+ *   1. Si la URL no cae en ningún contexto declarado → pasa (deja seguir)
+ *   2. Si la URL es la ruta de login del contexto → pasa (sin chequeo de permisos)
+ *   3. Si el usuario no está autenticado → deja que el middleware `auth` redirija
+ *   4. Si `availableContexts` está vacío (SSR sin hidratar) → intenta fetchMe()
+ *      y si falla, pasa sin redirigir (mejor renderizar que redirigir mal)
+ *   5. Si el usuario está autenticado pero NO tiene acceso al contexto →
+ *      redirige al primer contexto accesible (o a su loginPath si no tiene ninguno)
+ *   6. Si todo OK pero `currentContext !== targetContext.context` → sincroniza el
+ *      contexto en el authStore y recarga permisos vía fetchMe()
+ *
+ * Esto es lo que permite el "cambio de contexto implícito por URL" sin botón.
+ *
+ * Numeración 03. para correr DESPUÉS de los middlewares saas
+ * (01.detect-subdomain, 02.validate-tenant).
+ */
+import type { ContextDefinition } from '../app.config'
+
+export default defineNuxtRouteMiddleware(async (to) => {
+  const appConfig = useAppConfig()
+  const contexts = (appConfig.innertia?.contexts ?? {}) as Record<string, ContextDefinition>
+  const list = Object.values(contexts)
+
+  // Si el producto no declaró contextos, el feature está inactivo
+  if (list.length === 0) return
+
+  // ¿La ruta cae bajo algún contexto?
+  const targetContext = list.find(ctx =>
+    to.path === ctx.path || to.path.startsWith(ctx.path + '/')
+  )
+
+  if (!targetContext) return  // ruta pública / fuera de contextos
+
+  // La ruta de login del propio contexto no requiere permisos
+  if (to.path === targetContext.loginPath) return
+
+  const authStore = useAuthStore()
+
+  // Si no está autenticado, deja que el middleware `auth` de la página haga el redirect
+  if (!authStore.isAuthenticated()) return
+
+  // ── Hidratación defensiva ─────────────────────────────────────────────────
+  // `availableContexts` se persiste en localStorage, que NO se lee en SSR.
+  // El plugin auth-init hace fetchMe en SSR pero puede fallar silenciosamente
+  // (ej. tenant no resuelto). Si llegamos con token válido pero array vacío,
+  // intentamos cargar los contextos antes de decidir el redirect.
+  if ((authStore.availableContexts ?? []).length === 0) {
+    try {
+      const { fetchMe } = useAuth()
+      await fetchMe()
+    } catch {
+      // no podemos resolver — pasamos: mejor renderizar la página que redirigir mal
+      return
+    }
+  }
+
+  const userContexts = (authStore.availableContexts ?? []) as string[]
+
+  // Si tras hidratar seguimos sin contextos, NO redirigimos.
+  if (userContexts.length === 0) return
+
+  // ¿Tiene acceso al contexto?
+  if (!userContexts.includes(targetContext.context)) {
+    const fallback = list.find(ctx => userContexts.includes(ctx.context))
+    if (fallback) {
+      return navigateTo(fallback.home, { replace: true })
+    }
+    return navigateTo(list[0]?.loginPath ?? '/', { replace: true })
+  }
+
+  // Sincronizar currentContext silenciosamente si cambia
+  if (authStore.currentContext !== targetContext.context) {
+    authStore.setCurrentContext(targetContext.context)
+    try {
+      const { fetchMe } = useAuth()
+      await fetchMe()
+    } catch {
+      // best-effort
+    }
+  }
+})
+```
+
+- [ ] **Step 2: Remove the old middleware file**
+
+```bash
+git rm middleware/03.apps.global.ts
+```
+
+- [ ] **Step 3: Stage and commit**
+
+```bash
+git add middleware/03.contexts.global.ts
+git commit -m "refactor(contexts): rename 03.apps.global→03.contexts.global, innertia.apps→innertia.contexts, AppDefinition→ContextDefinition"
+```
+
+---
+
+### Task 6: `useOrganization.ts` + `useMobileGuard.ts` — swap `useApp()` for `useContext()`
+
+**Files:**
+- Modify: `composables/useOrganization.ts`
+- Modify: `composables/useMobileGuard.ts`
+
+- [ ] **Step 1: Update `useOrganization.ts` — change `useApp()` to `useContext()`**
+
+Find line 13:
+```ts
+  const { current: currentApp } = useApp()
+```
+Replace with:
+```ts
+  const { current: currentApp } = useContext()
+```
+
+(The local alias `currentApp` is kept — it's used on line 23 as `currentApp.value?.context`. No other changes needed in this file.)
+
+- [ ] **Step 2: Verify `useOrganization.ts` — no remaining `useApp` references**
+
+```bash
+grep -n "useApp" composables/useOrganization.ts
+```
+Expected: no output.
+
+- [ ] **Step 3: Update `useMobileGuard.ts` — full replacement**
+
+Replace the full file with:
+
+```ts
+import { useMediaQuery } from '@vueuse/core'
+import type { ContextDefinition } from '../app.config'
+
+const PICKER_CHOICE_COOKIE = 'innertia_mobile_context_choice'
+const PICKER_COOKIE_MAX_AGE = 60 * 60 * 24 * 30  // 30 días
+
+/**
+ * Detección reactiva de viewport mobile + lógica de landing.
+ *
+ * Reglas para `landing` (qué mostrar cuando el usuario entra a `/` en mobile):
+ *   - 0 contextos mobile-friendly  → blocker "abre en escritorio"
+ *   - 1 contexto mobile-friendly   → redirect directo al login de ese contexto
+ *   - 2+ contextos mobile-friendly → picker (con cookie para recordar última elección)
+ *
+ * El breakpoint se lee desde `appConfig.innertia.mobile.breakpoint` (default 1024).
+ */
+export function useMobileGuard() {
+  const { all, current, accessible } = useContext()
+  const authStore = useAuthStore()
+  const appConfig = useAppConfig()
+
+  const breakpoint: number = appConfig.innertia?.mobile?.breakpoint ?? 1024
+  const isMobile = useMediaQuery(`(max-width: ${breakpoint - 1}px)`)
+
+  /** Contextos con mode 'allow' en mobile. */
+  const mobileApps = computed<ContextDefinition[]>(() =>
+    all.value.filter(a => a.mobile?.mode === 'allow')
+  )
+
+  /** Contextos mobile-friendly + accesibles para el usuario autenticado. */
+  const mobileAccessibleApps = computed<ContextDefinition[]>(() =>
+    accessible.value.filter(a => a.mobile?.mode === 'allow')
+  )
+
+  /** ¿El contexto actual está bloqueado en mobile? */
+  const isCurrentAppBlocked = computed<boolean>(() => {
+    if (!isMobile.value) return false
+    if (!current.value) return false
+    return current.value.mobile?.mode === 'block'
+  })
+
+  /**
+   * Para el blocker: si el usuario está autenticado y tiene OTRO contexto mobile-friendly,
+   * lo ofrecemos como fallback ("continuar en X").
+   */
+  const mobileFallbackApp = computed<ContextDefinition | null>(() => {
+    if (!authStore.isAuthenticated()) return null
+    return mobileAccessibleApps.value[0] ?? null
+  })
+
+  // ── Cookie helpers para recordar última elección del picker ─────────────────
+  function rememberPickerChoice(contextKey: string) {
+    if (!(appConfig.innertia?.mobile?.rememberChoice ?? true)) return
+    const cookie = useCookie<string | null>(PICKER_CHOICE_COOKIE, {
+      maxAge: PICKER_COOKIE_MAX_AGE,
+      sameSite: 'lax',
+    })
+    cookie.value = contextKey
+  }
+
+  function getRememberedPickerChoice(): string | null {
+    const cookie = useCookie<string | null>(PICKER_CHOICE_COOKIE)
+    return cookie.value ?? null
+  }
+
+  function clearRememberedPickerChoice() {
+    const cookie = useCookie<string | null>(PICKER_CHOICE_COOKIE)
+    cookie.value = null
+  }
+
+  return {
+    isMobile,
+    mobileApps,
+    mobileAccessibleApps,
+    isCurrentAppBlocked,
+    mobileFallbackApp,
+    rememberPickerChoice,
+    getRememberedPickerChoice,
+    clearRememberedPickerChoice,
+  }
+}
+```
+
+- [ ] **Step 4: Verify no remaining `useApp` or `AppDefinition` references in both files**
+
+```bash
+grep -n "useApp\|AppDefinition\|AppMobileMode" composables/useOrganization.ts composables/useMobileGuard.ts
+```
+Expected: no output.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add composables/useOrganization.ts composables/useMobileGuard.ts
+git commit -m "refactor(contexts): useOrganization + useMobileGuard — useApp()→useContext(), AppDefinition→ContextDefinition"
+```
+
+---
+
+### Task 7: Docs — CHANGELOG + final verification
+
+**Files:**
+- Create: `CHANGELOG.md`
+
+- [ ] **Step 1: Create `CHANGELOG.md`**
+
+```bash
+cat > CHANGELOG.md << 'EOF'
+# Changelog
+
+All notable changes to `@innertia-solutions/innertia-nuxt` are documented here.
+
+## [Unreleased]
+
+### BREAKING CHANGES
+
+#### apps → contexts rename
+
+Aligns frontend with innertia-laravel which already renamed the concept.
+
+**Config (`app.config.ts` / `nuxt.config.ts` in your product):**
+```diff
+- innertia.apps: { backoffice: { ... }, technician: { ... } }
++ innertia.contexts: { backoffice: { ... }, technician: { ... } }
+```
+
+**Types:**
+```diff
+- import type { AppDefinition } from '@innertia-solutions/innertia-nuxt/app.config'
++ import type { ContextDefinition } from '@innertia-solutions/innertia-nuxt/app.config'
+
+- import type { AppMobileMode } from '@innertia-solutions/innertia-nuxt/app.config'
++ import type { ContextMobileMode } from '@innertia-solutions/innertia-nuxt/app.config'
+```
+
+**Composables:**
+```diff
+- const { current, all, accessible, canAccess } = useApp()
++ const { current, all, accessible, canAccess } = useContext()
+# useContext() now also returns: contexts (dict), currentContext, availableContexts,
+# switchContext(), confirmSwitch(), hasAccessToContext()
+```
+
+`useApp()` has been removed. Use `useContext()` for all context/app logic.
+
+**Login body field:**
+
+The `performLogin()` function in `useAuth` now sends `context` instead of `app` in
+the POST body — matching what innertia-laravel now expects.
+EOF
+```
+
+- [ ] **Step 2: Final grep — verify no stale references remain in the entire library**
+
+```bash
+grep -r "innertia\.apps\|AppDefinition\|AppMobileMode\|useApp()\|'app:'\|\"app:\"" \
+  --include="*.ts" --include="*.js" --include="*.vue" \
+  --exclude-dir=".nuxt" --exclude-dir="node_modules" \
+  .
+```
+Expected: **no output**. If any matches appear, fix them before committing.
+
+- [ ] **Step 3: Commit**
+
+```bash
+git add CHANGELOG.md
+git commit -m "docs(contexts): add CHANGELOG with apps→contexts BREAKING CHANGE"
+```
+EOF

package/docs/superpowers/specs/2026-05-27-nuxt-apps-to-contexts-rename-design.md

@@ -0,0 +1,113 @@
+# innertia-nuxt: Rename apps → contexts
+
+**Fecha:** 2026-05-27
+**Estado:** Aprobado para implementación
+**Tipo:** Refactor — rename puro, sin cambios de comportamiento
+**Scope:** innertia-nuxt library
+
+## Problema
+
+El concepto de "apps" (áreas del sistema a las que un usuario tiene acceso) colisiona semánticamente con "apps" en el contexto de frontend (aplicaciones, secciones de front). Renombrar a "contexts" elimina la ambigüedad y alinea la librería con el rename ya realizado en innertia-laravel (donde `user_apps`, `HasApps`, `appKeys()` etc. ya se renombraron a `user_contexts`, `HasContexts`, `contextKeys()`).
+
+El backend ya devuelve `availableContexts` y `currentContext` — el frontend ya usaba esos nombres en el store. Este rename hace que la **capa de configuración y composables** sea consistente con la API que ya consume.
+
+## Alcance
+
+Rename puro. **Cero cambios de comportamiento.** Todo lo que hoy funciona, sigue funcionando igual — solo cambian los nombres.
+
+**Fuera de scope:**
+- `menuApps` en `app.config.ts` y `backoffice.vue` — semánticamente correcto como "secciones del menú", no relacionado con el sistema de user contexts. Se mantiene intacto.
+- Lógica de organizations, mobile guard, o cualquier otra feature.
+
+## Mapa de renombrado
+
+### `app.config.ts` — config key + tipos
+
+| Antes | Después |
+|-------|---------|
+| `innertia.apps: {}` | `innertia.contexts: {}` |
+| `AppDefinition` interface | `ContextDefinition` |
+| `AppMobileMode` type | `ContextMobileMode` |
+
+`menuApps` **no se toca**.
+
+### `composables/useContext.js` — fusión de useApp + useContext
+
+`useApp.ts` se elimina. `useContext.js` absorbe su lógica y expone la unión completa:
+
+```ts
+const {
+  // — absorbido de useApp —
+  current,            // ContextDefinition | null  (contexto según URL actual)
+  all,                // ContextDefinition[]        (todos los declarados en config)
+  accessible,         // ContextDefinition[]        (filtrados por availableContexts del user)
+  canAccess,          // (key: string) => boolean
+  contexts,           // Record<string, ContextDefinition>  (dict raw del config)
+
+  // — ya existía en useContext —
+  currentContext,     // string | null
+  availableContexts,  // string[]
+  switchContext,      // (target: string) => Promise<{success, reason?}>
+  confirmSwitch,      // (target: string) => Promise<{success}>
+  hasAccessToContext, // (context: string) => boolean
+} = useContext()
+```
+
+**Regla de resolución de la parte absorbida:** lee de `appConfig.innertia.contexts` (antes `appConfig.innertia.apps`). La lógica interna es idéntica a la de `useApp.ts` actual.
+
+### `composables/useApp.ts`
+
+**Eliminado.** Toda su funcionalidad vive en `useContext.js`.
+
+### `composables/useAuth.js`
+
+Login POST body:
+
+```js
+// Antes
+api.post(`${context}/auth/login`, { email, password, app: context })
+
+// Después
+api.post(`${context}/auth/login`, { email, password, context })
+```
+
+El backend (innertia-laravel) ya espera el campo `context`. Este fix cierra la inconsistencia.
+
+### `middleware/03.apps.global.ts` → `middleware/03.contexts.global.ts`
+
+- Renombrar el archivo.
+- Internamente: `apps` variables → `contexts`, `AppDefinition` import → `ContextDefinition`, `appConfig.innertia.apps` → `appConfig.innertia.contexts`.
+- La lógica de los 6 escenarios (ruta pública, login path, sin auth, sin contextos, sin acceso, sync) no cambia.
+
+### `composables/useOrganization.ts`
+
+- `useApp()` → `useContext()`
+- Las propiedades que consume (`current`, referenciada internamente como `currentApp`) siguen existiendo con el mismo nombre en el composable fusionado.
+
+### `composables/useMobileGuard.ts`
+
+- `useApp()` → `useContext()`
+- Propiedades consumidas: `all`, `current`, `accessible` — todas disponibles en el composable fusionado sin cambios de nombre.
+
+### `CHANGELOG.md`
+
+Agregar entrada `[Unreleased]` con sección `### BREAKING CHANGES`.
+
+## Archivos a modificar (8)
+
+1. `app.config.ts` — config key + tipos
+2. `composables/useContext.js` — absorber useApp + actualizar internals
+3. `composables/useApp.ts` — **eliminar**
+4. `composables/useAuth.js` — fix body del login
+5. `middleware/03.apps.global.ts` → **renombrar** a `03.contexts.global.ts` + editar internals
+6. `composables/useOrganization.ts` — `useApp()` → `useContext()`
+7. `composables/useMobileGuard.ts` — `useApp()` → `useContext()`
+8. `CHANGELOG.md` — BREAKING CHANGE entry
+
+## BREAKING CHANGES para productos consumidores
+
+- Config `innertia.contexts` en vez de `innertia.apps`
+- Tipo `ContextDefinition` en vez de `AppDefinition`
+- Tipo `ContextMobileMode` en vez de `AppMobileMode`
+- `useApp()` eliminado → usar `useContext()` (que ahora expone también `current`, `all`, `accessible`, `canAccess`, `contexts`)
+- `performLogin` body: campo `context` en vez de `app`

package/middleware/{03.apps.global.ts → 03.contexts.global.ts}

@@ -1,45 +1,45 @@
 /**
  * Middleware global que se ejecuta en cada navegación.
  *
- * Lee la declaración de apps desde `appConfig.innertia.apps`. Si el producto
- * no declara apps, este middleware no hace nada (feature inactivo).
+ * Lee la declaración de contextos desde `appConfig.innertia.contexts`. Si el
+ * producto no declara contextos, este middleware no hace nada (feature inactivo).
  *
- * Cuando hay apps declaradas, resuelve qué "app" (contexto) está intentando
- * acceder el usuario según el prefijo de URL y:
- *   1. Si la URL no cae en ningún app declarado → pasa (deja seguir)
- *   2. Si la URL es la ruta de login del app → pasa (sin chequeo de permisos)
+ * Cuando hay contextos declarados, resuelve qué contexto está intentando acceder
+ * el usuario según el prefijo de URL y:
+ *   1. Si la URL no cae en ningún contexto declarado → pasa (deja seguir)
+ *   2. Si la URL es la ruta de login del contexto → pasa (sin chequeo de permisos)
  *   3. Si el usuario no está autenticado → deja que el middleware `auth` redirija
  *   4. Si `availableContexts` está vacío (SSR sin hidratar) → intenta fetchMe()
  *      y si falla, pasa sin redirigir (mejor renderizar que redirigir mal)
- *   5. Si el usuario está autenticado pero NO tiene acceso al contexto del app →
- *      redirige al primer app accesible (o a su loginPath si no tiene ninguno)
- *   6. Si todo OK pero `currentContext !== app.context` → sincroniza el contexto
- *      en el authStore y recarga permisos vía fetchMe()
+ *   5. Si el usuario está autenticado pero NO tiene acceso al contexto →
+ *      redirige al primer contexto accesible (o a su loginPath si no tiene ninguno)
+ *   6. Si todo OK pero `currentContext !== targetContext.context` → sincroniza el
+ *      contexto en el authStore y recarga permisos vía fetchMe()
  *
  * Esto es lo que permite el "cambio de contexto implícito por URL" sin botón.
  *
  * Numeración 03. para correr DESPUÉS de los middlewares saas
  * (01.detect-subdomain, 02.validate-tenant).
  */
-import type { AppDefinition } from '../app.config'
+import type { ContextDefinition } from '../app.config'
 
 export default defineNuxtRouteMiddleware(async (to) => {
   const appConfig = useAppConfig()
-  const apps = (appConfig.innertia?.apps ?? {}) as Record<string, AppDefinition>
-  const list = Object.values(apps)
+  const contexts = (appConfig.innertia?.contexts ?? {}) as Record<string, ContextDefinition>
+  const list = Object.values(contexts)
 
-  // Si el producto no declaró apps, el feature está inactivo
+  // Si el producto no declaró contextos, el feature está inactivo
   if (list.length === 0) return
 
-  // ¿La ruta cae bajo algún app?
-  const targetApp = list.find(app =>
-    to.path === app.path || to.path.startsWith(app.path + '/')
+  // ¿La ruta cae bajo algún contexto?
+  const targetContext = list.find(ctx =>
+    to.path === ctx.path || to.path.startsWith(ctx.path + '/')
   )
 
-  if (!targetApp) return  // ruta pública / fuera de apps
+  if (!targetContext) return  // ruta pública / fuera de contextos
 
-  // La ruta de login del propio app no requiere permisos del contexto
-  if (to.path === targetApp.loginPath) return
+  // La ruta de login del propio contexto no requiere permisos
+  if (to.path === targetContext.loginPath) return
 
   const authStore = useAuthStore()
 
@@ -66,9 +66,9 @@ export default defineNuxtRouteMiddleware(async (to) => {
   // Si tras hidratar seguimos sin contextos, NO redirigimos.
   if (userContexts.length === 0) return
 
-  // ¿Tiene acceso al contexto del app?
-  if (!userContexts.includes(targetApp.context)) {
-    const fallback = list.find(app => userContexts.includes(app.context))
+  // ¿Tiene acceso al contexto?
+  if (!userContexts.includes(targetContext.context)) {
+    const fallback = list.find(ctx => userContexts.includes(ctx.context))
     if (fallback) {
       return navigateTo(fallback.home, { replace: true })
     }
@@ -76,8 +76,8 @@ export default defineNuxtRouteMiddleware(async (to) => {
   }
 
   // Sincronizar currentContext silenciosamente si cambia
-  if (authStore.currentContext !== targetApp.context) {
-    authStore.setCurrentContext(targetApp.context)
+  if (authStore.currentContext !== targetContext.context) {
+    authStore.setCurrentContext(targetContext.context)
     try {
       const { fetchMe } = useAuth()
       await fetchMe()

package/package.json

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

package/composables/useApp.ts

@@ -1,46 +0,0 @@
-import type { AppDefinition } from '../app.config'
-
-/**
- * Devuelve metadata del app actual + listas filtradas por permisos del usuario.
- * Lee la declaración de apps desde `appConfig.innertia.apps` (configurable por
- * el producto en su `nuxt.config.ts`).
- *
- * Uso típico:
- *   const { current, accessible } = useApp()
- *   <h1>Estás en: {{ current?.label }}</h1>
- */
-export function useApp() {
-  const route = useRoute()
-  const authStore = useAuthStore()
-  const appConfig = useAppConfig()
-
-  /** Diccionario de apps declarados por el producto. */
-  const apps = computed<Record<string, AppDefinition>>(() =>
-    (appConfig.innertia?.apps ?? {}) as Record<string, AppDefinition>
-  )
-
-  /** Todos los apps declarados, en orden de declaración. */
-  const all = computed<AppDefinition[]>(() => Object.values(apps.value))
-
-  /** App actual, determinado por el prefijo de la ruta. `null` si la URL no cae en ningún app. */
-  const current = computed<AppDefinition | null>(() => {
-    return all.value.find(app =>
-      route.path === app.path || route.path.startsWith(app.path + '/')
-    ) ?? null
-  })
-
-  /** Apps a los que el usuario autenticado tiene acceso (filtrado por `availableContexts`). */
-  const accessible = computed<AppDefinition[]>(() => {
-    const ctxs = (authStore.availableContexts ?? []) as string[]
-    return all.value.filter(app => ctxs.includes(app.context))
-  })
-
-  /** Helper: ¿el usuario puede acceder a este app? */
-  function canAccess(appKey: string): boolean {
-    const app = apps.value[appKey]
-    if (!app) return false
-    return ((authStore.availableContexts ?? []) as string[]).includes(app.context)
-  }
-
-  return { current, all, accessible, canAccess, apps }
-}