Foro: reprocesar los enlaces de wowhead tras montar los posts
Los enlaces de wowhead de un post salían en crudo (item=41599) en vez de con nombre, color e icono. Causa: tooltips.js solo recorre el DOM al cargar, así que el contenido que monta React (los posts, inyectados con dangerouslySetInnerHTML, y las páginas abiertas por navegación SPA) se quedaba sin procesar. Se añade WowheadRefresh, un componente cliente que llama a $WowheadPower.refreshLinks() al montar (con reintentos, porque tooltips.js carga afterInteractive) y se repite al cambiar de tema/página. Es exactamente lo que ya hacía la tienda (StoreBrowser) tras cada AJAX. Con esto los enlaces reciben color por calidad, icono y —al llevar data-wh-rename-link— el nombre automático. Verificado: refreshLinks compilado en el bundle; la página del tema carga tooltips.js y sirve el enlace con data-wh-rename-link + href /wotlk/. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -17,6 +17,7 @@ import { Pagination } from '@/components/Pagination'
|
||||
import { ReplyForm } from '@/components/ReplyForm'
|
||||
import { EditPostForm } from '@/components/EditPostForm'
|
||||
import { ForumModActions } from '@/components/ForumModActions'
|
||||
import { WowheadRefresh } from '@/components/WowheadRefresh'
|
||||
|
||||
export const dynamic = 'force-dynamic'
|
||||
|
||||
@@ -66,6 +67,7 @@ export default async function TopicPage({
|
||||
}
|
||||
>
|
||||
<div className="main-wide">
|
||||
<WowheadRefresh dep={`${id}-${page}`} />
|
||||
{path && (
|
||||
<ForumBreadcrumb
|
||||
items={[
|
||||
|
||||
@@ -0,0 +1,31 @@
|
||||
'use client'
|
||||
|
||||
import { useEffect } from 'react'
|
||||
|
||||
/**
|
||||
* Reaplica el tratamiento de wowhead (color por calidad, icono y nombre automático)
|
||||
* a los enlaces que React acaba de montar. `tooltips.js` solo recorre el DOM al
|
||||
* cargar, así que los enlaces de un post (inyectados con dangerouslySetInnerHTML) o
|
||||
* los de una página abierta por navegación SPA se quedan sin procesar sin esto.
|
||||
* Es lo mismo que hace la tienda con $WowheadPower.refreshLinks() (ver StoreBrowser).
|
||||
*
|
||||
* Se reintenta un rato porque tooltips.js carga `afterInteractive` y puede no estar
|
||||
* listo justo al montar. `dep` (p.ej. tema+página) fuerza que se repita tras navegar.
|
||||
*/
|
||||
export function WowheadRefresh({ dep }: { dep?: string | number }) {
|
||||
useEffect(() => {
|
||||
let tries = 0
|
||||
let timer: ReturnType<typeof setTimeout>
|
||||
const run = () => {
|
||||
const wp = (window as unknown as { $WowheadPower?: { refreshLinks?: () => void } }).$WowheadPower
|
||||
if (wp?.refreshLinks) {
|
||||
wp.refreshLinks()
|
||||
return
|
||||
}
|
||||
if (tries++ < 25) timer = setTimeout(run, 150)
|
||||
}
|
||||
run()
|
||||
return () => clearTimeout(timer)
|
||||
}, [dep])
|
||||
return null
|
||||
}
|
||||
Reference in New Issue
Block a user