Merge pull request #190 from ahmed-deriv/ahmed/DAPI-833/feat--add-tra…

…nslations-french ahmed/DAPI-833/feat--add-translations-french
deriv-com · Dec 31, 2024 · 4b159b8 · 4b159b8
2 parents c2e78a6 + 5e2a12b
commit 4b159b8
Show file tree

Hide file tree

Showing 7 changed files with 644 additions and 606 deletions.
diff --git a/i18n/en/code.json b/i18n/en/code.json
diff --git a/i18n/fr/code.json b/i18n/fr/code.json
diff --git a/src/features/Home/ClientLibraries/index.tsx b/src/features/Home/ClientLibraries/index.tsx
@@ -13,7 +13,7 @@ const ClientLibraries = () => {
         <Translate>Supports JavaScript, Python, and Flutter for ultimate compatibility.</Translate>
       </Text>
       <div
-        className={`${styles.spaceEvenContent} ${styles.justifyCenter} ${styles.gap4} ${styles.mh3} ${styles.client_libraries}`}
+        className={`${styles.centerContent} ${styles.gap4} ${styles.mh3} ${styles.client_libraries}`}
       >
         <a
           className={styles.LibraryGoTo}

diff --git a/src/features/Home/Features/index.tsx b/src/features/Home/Features/index.tsx
@@ -20,7 +20,7 @@ const Features = (props: FeaturesProps) => {
       <Text centered>{description}</Text>
 
       <div
-        className={`${styles.spaceEvenContent} ${styles.featuresContainer} ${styles.mh5}`}
+        className={`${styles.spaceEvenContent} ${styles.featuresContainer}`}
       >
         {props.features?.map((feature, idx) => (
           <div key={idx}>

diff --git a/src/features/Home/HeroHeader/index.tsx b/src/features/Home/HeroHeader/index.tsx
@@ -3,10 +3,27 @@ import { Button, Heading, Text } from '@deriv-com/quill-ui';
 import Translate from '@docusaurus/Translate';
 import styles from './HeroHeader.module.scss';
 import { useHistory } from '@docusaurus/router';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 
 const HeroHeader = () => {
   const history = useHistory();
 
+  const {
+    i18n: { currentLocale },
+  } = useDocusaurusContext();
+
+  const internal_links = React.useMemo(() => {
+    const is_en = currentLocale === 'en';
+    const get_url = (path: string) => {
+      const pathInfo = `${!is_en ? `/${currentLocale}` : ''}/${path}`;
+      return pathInfo;
+    };
+    return {
+      webSocketAPI: get_url('#WebsocketAPI'),
+      derivFixAPI: get_url('#derivFix'),
+    };
+  }, [currentLocale]);
+
   return (
     <div className={`${styles.heroContainer}`} data-testid='hero-header'>
       <div className='container'>
@@ -15,15 +32,24 @@ const HeroHeader = () => {
             <Translate>Deriv API</Translate>
           </Heading.H1>
           <Text className={styles.description} data-testid='hero-header-description'>
-            <Translate>{`Build smarter trading solutions with Deriv’s APIs. Use the WebSocket API for real-time Options trading and the DerivFIX API for ultra-low latency CFDs trading, ensuring precision, stability, and high performance.`}</Translate>
+            <Translate>{`Build smarter trading solutions with Deriv’s APIs. Use the WebSocket API for real-time Options trading and the Deriv FIX API for ultra-low latency CFDs trading, ensuring precision, stability, and high performance.`}</Translate>
           </Text>
         </div>
         <div className={styles.heroBtnContainer}>
-          <Button variant='primary' size='lg' onClick={() => history.push('/#WebsocketAPI')}>
+          <Button
+            variant='primary'
+            size='lg'
+            onClick={() => history.push(internal_links.webSocketAPI)}
+          >
             <Translate>WebSocket API</Translate>
           </Button>
-          <Button variant='secondary' color='white-black' size='lg' onClick={() => history.push('/#derivFix')}>
-            <Translate>DerivFIX API</Translate>
+          <Button
+            variant='secondary'
+            color='white-black'
+            size='lg'
+            onClick={() => history.push(internal_links.derivFixAPI)}
+          >
+            <Translate>Deriv FIX API</Translate>
           </Button>
         </div>
       </div>

diff --git a/src/features/Home/ProductInfo/constant.ts b/src/features/Home/ProductInfo/constant.ts
@@ -27,11 +27,11 @@ export const products: IProduct = {
 
   },
   DerivFIX: {
-    title: translate({ message: 'DerivFIX API' }),
+    title: translate({ message: 'Deriv FIX API' }),
     description: [
       translate({
         message:
-          'Experience consistent performance and ultra-low latency with DerivFIX, the API specifically engineered for professional and institutional CFDs trading.',
+          'Experience consistent performance and ultra-low latency with Deriv FIX, the API specifically engineered for professional and institutional CFDs trading.',
       }),
       translate({
         message:

diff --git a/src/features/Home/index.tsx b/src/features/Home/index.tsx
@@ -35,7 +35,7 @@ export default function HomepageFeatures() {
             <ClientLibraries />
             <ProductInfo product={products.DerivFIX} reverse />
             <Features
-              title={translate({ message: 'DerivFIX API key features' })}
+              title={translate({ message: 'Deriv FIX API key features' })}
               description={translate({
                 message: 'Tailored for high-frequency, high-stakes trading.',
               })}