@andre1502/react-utilities 0.9.1 → 0.9.2

package/dist/index.d.ts

@@ -1,2 +1,3 @@
 export * from './format';
+export * from './i18n';
 export * from './sentry';

package/dist/index.js

@@ -14,6 +14,17 @@ Object.keys(_format).forEach(function (key) {
     }
   });
 });
+var _i18n = require("./i18n");
+Object.keys(_i18n).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _i18n[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _i18n[key];
+    }
+  });
+});
 var _sentry = require("./sentry");
 Object.keys(_sentry).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_format","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_sentry"],"sources":["../src/index.ts"],"sourcesContent":["export * from './format';\nexport * from './sentry';\n"],"mappings":";;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,OAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,OAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,OAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAC,OAAA,CAAAL,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["_format","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_i18n","_sentry"],"sources":["../src/index.ts"],"sourcesContent":["export * from './format';\nexport * from './i18n';\nexport * from './sentry';\n"],"mappings":";;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,KAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,KAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,KAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAC,KAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,OAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,OAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,OAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAE,OAAA,CAAAN,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/dist/index.mjs

@@ -1,6 +1,9 @@
 export { CurrencySymbolEnum, formatAccountNumber, formatNumber, getCurrencySymbol, parseFormatNumber } from './format.mjs';
+export { E as EnvironmentEnum } from './EnvironmentEnum-UcQ6Il1O.js';
+export { g as getV, i as initI18n } from './I18n-yXLN_hDO.js';
 export { i as initSentry, r as recordAdditionalSentryHttp } from './React-BaJ1KfGF.js';
 import '@formatjs/intl-numberformat';
+import 'cross-fetch';
 import '@sentry/react';
 import './Utils-Cq948gfa.js';
 //# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@andre1502/react-utilities",
-  "version": "0.9.1",
+  "version": "0.9.2",
   "description": "module to combine common functions",
   "repository": {
     "type": "git",
@@ -15,11 +15,6 @@
       "require": "./dist/index.cjs",
       "import": "./dist/index.mjs"
     },
-    "./fmt": {
-      "types": "./dist/index-fmt.d.ts",
-      "require": "./dist/index-fmt.cjs",
-      "import": "./dist/index-fmt.mjs"
-    },
     "./react-native": {
       "types": "./dist/index-rn.d.ts",
       "require": "./dist/index-rn.cjs",
@@ -35,6 +30,11 @@
       "require": "./dist/format.cjs",
       "import": "./dist/format.mjs"
     },
+    "./i18n": {
+      "types": "./dist/i18n.d.ts",
+      "require": "./dist/i18n.cjs",
+      "import": "./dist/i18n.mjs"
+    },
     "./sentry": {
       "types": "./dist/sentry.d.ts",
       "require": "./dist/sentry.cjs",
@@ -89,6 +89,11 @@
     "@types/lodash": "^4.17.7",
     "google-auth-library": "^9.11.0",
     "googleapis": "^140.0.1",
+    "i18next": "^23.16.5",
+    "i18next-chained-backend": "^4.6.2",
+    "i18next-http-backend": "^2.6.2",
+    "i18next-localstorage-backend": "^4.2.0",
+    "i18next-resources-to-backend": "^1.2.1",
     "lodash": "^4.17.21",
     "sitemap": "^8.0.0"
   },

package/src/Config/Config.ts

@@ -1,4 +1,5 @@
 import * as lodash from 'lodash';
+import { EnvironmentEnum } from '../enums/EnvironmentEnum';
 import { OutputMap } from '../interfaces/Config/OutputMap';
 import { OutputOptions } from '../interfaces/Config/OutputOptions';
 import { outputToFile } from './Output';
@@ -137,17 +138,17 @@ const envMap = (env: string): string => {
     case 'dev':
     case 'develop':
     case 'development':
-      result = 'dev';
+      result = EnvironmentEnum.DEV;
       break;
     case 'stg':
     case 'stag':
     case 'staging':
-      result = 'staging';
+      result = EnvironmentEnum.STAGING;
       break;
     case 'prd':
     case 'prod':
     case 'production':
-      result = 'production';
+      result = EnvironmentEnum.PRODUCTION;
       break;
     default:
       throw new Error(`env ${env} not supported.`);

package/src/I18n/I18n.ts

@@ -0,0 +1,117 @@
+import i18next, { InitOptions, ThirdPartyModule } from 'i18next';
+import ChainedBackend from 'i18next-chained-backend';
+import HttpBackend from 'i18next-http-backend';
+import LocalStorageBackend from 'i18next-localstorage-backend';
+import ResourcesToBackend from 'i18next-resources-to-backend';
+
+const getV = (divider: number): number => {
+  return Math.floor(Date.now() / divider);
+};
+
+const initI18n = (
+  initReactI18next: ThirdPartyModule,
+  lang: string,
+  fallbackLang: string,
+  langCacheExpiredTimeMs: number,
+  resources: { [key: string]: any },
+  version: string,
+  withLocalstorageBackend?: boolean,
+  cdnUrl?: string,
+  debug?: boolean,
+) => {
+  let backends: Array<any> = [];
+  let backendOptions: Array<any> = [];
+  const langs = Object.keys(resources);
+
+  // https://www.i18next.com/how-to/backend-fallback
+  if (withLocalstorageBackend) {
+    const versions: { [key: string]: string } = {};
+
+    langs.forEach((value) => Object.assign(versions, { [value]: version }));
+
+    backends.push(LocalStorageBackend);
+    backendOptions.push({
+      // prefix for stored languages
+      prefix: `i18next_res_`,
+
+      // expiration
+      expirationTime: langCacheExpiredTimeMs,
+
+      // language versions
+      versions: versions,
+    });
+  }
+
+  if (cdnUrl) {
+    backends.push(HttpBackend);
+    backendOptions.push({
+      // load resources from url path
+      loadPath: `${cdnUrl}/locales/{{lng}}.json`,
+      // adds parameters to resource URL. 'example.com' -> 'example.com?v=1.3.5'
+      queryStringParams: {
+        v: `${version}.${getV(langCacheExpiredTimeMs)}`,
+      },
+
+      reloadInterval: langCacheExpiredTimeMs, // can be used to reload resources in a specific interval (milliseconds) (useful in server environments)
+    });
+  }
+
+  backends.push(ResourcesToBackend(resources));
+
+  // https://www.i18next.com/misc/creating-own-plugins#languagedetector
+  const languageDetector: any = {
+    type: 'languageDetector',
+    name: 'customDetector',
+    async: false,
+    init: () => {
+      /* use services and options */
+    },
+    detect: (callback: any) => {
+      return lang;
+    },
+  };
+
+  const config: InitOptions = {
+    debug: debug ?? false,
+    compatibilityJSON: 'v4',
+    ns: ['translation'],
+    defaultNS: 'translation',
+    lng: lang,
+    fallbackLng: fallbackLang,
+    load: 'currentOnly',
+    keySeparator: false,
+    nonExplicitSupportedLngs: true,
+    backend: {
+      backends: backends,
+      backendOptions: backendOptions,
+      cacheHitMode: 'refreshAndUpdateStore',
+      reloadInterval: langCacheExpiredTimeMs,
+      refreshExpirationTime: langCacheExpiredTimeMs, // only after determined time it should trigger a refresh if necessary
+    },
+    react: {
+      bindI18nStore: 'added', // this way, when the HttpBackend delivers new translations (thanks to refreshAndUpdateStore), the UI gets updated
+    },
+    interpolation: {
+      escapeValue: false, // react already safes from xss
+    },
+  };
+
+  if (!i18next.isInitialized) {
+    i18next
+      .use(ChainedBackend)
+      .use(languageDetector)
+      .use(initReactI18next) // passes i18n down to react-i18next
+      .init(config, (ex, t) => {
+        if (ex) {
+          console.error(`Error when i18n init`, ex);
+          return;
+        }
+
+        setInterval(() => {
+          i18next.reloadResources();
+        }, langCacheExpiredTimeMs);
+      });
+  }
+};
+
+export { getV, initI18n };

package/src/config-cli.ts

@@ -3,6 +3,7 @@ import { JSONClient } from 'google-auth-library/build/src/auth/googleauth';
 import { exportConfig, processConfig } from './Config/Config';
 import { authorizeServiceAccount, fetchGoogleSheet } from './Config/GoogleAuth';
 import { exportLocales, processLocales } from './Config/Locales';
+import { EnvironmentEnum } from './enums/EnvironmentEnum';
 import { ConfigOptions } from './interfaces/Config/ConfigOptions';
 
 export { transformConfig } from './Config/Config';
@@ -10,6 +11,7 @@ export { transformSitemap } from './Config/Sitemap';
 export * from './interfaces/Config/ConfigOptions';
 export * from './interfaces/Config/OutputOptions';
 export type { ExportAs, FormatAs } from './types/Config/OptionType';
+export { EnvironmentEnum };
 
 /**
  * Private function to fetch locales

package/src/enums/EnvironmentEnum.ts

@@ -0,0 +1,5 @@
+export enum EnvironmentEnum {
+  DEV = 'dev',
+  STAGING = 'staging',
+  PRODUCTION = 'production',
+}

package/src/i18n.ts

@@ -0,0 +1,4 @@
+import { EnvironmentEnum } from './enums/EnvironmentEnum';
+
+export * from './I18n/I18n';
+export { EnvironmentEnum };

package/src/index-rn.ts

@@ -1,2 +1,3 @@
 export * from './format';
+export * from './i18n';
 export * from './sentry-rn';

package/src/index.ts

@@ -1,2 +1,3 @@
 export * from './format';
+export * from './i18n';
 export * from './sentry';

package/dist/index-fmt.cjs

@@ -1,16 +0,0 @@
-'use strict';
-
-var format = require('./format.cjs');
-require('@formatjs/intl-numberformat');
-
-
-
-Object.defineProperty(exports, "CurrencySymbolEnum", {
-	enumerable: true,
-	get: function () { return format.CurrencySymbolEnum; }
-});
-exports.formatAccountNumber = format.formatAccountNumber;
-exports.formatNumber = format.formatNumber;
-exports.getCurrencySymbol = format.getCurrencySymbol;
-exports.parseFormatNumber = format.parseFormatNumber;
-//# sourceMappingURL=index-fmt.cjs.map

package/dist/index-fmt.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-fmt.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/index-fmt.d.ts

@@ -1 +0,0 @@
-export * from './format';

package/dist/index-fmt.js

@@ -1,17 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _format = require("./format");
-Object.keys(_format).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _format[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _format[key];
-    }
-  });
-});
-//# sourceMappingURL=index-fmt.js.map

package/dist/index-fmt.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-fmt.js","names":["_format","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../src/index-fmt.ts"],"sourcesContent":["export * from './format';\n"],"mappings":";;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/dist/index-fmt.mjs

@@ -1,3 +0,0 @@
-export { CurrencySymbolEnum, formatAccountNumber, formatNumber, getCurrencySymbol, parseFormatNumber } from './format.mjs';
-import '@formatjs/intl-numberformat';
-//# sourceMappingURL=index-fmt.mjs.map

package/dist/index-fmt.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-fmt.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/src/index-fmt.ts

@@ -1 +0,0 @@
-export * from './format';