feat: add Header component with responsive navigation and i18n path switching logic

This commit is contained in:
Esteban 2026-05-08 15:16:45 -05:00
parent 50e460b46e
commit 97b77f9904
1 changed files with 28 additions and 0 deletions

View File

@ -2,7 +2,11 @@
import Button from "./ui/Button.astro"; import Button from "./ui/Button.astro";
import { Icon } from "astro-icon/components"; import { Icon } from "astro-icon/components";
import { getCollection } from "astro:content";
import { createTranslator, routeTranslations } from "../i18n/index.ts"; import { createTranslator, routeTranslations } from "../i18n/index.ts";
const allNews = await getCollection("news");
const tl = createTranslator(Astro.currentLocale); const tl = createTranslator(Astro.currentLocale);
const currentLocale = Astro.currentLocale; const currentLocale = Astro.currentLocale;
const currentPath = Astro.url.pathname; const currentPath = Astro.url.pathname;
@ -13,6 +17,7 @@ function translatePath(newLocale: string) {
if (segments.length === 0) return `/${newLocale}`; if (segments.length === 0) return `/${newLocale}`;
const remainingSegments = segments.slice(1); const remainingSegments = segments.slice(1);
const newsRouteNames = Object.values(routeTranslations.news);
const translatedSegments = remainingSegments.map(segment => { const translatedSegments = remainingSegments.map(segment => {
for (const key in routeTranslations) { for (const key in routeTranslations) {
@ -24,6 +29,29 @@ function translatePath(newLocale: string) {
return segment; return segment;
}); });
// Lógica para noticias
if (segments.length >= 2 && newsRouteNames.includes(segments[1])) {
const isDetail = segments.length >= 3;
if (isDetail) {
const currentId = segments[segments.length - 1];
const baseId = currentId.split('/').pop();
const exists = allNews.some(post =>
post.id.endsWith(baseId!) && post.data.locale === newLocale
);
if (!exists) {
// Redirigir al home de noticias si no existe la traducción
return `/${newLocale}/${translatedSegments[0]}`;
}
// Reconstruir ID con el nuevo locale
const newId = `${newLocale}/${baseId}`;
return `/${newLocale}/${translatedSegments[0]}/${newId}`;
}
}
return `/${[newLocale, ...translatedSegments].join('/')}`; return `/${[newLocale, ...translatedSegments].join('/')}`;
} }