refactor(i18n): use JSON with flattened key and namespace (#30114)

Co-authored-by: yyh <yuanyouhuilyz@gmail.com>
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

web/types/i18n.d.ts

@@ -1,26 +1,31 @@
-import type { messagesEN } from '../i18n-config/i18next-config'
-import 'react-i18next'
-
-// Complete type structure that matches i18next-config.ts camelCase conversion
-export type Messages = typeof messagesEN
-
-// Utility type to flatten nested object keys into dot notation
-type FlattenKeys<T> = T extends object
-  ? {
-      [K in keyof T]: T[K] extends object
-        ? `${K & string}.${FlattenKeys<T[K]> & string}`
-        : `${K & string}`
-    }[keyof T]
-  : never
-
-export type ValidTranslationKeys = FlattenKeys<Messages>
+import type { NamespaceCamelCase, Resources } from '../i18n-config/i18next-config'
+import 'i18next'
 
 declare module 'i18next' {
   // eslint-disable-next-line ts/consistent-type-definitions
   interface CustomTypeOptions {
-    defaultNS: 'translation'
-    resources: {
-      translation: Messages
-    }
+    defaultNS: 'common'
+    resources: Resources
+    keySeparator: false
   }
 }
+
+export type I18nKeysByPrefix<
+  NS extends NamespaceCamelCase,
+  Prefix extends string = '',
+> = Prefix extends ''
+  ? keyof Resources[NS]
+  : keyof Resources[NS] extends infer K
+    ? K extends `${Prefix}${infer Rest}`
+      ? Rest
+      : never
+    : never
+
+export type I18nKeysWithPrefix<
+  NS extends NamespaceCamelCase,
+  Prefix extends string = '',
+> = Prefix extends ''
+  ? keyof Resources[NS]
+  : Extract<keyof Resources[NS], `${Prefix}${string}`>
+
+type A = I18nKeysWithPrefix<'billing'>