brave / ads-ui

Self-service ads UI
Mozilla Public License 2.0
23 stars 11 forks source link

fix: use language on demand only #1143

Closed tackley closed 6 months ago

tackley commented 6 months ago

Until we've had a better chance to review the experience in other languages, don't default to it. Supply e.g. lang=es as a query string to switch language.

And also support the pseudolang with lang=test.

github-actions[bot] commented 6 months ago

[puLL-Merge] - brave/ads-ui@1143

Description

This pull request contains several changes that migrate the localization configuration from JavaScript to TypeScript and introduce functionality for language detection and pseudolocalization for testing internationalization. It also updates dependencies related to the internationalization process and modifies the way language activation is managed within the application.

Changes ### Changes #### `lingui.config.js` to `lingui.config.ts` - Deleted `lingui.config.js` and replaced it with `lingui.config.ts` to leverage TypeScript for defining the Lingui configuration. - Added a "test" locale for the purpose of pseudolocalization, along with its configuration (`pseudoLocale: "test"` and `fallbackLocales`). #### `package.json` - Added `@lingui/detect-locale` package for improved locale detection. - Removed the `"compile": "lingui compile"` script, possibly to streamline the localization process, focusing on the extraction phase. #### `src/App.tsx` - Removed browser language detection from `useEffect`, simplifying the dynamic activation of locales to rely on the newly introduced locale detection in `src/i18n.ts`. #### `src/i18n.ts` - Enhanced language detection using `@lingui/detect-locale`. This includes checking the `"lang"` URL parameter and possibly a navigator language fallback (commented out). - Updated locale codes and added a "test" locale for pseudolocalization. #### `src/locales/test.po` - Introduced a new pseudolocale `.po` file containing over 2000 lines of translations. This aids in testing the application's internationalization by visually exaggerating translations.

Security Hotspots

  1. Pseudolocalization visibility (src/locales/test.po):

    • Risk: Low
    • The inclusion of a pseudolocale is useful for testing but should be managed carefully to ensure it's not accessible or visible to end-users in a production environment.
  2. Dependency updates (package.json):

    • Risk: Medium
    • Adding new dependencies and updating existing ones can introduce new vulnerabilities or incompatibilities. Each new or updated package (@lingui/detect-locale, etc.) should be carefully evaluated.
  3. Language detection and fallback (src/i18n.ts):

    • Risk: Medium
    • Implementing custom logic for language detection and activation, especially with commented-out code (//fromNavigator()), requires a careful review to ensure that there are no edge cases or security implications, such as script injections via URL parameters.
  4. Public exposure of pseudolocalization configuration (lingui.config.ts):

    • Risk: Low
    • The configuration explicitly mentions a test locale for pseudolocalization, which is great for internal testing but should be handled in a way that it's not included or exposed in the production build process.