feat: extract i18n into a package

packages/i18n/src/index.ts

@@ -0,0 +1,62 @@
+import i18next, { Resource } from 'i18next';
+import { initReactI18next, useTranslation } from 'react-i18next';
+import { LOCALES } from './resources/index.js';
+import type en_US from './resources/en.json';
+
+// const localStorage = {
+//   getItem() {
+//     return undefined;
+//   },
+//   setItem() {},
+// };
+// See https://react.i18next.com/latest/typescript
+declare module 'react-i18next' {
+  interface CustomTypeOptions {
+    // custom namespace type if you changed it
+    // defaultNS: 'ns1';
+    // custom resources type
+    resources: {
+      en: typeof en_US;
+    };
+  }
+}
+
+// const STORAGE_KEY = 'i18n_lng';
+
+export { i18n, useTranslation, LOCALES };
+
+const resources = LOCALES.reduce<Resource>(
+  (acc, { tag, res }) => ({ ...acc, [tag]: { translation: res } }),
+  {}
+);
+
+const fallbackLng = LOCALES[0].tag;
+const standardizeLocale = (language: string) => {
+  if (LOCALES.find(locale => locale.tag === language)) return language;
+  if (LOCALES.find(locale => locale.tag === language.slice(0, 2).toLowerCase()))
+    return language;
+  return fallbackLng;
+};
+
+const language = standardizeLocale(
+  //   localStorage.getItem(STORAGE_KEY) ??
+  //     (typeof navigator !== 'undefined' ? navigator.language : 'en')
+  'en'
+);
+
+const i18n = i18next.createInstance();
+i18n.use(initReactI18next).init({
+  lng: language,
+  fallbackLng,
+  debug: false,
+  resources,
+  interpolation: {
+    escapeValue: false, // not needed for react as it escapes by default
+  },
+});
+
+i18n.on('languageChanged', () => {
+  //   localStorage.setItem(STORAGE_KEY, lng);
+});
+
+// const I18nProvider = I18nextProvider;