mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-10-10 21:54:47 +08:00
Modifying some scripts that verify the shape of localization calls to work with the i18nString shorthand: const i18nString = i18.i18n.getLocalizedString.bind(undefined, str_); Bug: 1136655 Change-Id: I09a961136dd89e8af11ab33f413f315e61184078 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2469903 Commit-Queue: Vidal Diazleal <vidorteg@microsoft.com> Reviewed-by: Simon Zünd <szuend@chromium.org> Reviewed-by: Peter Marshall <petermarshall@chromium.org> Reviewed-by: Christy Chen <chrche@microsoft.com>
1.7 KiB
1.7 KiB
Localizable strings in the DevTools frontend need to be wrapped in localization calls. There are two different calls.
i18nString
The basic API to make a string (with or without placeholder) localizable.
The first argument is the string reference in UIStrings
The second argument is an object for placeholders (if any)
// at the top of example.js file, after import statements
const UIStrings = {
/**
* @description This is an example description for my new string with placeholder
* @example {example for placeholder} PH1
* @example {example 2 for placeholder 2} PH2
*/
addAnotherString: 'Another new string I want to add, with {PH1} and {PH2}',
};
message = i18nString(UIStrings.addAnotherString, {PH1: 'a placeholder', PH2: 'another placeholder'});
i18n.i18n.getFormatLocalizedString
This call returns a span element, not a string. It is used when you want to construct a DOM element with a localizable string, or localizable content that contains some other DOM element.
// Create the string in UIString
/**
*@description Message in Coverage View of the Coverage tab
*@example {reload button icon} PH1
*@example {record button icon} PH2
*/
clickTheRecordButtonSToStart: 'Click the reload button {PH1} to reload or record button {PH2} start capturing coverage.',
// Element with localizable content containing two DOM elements that are buttons
const reloadButton = UI.createInlineButton(UI.Toolbar.createActionButtonForId('coverage.start-with-reload'));
const recordButton = UI.createInlineButton(UI.Toolbar.createActionButton(this._toggleRecordAction));
message = i18n.i18n.getFormatLocalizedString(str_, UIStrings.clickTheReloadButtonSToReloadAnd, {PH1: reloadButton, PH2:recordButton });