web-next: selector de cuenta de juego (WOW1/WOW2…) en /account

Si la Battle.net tiene más de una cuenta de juego, /account muestra un
desplegable «Cargar datos de la cuenta» (WOW1, WOW2…). Al cambiar, fija la
cuenta activa en la sesión vía /api/auth/select-account y refresca → toda la
página (datos, personajes, servicios, compras) opera sobre la cuenta elegida
(la sesión.accountId manda). Con una sola cuenta no aparece (como hasta ahora).
components/GameAccountSwitcher.tsx (client) + getGameAccounts en la page.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

web-next/app/[locale]/account/page.tsx

@@ -2,9 +2,11 @@ import { getTranslations, setRequestLocale } from 'next-intl/server'
 import { redirect, Link } from '@/i18n/navigation'
 import { getSession } from '@/lib/session'
 import { getAccountDashboard, getAccountRank } from '@/lib/account'
+import { getGameAccounts } from '@/lib/auth'
 import { isAdmin } from '@/lib/admin'
 import { PageShell } from '@/components/PageShell'
 import { AccountTools } from '@/components/AccountTools'
+import { GameAccountSwitcher } from '@/components/GameAccountSwitcher'
 
 export const dynamic = 'force-dynamic'
 
@@ -39,9 +41,16 @@ export default async function AccountPage({ params }: { params: Promise<{ locale
   const data = await getAccountDashboard(session)
   const admin = await isAdmin(session)
   const rank = getAccountRank(data.dp)
+  // Cuentas de juego de la Battle.net (para el selector si hay más de una).
+  const games = await getGameAccounts(session.bnetId ?? 0)
 
   return (
     <PageShell title={t('title')}>
+      {/* Selector de cuenta de juego (WOW1/WOW2…) si la bnet tiene más de una */}
+      {games.length > 1 && (
+        <GameAccountSwitcher accounts={games} currentId={session.accountId ?? 0} />
+      )}
+
       {/* Información: dos fieldsets como en Django */}
       <div className="box-content">
         <div className="title-box-content">

web-next/components/GameAccountSwitcher.tsx

@@ -0,0 +1,59 @@
+'use client'
+
+import { useState } from 'react'
+import { useTranslations } from 'next-intl'
+import { useRouter } from '@/i18n/navigation'
+
+/**
+ * Desplegable para cambiar la cuenta de juego activa (WOW1, WOW2…) cuando la
+ * Battle.net tiene más de una. Al cambiar, fija la cuenta en la sesión
+ * (/api/auth/select-account) y refresca → todo /account (datos, personajes,
+ * servicios, compras…) pasa a operar sobre la cuenta seleccionada.
+ */
+export function GameAccountSwitcher({
+  accounts,
+  currentId,
+}: {
+  accounts: { id: number; index: number }[]
+  currentId: number
+}) {
+  const t = useTranslations('Account')
+  const router = useRouter()
+  const [busy, setBusy] = useState(false)
+
+  async function onChange(e: React.ChangeEvent<HTMLSelectElement>) {
+    const id = Number(e.target.value)
+    if (id === currentId || busy) return
+    setBusy(true)
+    try {
+      const res = await fetch('/api/auth/select-account', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'same-origin',
+        body: JSON.stringify({ accountId: id }),
+      })
+      const d = await res.json()
+      if (d.success) router.refresh()
+      else setBusy(false)
+    } catch {
+      setBusy(false)
+    }
+  }
+
+  return (
+    <div className="box-content">
+      <div className="body-box-content centered">
+        <p>
+          {t('switchAccountLabel')}{' '}
+          <select value={currentId} onChange={onChange} disabled={busy} aria-label={t('switchAccountLabel')}>
+            {accounts.map((a) => (
+              <option key={a.id} value={a.id}>
+                WOW{a.index}
+              </option>
+            ))}
+          </select>
+        </p>
+      </div>
+    </div>
+  )
+}

web-next/messages/en.json

@@ -151,7 +151,8 @@
     "accountName": "Account name",
     "twofaLabel": "2FA (Two-step verification)",
     "twofaOff": "Disabled",
-    "banHistoryLink": "View history"
+    "banHistoryLink": "View history",
+    "switchAccountLabel": "Load account data:"
   },
   "SelectAccount": {
     "title": "Select your game account",

web-next/messages/es.json

@@ -151,7 +151,8 @@
     "accountName": "Nombre de la cuenta",
     "twofaLabel": "2FA (Verificación en 2 pasos)",
     "twofaOff": "Desactivado",
-    "banHistoryLink": "Consultar historial"
+    "banHistoryLink": "Consultar historial",
+    "switchAccountLabel": "Cargar datos de la cuenta:"
   },
   "SelectAccount": {
     "title": "Selecciona tu cuenta de juego",