@manglar/footer

Footer compartido para todo el ecosistema Manglar (manglar.fun, WC2026Streams, ManglarPelis, y lo que siga — ManglarNBA, ManglarFutbol...).

Qué resuelve

Antes: 3 repos, 3 Footer.tsx completamente distintos, cero código compartido, y los links de Explorar/Géneros/Cuenta en ManglarPelis eran <button> sin onClick (no hacían nada).

Ahora: un solo paquete instalado en los 3 (pronto 4) repos.

• La columna "Ecosistema Manglar" y "Legal" salen SIEMPRE del mismo array (src/ecosystem.ts). Agregar ManglarNBA = una entrada, un npm publish, un npm update en cada repo.
• Los links legales (Privacidad, Términos, Cookies, DMCA) apuntan a manglar.fun/legal/* — páginas reales que viven UNA vez en el Hub, no 4 copias del mismo texto.
• Cada sitio solo define lo que le es propio (sus columnas de navegación, redes sociales, disclaimer) vía props.

1. Publicar el paquete

Necesitas una cuenta de npm (gratis, npmjs.com/signup). Luego:

cd manglar-footer
npm install
npm run build        # compila src/ -> dist/
npm login            # una sola vez
npm publish          # como es @manglar/footer (scoped), publica público gratis

Si prefieres no publicarlo público en npm, alternativas:

• GitHub Packages (privado, gratis): cambia el registry en .npmrc y publica ahí en vez de npmjs.com.
• Git submodule / dependencia por git URL: en cada repo, npm install github:tuusuario/manglar-footer — sin publicar a ningún registry, pero pierdes versionado semántico fácil.

Recomendación: publícalo público en npm. No expone nada sensible (es solo UI), y es la opción con menos fricción para actualizar los 4 sitios.

2. Instalar en cada repo

npm install @manglar/footer

3. Reemplazar el Footer.tsx de cada repo

Ya te dejé el Footer.tsx final de cada proyecto en integraciones/:

• integraciones/ManglarPelis/Footer.tsx → reemplaza ManglarPelis/src/app/components/Footer.tsx. Nota: el componente ahora recibe onNavigate como prop — pásale el mismo navigate que ya usas en App.tsx al renderizar <Footer onNavigate={navigate} />.
• integraciones/wc2026/Footer.tsx → reemplaza wc2026/src/app/components/Footer.tsx. Usa rutas reales (/en-vivo, /partidos, etc.) así que no necesita props nuevas.
• integraciones/Manglar_HUB/Footer.tsx → reemplaza Manglar_HUB/src/app/components/Footer.tsx. Puedes borrar src/app/config/ecosystem.ts — ya no lo usa el footer (el registry ahora vive en el paquete). Si el EcosystemStrip del home lo sigue usando, déjalo o migra esas cards también a leer de @manglar/footer.

4. Cuando llegue ManglarNBA (en unas semanas)

1. En manglar-footer/src/ecosystem.ts, descomenta/agrega la entrada de nba con su URL real.
2. npm version patch && npm publish.
3. En los 4 repos: npm update @manglar/footer.
4. En el repo nuevo de ManglarNBA: crea su propio Footer.tsx copiando el patrón de integraciones/wc2026/Footer.tsx (le pasas sus columnas propias). El resto —Ecosistema, Legal, copyright— sale gratis.

5. Páginas legales reales en el Hub

Los links de Legal apuntan a https://manglar.fun/legal/privacidad, /terminos, /cookies, /dmca. Esas 4 rutas hoy no existen todavía en Manglar_HUB — solo el footer ya apunta ahí correctamente. Si quieres, en otra sesión te armo esas 4 páginas (contenido base de privacidad/DMCA que luego ajustas) para que los links del footer no den 404.