Enlaces de ítems por wowhead (locale + tooltips) en toda la web

Sustituye la base de datos de ítems del sistema antiguo (AoWoW en
wotlk.novawow/wotlk.ultimowow) y los iconos de mirrors por wowhead / zamimg,
con el idioma del tooltip según el locale de la web (es. / www.).

Sistema reutilizable para rutas actuales y futuras:
- lib/wowhead.ts: wowheadUrl/wowheadItemUrl/wowheadWotlkHome (subdominio por
  locale), wowheadIcon (zamimg) y wowheadData (atributo data-wowhead, rama WotLK).
- components/WowheadLink.tsx: enlace con tooltip en el locale actual.
- layout raíz: config whTooltips (solo tooltips) + script tooltips.js global;
  funciona con contenido añadido por React (carrito, búsquedas).

Aplicado en: send-gift (catálogo + carrito), restore-items, recruit
(RecruitPanel, enlace por item_id + icono zamimg), quest-character (misión/npc/
facción + iconos), y el enlace "WOTLK DB" de la cabecera.

Verificado en prod (:3001): /es -> es.wowhead.com, /en -> www.wowhead.com,
data-wowhead presente, iconos por zamimg.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-14 22:34:26 +00:00
parent 809eb756c8
commit 7d1abab9f1
9 changed files with 132 additions and 23 deletions
+13
View File
@@ -1,4 +1,5 @@
import type { Metadata } from 'next'
import Script from 'next/script'
import { notFound } from 'next/navigation'
import { NextIntlClientProvider, hasLocale } from 'next-intl'
import { getTranslations, setRequestLocale } from 'next-intl/server'
@@ -66,6 +67,14 @@ export default async function LocaleLayout({
/>
{/* Tema real de NovaWoW (nw-ryu). Va el ÚLTIMO para ganar la cascada. */}
<link rel="stylesheet" href="/nw-themes/nw-ryu/nw-css/novawow-style.css?v=2" />
{/* Config de los tooltips de wowhead (debe definirse antes de tooltips.js).
Solo tooltips: no recolorea/renombra/iconiza nuestros enlaces. El idioma
del tooltip lo da el subdominio del enlace (es./www.). */}
<script
dangerouslySetInnerHTML={{
__html: 'const whTooltips={colorLinks:false,iconizeLinks:false,renameLinks:false};',
}}
/>
</head>
<body>
<NextIntlClientProvider>
@@ -76,6 +85,10 @@ export default async function LocaleLayout({
<Footer />
<CookieBanner />
</NextIntlClientProvider>
{/* Tooltips de wowhead (WotLK) en todos los enlaces .../wowhead.com/... y
elementos con data-wowhead. Funciona con contenido añadido por React
(carrito, búsquedas) porque delega el hover en el documento. */}
<Script src="https://wow.zamimg.com/js/tooltips.js" strategy="afterInteractive" />
</body>
</html>
)
@@ -5,6 +5,7 @@ import { redirect } from '@/i18n/navigation'
import { getSession } from '@/lib/session'
import { getGameCharacters } from '@/lib/characters'
import { QUEST_OPTIONS } from '@/lib/quest-tracker'
import { wowheadIcon, wowheadUrl, wowheadData, wowheadWotlkHome, type WowheadType } from '@/lib/wowhead'
import { PageShell } from '@/components/PageShell'
import { ServiceBox } from '@/components/ServiceBox'
import { QuestTrackerForm } from '@/components/QuestTrackerForm'
@@ -17,7 +18,6 @@ export async function generateMetadata({ params }: { params: Promise<{ locale: s
return { title: t('quest.pageTitle') }
}
const QUEST_DB = 'https://wotlk.novawow.com'
const CLASS_GROUPS: { css: string; name: string }[] = [
{ css: 'warlock', name: 'Brujo' },
{ css: 'hunter', name: 'Cazador' },
@@ -65,7 +65,8 @@ export default async function QuestCharacterPage({ params }: { params: Promise<{
<li key={o.key}>
{o.link ? (
<a
href={`${QUEST_DB}/?${o.link.type}=${o.link.id}`}
href={wowheadUrl(o.link.type as WowheadType, o.link.id, locale)}
data-wowhead={wowheadData(o.link.type as WowheadType, o.link.id)}
target="_blank"
rel="noopener noreferrer"
className="icontinyl"
@@ -73,7 +74,7 @@ export default async function QuestCharacterPage({ params }: { params: Promise<{
o.icon
? {
paddingLeft: '18px',
background: `url("${QUEST_DB}/static/images/wow/icons/tiny/${o.icon}.gif") left center no-repeat`,
background: `url("${wowheadIcon(o.icon, 'tiny')}") left center no-repeat`,
}
: undefined
}
@@ -95,8 +96,8 @@ export default async function QuestCharacterPage({ params }: { params: Promise<{
<ul>
<li>
{t.rich('quest.hodir', {
hodir: (c) => <a href={`${QUEST_DB}/?faction=1119`} target="_blank" rel="noopener noreferrer">{c}</a>,
lille: (c) => <a href={`${QUEST_DB}/?npc=32540`} target="_blank" rel="noopener noreferrer">{c}</a>,
hodir: (c) => <a href={wowheadUrl('faction', 1119, locale)} data-wowhead={wowheadData('faction', 1119)} target="_blank" rel="noopener noreferrer">{c}</a>,
lille: (c) => <a href={wowheadUrl('npc', 32540, locale)} data-wowhead={wowheadData('npc', 32540)} target="_blank" rel="noopener noreferrer">{c}</a>,
})}
</li>
</ul>
@@ -107,9 +108,9 @@ export default async function QuestCharacterPage({ params }: { params: Promise<{
</ul>
<br />
<p>{t('quest.howToSearch')}</p>
<p>{t.rich('quest.step1', { link: (c) => <a href={QUEST_DB} target="_blank" rel="noopener noreferrer">{c}</a> })}</p>
<p>{t.rich('quest.step1', { link: (c) => <a href={wowheadWotlkHome(locale)} target="_blank" rel="noopener noreferrer">{c}</a> })}</p>
<p>{t('quest.step2')}</p>
<p>{t.rich('quest.step3', { url: QUEST_DB, s: (c) => <span className="second-brown">{c}</span> })}</p>
<p>{t.rich('quest.step3', { url: wowheadWotlkHome(locale), s: (c) => <span className="second-brown">{c}</span> })}</p>
<p>{t('quest.step4')}</p>
<br />
<p>{t('quest.searchButtonExplain')}</p>