Skip to content

How to add languages

seriousm4x edited this page Jan 26, 2024 · 4 revisions

Explanation

There are two different language code formats:

  • Language Code specifies the base language. For example: en
  • ISO Country Code is defined as language-COUNTRY. For example: en-US

datahub.io has a table for all languages.

All language-COUNTRY formats should inherit from the base language. See de and de-DE for example.

What to do

  1. Fork UpSnap, clone your fork and create a new branch. Name it i18n-add- followed by your language code.

  2. Create a new folder inside frontend/src/lib/i18n/ with the corresponding language code from above. Inside your new folder create a file called index.ts.

    import en from "../en";
    import type { Translation } from "../i18n-types";
    
    const de = {
      ...(en as unknown as Translation),
      "home": {...}
      "account": {...}
      ...
    } satisfies Translation;
    
    export default de;

    We import en as our base translation and then specify our own strings. For more infos on how typesafe-i18n works, check the repo. There are multiple examples.

  3. On the accounts page add your flag emoji with the corresponding language code (same as folder name). Keep it in alphabetical order.

  4. In DeviceCard import your locale from date-fns and add it to the switch statement like the others. Take a look here which codes are supported by date-fns. Keep it in alphabetical order as well.

  5. In your shell:

    pnpm run format
    pnpm run lint

    and check for errors. If everything looks good, create a pull request.