fix: test eduard social button (binary-com#7380)

fasihali-deriv · Apr 3, 2024 · ab039d4 · ab039d4
1 parent 6926f84
commit ab039d4
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 86 deletions.
diff --git a/src/components/hooks/use-social-media-url.tsx b/src/components/hooks/use-social-media-url.tsx
diff --git a/src/features/components/templates/footer/data.tsx b/src/features/components/templates/footer/data.tsx
@@ -606,16 +606,45 @@ export const socialButtonsCareers = [
         'data-cy': 'facebook',
         'aria-label': 'facebook',
     },
-    {
-        icon: <StandaloneInstagramIcon iconSize="md" fill="#000000b8" />,
-        href: 'https://www.instagram.com/derivcareers/',
-        'data-cy': 'instagram',
-        'aria-label': 'instagram',
-    },
+
     {
         icon: <StandaloneLinkedinIcon iconSize="md" fill="#000000b8" />,
         href: 'https://www.linkedin.com/company/derivdotcom/life/',
         'data-cy': 'linkedin',
         'aria-label': 'linkedin',
     },
+    {
+        icon: <StandaloneInstagramIcon iconSize="md" fill="#000000b8" />,
+        href: 'https://www.instagram.com/derivcareers/',
+        'data-cy': 'instagram',
+        'aria-label': 'instagram',
+    },
 ]
+
+export const specialLanguageUrls = {
+    ar: {
+        instagram: 'https://www.instagram.com/deriv_ar/',
+        twitter: 'https://twitter.com/DerivArabic',
+        facebook: 'https://www.facebook.com/derivarabic',
+    },
+    fr: {
+        instagram: 'https://www.instagram.com/deriv_french/',
+        twitter: 'https://twitter.com/DerivFrench',
+        facebook: 'https://www.facebook.com/FrenchDeriv/',
+    },
+    ru: {
+        instagram: 'https://www.instagram.com/deriv_russian/',
+        twitter: 'https://twitter.com/DerivRussian',
+        facebook: 'https://www.facebook.com/RussianDeriv',
+    },
+    es: {
+        instagram: 'https://www.instagram.com/deriv_espanol/',
+        twitter: 'https://twitter.com/derivespanol',
+        facebook: 'https://www.facebook.com/derivespanol',
+    },
+    pt: {
+        instagram: 'https://www.instagram.com/deriv_portugues/',
+        twitter: 'https://twitter.com/DerivPortugues',
+        facebook: 'https://www.facebook.com/derivportugues',
+    },
+}
diff --git a/src/features/components/templates/footer/index.tsx b/src/features/components/templates/footer/index.tsx
@@ -1,4 +1,5 @@
 import React, { useEffect, useState } from 'react'
+import Cookies from 'js-cookie'
 import { Footer } from '@deriv-com/blocks'
 import { qtJoin } from '@deriv/quill-design'
 import {
@@ -8,6 +9,7 @@ import {
     socialButtonsEU,
     socialButtonsROW,
     socialButtonsCPA,
+    specialLanguageUrls,
     warnText,
 } from './data'
 // import { socialIconROW, socialIconEU, socialIconCareer } from './validate-social-icons-data'
@@ -18,12 +20,22 @@ import useRegion from 'components/hooks/use-region'
 import { getLocationPathname } from 'common/utility'
 import useThirdPartyFlags from 'components/hooks/use-third-party-flags'
 
+const overrideWithLang = (buttons, lang) =>
+    buttons.map((button) =>
+        lang in specialLanguageUrls
+            ? button['aria-label'] in specialLanguageUrls[lang]
+                ? { ...button, href: specialLanguageUrls[lang][button['aria-label']] }
+                : button
+            : button,
+    )
+
 export const MainFooter = () => {
-    const { is_eu, is_cpa_plan } = useRegion()
     const [is_career, setIsCareer] = useState(false)
+    const { is_eu, is_cpa_plan } = useRegion()
     const [social_buttons, setSocialButtons] = useState(socialButtonsROW)
     const [warn_text, setWarnText] = useState(warnText)
     const [nav_data, setNavData] = useState(RowFooterNavData)
+    const lang = Cookies.get('user_language') || 'en'
 
     useEffect(() => {
         const current_path = getLocationPathname()
@@ -48,7 +60,8 @@ export const MainFooter = () => {
         const socialIconCPA = filterSocialIcons(cpa_social_media_icons, socialButtonsCPA)
 
         const region_buttons = is_eu ? socialIconEU : is_cpa_plan ? socialIconCPA : socialIconROW
-        setSocialButtons(is_career ? socialIconCareer : region_buttons)
+        const buttons = is_career ? socialIconCareer : region_buttons
+        setSocialButtons(overrideWithLang(buttons, lang))
         if (is_eu) setNavData(EuFooterNavData)
         setWarnText(!is_eu && !is_cpa_plan ? warnText : null)
     }, [