Revert "yashim/chore: remove all whatsapp (#571)"

This reverts commit 1cf02d5.
deriv-com · Nov 6, 2023 · bcbb619 · bcbb619
1 parent 1cf02d5
commit bcbb619
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 1 deletion.
diff --git a/src/javascript/app/base/header.js b/src/javascript/app/base/header.js
@@ -146,6 +146,10 @@ const Header = (() => {
             el.src = Url.urlForStatic(`${header_icon_base_path}ic-reports.svg`);
         });
 
+        applyToAllElements('.whatsapp-icon', (el) => {
+            el.src = Url.urlForStatic(`${header_icon_base_path}ic-whatsapp.svg`);
+        });
+
         applyToAllElements('.livechat-icon', (el) => {
             el.src = Url.urlForStatic(`${header_icon_base_path}ic-livechat.svg`);
         });
@@ -461,6 +465,10 @@ const Header = (() => {
             }
         });
 
+        // whatsapp mobile menu
+        const whatsapp_mobile_drawer = getElementById('whatsapp-mobile-drawer');
+        whatsapp_mobile_drawer.addEventListener('click', () => window.open('https://wa.me/35699578341', '_blank'));
+
         // Livechat Logo
         const livechat_img = getElementById('livechat__logo');
         livechat_img.src = Url.urlForStatic('images/common/livechat.svg');
@@ -512,6 +520,10 @@ const Header = (() => {
         const topbar_help_center = getElementById('topbar-help-centre');
         topbar_help_center.addEventListener('click', () => window.location = `https://www.deriv.${getTopLevelDomain()}/help-centre/`);
 
+        // WhatsApp.
+        const topbar_whatsapp = getElementById('topbar-whatsapp');
+        topbar_whatsapp.addEventListener('click', () => window.open('https://wa.me/35699578341', '_blank'));
+
         // Topbar fullscreen events.
         const topbar_fullscreen = getElementById('topbar-fullscreen');
         topbar_fullscreen.addEventListener('click', toggleFullscreen);

diff --git a/src/sass/_common/header.scss b/src/sass/_common/header.scss
@@ -152,7 +152,7 @@ body .topbar {
     }
 }
 
-#livechat {
+#livechat, #topbar-whatsapp {
     cursor: pointer;
     height: inherit;
 

diff --git a/src/templates/_common/_layout/header.jsx b/src/templates/_common/_layout/header.jsx
@@ -39,6 +39,10 @@ const MobileMenu = () => (
                         <div className='mobile__platform-switcher-text'>{it.L('Reports')}</div>
                         <img id='mobile__platform-switcher-icon-arrowright' className='mobile__platform-switcher-icon-right' />
                     </div>
+                    <div  id='whatsapp-mobile-drawer' className='mobile__platform-switcher-item whatsapp'>
+                        <img className='mobile__platform-switcher-icon whatsapp-icon' />
+                        <div className='mobile__platform-switcher-text'>{it.L('WhatsApp')}</div>
+                    </div>
                     <div  id='mobile__menu-livechat' className='mobile__platform-switcher-item'>
                         <img className='mobile__platform-switcher-icon livechat-icon' />
                         <div className='mobile__platform-switcher-text'>{it.L('Live chat')}</div>

diff --git a/src/templates/_common/_layout/layout.jsx b/src/templates/_common/_layout/layout.jsx
@@ -43,6 +43,9 @@ const Topbar = () => (
             </div>
             <div id='language-select'><img id='language-select__logo' /></div>
             <span className='no-underline nowrap gmt-clock' data-balloon-pos='up' />
+            <div id='topbar-whatsapp'>
+                <img src={it.url_for('images/pages/footer/ic-whatsapp.svg')} />
+            </div>
             <LiveChat />
             <div id='topbar-help-centre'>
                 <img src={it.url_for('images/pages/footer/ic-help-centre.svg')} />