fix: add language redirection and fix the glitch

mitra-deriv · mitra-deriv · commit 92b49a2cc468 · 2022-08-25T19:26:45.000+08:00
diff --git a/gulpfile.babel.js b/gulpfile.babel.js
@@ -12,7 +12,7 @@ gulp.task(
     gulp.series(done => {
         connect.server({
             root      : 'www',
-            port      : 80,
+            port      : 8000,
             livereload: true,
         });
         done();
@@ -24,7 +24,7 @@ gulp.task(
     gulp.series(done => {
         gulp.src('www/index.html').pipe(
             open({
-                uri: 'http://localhost:80/',
+                uri: 'http://localhost:8000/',
             })
         );
         done();
@@ -75,7 +75,10 @@ gulp.task(
     })
 );
 
-gulp.task('test-deploy', gulp.series('build-min', 'serve', () => {}));
+gulp.task(
+    'test-deploy',
+    gulp.series('build-min', 'serve', () => {})
+);
 
 gulp.task(
     'watch-static',
diff --git a/src/common/lang.js b/src/common/lang.js
@@ -88,3 +88,9 @@ export const showBanner = async () => {
         });
     }
 };
+
+export const getLanguageBase = url => {
+    const lang = getLanguage();
+    console.log(url + lang, 'language');
+    return url + lang;
+};
diff --git a/src/indexPage/index.js b/src/indexPage/index.js
@@ -37,7 +37,7 @@ const checkifBotRunning = () => {
 let Component, dynamicRoutePathanme;
 export const getComponent = () => {
     Component = <BinaryLanding />;
-    dynamicRoutePathanme = 'bot-landing';
+    dynamicRoutePathanme = 'movetoderiv';
     return {
         Component,
         dynamicRoutePathanme,
@@ -101,7 +101,11 @@ const renderElements = () => {
             showBanner();
             $('#shop-url').attr(
                 'href',
-                createUrl({ subdomain: 'shop', path: 'collections/strategies', isNonBotPage: true })
+                createUrl({
+                    subdomain   : 'shop',
+                    path        : 'collections/strategies',
+                    isNonBotPage: true,
+                })
             );
             elements.map(elem => document.querySelector(elem).classList.remove('hidden'));
             document.getElementById(dynamicRoutePathanme).classList.add('hidden');
diff --git a/src/indexPage/react-components/binary-landing/Hero.jsx b/src/indexPage/react-components/binary-landing/Hero.jsx
@@ -1,13 +1,15 @@
-import React from 'react'
+import React from 'react';
 import Slider from 'react-slick';
 import { translate } from '../../../common/i18n';
+import {getLanguageBase } from '../../../common/lang';
 
 const carouselImages = [
     'image/hero-dmt5.png',
     'image/hero-derivgo.png',
     'image/hero-derivx.png',
     'image/hero-dtrader.png',
-]
+];
+
 
 const carouselSettings = {
     dots          : false,
@@ -38,34 +40,42 @@ const carouselSettings = {
 
 const Hero = () => {
     const renderContent = () => (
-        <div className='hero-wrapper-container_box-binary hero-wrapper-container-left-binary'>
+        <div className="hero-wrapper-container_box-binary hero-wrapper-container-left-binary">
             <h1>{translate('We’re moving!')}</h1>
             <h2>
-                {translate('We’ve been')}<b>{translate(' Binary.com')}</b>{translate(' for 2 decades and it’s time for an exciting new chapter.')}
+                {translate('We’ve been')}
+                <b>{translate(' Binary.com')}</b>
+                {translate(' for 2 decades and it’s time for an exciting new chapter.')}
+            </h2>
+            <h2>
+                {translate('Say hello to our new home,')}
+                <b>{translate(' Deriv.')}</b>
             </h2>
-            <h2>{translate('Say hello to our new home,')}<b>{translate(' Deriv.')}</b></h2>
             <div className="btn-group">
-                <a href="https://deriv.com">
-                    <button className="l-btn primary">{translate('Hello Deriv!')}</button>
+                <a href={getLanguageBase('https://deriv.com/')}>
+                    <button className="l-btn primary">
+                        {translate('Hello Deriv!')}
+                    </button>
                 </a>
                 <a href="https://www.binary.com?binary-bot-lp" id="logo">
                     <button className="l-btn">{translate('Maybe later')}</button>
                 </a>
             </div>
         </div>
-    )
+    );
 
     const renderCarousel = () => (
-        <div className='hero-wrapper-container_box-binary hero-wrapper-container-right-binary'>
+        <div className="hero-wrapper-container_box-binary hero-wrapper-container-right-binary">
             <Slider {...carouselSettings}>
-                {carouselImages.map((slide, index) => <img key={index} src={slide} />)}
+                {carouselImages.map((slide, index) => (
+                    <img key={index} src={slide} />
+                ))}
             </Slider>
         </div>
-    )
-
+    );
 
     return (
-        <div className='hero-wrapper'>
+        <div className="hero-wrapper">
             <section className="hero-wrapper-container">
                 {renderContent()}
                 {renderCarousel()}
@@ -74,7 +84,7 @@ const Hero = () => {
                 </div>
             </section>
         </div>
-    )
+    );
 };
 
-export default Hero
+export default Hero;
diff --git a/src/indexPage/react-components/binary-landing/Navigation.jsx b/src/indexPage/react-components/binary-landing/Navigation.jsx
@@ -1,6 +1,9 @@
 import React from 'react'
 import { translate } from '../../../common/i18n';
+import {getLanguage} from '../../../common/lang'
 
+const lang = getLanguage();
+const URL = `https://oauth.deriv.com/oauth2/authorize?app_id=16929&l=${lang}&brand=deriv`;
 
 const MoveToDerivNav = () => (
     <div className='navigation'>
@@ -10,7 +13,7 @@ const MoveToDerivNav = () => (
                     <img src="image/binary.png" />
                 </a>
             </div>
-            <a href="https://oauth.deriv.com/oauth2/authorize?app_id=16929&l=en&brand=deriv" className="navigation-to-deriv" rel="noopener noreferrer">
+            <a href={URL} className="navigation-to-deriv" rel="noopener noreferrer">
                 <button className='btn-group right-btn'>
                     {translate('Take me to Deriv')}
                 </button>
diff --git a/templates/index.mustache b/templates/index.mustache
@@ -25,7 +25,7 @@
         </div>
     </div>
     <div id="movetoderiv"></div>
-    <div id="bot-landing"></div>
+    
 	
 	<div id="header">
 		<div class="wrapper">
diff --git a/templates/movetoderiv.mustache b/templates/movetoderiv.mustache
@@ -25,7 +25,7 @@
     <div id="binary-logo"></div>
     <div id="movetoderiv">
     </div>
-     <div id="bot-landing"></div>
+     
       <div id="footer"></div>
        <div id="notification-banner"></div>
 	<div id="main">
