diff --git a/packages/trader/src/AppV2/Components/InfoModal/index.ts b/packages/trader/src/AppV2/Components/InfoModal/index.ts deleted file mode 100644 index 16636d3b3ba4..000000000000 --- a/packages/trader/src/AppV2/Components/InfoModal/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -import InfoModal from './info-modal'; -import './info-modal.scss'; - -export default InfoModal; diff --git a/packages/trader/src/AppV2/Components/InfoModal/info-modal.tsx b/packages/trader/src/AppV2/Components/InfoModal/info-modal.tsx deleted file mode 100644 index 9efc5c7881a0..000000000000 --- a/packages/trader/src/AppV2/Components/InfoModal/info-modal.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import { CaptionText, Modal } from '@deriv-com/quill-ui'; -import { localize } from '@deriv/translations'; -import React from 'react'; - -type InfoModalProps = { - icon?: React.ReactNode; - header_content: string; - body_content: string; - className?: string; -}; - -const InfoModal = ({ header_content, body_content, icon }: InfoModalProps) => { - const [isVisible, setIsVisible] = React.useState(false); - return ( - <> - - - - {body_content} - - - ); -}; - -export default InfoModal; diff --git a/packages/trader/src/AppV2/Components/PayoutInfoModal/index.ts b/packages/trader/src/AppV2/Components/PayoutInfoModal/index.ts new file mode 100644 index 000000000000..789a9f6da67a --- /dev/null +++ b/packages/trader/src/AppV2/Components/PayoutInfoModal/index.ts @@ -0,0 +1,4 @@ +import PayoutInfoModal from './payout-info-modal'; +import './payout-info-modal.scss'; + +export default PayoutInfoModal; diff --git a/packages/trader/src/AppV2/Components/InfoModal/info-modal.scss b/packages/trader/src/AppV2/Components/PayoutInfoModal/payout-info-modal.scss similarity index 100% rename from packages/trader/src/AppV2/Components/InfoModal/info-modal.scss rename to packages/trader/src/AppV2/Components/PayoutInfoModal/payout-info-modal.scss diff --git a/packages/trader/src/AppV2/Components/PayoutInfoModal/payout-info-modal.tsx b/packages/trader/src/AppV2/Components/PayoutInfoModal/payout-info-modal.tsx new file mode 100644 index 000000000000..a65fa76278ab --- /dev/null +++ b/packages/trader/src/AppV2/Components/PayoutInfoModal/payout-info-modal.tsx @@ -0,0 +1,33 @@ +import { CaptionText, Modal } from '@deriv-com/quill-ui'; +import { Localize } from '@deriv/translations'; +import React from 'react'; + +const PayoutInfoModal = () => { + const [isVisible, setIsVisible] = React.useState(false); + return ( + <> + + } + shouldCloseOnPrimaryButtonClick + isMobile + showHandleBar + > + } /> + + { + + } + + + + ); +}; + +export default PayoutInfoModal; diff --git a/packages/trader/src/AppV2/Containers/ContractDetails/contract-details.tsx b/packages/trader/src/AppV2/Containers/ContractDetails/contract-details.tsx index d15394938b6f..c08a37454c17 100644 --- a/packages/trader/src/AppV2/Containers/ContractDetails/contract-details.tsx +++ b/packages/trader/src/AppV2/Containers/ContractDetails/contract-details.tsx @@ -1,8 +1,6 @@ import React from 'react'; import { Text } from '@deriv-com/quill-ui'; -import InfoSheet from 'AppV2/Components/InfoModal'; -import { localize } from '@deriv/translations'; -import { LabelPairedCircleInfoSmRegularIcon } from '@deriv/quill-icons'; +import PayoutInfoModal from 'AppV2/Components/PayoutInfoModal'; import ChartPlaceholder from '../Chart'; const ContractDetails = () => { @@ -11,23 +9,11 @@ const ContractDetails = () => {
Contract Details
- +
Contract card
Take Profit - } - header_content={localize('Take profit')} - body_content={localize( - 'When your profit reaches or exceeds the set amount, your trade will be closed automatically.' - )} - />