Skip to content

How to migrate i18n.dart files to .arb

Sky Blu edited this page Jan 13, 2022 · 3 revisions

Highlight i18n-translated strings

  • Open a Migrate *.i18n.dart ticket.
  • It will contain one or more todo items referencing a component file and the corresponding .i18n.dart files. For example:
- [ ] lib/screens/authentication/login_screen.dart:
   import 'package:seeds/i18n/authentication/login.i18n.dart';
  • Create a new branch, e.g. migrate-login.i18n.dart/gh-1448
  • Open the component file (e.g. login_screen.dart).
  • Delete the import .. i18n.dart statement.
  • This will create multiple The getter 'i18n' isn't defined errors in the file. For example:
Text("Lost your key?".i18n, style: Theme.of(context).textTheme.subtitle2),
                     ^^^^^ error
Text(" Recover ".i18n, style: Theme.of(context).textTheme.subtitle2HighEmphasisGreen1),
                ^^^^^ error
Text("your account here".i18n, style: Theme.of(context).textTheme.subtitle2),
                        ^^^^^ error

Migrate i18n-translated strings

For each error:

  • Open lib/l10n/app_en.arb.
  • Add a new key. For example:
"loginRecoverAccountActionSegment1": "Lost your key?",
"loginRecoverAccountActionLink": " Recover ",
"loginRecoverAccountActionSegment2": "your account here"
  • Rebuild or restart the app (to regenerate files in .dart_tool/flutter_gen/gen_l10n/).
  • Add import 'package:flutter_gen/gen_l10n/app_localizations.dart’;
  • Use new keys in code. For example:
Text(localization.loginRecoverAccountActionSegment1, style: Theme.of(context).textTheme.subtitle2),
Text(localization.loginRecoverAccountActionLink, style: Theme.of(context).textTheme.subtitle2HighEmphasisGreen1),
Text(localization.loginRecoverAccountActionSegment2, style: Theme.of(context).textTheme.subtitle2),

Add existing translations to other language files.

For example, for Spanish:

  • Open lib/l10n/app_es.arb.
  • Add the key from lib/l10n/app_en.arb.
  • Add translations from the deleted import .. i18n.dart file.
  • Example:
"loginRecoverAccountActionSegment1": "Perdiste tu llave?",
"loginRecoverAccountActionLink": " Recuperar ",
"loginRecoverAccountActionSegment2": "tu cuenta aqui"

Check for previously untranslated strings

  • Check the component file (e.g. login_screen.dart) for any other strings that need to be translated
  • If needed, create and use new keys

Clean up and merge

  • Delete the i18n.dart file
  • Run simulator with the corresponding language setting to double-check the translations work as expected
  • Make and merge a PR against master
  • Merge master into weblate to automatically update the Weblate repo and allow translators to add missing translations

Complete example

https://github.com/JoinSEEDS/seeds_light_wallet/pull/1481/files