i18n: use automatic type inference of translation keys

Finally figured out a way to make typescript strongly type translation
keys so we can avoid the tedium of creating enums of translation keys.
This commit is contained in:
David Lechner
2022-07-22 13:48:50 -05:00
parent 3e10096b6e
commit d6df128860
80 changed files with 402 additions and 875 deletions
@@ -12,7 +12,7 @@ import {
import { useSelector } from '../../reducers';
import FileNameFormGroup from '../fileNameFormGroup/FileNameFormGroup';
import { renameFileDialogDidAccept, renameFileDialogDidCancel } from './actions';
import { I18nId, useI18n } from './i18n';
import { useI18n } from './i18n';
const RenameFileDialog: React.VFC = () => {
const i18n = useI18n();
@@ -46,7 +46,7 @@ const RenameFileDialog: React.VFC = () => {
return (
<Dialog
title={i18n.translate(I18nId.Title, {
title={i18n.translate('title', {
fileName: oldName,
})}
isOpen={isOpen}
@@ -74,7 +74,7 @@ const RenameFileDialog: React.VFC = () => {
disabled={result !== FileNameValidationResult.IsOk}
type="submit"
>
{i18n.translate(I18nId.ActionRename)}
{i18n.translate('action.rename')}
</Button>
</div>
</div>
@@ -1,12 +0,0 @@
// SPDX-License-Identifier: MIT
// Copyright (c) 2022 The Pybricks Authors
import { lookup } from '../../../test';
import { I18nId } from './i18n';
import en from './translations/en.json';
describe('Ensure .json file has matches for I18nId', () => {
test.each(Object.values(I18nId))('%s', (id) => {
expect(lookup(en, id)).toBeDefined();
});
});
+4 -7
View File
@@ -1,15 +1,12 @@
// SPDX-License-Identifier: MIT
// Copyright (c) 2022 The Pybricks Authors
import { I18n, useI18n as useShopifyI18n } from '@shopify/react-i18n';
import { useI18n as useShopifyI18n } from '@shopify/react-i18n';
import type { TypedI18n } from '../../i18n';
import type translations from './translations/en.json';
export function useI18n(): I18n {
export function useI18n(): TypedI18n<typeof translations> {
// istanbul ignore next: babel-loader rewrites this line
const [i18n] = useShopifyI18n();
return i18n;
}
export enum I18nId {
Title = 'title',
ActionRename = 'action.rename',
}