feat(website/i18n): swap locale when footer

This commit is contained in:
Elian Doran 2025-10-25 22:36:27 +03:00
parent e1dc4d1433
commit 9ba1e9d732
No known key found for this signature in database
3 changed files with 24 additions and 3 deletions

View File

@ -5,11 +5,13 @@ import githubDiscussionsIcon from "../assets/boxicons/bx-discussion.svg?raw";
import matrixIcon from "../assets/boxicons/bx-message-dots.svg?raw";
import redditIcon from "../assets/boxicons/bx-reddit.svg?raw";
import { Link } from "./Button.js";
import { LOCALES } from "../i18n";
import { LOCALES, swapLocaleInUrl } from "../i18n";
import { useTranslation } from "react-i18next";
import { useLocation } from "preact-iso";
export default function Footer() {
const { t } = useTranslation();
const { url } = useLocation();
return (
<footer>
@ -26,7 +28,7 @@ export default function Footer() {
<div class="row">
<nav class="languages">
{LOCALES.map(locale => (
<Link href={"/" + locale.id + "/"}>{locale.name}</Link>
<Link href={swapLocaleInUrl(url, locale.id)}>{locale.name}</Link>
))}
</nav>
</div>

View File

@ -1,5 +1,5 @@
import { describe, expect, it } from "vitest";
import { mapLocale } from "./i18n";
import { mapLocale, swapLocaleInUrl } from "./i18n";
describe("mapLocale", () => {
it("maps Chinese", () => {
@ -12,3 +12,12 @@ describe("mapLocale", () => {
expect(mapLocale("ro")).toStrictEqual("ro");
});
});
describe("swapLocale", () => {
it("swap locale in URL", () => {
expect(swapLocaleInUrl("/get-started", "ro")).toStrictEqual("/ro/get-started");
expect(swapLocaleInUrl("/ro/get-started", "ro")).toStrictEqual("/ro/get-started");
expect(swapLocaleInUrl("/en/get-started", "ro")).toStrictEqual("/ro/get-started");
expect(swapLocaleInUrl("/ro/", "en")).toStrictEqual("/en/");
});
});

View File

@ -31,3 +31,13 @@ export function mapLocale(locale: string) {
// Default for everything else
return locale.split('-')[0]; // e.g. "en-US" -> "en"
}
export function swapLocaleInUrl(url: string, newLocale: string) {
const components = url.split("/");
if (components.length === 2) {
return `/${newLocale}${url}`;
} else {
components[1] = newLocale;
return components.join("/");
}
}