Add i18n and l10n with lingui and babel

[goanpeca]

Hello, folks!

This PR adds a language switcher and some logic to deal with multiple languages on the xarray website. Using lingui and babel.

Currently, as part of the Scientific Python grant, we have the site 100% translated into Portuguese (Brazilian) and Spanish. Other languages may follow soon - having the infrastructure set up will hopefully help us recruit new translators 😄

We have been working on the automation process for the sync between crowdin and the websites and can help answer any questions you might have.

This PR is a proof of concept and we are happy to adapt to any specific format or needs you might have here. Feedback is appreciated.

Thanks!

Desktop

Mobile

Moving forward

Ensure all translatable strings are wrapped up in the t macro. Yarn build will extract and compile the translations strings

and the rest of the work will happen automatically on https://github.com/Scientific-Python-Translations/xarray-translations and crowding with the volunteer contributors.

For components and pages

import { useLingui } from '@lingui/react/macro'

const Team = () => {
  const { t } = useLingui()
  return ({t`Current core maintainers 🤝`})

For data: convert the object to a function so the t macro can work.

import { useLingui } from '@lingui/react/macro'

export const getLibraries = () => {
  const { t } = useLingui()
  let Libraries = [
    {
      name: 'NumPy',
      description: t`NumPy is the fundamental package for array computing with Python.`,
      url: 'https://numpy.org',
      repo: 'https://github.com/numpy/numpy',
      logo: '/libraries/numpy_logo.svg',
    },
...
}

[vercel]

@goanpeca is attempting to deploy a commit to the xarray Team on Vercel.

A member of the Team first needs to authorize it.

[melissawm]

For context, here's some initial discussion around this topic: pydata/xarray#9094

[goanpeca]

The PR has now selected all localizable strings. I added a simple dropdown but I need some help in getting it to actually change the language.

[goanpeca]

Hi @andersy005 :)

Wanted to know what we could do to help move this forward

Thanks!

[andersy005]

thank you for your patience, @goanpeca! very cool to see this addition to the site! let's remove the RSS feed files (atom.xml, rss.json, rss.xml) from git. these aren't meant to be pushed.

@jhamman, i no longer have permissions to approve the vercel deployment. do you mind authorizing it so we can check how it looks in staging? after that, we can merge to prod.

[goanpeca]

Hi @andersy005 thanks!

Will make the changes and ping you :)

[goanpeca]

thank you for your patience, @goanpeca! very cool to see this addition to the site! let's remove the RSS feed files (atom.xml, rss.json, rss.xml) from git. these aren't meant to be pushed.

I made the updates @andersy005 ! Thanks 🚀

---

cc @jhamman 🙈

[andersy005]

this looks solid, @goanpeca! thank you for putting it together. looking forward to other translations

waiting for @jhamman to authorize the preview, when he gets a moment

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
xarray-dev	❌ Failed (Inspect)			May 8, 2025 3:01pm

[goanpeca]

Thanks @jhamman , there seems to be some issue but I cannot access the logs, any pointers to debug this?

Thanks

[jhamman]

Here are the logs:

[08:00:55.456] Running build in Washington, D.C., USA (East) – iad1
[08:00:55.482] Cloning github.com/xarray-contrib/xarray.dev (Branch: add-i18n, Commit: a89f645)
[08:00:57.628] Cloning completed: 2.146s
[08:01:00.884] Restored build cache from previous deployment (5tdvhbKSYoayVgx2MA7LLnnudq8u)
[08:01:01.928] Running "vercel build"
[08:01:02.351] Vercel CLI 41.7.3
[08:01:05.911] yarn config v1.22.19
[08:01:05.950] success Set "enableGlobalCache" to "false".
[08:01:05.951] Done in 0.04s.
[08:01:05.960] Installing dependencies...
[08:01:06.152] yarn install v1.22.19
[08:01:06.231] [1/4] Resolving packages...
[08:01:21.212] [2/4] Fetching packages...
[08:01:51.677] error @lingui/core@5.3.1: The engine "node" is incompatible with this module. Expected version ">=20.0.0". Got "18.20.6"
[08:01:51.689] error Found incompatible module.
[08:01:51.689] info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
[08:01:51.753] Error: Command "yarn install" exited with 1
[08:01:52.336] 
[08:01:55.468] Exiting build container

[andersy005]

[08:01:51.677] error @lingui/core@5.3.1: The engine "node" is incompatible with this module. Expected version ">=20.0.0". Got "18.20.6"

@jhamman, can we bump the node version in our vercel settings?

[goanpeca]

Hi @jhamman and @andersy005, wanted to ask if the vercel configuration could be updated 😄 ?

Thanks! 🚀

[jhamman]

I've bumped our node version to 20.x. The (re)deployment ran and reported this error:

 ⨯ ESLint: Invalid Options: - Unknown options: useEslintrc, extensions - 'extensions' has been removed.

@andersy005 - do you have bandwidth this week to help unblock here?