From 9ba1e9d732128df6dfdc4e2e5089d1d47845ad45 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sat, 25 Oct 2025 22:36:27 +0300
Subject: [PATCH] feat(website/i18n): swap locale when footer

---
 apps/website/src/components/Footer.tsx |  6 ++++--
 apps/website/src/i18n.spec.ts          | 11 ++++++++++-
 apps/website/src/i18n.ts               | 10 ++++++++++
 3 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/apps/website/src/components/Footer.tsx b/apps/website/src/components/Footer.tsx
index 0c1cb4b6c..c421be961 100644
--- a/apps/website/src/components/Footer.tsx
+++ b/apps/website/src/components/Footer.tsx
@@ -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>
diff --git a/apps/website/src/i18n.spec.ts b/apps/website/src/i18n.spec.ts
index efc1e18e8..e06cdba3c 100644
--- a/apps/website/src/i18n.spec.ts
+++ b/apps/website/src/i18n.spec.ts
@@ -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/");
+    });
+});
diff --git a/apps/website/src/i18n.ts b/apps/website/src/i18n.ts
index 546907166..291eca69b 100644
--- a/apps/website/src/i18n.ts
+++ b/apps/website/src/i18n.ts
@@ -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("/");
+    }
+}