Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on May 20, 2025. It is now read-only.

NikitaK/Help centre files with answers convert to TS #2416

Merged
merged 2 commits into from Jan 11, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion src/index.d.ts

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import React from 'react'
import styled from 'styled-components'
import PropTypes from 'prop-types'
import { DidntFindYourAnswerBanner } from './_didnt-find-answer'
import { Community } from './_community'
import Layout from 'components/layout/layout'
Expand All @@ -9,6 +8,17 @@ import { SideTab, StyledLink } from 'components/elements'
import { Container, SEO } from 'components/containers'
import device from 'themes/device'

export type ArticleProps = {
children?: React.ReactNode
header?: string
title?: string
description?: string
text?: string
label?: string
is_mounted?: boolean
has_note?: string
}

const Content = styled.div`
display: flex;
flex-direction: row;
Expand All @@ -26,10 +36,24 @@ const TabWrapper = styled.div`
const ContactContainer = styled.div`
margin-top: 8rem;
`
export const Article = ({ children, header, title, description }) => {
export const Article = ({
children,
header = '',
title = '',
description = '',
text = '',
label = '',
is_mounted = false,
}: ArticleProps) => {
return (
<Layout>
<SEO title={title} description={description} />
<SEO
title={title}
description={description}
text={text}
label={label}
is_mounted={is_mounted}
/>
<Container align="left" justify="flex-start" direction="column">
<StyledLink
to="/help-centre/"
Expand Down Expand Up @@ -63,10 +87,3 @@ export const Article = ({ children, header, title, description }) => {
</Layout>
)
}

Article.propTypes = {
children: PropTypes.node,
description: PropTypes.string,
header: PropTypes.string,
title: PropTypes.string,
}
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React from 'react'
import styled from 'styled-components'
import { Article } from './_article'
import { Article, ArticleProps } from './_article'
import { ArticleWrapper, ExternalLink, StyledHeader, StyledText } from './_help-centre-style'
import { usePageLoaded } from 'components/hooks/use-page-loaded'
import { deriv_app_url } from 'common/constants'
Expand All @@ -22,7 +22,7 @@ const StyledLink = styled(ExternalLink)`
}
`

const WhoCanOpenAnAccount = () => (
const WhoCanOpenAnAccount = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">{localize("Why can't I create an account?")}</StyledHeader>
<Text>
Expand All @@ -43,7 +43,7 @@ const WhoCanOpenAnAccount = () => (
</ArticleWrapper>
)

const ChangingPersonalDetails = () => (
const ChangingPersonalDetails = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">{localize('How can I change my personal details?')}</StyledHeader>
<Text>
Expand All @@ -70,7 +70,7 @@ const ChangingPersonalDetails = () => (
</ArticleWrapper>
)

const ChangeAccountCurrency = () => (
const ChangeAccountCurrency = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">{localize("How can I change my account's currency?")}</StyledHeader>
<Text>
Expand All @@ -81,7 +81,7 @@ const ChangeAccountCurrency = () => (
</ArticleWrapper>
)

const RecoveringPassword = () => (
const RecoveringPassword = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">
{localize(
Expand All @@ -106,7 +106,7 @@ const RecoveringPassword = () => (
</ArticleWrapper>
)

const CloseAccount = () => (
const CloseAccount = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">{localize('How can I close my account?')}</StyledHeader>
<Text>
Expand All @@ -132,7 +132,7 @@ const CloseAccount = () => (
</ArticleWrapper>
)

const UnsubscribeEmail = () => (
const UnsubscribeEmail = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">
{localize('How do I unsubscribe from marketing emails?')}
Expand All @@ -156,7 +156,7 @@ const UnsubscribeEmail = () => (
</ArticleWrapper>
)

const DormantFee = () => (
const DormantFee = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">{localize('What is a dormant fee?')}</StyledHeader>
<Text>
Expand Down
34 changes: 17 additions & 17 deletions src/pages/help-centre/dbot.js → src/pages/help-centre/dbot.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React from 'react'
import styled from 'styled-components'
import { Article } from './_article'
import { Article, ArticleProps } from './_article'
import { ArticleWrapper, StyledHeader, StyledText } from './_help-centre-style'
import { usePageLoaded } from 'components/hooks/use-page-loaded'
import { Text } from 'components/elements'
Expand Down Expand Up @@ -94,13 +94,13 @@ const Td = styled.td`
const Tr = styled.tr`
border: 1px solid var(--color-grey-7);
`
const StyledTable = styled.table`
const StyledTable = styled.table<ArticleProps>`
border-collapse: collapse;
width: 100%;
margin-bottom: ${(props) => (props.has_note ? '2.4rem' : 0)};
`

const WhatIsDBot = () => (
const WhatIsDBot = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('What is DBot?')}</StyledHeader>
<Text>
Expand All @@ -111,7 +111,7 @@ const WhatIsDBot = () => (
</ArticleWrapper>
)

const FindBlocks = () => (
const FindBlocks = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('How do I find the blocks I need?')}</StyledHeader>
<Text>
Expand Down Expand Up @@ -148,7 +148,7 @@ const FindBlocks = () => (
</ArticleWrapper>
)

const RemoveBlocks = () => (
const RemoveBlocks = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">
{localize('How do I remove blocks from the workspace?')}
Expand All @@ -170,7 +170,7 @@ const RemoveBlocks = () => (
</ArticleWrapper>
)

const CreateVariables = () => (
const CreateVariables = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('How do I create variables?')}</StyledHeader>
<Text>{localize("1. Click 'Get started' to open the blocks menu.")}</Text>
Expand Down Expand Up @@ -224,7 +224,7 @@ const CreateVariables = () => (
</ArticleWrapper>
)

const QuickStrategy = () => (
const QuickStrategy = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">
{localize('What is a quick strategy and how do I use it?')}
Expand Down Expand Up @@ -314,7 +314,7 @@ const QuickStrategy = () => (
</ArticleWrapper>
)

const MartingaleStrategy = () => (
const MartingaleStrategy = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('What is the Martingale strategy?')}</StyledHeader>
<Text>
Expand All @@ -325,7 +325,7 @@ const MartingaleStrategy = () => (
</ArticleWrapper>
)

const AlembertStrategy = () => (
const AlembertStrategy = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('What is the D’Alembert strategy?')}</StyledHeader>
<Text>
Expand All @@ -336,7 +336,7 @@ const AlembertStrategy = () => (
</ArticleWrapper>
)

const OskarStrategy = () => (
const OskarStrategy = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize("What is the Oscar's Grind strategy?")}</StyledHeader>
<Text>
Expand All @@ -347,7 +347,7 @@ const OskarStrategy = () => (
</ArticleWrapper>
)

const SaveStrategy = () => (
const SaveStrategy = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('How do I save my strategy?')}</StyledHeader>
<Text>
Expand Down Expand Up @@ -438,7 +438,7 @@ const SaveStrategy = () => (
</ArticleWrapper>
)

const ImportStrategy = () => (
const ImportStrategy = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('How do I import my strategies into DBot?')}</StyledHeader>
<Text>
Expand Down Expand Up @@ -494,7 +494,7 @@ const ImportStrategy = () => (
</ArticleWrapper>
)

const ResetWorkspace = () => (
const ResetWorkspace = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('How do I reset the workspace?')}</StyledHeader>
<Text>
Expand All @@ -514,7 +514,7 @@ const ResetWorkspace = () => (
</ArticleWrapper>
)

const TransactionLog = () => (
const TransactionLog = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('How do I clear my transaction log?')}</StyledHeader>
<Text>
Expand Down Expand Up @@ -542,7 +542,7 @@ const TransactionLog = () => (
</ArticleWrapper>
)

const ControlLosses = () => (
const ControlLosses = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('How do I control my losses with DBot?')}</StyledHeader>
<Text>
Expand Down Expand Up @@ -655,7 +655,7 @@ const ControlLosses = () => (
</ArticleWrapper>
)

const TradeStatus = () => (
const TradeStatus = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">
{localize('Where can I see the status of my trades in DBot?')}
Expand Down Expand Up @@ -693,7 +693,7 @@ const TradeStatus = () => (
</ArticleWrapper>
)

const ViewChart = () => (
const ViewChart = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper margin_left="2rem">
<StyledHeader as="h4">{localize('How do I view the chart in DBot?')}</StyledHeader>
<Text>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
import React from 'react'
import { Article } from './_article'
import { Article, ArticleProps } from './_article'
import { ArticleWrapper, ExternalLink, StyledHeader, StyledText } from './_help-centre-style'
import { usePageLoaded } from 'components/hooks/use-page-loaded'
import { deriv_app_url } from 'common/constants'
import { Text } from 'components/elements'
import { Localize, localize, WithIntl } from 'components/localization'

const PaymentMethods = () => (
const PaymentMethods = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">{localize('What payment methods do you support?')}</StyledHeader>
<Text>
Expand All @@ -30,7 +30,7 @@ const PaymentMethods = () => (
</ArticleWrapper>
)

const WithdrawalProcessingTime = () => (
const WithdrawalProcessingTime = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">
{localize('How long does it take to process deposits and withdrawals?')}
Expand All @@ -43,7 +43,7 @@ const WithdrawalProcessingTime = () => (
</ArticleWrapper>
)

const MinimumDepositWithdrawal = () => (
const MinimumDepositWithdrawal = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">
{localize('What is the minimum deposit or withdrawal amount?')}
Expand All @@ -59,7 +59,7 @@ const MinimumDepositWithdrawal = () => (
</ArticleWrapper>
)

const ExpiredVerificationLink = () => (
const ExpiredVerificationLink = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">
{localize('My withdrawal verification link expired. What should I do?')}
Expand All @@ -72,7 +72,7 @@ const ExpiredVerificationLink = () => (
</ArticleWrapper>
)

const LiftWithdrawalLimits = () => (
const LiftWithdrawalLimits = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">{localize('How can I lift my withdrawal limits?')}</StyledHeader>
<Text>
Expand All @@ -93,7 +93,7 @@ const LiftWithdrawalLimits = () => (
</ArticleWrapper>
)

const CreditCardDepositDeclined = () => (
const CreditCardDepositDeclined = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">
{localize('Why does my credit card deposit keep getting declined?')}
Expand All @@ -106,7 +106,7 @@ const CreditCardDepositDeclined = () => (
</ArticleWrapper>
)

const WithdrawDepositBonus = () => (
const WithdrawDepositBonus = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">{localize('Can I withdraw my deposit bonus?')}</StyledHeader>
<Text>
Expand All @@ -117,7 +117,7 @@ const WithdrawDepositBonus = () => (
</ArticleWrapper>
)

const WithdrawMaestroMastercard = () => (
const WithdrawMaestroMastercard = ({ text, label, is_mounted }: ArticleProps) => (
<ArticleWrapper>
<StyledHeader as="h4">
{localize("Why can't I withdraw funds to my Maestro/Mastercard?")}
Expand Down
Loading