From 1165082c618d840f42a615e91f7595b79199f518 Mon Sep 17 00:00:00 2001 From: LucyNashi Date: Wed, 4 Feb 2026 00:09:07 +0100 Subject: [PATCH 1/4] add translation system + french translation --- src/components/BackButton.astro | 7 +- src/components/BackToTopButton.astro | 7 +- src/components/Breadcrumb.astro | 8 +- src/components/Datetime.astro | 7 +- src/components/Footer.astro | 7 +- src/components/Header.astro | 22 ++++-- src/components/Pagination.astro | 8 +- src/components/ShareLinks.astro | 7 +- src/i18n/ui.ts | 112 +++++++++++++++++++++++++++ src/i18n/utils.ts | 13 ++++ src/layouts/Layout.astro | 4 + src/layouts/PostDetails.astro | 9 ++- src/pages/404.astro | 10 ++- src/pages/archives/index.astro | 33 ++++---- src/pages/index.astro | 17 ++-- src/pages/posts/[...page].astro | 9 ++- src/pages/search.astro | 9 ++- src/pages/tags/index.astro | 9 ++- 18 files changed, 252 insertions(+), 46 deletions(-) create mode 100644 src/i18n/ui.ts create mode 100644 src/i18n/utils.ts diff --git a/src/components/BackButton.astro b/src/components/BackButton.astro index 0d981d1eec..adf74ad0d5 100644 --- a/src/components/BackButton.astro +++ b/src/components/BackButton.astro @@ -2,6 +2,11 @@ import IconChevronLeft from "@/assets/icons/IconChevronLeft.svg"; import LinkButton from "./LinkButton.astro"; import { SITE } from "@/config"; +import { getLangFromUrl, useTranslations } from '../i18n/utils'; + + +const lang = getLangFromUrl(Astro.url); +const t = useTranslations(lang); --- { @@ -13,7 +18,7 @@ import { SITE } from "@/config"; class="focus-outline -ms-2 mt-8 mb-2 hover:text-foreground/75" > - Go back + {t('nav.back')} ) diff --git a/src/components/BackToTopButton.astro b/src/components/BackToTopButton.astro index 88e733eee1..bf913979ef 100644 --- a/src/components/BackToTopButton.astro +++ b/src/components/BackToTopButton.astro @@ -1,6 +1,11 @@ --- import IconChevronLeft from "@/assets/icons/IconChevronLeft.svg"; import IconArrowNarrowUp from "@/assets/icons/IconArrowNarrowUp.svg"; +import { getLangFromUrl, useTranslations } from '../i18n/utils'; + + +const lang = getLangFromUrl(Astro.url); +const t = useTranslations(lang); ---
- Back To Top + {t('nav.top')}
diff --git a/src/components/Breadcrumb.astro b/src/components/Breadcrumb.astro index b49fe3d754..49bd05e157 100644 --- a/src/components/Breadcrumb.astro +++ b/src/components/Breadcrumb.astro @@ -1,4 +1,10 @@ --- +import { getLangFromUrl, useTranslations } from '../i18n/utils'; + + +const lang = getLangFromUrl(Astro.url); +const t = useTranslations(lang); + // Remove current url path and remove trailing slash if exists const currentUrlPath = Astro.url.pathname.replace(/\/+$/, ""); @@ -28,7 +34,7 @@ if (breadcrumbList[0] === "tags" && !isNaN(Number(breadcrumbList[2]))) { class="font-light [&>li]:inline [&>li:not(:last-child)>a]:hover:opacity-100" >
  • - Home + {t('nav.home')}
    • { diff --git a/src/components/Datetime.astro b/src/components/Datetime.astro index e16834ff45..7f54804009 100644 --- a/src/components/Datetime.astro +++ b/src/components/Datetime.astro @@ -4,6 +4,11 @@ import utc from "dayjs/plugin/utc"; import timezone from "dayjs/plugin/timezone"; import IconCalendar from "@/assets/icons/IconCalendar.svg"; import { SITE } from "@/config"; +import { getLangFromUrl, useTranslations } from '../i18n/utils'; + + +const lang = getLangFromUrl(Astro.url); +const t = useTranslations(lang); dayjs.extend(utc); dayjs.extend(timezone); @@ -44,7 +49,7 @@ const date = datetime.format("D MMM, YYYY"); // e.g., '22 Mar, 2025' { isModified && ( - Updated: + {t('post.updated')} ) } diff --git a/src/components/Footer.astro b/src/components/Footer.astro index 2283c7fac1..dc03f5ee97 100644 --- a/src/components/Footer.astro +++ b/src/components/Footer.astro @@ -1,6 +1,11 @@ --- import type { HTMLAttributes } from "astro/types"; import Socials from "./Socials.astro"; +import { getLangFromUrl, useTranslations } from '../i18n/utils'; + + +const lang = getLangFromUrl(Astro.url); +const t = useTranslations(lang); const currentYear = new Date().getFullYear(); @@ -26,7 +31,7 @@ const { noMarginTop = false, class: className, ...attrs } = Astro.props;
    Copyright © {currentYear} - All rights reserved. + {t('footer.rights')}.
    diff --git a/src/components/Header.astro b/src/components/Header.astro index 5120467dd8..3b72a4b28f 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -7,6 +7,11 @@ import IconSunHigh from "@/assets/icons/IconSunHigh.svg"; import IconMenuDeep from "@/assets/icons/IconMenuDeep.svg"; import LinkButton from "./LinkButton.astro"; import { SITE } from "@/config"; +import { getLangFromUrl, useTranslations } from '../i18n/utils'; + + +const lang = getLangFromUrl(Astro.url); +const t = useTranslations(lang); const { pathname } = Astro.url; @@ -73,17 +78,18 @@ const isActive = (path: string) => { >
  • - Posts + {t('posts.title')}
  • - Tags + {t('tags.title')}
  • - About + {t('about.title')} +
    • { @@ -97,11 +103,11 @@ const isActive = (path: string) => { "active-nav [&>svg]:stroke-accent": isActive("/archives"), }, ]} - title="Archives" + title={t('archives.title')} aria-label="archives" >