Add a new language
Why?
You may want to add a new language to your app to make your content available to a larger audience.
How?
Add the translation files
First, you will have to add the JSON translation files under the src/locales/<yourLanguageCode>
folder,
with yourLanguageCode
being a country's alpha2 code (de
for example).
Initiate the dayjs locale and the zod locale in this file.
Example:
src/locales/de/index.ts
import "dayjs/locale/de";
import zod from "zod-i18n-map/locales/de/zod.json";
Import translations in the index
All translation files are referenced in the src/locales/index.ts
file. You need to import the new folder
you created, for instance, for german:
src/locales/index.ts
import de from "@/locales/de";
and add it to the default export:
src/locales/index.ts
export default { en, fr, ar, sw, de } as const;
Add the language to the list of user's available languages
Finally, you need to add the language to the AVAILABLE_LANGUAGES
list in src/lib/i18n/constants.ts
, in order
to make the language appear in the Select when creating an account.