Any way to avoid code duplication with i18n?

[kindred sequoia]

As I see, to get static pages for each locale we need to duplicate every page and it's sad. Am I missing something?
I know, we can use some library to control translations, but with this approach we will have static pages only for some single language, and the rest translations will be loaded dynamically.

All I want is some language templating and auto-generator for pages 🙂 So that I could write

// index.astro
<h1>{ t("some fancy title") }>/h1>

And after build it will be as
/index.html
/en/index.html

Maybe it is possible already?

[fluid drift]

Still waiting for an answer?

It looks like no-one has responded to your question yet. People might not be available right now or don’t know how to answer your question. Want an answer while you wait? Try asking our experimental bot in #1095492539085230272.

[foggy herald]

https://github.com/yassinedoghri/astro-i18next

[prime coyote]

@foggy herald you say its better...? 🙂

[foggy herald]

personally yes

it generates your localized pages with a command instead of having two separate websites to maintain

or i misunderstood the docs

[prime coyote]

Yes you are right and i think multipage page handling is easier to implement than in clean i18n

I will do more tests today and implement i18n again , i18next is plan B 😄

[foggy herald]

still having trouble getting it to work for collections as im still a beginner

---
import { localizePath } from "astro-i18next";
import { t, changeLanguage } from "i18next";
import { getCollection } from "astro:content";
import ProjectLayout from "../../layouts/ProjectLayout.astro";

changeLanguage("en");

await changeLanguage("en");

export async function getStaticPaths() {
  const lang = Astro.request.headers.get("lang") || "en";
  const collectionName = `work`;
  const projectEntries = await getCollection(collectionName);
  return projectEntries.map((entry: any) => {
    if (typeof entry.slug !== "string") {
      console.error("Invalid slug type:", entry.slug);
      return;
    }
    const localizedSlug = localizePath({ path: entry.slug, locale: lang });
    return {
      params: { slug: localizedSlug },
      props: { entry },
    };
  });
}
const { entry } = Astro.props;
const { Content } = await entry.render();
console.log(typeof entry.slug, entry.slug);
---

<ProjectLayout frontmatter={entry.data}>
  <Content />
</ProjectLayout>

@prime coyote tried doing it like this but i get a typeError

TypeError: Cannot read properties of undefined (reading 'headers')
    at Module.getStaticPaths (/home/tom/local-sites/portfolio/src/pages/work/[slug].astro:12:30)
    at callGetStaticPaths (file:///home/tom/local-sites/portfolio/node_modules/astro/dist/core/render/route-cache.js:29:27)
    at getParamsAndProps (file:///home/tom/local-sites/portfolio/node_modules/astro/dist/core/render/params-and-props.js:18:29)
    at matchRoute (file:///home/tom/local-sites/portfolio/node_modules/astro/dist/vite-plugin-astro-server/route.js:38:13)
    at async run (file:///home/tom/local-sites/portfolio/node_modules/astro/dist/vite-plugin-astro-server/request.js:51:28)
    at async runWithErrorHandling (file:///home/tom/local-sites/portfolio/node_modules/astro/dist/vite-plugin-astro-server/controller.js:64:5)
    at async handleRequest (file:///home/tom/local-sites/portfolio/node_modules/astro/dist/vite-plugin-astro-server/request.js:47:3)

[prime coyote]

try to check type of headers before that line: "const lang = Astro.request.headers.get("lang") || "en";"

[open knot]

@foggy herald with https://github.com/yassinedoghri/astro-i18next you have to make some trick to make collection works, you can find an example here https://github.com/zankhq/astros.
But I think you will find a a better time by using https://github.com/jlarmstrongiv/astro-i18n-aut instead, which avoid having to generate the locale folder every time as well, I m moving my websites to this solution, you can find an example here https://github.com/zankhq/astro-starter

[foggy herald]

Ah right thanks

[foggy herald]

That's starter template's looking clean, very nice

[open knot]

thanks, the starter is just the standard blog template where I added some functionalities which i generally use for websites I make (like cms, localization, etc...)

[foggy herald]

right, its good for me to see it all in action though 😅