From 545823d3a5ace788e020527b5e522c259e203c1a Mon Sep 17 00:00:00 2001 From: Konstantinos-Gk Date: Thu, 5 Oct 2023 14:59:45 +0200 Subject: [PATCH] feat: ctrader faq section --- .../deriv-ctrader/browse-our-faq/data.tsx | 404 ++++++++++++++++++ .../deriv-ctrader/browse-our-faq/index.tsx | 19 + src/features/pages/deriv-ctrader/index.tsx | 2 + .../browse-our-faq/deriv-prime-faq.tsx | 9 +- .../deriv-prime/browse-our-faq/types.ts | 2 + .../common/ctrader/ctrader-desktop-app.png | Bin 0 -> 55734 bytes src/images/common/ctrader/ctrader-get.png | Bin 0 -> 39291 bytes src/images/common/ctrader/ctrader-trade.png | Bin 0 -> 26755 bytes .../common/ctrader/ctrader-transfer-menu.png | Bin 0 -> 35938 bytes .../common/ctrader/ctrader-withdrawal.png | Bin 0 -> 57858 bytes .../common/ctrader/traders-hub-demo.png | Bin 0 -> 18691 bytes .../common/ctrader/traders-hub-real.png | Bin 0 -> 19149 bytes 12 files changed, 433 insertions(+), 3 deletions(-) create mode 100644 src/features/pages/deriv-ctrader/browse-our-faq/data.tsx create mode 100644 src/features/pages/deriv-ctrader/browse-our-faq/index.tsx create mode 100644 src/images/common/ctrader/ctrader-desktop-app.png create mode 100644 src/images/common/ctrader/ctrader-get.png create mode 100644 src/images/common/ctrader/ctrader-trade.png create mode 100644 src/images/common/ctrader/ctrader-transfer-menu.png create mode 100644 src/images/common/ctrader/ctrader-withdrawal.png create mode 100644 src/images/common/ctrader/traders-hub-demo.png create mode 100644 src/images/common/ctrader/traders-hub-real.png diff --git a/src/features/pages/deriv-ctrader/browse-our-faq/data.tsx b/src/features/pages/deriv-ctrader/browse-our-faq/data.tsx new file mode 100644 index 00000000000..282c3bbe311 --- /dev/null +++ b/src/features/pages/deriv-ctrader/browse-our-faq/data.tsx @@ -0,0 +1,404 @@ +import React from 'react' +import { StaticImage } from 'gatsby-plugin-image' +import { DerivPrimeFAQDataItem } from 'features/pages/partners/deriv-prime/browse-our-faq/types' +import Flex from 'features/components/atoms/flex-box' +import Typography from 'features/components/atoms/typography' +import Login from 'common/login' + +const handleLogin = () => { + Login.redirectToLogin() +} + +export const ctrader_faq_data: DerivPrimeFAQDataItem[] = [ + { + id: 1, + question: '_t_What is Deriv cTrader?_t_', + answers: [ + { + id: 1, + type: 'text', + text: '_t_Deriv cTrader is an easy-to-use multi-asset CFD trading platform with many features that new and experienced traders can enjoy._t_', + }, + ], + }, + { + id: 2, + question: '_t_What markets can I trade on Deriv cTrader?_t_', + answers: [ + { + id: 1, + type: 'text', + text: '_t_You can trade forex, stocks, stock indices, commodities, cryptocurrencies, ETFs, and derived indices on Deriv cTrader._t_', + }, + ], + }, + { + id: 3, + question: '_t_How do I add a Deriv cTrader account?_t_', + answers: [ + { + id: 1, + type: 'text', + text: '_t_Follow these steps:_t_', + }, + { + id: 2, + type: 'text', + text: '_t_1. <0>Log in to your Deriv account._t_', + components: [], + }, + { + id: 3, + type: 'text', + text: '_t_2. Select Demo (to practise with virtual money) or Real (to trade with real money)._t_', + }, + { + id: 4, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 5, + type: 'text', + text: '_t_3. Under CFDs, look for Deriv cTrader and hit Get._t_', + }, + { + id: 6, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 7, + type: 'text', + text: '_t_4. Your new Deriv cTrader account is ready._t_', + }, + ], + }, + { + id: 4, + question: '_t_How do I log in to my Deriv cTrader account?_t_', + answers: [ + { + id: 1, + type: 'text', + text: '_t_Follow these steps:_t_', + }, + { + id: 2, + type: 'text', + text: '_t_1. <0>Log in to your Deriv account._t_', + components: [], + }, + { + id: 3, + type: 'text', + text: '_t_2. Select Demo (to practise with virtual money) or Real (to trade with real money)._t_', + }, + { + id: 4, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 5, + type: 'text', + text: '_t_3. Under CFDs, look for Deriv cTrader and hit Trade._t_', + }, + { + id: 6, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 7, + type: 'text', + text: '_t_4. You can trade via the desktop app, web terminal, or mobile app._t_', + }, + { + id: 8, + type: 'custom_component', + component: ( + + + + ), + }, + ], + }, + { + id: 5, + question: '_t_How do I make deposits into my Deriv cTrader account?_t_', + answers: [ + { + id: 1, + type: 'text', + text: '_t_Follow these steps:_t_', + }, + { + id: 2, + type: 'text', + text: '_t_1. <0>Log in to your Deriv account._t_', + components: [], + }, + { + id: 3, + type: 'text', + text: '_t_2. Select Real._t_', + }, + { + id: 4, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 5, + type: 'text', + text: '_t_3. Under CFDs, look for Deriv cTrader and hit Transfer._t_', + }, + { + id: 6, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 7, + type: 'text', + text: '_t_4. Using the drop-down menus, select your Deriv account as the From account and your Deriv cTrader account as the To account. Then, enter the amount and hit Transfer._t_', + }, + { + id: 8, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 9, + type: 'text', + text: '_t_5. Your funds will be available in your Deriv cTrader account immediately._t_', + }, + ], + }, + { + id: 6, + question: '_t_How do I make withdrawals from my Deriv cTrader account?_t_', + answers: [ + { + id: 1, + type: 'text', + text: '_t_Follow these steps:_t_', + }, + { + id: 2, + type: 'text', + text: '_t_1. <0>Log in to your Deriv account._t_', + components: [], + }, + { + id: 3, + type: 'text', + text: '_t_2. Select Real._t_', + }, + { + id: 4, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 5, + type: 'text', + text: '_t_3. Under CFDs, look for Deriv cTrader and hit Transfer._t_', + }, + { + id: 6, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 7, + type: 'text', + text: '_t_4. Using the drop-down menus, select your Deriv cTrader account as the From account and your Deriv account as the To account. Then, enter the amount and hit Transfer._t_', + }, + { + id: 8, + type: 'custom_component', + component: ( + + + + ), + }, + { + id: 9, + type: 'text', + text: '_t_5. Your funds will be available in your Deriv account immediately._t_', + }, + ], + }, + { + id: 7, + question: '_t_What’s the minimum amount to open a position on Deriv cTrader?_t_', + answers: [ + { + id: 1, + type: 'text', + text: '_t_This depends on the margin required for each asset. You’ll be able to see the required margin for each asset before opening your position._t_', + }, + ], + }, + { + id: 8, + question: '_t_Does Deriv cTrader offer any risk-management tools?_t_', + answers: [ + { + id: 1, + type: 'text', + text: '_t_Yes, Deriv cTrader offers stop loss, take profit, pending orders, and other risk-management tools._t_', + }, + ], + }, +] diff --git a/src/features/pages/deriv-ctrader/browse-our-faq/index.tsx b/src/features/pages/deriv-ctrader/browse-our-faq/index.tsx new file mode 100644 index 00000000000..cc60ff94e2a --- /dev/null +++ b/src/features/pages/deriv-ctrader/browse-our-faq/index.tsx @@ -0,0 +1,19 @@ +import React from 'react' +import { ctrader_faq_data } from './data' +import DerivPrimeFaq from 'features/pages/partners/deriv-prime/browse-our-faq/deriv-prime-faq' +import Typography from 'features/components/atoms/typography' +import { Localize } from 'components/localization' +import Container from 'features/components/atoms/container' + +const BrowseOurFaq = () => { + return ( + + + + + + + ) +} + +export default BrowseOurFaq diff --git a/src/features/pages/deriv-ctrader/index.tsx b/src/features/pages/deriv-ctrader/index.tsx index 4abccd16c9a..7e5670a4473 100644 --- a/src/features/pages/deriv-ctrader/index.tsx +++ b/src/features/pages/deriv-ctrader/index.tsx @@ -3,6 +3,7 @@ import CTraderHero from './hero-banner' import CTraderNumbers from './trade-numbers' import CTraderTradeDescription from './trade-description' import CTraderWhyTrade from './why-trade' +import BrowseOurFaq from './browse-our-faq' import CTraderTradeFeatures from './platform-features' import HowToStartCTrader from './how-to-start' import CTraderPlatformBanner from './platform-banner' @@ -31,6 +32,7 @@ const DerivCTrader = () => { )} +