From 8203db3dc224fac659072b8e58b7f39e6851e35e Mon Sep 17 00:00:00 2001
From: tresabhi <43380238+tresabhi@users.noreply.github.com>
Date: Fri, 27 Dec 2024 13:43:25 -0600
Subject: [PATCH] feat: some locale links

---
 packages/website/src/components/Footer.astro  | 18 ++++++++++++------
 packages/website/src/components/LinkI18n.tsx  | 19 +++++++++++++++++++
 .../website/src/core/i18n/getBestLocale.ts    | 11 +++++++++++
 packages/website/src/layouts/BaseLayout.astro | 11 +++++------
 4 files changed, 47 insertions(+), 12 deletions(-)
 create mode 100644 packages/website/src/components/LinkI18n.tsx
 create mode 100644 packages/website/src/core/i18n/getBestLocale.ts

diff --git a/packages/website/src/components/Footer.astro b/packages/website/src/components/Footer.astro
index 2bd1ccc6b..1f22b5a93 100644
--- a/packages/website/src/components/Footer.astro
+++ b/packages/website/src/components/Footer.astro
@@ -2,8 +2,10 @@
 import { assertSecret, fetchGameDefinitions } from '@blitzkit/core';
 import { Code, Flex, Heading, Link, Text } from '@radix-ui/themes';
 import packageJson from '../../../../package.json';
+import { LinkI18n } from './LinkI18n';
 
 const gameDefinitions = await fetchGameDefinitions();
+const { locale } = Astro.params;
 ---
 
 <style>
@@ -13,6 +15,7 @@ const gameDefinitions = await fetchGameDefinitions();
 </style>
 
 <Flex className="footer" gap="6" p="6" direction="column" align="center">
+  {locale}
   <Flex
     align="center"
     justify="between"
@@ -68,7 +71,9 @@ const gameDefinitions = await fetchGameDefinitions();
             sm: 'start',
           }}
         >
-          <Link href="/docs/about/credits" color="gray"> Credits </Link>
+          <LinkI18n {locale} href="/docs/about/credits" color="gray"
+            >Credits</LinkI18n
+          >
           <Link
             href="https://discord.gg/nDt7AjGJQH"
             target="_blank"
@@ -83,7 +88,8 @@ const gameDefinitions = await fetchGameDefinitions();
           >
             GitHub
           </Link>
-          <Link href="/docs/patches" color="gray"> Patches </Link>
+          <LinkI18n {locale} href="/docs/patches" color="gray">Patches</LinkI18n
+          >
         </Flex>
       </Flex>
 
@@ -101,12 +107,12 @@ const gameDefinitions = await fetchGameDefinitions();
       >
         <Heading size="3">Legal</Heading>
         <Flex direction="column">
-          <Link href="/docs/legal/privacy-policy" color="gray">
+          <LinkI18n {locale} href="/docs/legal/privacy-policy" color="gray">
             Privacy policy
-          </Link>
-          <Link href="/docs/legal/terms-of-service" color="gray">
+          </LinkI18n>
+          <LinkI18n {locale} href="/docs/legal/terms-of-service" color="gray">
             Terms of service
-          </Link>
+          </LinkI18n>
         </Flex>
       </Flex>
     </Flex>
diff --git a/packages/website/src/components/LinkI18n.tsx b/packages/website/src/components/LinkI18n.tsx
new file mode 100644
index 000000000..4ad51e137
--- /dev/null
+++ b/packages/website/src/components/LinkI18n.tsx
@@ -0,0 +1,19 @@
+import { Link, type LinkProps } from '@radix-ui/themes';
+import { getBestLocale } from '../core/i18n/getBestLocale';
+
+type LinkI18nProps = LinkProps & {
+  locale: string | undefined;
+};
+
+export function LinkI18n({ locale, href, ...props }: LinkI18nProps) {
+  const bestLocale = getBestLocale();
+  const resolvedLocale = locale ?? bestLocale;
+  const prefix = resolvedLocale === undefined ? '' : `/${resolvedLocale}`;
+
+  return (
+    <Link
+      href={href === undefined ? undefined : `${prefix}${href}`}
+      {...props}
+    />
+  );
+}
diff --git a/packages/website/src/core/i18n/getBestLocale.ts b/packages/website/src/core/i18n/getBestLocale.ts
new file mode 100644
index 000000000..471f663ed
--- /dev/null
+++ b/packages/website/src/core/i18n/getBestLocale.ts
@@ -0,0 +1,11 @@
+import { DEFAULT_LOCALE, SUPPORTED_LOCALES } from '@blitzkit/core';
+
+export function getBestLocale() {
+  const desiredLocale = navigator.language.split('-')[0];
+  const isSupported = SUPPORTED_LOCALES.includes(desiredLocale);
+  const isDefault = desiredLocale === DEFAULT_LOCALE;
+
+  if (!isSupported || isDefault) return undefined;
+
+  return desiredLocale;
+}
diff --git a/packages/website/src/layouts/BaseLayout.astro b/packages/website/src/layouts/BaseLayout.astro
index 819ab245f..9704d5d82 100644
--- a/packages/website/src/layouts/BaseLayout.astro
+++ b/packages/website/src/layouts/BaseLayout.astro
@@ -38,17 +38,16 @@ const isRoot = pathname === '/';
     <Party3 />
 
     <script>
-      import { DEFAULT_LOCALE, SUPPORTED_LOCALES } from '@blitzkit/core';
+      import { SUPPORTED_LOCALES } from '@blitzkit/core';
+      import { getBestLocale } from '../core/i18n/getBestLocale';
 
       const isI18nPath = SUPPORTED_LOCALES.some((locale) =>
         window.location.pathname.startsWith(`/${locale}`),
       );
-      const desiredLocale = navigator.language.split('-')[0];
-      const isSupported = SUPPORTED_LOCALES.includes(desiredLocale);
-      const isDefault = desiredLocale === DEFAULT_LOCALE;
+      const bestLocale = getBestLocale();
 
-      if (!isI18nPath && isSupported && !isDefault) {
-        window.location.pathname = `/${desiredLocale}${window.location.pathname}`;
+      if (!isI18nPath && bestLocale !== undefined) {
+        window.location.pathname = `/${bestLocale}${window.location.pathname}`;
       }
     </script>
   </head>