feat(website/i18n): footer navigation

apps/website/src/components/Footer.css

@@ -5,17 +5,25 @@ footer {
     color: var(--muted-color);
     font-size: 0.8em;
 
-    .content-wrapper {
+    .row {
         display: flex;
         justify-content: space-between;
         align-items: center;
         flex-direction: column-reverse;
         gap: 2em;
+        margin-bottom: 1em;
 
         @media (min-width: 720px) {
             flex-direction: row;
         }
     }
+
+    nav.languages {
+        flex-grow: 1;
+        justify-content: center;
+        display: flex;
+        gap: 1em;
+    }
 }
 
 .social-buttons {

apps/website/src/components/Footer.tsx

@@ -5,12 +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 { t } from "../i18n";
+import { LOCALES, t } from "../i18n";
 
 export default function Footer() {
     return (
         <footer>
             <div class="content-wrapper">
+                <div class="row">
                     <div class="footer-text">
                         © 2024-2025 <Link href="https://github.com/eliandoran" openExternally>Elian Doran</Link>{t("footer.copyright_and_the")}<Link href="https://github.com/TriliumNext/Trilium/graphs/contributors" openExternally>{t("footer.copyright_community")}</Link>.<br />
                         © 2017-2024 <Link href="https://github.com/zadam" openExternally>zadam</Link>.
@@ -18,6 +19,15 @@ export default function Footer() {
 
                     <SocialButtons />
                 </div>
+
+                <div class="row">
+                    <nav class="languages">
+                        {LOCALES.map(locale => (
+                            <Link href={"/" + locale.id + "/"}>{locale.name}</Link>
+                        ))}
+                    </nav>
+                </div>
+            </div>
         </footer>
     )
 }

apps/website/src/i18n.ts

@@ -17,7 +17,7 @@ export const LOCALES: Locale[] = [
     { id: "pl", name: "Polski" },
     { id: "es", name: "Español" },
     { id: "ar", name: "اَلْعَرَبِيَّةُ", rtl: true },
-];
+].toSorted((a, b) => a.name.localeCompare(b.name));
 
 i18next
     .use(HttpApi)

apps/website/src/index.tsx

@@ -7,7 +7,6 @@ import { NotFound } from './pages/_404.jsx';
 import Footer from './components/Footer.js';
 import GetStarted from './pages/GetStarted/get-started.js';
 import SupportUs from './pages/SupportUs/SupportUs.js';
-import { LOCALES } from './i18n';
 
 export function App(props: {repoStargazersCount: number}) {
 	return (
@@ -36,17 +35,6 @@ export async function prerender(data) {
 	// This ensures the GitHub API is not called on every page load in the client.
 	const stargazersCount = await getRepoStargazersCount();
 
-	const result = await ssr(<App repoStargazersCount={stargazersCount} {...data} />);
-    console.log("Got links ", result.links);
-    const links: string[] = [];
-    for (const locale of LOCALES) {
-        for (const link of result.links?.values() ?? []) {
-            links.push(locale.id + link);
-        }
-    }
-    return {
-        ...result,
-        links
-    };
+	return await ssr(<App repoStargazersCount={stargazersCount} {...data} />);
 }