Call getMatchableLocales in importMessages

build-tools/tasks/generate-i18n-messages.js

@@ -51,26 +51,32 @@ module.exports = function generateI18nMessages() {
 
   // Generate a dynamic provider function for automatic bundler splitting and imports.
   const dynamicFile = [
-    `import { warnOnce } from '@cloudscape-design/component-toolkit/internal';`,
-    `import { isDevelopment } from '../internal/is-development';\n`,
-    `export function importMessages(locale) {`,
-    `  switch (locale.toLowerCase()) {`,
+    `import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
+import { isDevelopment } from '../internal/is-development';
+import { getMatchableLocales } from './get-matchable-locales';
+
+export function importMessages(locale) {
+  for (const matchableLocale of getMatchableLocales(locale)) {
+    switch (matchableLocale.toLowerCase()) {`,
     ...files.flatMap(fileName => {
       const [subset, locale] = fileName.split('.');
       if (subset !== 'all') {
         return []; // For now, this only supports loading all messages for the locale.
       }
       return [
-        `  case "${locale.toLowerCase()}":`,
-        `    return import("./messages/${subset}.${locale}.js").then(mod => [mod.default]);`,
+        `    case "${locale.toLowerCase()}":
+      return import("./messages/${subset}.${locale}.js").then(mod => [mod.default]);`,
       ];
     }),
-    `  }\n`,
-    `  if (isDevelopment) {`,
-    `    warnOnce('importMessages', \`Unknown locale "\${locale}" provided to importMessages\`)`,
-    `  }\n`,
-    `  return Promise.resolve([]);`,
-    `}`,
+    `    }
+  }
+
+  if (isDevelopment) {
+    warnOnce('importMessages', \`Unknown locale "\${locale}" provided to importMessages\`)
+  }
+
+  return Promise.resolve([]);
+}`,
   ].join('\n');
 
   fs.copyFileSync(path.join(sourceI18nDir, 'dynamic.d.ts'), path.join(targetI18nDir, 'dynamic.d.ts'));

src/i18n/dynamic.d.ts

@@ -1,4 +1,9 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
+
+// It's fine for importMessages to raise TypeScript requirements because
+// it will usually be accompanied by the I18nProvider anyway.
+// eslint-disable-next-line @cloudscape-design/ban-files
 import { I18nProviderProps } from './provider';
+
 export function importMessages(locale: string): Promise<ReadonlyArray<I18nProviderProps.Messages>>;

src/i18n/get-matchable-locales.ts

@@ -0,0 +1,15 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+
+export function getMatchableLocales(ietfLanguageTag: string): string[] {
+  const parts = ietfLanguageTag.split('-');
+  if (parts.length === 1) {
+    return [ietfLanguageTag];
+  }
+
+  const localeStrings: string[] = [];
+  for (let i = parts.length; i > 0; i--) {
+    localeStrings.push(parts.slice(0, i).join('-'));
+  }
+  return localeStrings;
+}

src/i18n/provider.tsx

@@ -9,6 +9,7 @@ import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
 import { useTelemetry } from '../internal/hooks/use-telemetry';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
 import { InternalI18nContext, FormatFunction, CustomHandler } from './context';
+import { getMatchableLocales } from './get-matchable-locales';
 
 export interface I18nProviderProps {
   messages: ReadonlyArray<I18nProviderProps.Messages>;
@@ -137,16 +138,3 @@ function mergeMessages(sources: ReadonlyArray<I18nProviderProps.Messages>): I18n
   }
   return result;
 }
-
-function getMatchableLocales(ietfLanguageTag: string): string[] {
-  const parts = ietfLanguageTag.split('-');
-  if (parts.length === 1) {
-    return [ietfLanguageTag];
-  }
-
-  const localeStrings: string[] = [];
-  for (let i = parts.length; i > 0; i--) {
-    localeStrings.push(parts.slice(0, i).join('-'));
-  }
-  return localeStrings;
-}