Merge pull request #50 from muhdlubega/lubega/readd-localize-util-fun…

…ction

Lubega: Remove localize deprecated tag

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

src/playground/Playground.tsx

@@ -87,7 +87,7 @@ export default function Playground({
 
           <div className="translations-playground-card translations-playground-bg-skyblue">
             <h1>
-              Deprecated <code>localize</code> function
+              <code>localize</code> function
             </h1>
             <div>{localize("Reports")}</div>
           </div>

src/utils/localize.ts

@@ -2,8 +2,6 @@ import { str as crc32 } from "crc-32";
 import i18next from "i18next";
 
 /**
- * @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}