diff --git a/package-lock.json b/package-lock.json
index 71ad58fb..2f98471f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,7 +10,7 @@
             "dependencies": {
                 "@deriv-com/analytics": "^1.5.3",
                 "@deriv-com/api-hooks": "^1.6.5",
-                "@deriv-com/translations": "^1.2.4",
+                "@deriv-com/translations": "^1.3.9",
                 "@deriv-com/ui": "^1.29.0",
                 "@deriv-com/utils": "latest",
                 "@deriv/deriv-charts": "^2.1.23",
diff --git a/package.json b/package.json
index 8b9afc14..61359c94 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,7 @@
     "dependencies": {
         "@deriv-com/analytics": "^1.5.3",
         "@deriv-com/api-hooks": "^1.6.5",
-        "@deriv-com/translations": "^1.2.4",
+        "@deriv-com/translations": "^1.3.9",
         "@deriv-com/ui": "^1.29.0",
         "@deriv-com/utils": "latest",
         "@deriv/deriv-charts": "^2.1.23",
diff --git a/src/components/bot-stopped.tsx b/src/components/bot-stopped.tsx
index e9682188..a31d285b 100644
--- a/src/components/bot-stopped.tsx
+++ b/src/components/bot-stopped.tsx
@@ -2,8 +2,8 @@ import React from 'react';
 import { observer } from 'mobx-react-lite';
 import Text from '@/components/shared_ui/text';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
 import { LegacyClose1pxIcon } from '@deriv/quill-icons';
+import { Localize, localize } from '@deriv-com/translations';
 import Dialog from './shared_ui/dialog';
 
 const BotStopped = observer(() => {
@@ -24,7 +24,7 @@ const BotStopped = observer(() => {
         >
             <div className='dc-dialog__content__header'>
                 <Text data-testid='data-title' weight='bold' as='p' align='left' size='s' color='prominent'>
-                    {localize("You're back online")}
+                    <Localize i18n_default_text="You're back online" />
                 </Text>
                 <div
                     data-testid='data-close-button'
@@ -40,9 +40,7 @@ const BotStopped = observer(() => {
                 </div>
             </div>
             <Text as='p' align='left' size='xs' color='prominent'>
-                {localize(
-                    'The bot has stopped, but your trade may still be running. You can check it on the Reports page.'
-                )}
+                <Localize i18n_default_text='The bot has stopped, but your trade may still be running. You can check it on the Reports page.' />
             </Text>
         </Dialog>
     );
diff --git a/src/components/contract-result-overlay/contract-result-overlay.tsx b/src/components/contract-result-overlay/contract-result-overlay.tsx
index cf64dc00..dae0915f 100644
--- a/src/components/contract-result-overlay/contract-result-overlay.tsx
+++ b/src/components/contract-result-overlay/contract-result-overlay.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import classNames from 'classnames';
 import Text from '@/components/shared_ui/text';
-import { Localize } from '@/utils/tmp/dummy';
 import { LabelPairedCircleCheckMdRegularIcon, LabelPairedCircleXmarkMdRegularIcon } from '@deriv/quill-icons';
+import { Localize } from '@deriv-com/translations';
 
 type TContractResultOverlayProps = {
     profit: number;
diff --git a/src/components/flyout/flyout-block-group.tsx b/src/components/flyout/flyout-block-group.tsx
index 3de8e390..db02041d 100644
--- a/src/components/flyout/flyout-block-group.tsx
+++ b/src/components/flyout/flyout-block-group.tsx
@@ -1,6 +1,6 @@
 import classNames from 'classnames';
-import { Localize } from '@/utils/tmp/dummy';
 import { LabelPairedPlusLgFillIcon } from '@deriv/quill-icons';
+import { Localize } from '@deriv-com/translations';
 import Button from '../shared_ui/button';
 import Text from '../shared_ui/text';
 import FlyoutBlock from './flyout-block';
diff --git a/src/components/journal/journal-components/format-message.tsx b/src/components/journal/journal-components/format-message.tsx
index 46315b22..bbd47ac3 100644
--- a/src/components/journal/journal-components/format-message.tsx
+++ b/src/components/journal/journal-components/format-message.tsx
@@ -2,7 +2,7 @@ import classnames from 'classnames';
 import { formatMoney, getCurrencyDisplayCode } from '@/components/shared';
 import Text from '@/components/shared_ui/text';
 import { LogTypes } from '@/external/bot-skeleton';
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { Localize, localize } from '@deriv-com/translations';
 import { TFormatMessageProps } from '../journal.types';
 
 const FormatMessage = ({ logType, className, extra }: TFormatMessageProps) => {
diff --git a/src/components/journal/journal-components/journal-tools.tsx b/src/components/journal/journal-components/journal-tools.tsx
index 1c49b760..e2e904c8 100644
--- a/src/components/journal/journal-components/journal-tools.tsx
+++ b/src/components/journal/journal-components/journal-tools.tsx
@@ -2,8 +2,8 @@ import React from 'react';
 import { CSSTransition } from 'react-transition-group';
 import Download from '@/components/download';
 import Text from '@/components/shared_ui/text';
-import { Localize } from '@/utils/tmp/dummy';
 import { LabelPairedBarsFilterCaptionFillIcon } from '@deriv/quill-icons';
+import { Localize } from '@deriv-com/translations';
 import { TJournalToolsProps } from '../journal.types';
 import FilterDialog from './filter-dialog';
 
diff --git a/src/components/layout/footer/Endpoint.tsx b/src/components/layout/footer/Endpoint.tsx
index 380a16dc..24bdb312 100644
--- a/src/components/layout/footer/Endpoint.tsx
+++ b/src/components/layout/footer/Endpoint.tsx
@@ -8,7 +8,7 @@ const Endpoint = () => {
 
     if (serverURL) {
         return (
-            <Text className='app-footer__endpoint' color='red' size='sm'>
+            <Text className='app-footer__endpoint' color='red' size='s'>
                 The server{' '}
                 <Link className='app-footer__endpoint-text' to={ENDPOINT}>
                     endpoint
diff --git a/src/components/layout/header/header.tsx b/src/components/layout/header/header.tsx
index e5ddac63..2e9cc8fe 100644
--- a/src/components/layout/header/header.tsx
+++ b/src/components/layout/header/header.tsx
@@ -1,9 +1,11 @@
 import clsx from 'clsx';
+import Button from '@/components/shared_ui/button';
+import Text from '@/components/shared_ui/text';
 import useActiveAccount from '@/hooks/api/account/useActiveAccount';
 import { StandaloneCircleUserRegularIcon } from '@deriv/quill-icons';
 import { useAuthData } from '@deriv-com/api-hooks';
 import { Localize, useTranslations } from '@deriv-com/translations';
-import { Button, Header, Text, useDevice, Wrapper } from '@deriv-com/ui';
+import { Header, useDevice, Wrapper } from '@deriv-com/ui';
 import { Tooltip } from '@deriv-com/ui';
 import { URLUtils } from '@deriv-com/utils';
 import { AppLogo } from '../app-logo';
@@ -47,10 +49,10 @@ const AppHeader = () => {
                         onClick={() => {
                             window.location.assign('https://app.deriv.com/cashier/deposit');
                         }}
-                        size='md'
+                        size='s'
                         className='deposit-button'
                     >
-                        <Text size='sm' weight='bold'>
+                        <Text size='s' weight='bold'>
                             {localize('Deposit')}
                         </Text>
                     </Button>
diff --git a/src/components/load-modal/load-modal.tsx b/src/components/load-modal/load-modal.tsx
index ef0c31f5..7afeaa22 100644
--- a/src/components/load-modal/load-modal.tsx
+++ b/src/components/load-modal/load-modal.tsx
@@ -1,7 +1,7 @@
 import { observer } from 'mobx-react-lite';
 import { tabs_title } from '@/constants/load-modal';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import GoogleDrive from '../../pages/dashboard/load-bot-preview/google-drive';
 import MobileFullPageModal from '../shared_ui/mobile-full-page-modal';
diff --git a/src/components/load-modal/local-footer.tsx b/src/components/load-modal/local-footer.tsx
index 12810c96..b018875a 100644
--- a/src/components/load-modal/local-footer.tsx
+++ b/src/components/load-modal/local-footer.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { observer } from 'mobx-react-lite';
 import { NOTIFICATION_TYPE } from '@/components/bot-notification/bot-notification-utils';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import Button from '../shared_ui/button';
 
diff --git a/src/components/load-modal/recent-footer.tsx b/src/components/load-modal/recent-footer.tsx
index 1e17304b..9b4d30a7 100644
--- a/src/components/load-modal/recent-footer.tsx
+++ b/src/components/load-modal/recent-footer.tsx
@@ -1,7 +1,7 @@
 import { observer } from 'mobx-react-lite';
 import { NOTIFICATION_TYPE } from '@/components/bot-notification/bot-notification-utils';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 import Button from '../shared_ui/button';
 
 const RecentFooter = observer(() => {
diff --git a/src/components/route-prompt-dialog/route-prompt-dialog.tsx b/src/components/route-prompt-dialog/route-prompt-dialog.tsx
index e77e5728..0ab90267 100644
--- a/src/components/route-prompt-dialog/route-prompt-dialog.tsx
+++ b/src/components/route-prompt-dialog/route-prompt-dialog.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { observer } from 'mobx-react-lite';
 import { useStore } from '@/hooks/useStore';
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { Localize, localize } from '@deriv-com/translations';
 import Dialog from '../shared_ui/dialog';
 
 const RoutePromptDialog = observer(() => {
diff --git a/src/components/shared/utils/constants/poi-failure-codes.tsx b/src/components/shared/utils/constants/poi-failure-codes.tsx
index b7c22b84..42075001 100644
--- a/src/components/shared/utils/constants/poi-failure-codes.tsx
+++ b/src/components/shared/utils/constants/poi-failure-codes.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 
 type TIDVErrorStatus = Readonly<{
     [key: string]: {
diff --git a/src/components/shared/utils/contract/contract.tsx b/src/components/shared/utils/contract/contract.tsx
index 93fb8b4b..ba7e3cdf 100644
--- a/src/components/shared/utils/contract/contract.tsx
+++ b/src/components/shared/utils/contract/contract.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import moment from 'moment';
-import { Localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 import { unique } from '../object';
 import { isForwardStarting } from '../shortcode';
 import { capitalizeFirstLetter } from '../string/string_util';
diff --git a/src/components/shared/utils/helpers/chart-notifications.tsx b/src/components/shared/utils/helpers/chart-notifications.tsx
index a8182c91..734bcbb6 100644
--- a/src/components/shared/utils/helpers/chart-notifications.tsx
+++ b/src/components/shared/utils/helpers/chart-notifications.tsx
@@ -1,8 +1,8 @@
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 
 export const switch_to_tick_chart = {
     key: 'switch_to_tick_chart',
-    header: localize('This chart display is not ideal for tick contracts'),
+    header: <Localize i18n_default_text='This chart display is not ideal for tick contracts' />,
     message: <Localize i18n_default_text='Please change the chart duration to tick for a better trading experience.' />,
     type: 'info',
 };
diff --git a/src/components/shared/utils/helpers/portfolio-notifications.tsx b/src/components/shared/utils/helpers/portfolio-notifications.tsx
index ecbf5263..3aaec550 100644
--- a/src/components/shared/utils/helpers/portfolio-notifications.tsx
+++ b/src/components/shared/utils/helpers/portfolio-notifications.tsx
@@ -1,5 +1,6 @@
 import Money from '@/components/shared_ui/money';
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 
 export const contractSold = (currency: string, sold_for: number | string, Money: React.ElementType) => ({
     key: 'contract_sold',
diff --git a/src/components/shared_ui/contract-card/contract-card-items/contract-card-footer.tsx b/src/components/shared_ui/contract-card/contract-card-items/contract-card-footer.tsx
index 60b5062c..888df785 100644
--- a/src/components/shared_ui/contract-card/contract-card-items/contract-card-footer.tsx
+++ b/src/components/shared_ui/contract-card/contract-card-items/contract-card-footer.tsx
@@ -3,7 +3,7 @@ import classNames from 'classnames';
 import { CSSTransition } from 'react-transition-group';
 import { hasContractEntered, isOpen, isValidToCancel, isValidToSell, useNewRowTransition } from '@/components/shared';
 import { TContractInfo } from '@/components/shared/src/utils/contract/contract-types';
-import { Localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 import Text from '../../text';
 import { TGetCardLables } from '../../types';
 import ContractCardSell from './contract-card-sell';
diff --git a/src/components/shared_ui/contract-card/contract-card-items/contract-update-form.tsx b/src/components/shared_ui/contract-card/contract-card-items/contract-update-form.tsx
index a11cb4b7..5c79dc7f 100644
--- a/src/components/shared_ui/contract-card/contract-card-items/contract-update-form.tsx
+++ b/src/components/shared_ui/contract-card/contract-card-items/contract-update-form.tsx
@@ -10,7 +10,7 @@ import {
     pick,
 } from '@/components/shared';
 import { TContractInfo, TContractStore } from '@/components/shared/utils/contract/contract-types';
-import { Localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 import ArrowIndicator from '../../arrow-indicator';
 import Button from '../../button';
 import InputWithCheckbox from '../../input-wth-checkbox';
diff --git a/src/components/shared_ui/contract-card/contract-card-items/lookbacks-card-body.tsx b/src/components/shared_ui/contract-card/contract-card-items/lookbacks-card-body.tsx
index 0858d66e..1512c240 100644
--- a/src/components/shared_ui/contract-card/contract-card-items/lookbacks-card-body.tsx
+++ b/src/components/shared_ui/contract-card/contract-card-items/lookbacks-card-body.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { CONTRACT_TYPES, getCardLabels, getDisplayStatus, isCryptocurrency } from '@/components/shared';
-import { Localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 import ArrowIndicator from '../../arrow-indicator';
 import MobileWrapper from '../../mobile-wrapper';
 import Money from '../../money';
diff --git a/src/components/trade-animation/contract-stage-text.tsx b/src/components/trade-animation/contract-stage-text.tsx
index 26fee97a..8324dedd 100644
--- a/src/components/trade-animation/contract-stage-text.tsx
+++ b/src/components/trade-animation/contract-stage-text.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { contract_stages } from '@/constants/contract-stage';
-import { Localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 
 type TContractStageText = {
     contract_stage: number;
diff --git a/src/components/trading-view-chart/trading-view-modal.tsx b/src/components/trading-view-chart/trading-view-modal.tsx
index 61cf2f59..ff1eb794 100644
--- a/src/components/trading-view-chart/trading-view-modal.tsx
+++ b/src/components/trading-view-chart/trading-view-modal.tsx
@@ -3,7 +3,7 @@ import { observer } from 'mobx-react-lite';
 import DraggableResizeWrapper from '@/components/draggable/draggable-resize-wrapper';
 import TradingViewComponent from '@/components/trading-view-chart/trading-view';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 
 const TradingViewModal = observer(() => {
     const { dashboard } = useStore();
diff --git a/src/pages/bot-builder/toolbar/workspace-group.tsx b/src/pages/bot-builder/toolbar/workspace-group.tsx
index 5ebdcf83..dd0af9c2 100644
--- a/src/pages/bot-builder/toolbar/workspace-group.tsx
+++ b/src/pages/bot-builder/toolbar/workspace-group.tsx
@@ -1,7 +1,6 @@
 import classNames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
 import {
     LabelPairedArrowRotateLeftMdRegularIcon,
     LabelPairedArrowRotateRightMdRegularIcon,
@@ -14,6 +13,7 @@ import {
     LabelPairedMagnifyingGlassPlusMdRegularIcon,
     LabelPairedObjectsAlignLeftMdRegularIcon,
 } from '@deriv/quill-icons';
+import { localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import ToolbarIcon from './toolbar-icon';
 
diff --git a/src/pages/chart/chart-modal/chart-modal-desktop.tsx b/src/pages/chart/chart-modal/chart-modal-desktop.tsx
index 50dfdf47..acd0bd2a 100644
--- a/src/pages/chart/chart-modal/chart-modal-desktop.tsx
+++ b/src/pages/chart/chart-modal/chart-modal-desktop.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { observer } from 'mobx-react-lite';
 import DraggableResizeWrapper from '@/components/draggable/draggable-resize-wrapper';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 import Chart from '..';
 
 const ChartModalDesktop = observer(() => {
diff --git a/src/pages/dashboard/cards.tsx b/src/pages/dashboard/cards.tsx
index e73506cb..03a56dd6 100644
--- a/src/pages/dashboard/cards.tsx
+++ b/src/pages/dashboard/cards.tsx
@@ -7,7 +7,6 @@ import MobileFullPageModal from '@/components/shared_ui/mobile-full-page-modal';
 import Text from '@/components/shared_ui/text';
 import { DBOT_TABS } from '@/constants/bot-contents';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
 import {
     DerivLightBotBuilderIcon,
     DerivLightGoogleDriveIcon,
@@ -15,7 +14,7 @@ import {
     DerivLightMyComputerIcon,
     DerivLightQuickStrategyIcon,
 } from '@deriv/quill-icons';
-import { Localize } from '@deriv-com/translations';
+import { Localize, localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import DashboardBotList from './load-bot-preview/dashboard-bot-list';
 import GoogleDrive from './load-bot-preview/google-drive';
diff --git a/src/pages/dashboard/load-bot-preview/dashboard-bot-list.tsx b/src/pages/dashboard/load-bot-preview/dashboard-bot-list.tsx
index 1565cdea..fd192a93 100644
--- a/src/pages/dashboard/load-bot-preview/dashboard-bot-list.tsx
+++ b/src/pages/dashboard/load-bot-preview/dashboard-bot-list.tsx
@@ -3,28 +3,28 @@ import { observer } from 'mobx-react-lite';
 import Text from '@/components/shared_ui/text';
 import { getSavedWorkspaces } from '@/external/bot-skeleton';
 import { useStore } from '@/hooks/useStore';
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import DeleteDialog from './delete-dialog';
 import RecentWorkspace from './recent-workspace';
 import './index.scss';
 
 type THeader = {
-    label: string;
+    label: React.ReactElement;
     className: string;
 };
 
 const HEADERS: THeader[] = [
     {
-        label: localize('Bot name'),
+        label: <Localize i18n_default_text='Bot name' />,
         className: 'bot-list__header__label',
     },
     {
-        label: localize('Last modified'),
+        label: <Localize i18n_default_text='Last modified' />,
         className: 'bot-list__header__time-stamp',
     },
     {
-        label: localize('Status'),
+        label: <Localize i18n_default_text='Status' />,
         className: 'bot-list__header__load-type',
     },
 ];
diff --git a/src/pages/dashboard/load-bot-preview/icon-radio.tsx b/src/pages/dashboard/load-bot-preview/icon-radio.tsx
index 651a8996..099f30c5 100644
--- a/src/pages/dashboard/load-bot-preview/icon-radio.tsx
+++ b/src/pages/dashboard/load-bot-preview/icon-radio.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import classNames from 'classnames';
 import Text from '@/components/shared_ui/text';
-import { localize } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 
 type TIconRadio = {
     google_drive_connected?: boolean;
diff --git a/src/pages/dashboard/load-bot-preview/local-footer.tsx b/src/pages/dashboard/load-bot-preview/local-footer.tsx
index aabb9675..6d0dd3d2 100644
--- a/src/pages/dashboard/load-bot-preview/local-footer.tsx
+++ b/src/pages/dashboard/load-bot-preview/local-footer.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { observer } from 'mobx-react-lite';
 import Button from '@/components/shared_ui/button';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import './index.scss';
 
diff --git a/src/pages/dashboard/load-bot-preview/local.tsx b/src/pages/dashboard/load-bot-preview/local.tsx
index c7842d54..5a966bb1 100644
--- a/src/pages/dashboard/load-bot-preview/local.tsx
+++ b/src/pages/dashboard/load-bot-preview/local.tsx
@@ -4,7 +4,7 @@ import { observer } from 'mobx-react-lite';
 import Dialog from '@/components/shared_ui/dialog';
 import { DBOT_TABS } from '@/constants/bot-contents';
 import { useStore } from '@/hooks/useStore';
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { Localize, localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import BotPreview from './bot-preview';
 import './index.scss';
diff --git a/src/pages/dashboard/load-bot-preview/save-modal.tsx b/src/pages/dashboard/load-bot-preview/save-modal.tsx
index 05ab97c7..33a47ece 100644
--- a/src/pages/dashboard/load-bot-preview/save-modal.tsx
+++ b/src/pages/dashboard/load-bot-preview/save-modal.tsx
@@ -11,8 +11,8 @@ import Text from '@/components/shared_ui/text';
 import ThemedScrollbars from '@/components/shared_ui/themed-scrollbars';
 import { config, save_types } from '@/external/bot-skeleton';
 import { useStore } from '@/hooks/useStore';
-import { localize } from '@/utils/tmp/dummy';
 import { DerivLightGoogleDriveIcon, DerivLightLocalDeviceIcon, DerivLightMyComputerIcon } from '@deriv/quill-icons';
+import { localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import IconRadio from './icon-radio';
 
diff --git a/src/pages/dashboard/stop-bot-modal-content.tsx b/src/pages/dashboard/stop-bot-modal-content.tsx
index a22fa0ed..1c59fb46 100644
--- a/src/pages/dashboard/stop-bot-modal-content.tsx
+++ b/src/pages/dashboard/stop-bot-modal-content.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import Dialog from '@/components/shared_ui/dialog';
 import Text from '@/components/shared_ui/text';
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { Localize, localize } from '@deriv-com/translations';
 
 export type TStopBotModalContent = {
     is_running: boolean;
@@ -50,7 +50,7 @@ const StopBotModalContent = ({
                             <Text weight='bold' as='span' lineHeight='s' size='xs'>
                                 <Localize i18n_default_text='Reports' />
                             </Text>
-                            <Localize i18n_default_text='page.' />
+                            <Localize i18n_default_text=' page.' />
                         </Text>
                         <Text as='p' lineHeight='s' size='xs'>
                             <Localize i18n_default_text='The Quick Strategy you just created will be loaded to the workspace.' />
@@ -67,7 +67,7 @@ const StopBotModalContent = ({
                                 <Localize i18n_default_text='Reports' />
                             </Text>
                             <Text as='span' lineHeight='s' size='xs' styles={{ paddingInlineStart: '0.4rem' }}>
-                                <Localize i18n_default_text='page.' />
+                                <Localize i18n_default_text=' page.' />
                             </Text>
                         </Text>
                     </>
diff --git a/src/pages/main/main.tsx b/src/pages/main/main.tsx
index f6f4925b..32eec92c 100644
--- a/src/pages/main/main.tsx
+++ b/src/pages/main/main.tsx
@@ -12,13 +12,13 @@ import dbot from '@/external/bot-skeleton/scratch/dbot';
 import { api_base } from '@/external/bot-skeleton/services/api/api-base';
 import { isDbotRTL } from '@/external/bot-skeleton/utils/workspace';
 import { useStore } from '@/hooks/useStore';
-import { Localize, localize } from '@/utils/tmp/dummy';
 import {
     LabelPairedChartLineCaptionRegularIcon,
     LabelPairedObjectsColumnCaptionRegularIcon,
     LabelPairedPuzzlePieceTwoCaptionBoldIcon,
     LegacyGuide1pxIcon,
 } from '@deriv/quill-icons';
+import { Localize, localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 import RunPanel from '../../components/run-panel';
 import Chart from '../chart';
diff --git a/src/pages/tutorials/dbot-tours/common/tour-end-dialog.tsx b/src/pages/tutorials/dbot-tours/common/tour-end-dialog.tsx
index 82fc96d9..af263522 100644
--- a/src/pages/tutorials/dbot-tours/common/tour-end-dialog.tsx
+++ b/src/pages/tutorials/dbot-tours/common/tour-end-dialog.tsx
@@ -2,7 +2,7 @@ import { observer } from 'mobx-react-lite';
 import Dialog from '@/components/shared_ui/dialog';
 import Text from '@/components/shared_ui/text';
 import { useStore } from '@/hooks/useStore';
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { Localize, localize } from '@deriv-com/translations';
 import { useDevice } from '@deriv-com/ui';
 
 const TourEndDialog = observer(() => {
@@ -55,7 +55,7 @@ const TourEndDialog = observer(() => {
             >
                 <div className='dc-dialog__content__header'>
                     <Text weight='bold' color='prominent' size={isDesktop ? 's' : 'xs'}>
-                        {localize('Congratulations')}
+                        <Localize i18n_default_text='Congratulations' />
                     </Text>
                 </div>
                 <div className='dc-dialog__content__description'>
diff --git a/src/pages/tutorials/dbot-tours/common/tour-steps.tsx b/src/pages/tutorials/dbot-tours/common/tour-steps.tsx
index 31ec4eaf..6fc363be 100644
--- a/src/pages/tutorials/dbot-tours/common/tour-steps.tsx
+++ b/src/pages/tutorials/dbot-tours/common/tour-steps.tsx
@@ -4,9 +4,9 @@ import Text from '@/components/shared_ui/text';
 import { getUUID } from '@/external/bot-skeleton/services/tradeEngine/utils/helpers';
 
 type TTourSteps = {
-    content: string[] | React.ReactElement[];
+    content: React.ReactElement[];
     media?: string;
-    label: string | boolean;
+    label: React.ReactElement;
     step_index: number;
     show_actions?: boolean;
     has_localize_component?: boolean;
diff --git a/src/pages/tutorials/dbot-tours/tour-content.tsx b/src/pages/tutorials/dbot-tours/tour-content.tsx
index 282d6747..addcbd0f 100644
--- a/src/pages/tutorials/dbot-tours/tour-content.tsx
+++ b/src/pages/tutorials/dbot-tours/tour-content.tsx
@@ -2,7 +2,6 @@ import { getImageLocation } from '../../../public-path';
 import React from 'react';
 import Text from '@/components/shared_ui/text';
 import { isDbotRTL } from '@/external/bot-skeleton/utils/workspace';
-import { localize } from '@/utils/tmp/dummy';
 import { LabelPairedCircleCheckCaptionRegularIcon } from '@deriv/quill-icons';
 import { Localize } from '@deriv-com/translations';
 import TourSteps from './common/tour-steps';
@@ -27,14 +26,14 @@ export const DBOT_ONBOARDING = [
         target: '#id-bot-builder',
         content: (
             <TourSteps
-                label={localize('Build from scratch')}
+                label={<Localize i18n_default_text='Get started on Deriv Bot' />}
                 content={[
-                    localize(
-                        'Create your bot using our drag-and-drop blocks or click Quick Strategy to choose from the ready-to-use bot templates.'
-                    ),
-                    localize(
-                        'We also provide a guide on the Tutorial tab to show you how you can build and execute a simple strategy.'
-                    ),
+                    <>
+                        <Localize i18n_default_text='Create your bot using our drag-and-drop blocks or click Quick Strategy to choose from the ready-to-use bot templates.' />
+                    </>,
+                    <>
+                        <Localize i18n_default_text='We also provide a guide on the Tutorial tab to show you how you can build and execute a simple strategy.' />
+                    </>,
                 ]}
                 media={'/assets/videos/dbot-onboarding-tour-step-1.mp4'}
                 step_index={1}
@@ -47,8 +46,13 @@ export const DBOT_ONBOARDING = [
         target: '#id-charts',
         content: (
             <TourSteps
-                label={localize('Monitor the market')}
-                content={[localize('View the market price of your favourite assets.')]}
+                label={<Localize i18n_default_text='Monitor the market' />}
+                content={[
+                    <Localize
+                        key='view the market'
+                        i18n_default_text='View the market price of your favourite assets.'
+                    />,
+                ]}
                 media={'/assets/videos/dbot-onboarding-tour-step-2.mp4'}
                 step_index={2}
             />
@@ -60,8 +64,13 @@ export const DBOT_ONBOARDING = [
         target: '#id-tutorials',
         content: (
             <TourSteps
-                label={localize('Learn more with our tutorials')}
-                content={[localize('Explore the video guides and FAQs to build your bot in the tutorials tab.')]}
+                label={<Localize i18n_default_text='Learn more with our tutorials' />}
+                content={[
+                    <Localize
+                        key='explore tutorials'
+                        i18n_default_text='Explore the video guides and FAQs to build your bot in the tutorials tab.'
+                    />,
+                ]}
                 media={'/assets/videos/dbot-onboarding-tour-step-3.mp4'}
                 step_index={3}
             />
@@ -73,8 +82,13 @@ export const DBOT_ONBOARDING = [
         target: '#tab__dashboard__table__tiles',
         content: (
             <TourSteps
-                label={localize('Use these shortcuts')}
-                content={[localize('You can also import or build your bot using any of these shortcuts.')]}
+                label={<Localize i18n_default_text='Use these shortcuts' />}
+                content={[
+                    <Localize
+                        key='use shortcuts'
+                        i18n_default_text='You can also import or build your bot using any of these shortcuts.'
+                    />,
+                ]}
                 step_index={4}
             />
         ),
@@ -86,8 +100,13 @@ export const DBOT_ONBOARDING = [
         target: '.dc-drawer__container',
         content: (
             <TourSteps
-                label={localize('Check your bot’s performance')}
-                content={[localize('See how your bot is doing in real-time.')]}
+                label={<Localize i18n_default_text='Check your bot’s performance' />}
+                content={[
+                    <Localize
+                        key='check bot performance'
+                        i18n_default_text='See how your bot is doing in real-time.'
+                    />,
+                ]}
                 media={'/assets/videos/dbot-onboarding-tour-step-5.mp4'}
                 step_index={5}
             />
@@ -100,7 +119,7 @@ export const DBOT_ONBOARDING = [
         target: '.animation__wrapper',
         content: (
             <TourSteps
-                label={localize('Run your bot')}
+                label={<Localize i18n_default_text='Run your bot' />}
                 content={[
                     <Localize
                         key='run your bot'
@@ -119,7 +138,7 @@ export const DBOT_ONBOARDING = [
         target: '#id-tutorials',
         content: (
             <TourSteps
-                label={localize('Want to retake the tour?')}
+                label={<Localize i18n_default_text='Want to retake the tour?' />}
                 content={[
                     <Text key={`${0}-id-tutorials`} as='p'>
                         <Localize i18n_default_text={`Head to the Tutorials tab to do so.`} />
@@ -130,7 +149,7 @@ export const DBOT_ONBOARDING = [
                 has_localize_component
             />
         ),
-        locale: { last: localize('Got it, thanks!') },
+        locale: { last: <Localize i18n_default_text='Got it, thanks!' /> },
         ...joyride_props,
         hideBackButton: true,
         disableOverlay: false,
@@ -413,13 +432,13 @@ export const BOT_BUILDER_TOUR = [
     {
         target: '.animation__wrapper',
         content: <Step6 show_label />,
-        locale: { last: localize('Next') },
+        locale: { last: <Localize i18n_default_text='Next' /> },
         ...joyride_props,
     },
 ];
 
 export type TMobileTourConfig = {
-    header: string;
+    header: React.ReactElement;
     content: Array<React.ReactElement>;
     tour_step_key: number;
     img?: string;
@@ -428,12 +447,12 @@ export type TMobileTourConfig = {
 
 export const BOT_BUILDER_MOBILE: TMobileTourConfig[] = [
     {
-        header: localize('Step 1'),
+        header: <Localize i18n_default_text='Step 1' />,
         content: [<Localize key='step-1' i18n_default_text={`First, click the Import icon on the tool bar.`} />],
         tour_step_key: 1,
     },
     {
-        header: localize('Step 2'),
+        header: <Localize i18n_default_text='Step 2' />,
         content: [
             <Localize
                 key='step-2'
@@ -443,7 +462,7 @@ export const BOT_BUILDER_MOBILE: TMobileTourConfig[] = [
         tour_step_key: 2,
     },
     {
-        header: localize('Step 3'),
+        header: <Localize i18n_default_text='Step 3' />,
         content: [
             <Localize
                 key='step-3'
@@ -456,7 +475,7 @@ export const BOT_BUILDER_MOBILE: TMobileTourConfig[] = [
 
 export const DBOT_ONBOARDING_MOBILE: TMobileTourConfig[] = [
     {
-        header: localize('Get started on Deriv Bot'),
+        header: <Localize i18n_default_text='Get started on Deriv Bot' />,
         content: [
             <Localize
                 key='get-started-on-deriv-bot'
@@ -467,7 +486,7 @@ export const DBOT_ONBOARDING_MOBILE: TMobileTourConfig[] = [
         tour_step_key: 1,
     },
     {
-        header: localize('Import or choose your bot'),
+        header: <Localize i18n_default_text='Import or choose your bot' />,
         content: [
             <Localize
                 key='import-or-choose-your-bot'
@@ -478,7 +497,7 @@ export const DBOT_ONBOARDING_MOBILE: TMobileTourConfig[] = [
         tour_step_key: 2,
     },
     {
-        header: localize('Monitor the market'),
+        header: <Localize i18n_default_text='Monitor the market' />,
         content: [
             <Localize key='monitor-the-market' i18n_default_text='View the market price of your favourite assets.' />,
         ],
@@ -486,7 +505,7 @@ export const DBOT_ONBOARDING_MOBILE: TMobileTourConfig[] = [
         tour_step_key: 3,
     },
     {
-        header: localize('Learn more with our tutorials'),
+        header: <Localize i18n_default_text='Learn more with our tutorials' />,
         content: [
             <Localize
                 key='learn-more-with-our-tutorials'
@@ -497,7 +516,7 @@ export const DBOT_ONBOARDING_MOBILE: TMobileTourConfig[] = [
         tour_step_key: 4,
     },
     {
-        header: localize('Use these shortcuts'),
+        header: <Localize i18n_default_text='Use these shortcuts' />,
         img: getImageLocation('dbot-mobile-onboarding-step-4.png'),
         content: [
             <Localize
@@ -508,7 +527,7 @@ export const DBOT_ONBOARDING_MOBILE: TMobileTourConfig[] = [
         tour_step_key: 5,
     },
     {
-        header: localize('Check your bot’s performance'),
+        header: <Localize i18n_default_text='Check your bot’s performance' />,
         media: '/assets/videos/dbot-mobile-onboarding-step-5.mp4',
         content: [
             <Localize key='check-your-bots-performance' i18n_default_text='See how your bot is doing in real-time.' />,
@@ -516,7 +535,7 @@ export const DBOT_ONBOARDING_MOBILE: TMobileTourConfig[] = [
         tour_step_key: 6,
     },
     {
-        header: localize('Run your bot'),
+        header: <Localize i18n_default_text='Run your bot' />,
         media: '/assets/videos/dbot-mobile-onboarding-step-6.mp4',
         content: [
             <Localize
@@ -528,7 +547,7 @@ export const DBOT_ONBOARDING_MOBILE: TMobileTourConfig[] = [
         tour_step_key: 7,
     },
     {
-        header: localize('Want to retake the tour?'),
+        header: <Localize i18n_default_text='Want to retake the tour?' />,
         img: getImageLocation('dbot-mobile-onboarding-step-7.png'),
         content: [<Localize key='want-to-retake-the-tour' i18n_default_text='Head to the Tutorials tab to do so.' />],
         tour_step_key: 8,
diff --git a/src/stores/app-store.ts b/src/stores/app-store.ts
index fa6c4e71..181ba26e 100644
--- a/src/stores/app-store.ts
+++ b/src/stores/app-store.ts
@@ -1,14 +1,9 @@
 import { action, makeObservable, reaction, when } from 'mobx';
 import { TApiHelpersStore, TDbotStore } from 'src/types/stores.types';
 import { ApiHelpers, DBot, runIrreversibleEvents } from '@/external/bot-skeleton';
-import {
-    ContentFlag,
-    isEuResidenceWithOnlyVRTC,
-    localize,
-    routes,
-    showDigitalOptionsUnavailableError,
-} from '@/utils/tmp/dummy';
+import { ContentFlag, isEuResidenceWithOnlyVRTC, routes, showDigitalOptionsUnavailableError } from '@/utils/tmp/dummy';
 import { TStores } from '@deriv/stores/types';
+import { localize } from '@deriv-com/translations';
 import RootStore from './root-store';
 
 export default class AppStore {
diff --git a/src/stores/google-drive-store.ts b/src/stores/google-drive-store.ts
index 472ba801..76f6a258 100644
--- a/src/stores/google-drive-store.ts
+++ b/src/stores/google-drive-store.ts
@@ -2,7 +2,8 @@ import { action, makeObservable, observable } from 'mobx';
 import { NOTIFICATION_TYPE } from '@/components/bot-notification/bot-notification-utils';
 import { button_status } from '@/constants/button-status';
 import { config, importExternal } from '@/external/bot-skeleton';
-import { getLanguage, localize } from '@/utils/tmp/dummy';
+import { getLanguage } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 import RootStore from './root-store';
 
 export type TErrorWithStatus = Error & { status?: number };
diff --git a/src/stores/journal-store.ts b/src/stores/journal-store.ts
index b26bd4ba..b4a4d1e6 100644
--- a/src/stores/journal-store.ts
+++ b/src/stores/journal-store.ts
@@ -3,8 +3,8 @@ import { v4 as uuidv4 } from 'uuid';
 import { formatDate } from '@/components/shared';
 import { LogTypes, MessageTypes } from '@/external/bot-skeleton';
 import { config } from '@/external/bot-skeleton/constants/config';
-import { localize } from '@/utils/tmp/dummy';
 import { TStores } from '@deriv/stores/types';
+import { localize } from '@deriv-com/translations';
 import { isCustomJournalMessage } from '../utils/journal-notifications';
 import { getStoredItemsByKey, getStoredItemsByUser, setStoredItemsByKey } from '../utils/session-storage';
 import { getSetting, storeSetting } from '../utils/settings';
diff --git a/src/stores/load-modal-store.ts b/src/stores/load-modal-store.ts
index 8cfa122a..5b513da2 100644
--- a/src/stores/load-modal-store.ts
+++ b/src/stores/load-modal-store.ts
@@ -10,8 +10,8 @@ import {
     setColors,
 } from '@/external/bot-skeleton';
 import { isDbotRTL } from '@/external/bot-skeleton/utils/workspace';
-import { localize } from '@/utils/tmp/dummy';
 import { TStores } from '@deriv/stores/types';
+import { localize } from '@deriv-com/translations';
 import { TStrategy } from 'Types';
 import RootStore from './root-store';
 
diff --git a/src/stores/run-panel-store.ts b/src/stores/run-panel-store.ts
index 25fd21fa..96459dcf 100644
--- a/src/stores/run-panel-store.ts
+++ b/src/stores/run-panel-store.ts
@@ -8,9 +8,10 @@ import { ErrorTypes, MessageTypes, observer, unrecoverable_errors } from '@/exte
 import { journalError, switch_account_notification } from '@/utils/bot-notifications';
 import GTM from '@/utils/gtm';
 import { helpers } from '@/utils/store-helpers';
-import { localize, routes } from '@/utils/tmp/dummy';
+import { routes } from '@/utils/tmp/dummy';
 import { Buy, ProposalOpenContract } from '@deriv/api-types';
 import { TStores } from '@deriv/stores/types';
+import { localize } from '@deriv-com/translations';
 import { TDbot } from 'Types';
 import RootStore from './root-store';
 
diff --git a/src/stores/save-modal-store.ts b/src/stores/save-modal-store.ts
index bac86e8b..2ec54d47 100644
--- a/src/stores/save-modal-store.ts
+++ b/src/stores/save-modal-store.ts
@@ -10,7 +10,7 @@ import {
     save_types,
     saveWorkspaceToRecent,
 } from '@/external/bot-skeleton';
-import { localize } from '@/utils/tmp/dummy';
+import { localize } from '@deriv-com/translations';
 import { TStrategy } from 'Types';
 import RootStore from './root-store';
 
diff --git a/src/stores/toolbox-store.ts b/src/stores/toolbox-store.ts
index 9d067c11..72a51a6c 100644
--- a/src/stores/toolbox-store.ts
+++ b/src/stores/toolbox-store.ts
@@ -1,7 +1,7 @@
 import { action, makeObservable, observable, reaction } from 'mobx';
 import { scrollWorkspace } from '@/external/bot-skeleton';
-import { localize } from '@/utils/tmp/dummy';
 import { TStores } from '@deriv/stores/types';
+import { localize } from '@deriv-com/translations';
 import RootStore from './root-store';
 
 export default class ToolboxStore {
diff --git a/src/utils/help-content/help-strings/trade_definition_multiplier.tsx b/src/utils/help-content/help-strings/trade_definition_multiplier.tsx
index e6c04491..08dca2d8 100644
--- a/src/utils/help-content/help-strings/trade_definition_multiplier.tsx
+++ b/src/utils/help-content/help-strings/trade_definition_multiplier.tsx
@@ -1,5 +1,6 @@
 import StaticUrl from '@/components/shared_ui/static-url';
-import { Localize, localize } from '@/utils/tmp/dummy';
+import { localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 
 export default {
     text: [
diff --git a/src/utils/store-helpers.tsx b/src/utils/store-helpers.tsx
index dd5cf69a..71a47ba3 100644
--- a/src/utils/store-helpers.tsx
+++ b/src/utils/store-helpers.tsx
@@ -1,4 +1,4 @@
-import { Localize } from '@/utils/tmp/dummy';
+import { Localize } from '@deriv-com/translations';
 
 export const helpers = {
     keep_current_contract: (