Skip to content
This repository has been archived by the owner on Sep 26, 2024. It is now read-only.

Commit

Permalink
fix: comments and updated with design
Browse files Browse the repository at this point in the history
  • Loading branch information
mayuran-deriv committed Apr 2, 2024
1 parent a48ae2c commit d83df5b
Show file tree
Hide file tree
Showing 8 changed files with 347 additions and 290 deletions.
10 changes: 5 additions & 5 deletions crowdin/messages.json
Original file line number Diff line number Diff line change
Expand Up @@ -3290,24 +3290,24 @@
"-519772806": "Smart and friendly support, 7 days a week",
"-2015932855": "smart and friendly support",
"-1690667791": "Why trade ETFs on Deriv",
"-2039405840": "The payout growth depends solely on the underlying index’s price moving tick by tick while remaining within a predefined range. The range width is determined by the growth rate and the symbol selected.",
"-390687537": "No, accumulator options are currently unavailable on Deriv Bot.",
"-2143632826": "Browse our FAQs",
"-232157320": "Fast-paced action with durations up to 230 ticks.",
"-844197189": "Controlled Risk",
"-467264818": "Hone your strategies risk-free with a demo account.",
"-1882861283": "Watch: Accumulator options in action",
"-652680277": "Step-by-step guide to trade on accumulator options",
"-712487889": "Read: Guide to trading accumulator options",
"-1923211546": "Open your first accumulator options trade with our step-by-step guide.",
"-1833614673": "How to trade accumulator options",
"-1627820643": "Move fast,<br/>when the market doesn’t",
"-360691661": "Looking for a fast-paced, strategic and potentially explosive way to trade?",
"-244980648": "What are accumulator options?",
"-1356285247": "Accumulator options icon",
"-1500514644": "Accumulator",
"-1167572902": "Secure your gains with manual or automatic profit-taking. With durations of up to 230 ticks, accumulator options are ideal for those looking for fast-paced, strategic trades while balancing risk and reward.",
"-677391007": "Deriv Go",
"-1833614673": "How to trade accumulator options",
"-2039405840": "The payout growth depends solely on the underlying index’s price moving tick by tick while remaining within a predefined range. The range width is determined by the growth rate and the symbol selected.",
"-390687537": "No, accumulator options are currently unavailable on Deriv Bot.",
"-2143632826": "Browse our FAQs",
"-360691661": "Looking for a fast-paced, strategic and potentially explosive way to trade?",
"-1759381505": "What are turbo options?",
"-1461784880": "How do vanilla options work?",
"-231290085": "Start connecting with fellow traders to make deposits and withdrawals.",
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,136 @@
import React from 'react'
import { AccordionBlock } from '@deriv-com/blocks'
import { Text } from '@deriv/quill-design'
import * as styles from '../accumulators_faq.module.scss'
import { Localize, localize } from 'components/localization'

const AccumulatorAccrodian = () => {
return (
<div id="faqs">
<AccordionBlock
className="border-opacity-black-100 border-x-none"
content={{
data: [
[
{
className: `${styles.accordion_border}`,
content: function noRefCheck() {
return (
<Text>
<Localize translate_text="_t_You can trade volatility indices, a type of derived indices, with accumulator options._t_" />
</Text>
)
},
title: localize(
'_t_What markets can I trade with accumulator options?_t_',
),
id: 'what-markets-can-i-trade-with-accumulator-options',
},
{
className: `${styles.accordion_border}`,
content: function noRefCheck() {
return (
<Text>
<Localize translate_text="_t_Not at the moment. You can only open one contract per instrument at a time._t_" />
</Text>
)
},
title: localize(
'_t_Can I open multiple accumulator contracts at the same time?_t_',
),
id: 'can-i-open-multiple-accumulator-contracts-at-the-same-time',
},
{
className: `${styles.accordion_border}`,
content: function noRefCheck() {
return (
<Text>
<Localize translate_text="_t_No, the growth rate can only be set before opening the contract. Once you open the contract, the growth rate cannot be changed._t_" />
</Text>
)
},
title: localize(
'_t_Can I change my growth rate after opening the contract?_t_',
),
id: 'can-i-change-my-growth-rate-after-opening-the-contract',
},
{
className: `${styles.accordion_border}`,
content: function noRefCheck() {
return (
<div className="flex flex-col gap-800">
<Text>
<Localize translate_text="_t_Opening accumulator contracts for a specific instrument and growth rate may be temporarily unavailable when our internal aggregate stake limits have been reached for that particular combination. If this happens, you can choose another instrument or the same instrument with a different growth rate._t_" />
</Text>
<Text>
<Localize translate_text="_t_The limits will reset when a loss condition is triggered or when someone trading the same combination closes their position. When this happens, you’ll be able to open new contracts again as normal._t_" />
</Text>
</div>
)
},
title: localize(
'_t_Can I open an accumulator contract at any time?_t_',
),
id: 'can-i-open-an-accumulator-contract-at-any-time',
},
{
className: `${styles.accordion_border}`,
content: function noRefCheck() {
return (
<Text>
<Localize translate_text="_t_Yes, you can close your accumulator contract whenever you are satisfied with the payout amount. However, if the current spot price touches or breaches the limits of the predefined range, your contract will automatically close and you’ll lose your accumulated payout._t_" />
</Text>
)
},
title: localize(
'_t_Can I close an accumulator contract at any time?_t_',
),
id: 'can-i-close-an-accumulator-contract-at-any-time',
},
{
className: `${styles.accordion_border}`,
content: function noRefCheck() {
return (
<div className="flex flex-col gap-800">
<Text>
<Localize translate_text="_t_No, the accumulated payout for accumulator options is not correlated with the direction of the underlying index._t_" />
</Text>
<Text>
<Localize translate_text="_t_The payout growth depends solely on the underlying index’s price moving tick by tick while remaining within a predefined range. The range width is determined by the growth rate and the symbol selected._t_" />
</Text>
<Text>
<Localize translate_text="_t_Whether the broader index moves up, down or sideways is irrelevant to the payout unless the price touches or breaches the range limits, triggering a loss._t_" />
</Text>
</div>
)
},
title: localize(
'_t_Is the accumulated payout correlated with the direction of the underlying index?_t_',
),
id: 'is-the-accumulated-payout-correlated-with-the-direction-of-the-underlying-index',
},
{
className: `${styles.accordion_border}`,
content: function noRefCheck() {
return (
<Text>
<Localize translate_text="_t_No, accumulator options are currently unavailable on Deriv Bot._t_" />
</Text>
)
},
title: localize(
'_t_Are accumulators available as a trade type on Deriv Bot?_t_',
),
id: 'are-accumulators-available-as-a-trade-type-on-deriv-bot',
},
],
],
}}
title={<Localize translate_text="_t_Browse our FAQs_t_" />}
variant="Flush"
/>
</div>
)
}

export default AccumulatorAccrodian
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import React from 'react'
import { Features } from '@deriv-com/blocks'
import { accumulatorOptionsVideoCard } from '../data'
import { Localize } from 'components/localization'
import { how_to_trade_accumulator_video_id } from 'common/constants'

interface HowToTradeAccumulatorProps {
handleModalToggle: (isOpen: boolean, videoId: string) => void
}

const HowToTradeAccumulator = ({ handleModalToggle }: HowToTradeAccumulatorProps) => {
return (
<Features.Card
hasPadding
className="xl:[&>*:nth-child(1)]:!px-50"
title={<Localize translate_text="_t_How to trade accumulator options_t_" />}
cols="two"
variant="ContentTop"
cards={accumulatorOptionsVideoCard.map((card) => ({
...card,
content: (
<div
onClick={() =>
handleModalToggle(card.id === 1, how_to_trade_accumulator_video_id)
}
>
{card.content}
</div>
),
}))}
/>
)
}

export default HowToTradeAccumulator
Loading

0 comments on commit d83df5b

Please sign in to comment.