FedericoSchonborn/website
1
0
Fork 0
forked from auxolotl/website
Code Pull requests Activity

refactor: Avoid duplicating pages for each language

Browse source 
This makes use of Astro dynamic routing to avoid having to redefine all
pages for each language.

Note that they still have to be defined in `i18n/ui.ts` which is not
refactored in this PR.

The Index will also now use the `defaultLang` from `i18n/ui.ts` rather
than hardcoding `/en/`.
This commit is contained in:
~hedy 2024-05-06 19:43:22 +08:00 committed by marshmallow
parent 919d623e43
commit dd3a81b5bf
10 changed files with 31 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/components/Header.astro
View file

@ -1,11 +1,11 @@
---
interface Props {}
import { getLangFromUrl, useTranslations } from '../i18n/utils';
import { useTranslations } from '../i18n/utils';
import { Image } from 'astro:assets';
import aux from '../../public/aux.svg';
const lang = getLangFromUrl(Astro.url);
const { lang } = Astro.params;
const translation = useTranslations(lang);
---

4
src/components/home/Goals.astro
View file

@ -1,7 +1,7 @@
---
import { getLangFromUrl, useTranslations } from '../../i18n/utils';
import { useTranslations } from '../../i18n/utils';
const lang = getLangFromUrl(Astro.url);
const { lang } = Astro.params;
const translation = useTranslations(lang);
---

4
src/components/home/Hero.astro
View file

@ -1,9 +1,9 @@
---
import { getLangFromUrl, useTranslations } from '../../i18n/utils';
import { useTranslations } from '../../i18n/utils';
import { Image } from 'astro:assets';
import aux from '../../../public/aux.svg';
const lang = getLangFromUrl(Astro.url);
const { lang } = Astro.params;
const translation = useTranslations(lang);
---

4
src/components/home/Roadmap.astro
View file

@ -1,7 +1,7 @@
---
import { getLangFromUrl, useTranslations } from '../../i18n/utils';
import { useTranslations } from '../../i18n/utils';
const lang = getLangFromUrl(Astro.url);
const { lang } = Astro.params;
const translation = useTranslations(lang);
---

4
src/components/home/Values.astro
View file

@ -1,7 +1,7 @@
---
import { getLangFromUrl, useTranslations } from '../../i18n/utils';
import { useTranslations } from '../../i18n/utils';
const lang = getLangFromUrl(Astro.url);
const { lang } = Astro.params;
const translation = useTranslations(lang);
---

6
src/i18n/utils.ts
View file

@ -1,11 +1,5 @@
import { ui, defaultLang } from './ui';
export function getLangFromUrl(url: URL) {
const [, lang] = url.pathname.split('/');
if (lang in ui) return lang as keyof typeof ui;
return defaultLang;
}
export function useTranslations(lang: keyof typeof ui) {
return function t(key: keyof typeof ui[typeof defaultLang]) {
return ui[lang][key] || ui[defaultLang][key];

4
src/layouts/Layout.astro
View file

@ -1,5 +1,4 @@
---
import { getLangFromUrl } from '../i18n/utils';
import Header from "../components/Header.astro";
interface Props {
@ -7,8 +6,7 @@ interface Props {
}
const { title } = Astro.props;
const lang = getLangFromUrl(Astro.url);
const { lang } = Astro.params;
---
<!doctype html>

15
src/pages/[lang]/index.astro Normal file
View file

@ -0,0 +1,15 @@
---
import { languages } from "../../i18n/ui";
import Layout from "../../layouts/Layout.astro";
import Home from "../../components/home/Home.astro";
export async function getStaticPaths() {
return Object.keys(languages).map((name) => (
{ params: { lang: name } }
))
}
---
<Layout title="auxolotl.org">
<Home />
</Layout>

8
src/pages/en/index.astro
View file

@ -1,8 +0,0 @@
---
import Layout from "../../layouts/Layout.astro";
import Home from "../../components/home/Home.astro";
---
<Layout title="auxolotl.org">
<Home />
</Layout>

6
src/pages/index.astro
View file

@ -1 +1,5 @@
<meta http-equiv="refresh" content="0;url=/en/" />
---
import { defaultLang } from '../i18n/ui';
---
<meta http-equiv="refresh" content=`0;url=/${defaultLang}/` />