…tability) (#199) ## Ticket Resolves #194 ## Changes - Add a new `i18n-types` NPM script for generating a TypeScript declaration of the JSON English locale file(s) - [Configure i18next to be type-safe](https://www.i18next.com/overview/typescript), to prevent references to i18n key paths that don't exist in the locale files ## Context for reviewers I'm interested to get feedback on this proposal. It comes with some tradeoffs... **Pros** - Type-safe i18n! This is useful for catching translation errors early. - In addition to type safety, it also enables autocomplete capability in IDE's (see demo below). - It's not always clear to teams how to enable type-safety of i18next, so providing this out-of-the-box could be helpful for teams that want it. **Cons** - This relies on a TypeScript file that references every English JSON file. I can definitely see an engineer adding a new English locale file and getting TypeScript errors when they attempt to reference keys in it, because they're already running the development server and didn't know to run `npm run i18n-types`. - I don't love that this relies on a new dependency to generate the TypeScript file. Instructing engineers in the README to manually update this file also didn't feel like a great option. - Like other TypeScript errors, the type errors that get shown for invalid keys don't make it obvious that the error is due to the key not existing in the locale definition. There is a nice feature where it can sometimes include a "Did you mean" suggestion though (see demo below). I _think_ the benefits of type-safe i18n is worth this added potential for confusion, but I'm curious to get people's thoughts on that. ## Testing https://github.com/navapbc/template-application-nextjs/assets/371943/78388995-f823-4168-996f-6db833a4b088 Example of the test coverage to help teams identify that the file needs to be updated: <img width="1142" alt="CleanShot 2023-08-19 at 10 10 01@2x" src="https://github.com/navapbc/template-application-nextjs/assets/371943/4d7873f2-a689-4a7a-a786-1ef5286000de">

Make i18next type-safe #194

Description

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions