fix: renamed your ads are running to hide my ads

binary-com · May 11, 2023 · 582ff90 · 582ff90
1 parent 62bd456
commit 582ff90
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 22 deletions.
diff --git a/packages/p2p/src/components/my-ads/my-ads.scss b/packages/p2p/src/components/my-ads/my-ads.scss
@@ -713,18 +713,11 @@
     .toggle-ads {
         display: flex;
         align-items: center;
-        font-size: var(--text-size-s);
         justify-items: flex-start;
 
         &__message {
             margin-right: 1.6rem;
         }
-        &--on {
-            color: var(--text-profit-success);
-        }
-        &--off {
-            color: var(--text-less-prominent);
-        }
     }
 
     &__expand-button {

diff --git a/packages/p2p/src/components/my-ads/toggle-ads.jsx b/packages/p2p/src/components/my-ads/toggle-ads.jsx
@@ -1,11 +1,10 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { ToggleSwitch } from '@deriv/components';
+import { Text, ToggleSwitch } from '@deriv/components';
 import { useIsMounted } from '@deriv/shared';
-import classNames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { requestWS } from 'Utils/websocket';
-import { localize } from 'Components/i18next';
+import { Localize } from '@deriv/translations';
 import { useStores } from 'Stores';
 import './my-ads.scss';
 
@@ -33,18 +32,15 @@ const ToggleAds = observer(() => {
     };
 
     return (
-        <div
-            className={classNames('toggle-ads', {
-                'toggle-ads--on': general_store.is_listed,
-                'toggle-ads--off': !general_store.is_listed || general_store.is_barred,
-            })}
-        >
-            <div className='toggle-ads__message'>
-                {(my_ads_store.api_error || general_store.is_listed) && !general_store.is_barred
-                    ? localize('Your ads are running')
-                    : localize('Your ads are paused')}
-            </div>
-
+        <div className='toggle-ads'>
+            <Text
+                className='toggle-ads__message'
+                color={`${general_store.is_listed ? 'profit-success' : 'less-prominent'}`}
+                line_height='xl'
+                size='xs'
+            >
+                <Localize i18n_default_text='Hide my ads' />
+            </Text>
             <ToggleSwitch
                 id='toggle-my-ads'
                 is_enabled={general_store.is_listed && !general_store.is_barred}