i18n support for route urls

[jvdwijngaard]

Today I came to the conclusion I'm in need of i18n support for the routes created by tanstack (I'm using file-based config but that doesn't really matter).

So in short, when I, for example, create file organization.lazy.tsx in the routes folder and run the cli, it will generate the following Route:

export const Route = createLazyFileRoute('/organizations')({
  component: () => <div>Hello from /organizations</div>,
})

But then the url will always be https://my.domain.ext/organizations.
For the above, I would like to have the ability to navigate to the same route using aliases:

• https://my.domain.ext/organisaties when the locale is nl_NL
• https://my.domain.ext/organizaciones when ithe locale is es_ES
• etc...

I do know there is something like routeMasks, but that would not work for deeplinks. Also I know the possiblity to create separate routes for each value I want to support and point it to the same component, but that would be cumbersome and create a lot of unnecessary routes. It would be nice to have the ability to configure it in the Route itself, for example define a list of aliases.

A very simple example would be something like this:

export const Route = createLazyFileRoute('/organizations')({
  component: () => <div>Hello from /organizations</div>,
  aliases: ['organisaties', 'organizaciones']
})

This is just a very simple example. Perhaps something more robust regarding i18n would be more in place, like defining a more complex config using the locales and the corresponding translations of each route.

I'm curious what your opinions or ideas on this subject are.

Thanks!

[schiller-manuel]

how do other routers handle this?
how do you know which language a user has chosen?

[jvdwijngaard]

@schiller-manuel

Couple of years ago I worked on a Nuxt project and used this: https://i18n.nuxtjs.org/docs/guide/custom-paths

It works combined with general i18n support, which React has packages available for.

[nikuscs]

The translated routes and segments are not relevant anymore for SEO juice, neither the general public sees the full URL most of the times, so i think this a useless feature in 2024, im more interested on how we can prefix and suffix paths. Probably #146 (comment) is way more important :p my 2 cents