@deriv-com/translations 1.3.4 → 1.3.6

package/README.md

@@ -10,7 +10,7 @@ This is a localization library that uses `i18next`, `react-i18next`, and a custo
 - [Usage](#usage)
     - [`initializeI18n`](#initializei18n)
     - [`<Localize />`](#localize-component-example)
-    - [~~`localize`~~](#localize-example)
+    - [`localize`](#localize-example)
     - [`useTranslations` Hook](#usetranslations-hook)
 - [Syncing translations to CDN](#syncing-translations)
     - [Example usage of the action in the workflow file](#example-usage-of-the-action-in-the-workflow-file)
@@ -100,16 +100,16 @@ import { Localize } from "@deriv-com/translations";
 />;
 ```
 
-### ~~`localize`~~ example:
+### `localize` example:
 
-> Note that the `localize` function is deprecated and should be replaced with the `useTranslations` hook or the `Localize` component. this function will not get the update from i18n instance once there is any changes like resource loaded or language change. the example of the `localize` function is provided for backward compatibility.
+> Note that the `localize` function will not get the update from i18n instance once there is any changes like resource loaded or language change. This `localize` function is not to be used to wrap strings in components and only suitable for util/mapper functions which would not cause issues with string not getting updated.
 
 ```jsx
 import { localize } from "@deriv-com/translations";
 
-<h4 className="drawer__notifications-header">
-  {localize("all notifications")}
-</h4>;
+const getNotification = () => ({
+  all: localize("all notifications"),
+});
 ```
 
 ### `useTranslations` Hook

package/dist/provider/translation-provider.js

@@ -1,40 +1,40 @@
-import { I as m, j as s } from "../jsx-runtime-ClgrxkDP.js";
-import { useMemo as d, createElement as f, createContext as g, useState as u, useEffect as x } from "react";
+import { I as f, j as s } from "../jsx-runtime-ClgrxkDP.js";
+import { useMemo as g, createElement as m, createContext as d, useState as i, useEffect as x } from "react";
 import "../crc32-LCGpXEbE.js";
 import { L } from "../constants-D-_KboaS.js";
 function p(t) {
   let {
     i18n: e,
     defaultNS: o,
-    children: n
+    children: a
   } = t;
-  const a = d(() => ({
+  const n = g(() => ({
     i18n: e,
     defaultNS: o
   }), [e, o]);
-  return f(m.Provider, {
-    value: a
-  }, n);
+  return m(f.Provider, {
+    value: n
+  }, a);
 }
-const v = g(null);
+const v = d(null);
 function P({
   defaultLang: t,
   i18nInstance: e,
   children: o
 }) {
-  const [n, a] = u(t || ""), [i, l] = u(!1), c = (r) => {
-    e.changeLanguage(r), a(r), localStorage.setItem(L, r);
+  const [a, n] = i(t || ""), [u, l] = i(!1), c = (r) => {
+    e.changeLanguage(r), n(r), localStorage.setItem(L, JSON.stringify(r));
   };
   return x(() => {
     if (e) {
       const r = e.language || t || "";
-      a(r), l(!0);
+      n(r), l(!0);
     }
-  }, [e, t]), !e || !i ? null : /* @__PURE__ */ s.jsx(p, { i18n: e, children: /* @__PURE__ */ s.jsx(
+  }, [e, t]), !e || !u ? null : /* @__PURE__ */ s.jsx(p, { i18n: e, children: /* @__PURE__ */ s.jsx(
     v.Provider,
     {
       value: {
-        currentLang: n,
+        currentLang: a,
         switchLanguage: c
       },
       children: o

package/dist/utils/lang-utils.d.ts

@@ -1,6 +1,6 @@
 import { constants } from './index';
 type LanguageCode = keyof typeof constants.ALL_LANGUAGES;
-export declare const getInitialLanguage: () => string;
+export declare const getInitialLanguage: () => any;
 export declare const loadIncontextTranslation: (lang: LanguageCode) => void;
 /**
  * Filter out unsupported languages and return an Object containing language code and language name

package/dist/utils/lang-utils.js

@@ -1,14 +1,14 @@
 import "../crc32-LCGpXEbE.js";
-import { L as c, D as s, A as o } from "../constants-D-_KboaS.js";
+import { L as s, D as o, A as c } from "../constants-D-_KboaS.js";
 const l = () => {
-  const a = new URLSearchParams(window.location.search).get("lang"), t = localStorage.getItem(c);
+  const a = new URLSearchParams(window.location.search).get("lang"), t = JSON.parse(localStorage.getItem(s));
   if (a) {
     const e = a.toUpperCase();
-    return localStorage.setItem(c, e), e;
+    return localStorage.setItem(s, JSON.stringify(e)), e;
   }
-  return t || s;
-}, u = (n) => {
-  if (n.toUpperCase() === "ACH") {
+  return t || o;
+}, u = (r) => {
+  if (r.toUpperCase() === "ACH") {
     const t = document.createElement("script");
     t.type = "text/javascript", t.text = `
             var _jipt = []; _jipt.push(['project', 'deriv-app']);
@@ -17,12 +17,12 @@ const l = () => {
             document.head.appendChild(crowdin);
         `, document.head.appendChild(t);
   }
-}, d = (n = []) => {
-  const a = ["ACH", ...n];
-  return Object.keys(o).filter((e) => !a.includes(e)).reduce((e, r) => (e[r] = o[r], e), {});
+}, g = (r = []) => {
+  const a = ["ACH", ...r];
+  return Object.keys(c).filter((e) => !a.includes(e)).reduce((e, n) => (e[n] = c[n], e), {});
 };
 export {
-  d as getAllowedLanguages,
+  g as getAllowedLanguages,
   l as getInitialLanguage,
   u as loadIncontextTranslation
 };

package/dist/utils/localize.d.ts

@@ -1,6 +1,4 @@
 /**
- * @deprecated use the `localize` function from the `useTranslations` hook, this function will not get the update from i18n instance once there is any changes like resource loaded or language changed
- *
  * @param {string} string
  * @param {Record<string, unknown>} values
  * @returns {string}

package/package.json

@@ -10,7 +10,7 @@
     "deriv-extract-translations": "./dist/deriv-extract-translations.cjs"
   },
   "private": false,
-  "version": "1.3.4",
+  "version": "1.3.6",
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build && cp ./src/scripts/deriv-extract-translations.cjs ./dist/deriv-extract-translations.cjs",