Adding translations

All locale files can be found under src/i18n in the client repository. In order to add a new translation, you will need to create an appropriate folder in this directory. You can refer to the en locale as an example.

If you'd like to add a new locale, e.g. French, create an fr folder in the src/i18n directory and copy the index.ts file from the base (en) locale folder into your newly created fr directory. After copying the file, open it and change the locale name from en to fr as below:

/* eslint-disable no-irregular-whitespace */
/* eslint-disable max-len */
import type { BaseTranslation } from '../i18n-types';

const en = { // <-- change it to fr or other language code of your choice
[...]
} satisfies BaseTranslation;

export default en; // <-- change it to fr or other language code of your choice

Now you can edit your index.ts file and translate its strings into the chosen language.

Generating types

After every change in your translation you will have to generate the locale types in order for the locale to load properly. To do this, you will need to install some client dependencies: at least typesafe-i18n but ideally you should setup the whole client development environment in order to preview your translations. You can find the client development prerequisites in the client's readme: https://github.com/DefGuard/client?tab=readme-ov-file#development. You will also need to have some node package manager, we use pnpm.

The types can be generated by executing one of the following commands in the client directory:

pnpm typesafe-i18n

or

pnpm tauri dev

The first command only generates the required locale types, the second one runs the client along with UI hot reload, so you can observe your locale changes in real-time.

Switching language

Currently client picks the locale based on the operating system's settings. There is no straightforward way to switch the locale in the client by hand, other than to hardcode different detectedLocale in src/components/App/App.tsx or change your operating system's language. This is a temporary shortcoming and will be changed in the future.