diff --git a/src/front/global.d.ts b/src/front/global.d.ts
index a660539110..9f1e821be4 100644
--- a/src/front/global.d.ts
+++ b/src/front/global.d.ts
@@ -2,23 +2,24 @@ import 'react'
declare module 'react' {
interface Attributes {
- styleName?: string;
- type?: string;
- title?: any;
+ styleName?: string
+ type?: string
+ title?: any
+ alt?: string
}
}
declare global {
interface IEtheriumProvider {
- [key: string]: any;
- isLiquality?: boolean;
- isTrust?: boolean;
- isMetaMask?: boolean;
+ [key: string]: any
+ isLiquality?: boolean
+ isTrust?: boolean
+ isMetaMask?: boolean
}
interface Window {
- [key: string]: any;
- ethereum?: IEtheriumProvider;
+ [key: string]: any
+ ethereum?: IEtheriumProvider
}
interface Navigator {
diff --git a/src/front/shared/components/Avatar/Avatar.tsx b/src/front/shared/components/Avatar/Avatar.tsx
index bfffbf128b..cad20c56c7 100644
--- a/src/front/shared/components/Avatar/Avatar.tsx
+++ b/src/front/shared/components/Avatar/Avatar.tsx
@@ -1,5 +1,4 @@
import React, { Fragment } from 'react'
-import PropTypes from 'prop-types'
import config from 'helpers/externalConfig'
import { toSvg } from 'jdenticon'
@@ -21,8 +20,17 @@ const hasGravatar = (ethAddress) => {
return false
}
-const Avatar = ({ value, className, size, ownerEthAddress }) => {
+type ComponentProps = {
+ value: string
+ size?: number
+ className?: string
+ ownerEthAddress?: string
+}
+
+const Avatar = (props: ComponentProps) => {
+ const { value, className, size = 35, ownerEthAddress } = props
let avatarUrl = `data:image/svg+xml,${encodeURIComponent(toSvg(value, size))}`
+
if (ownerEthAddress) {
const gravatar = hasGravatar(ownerEthAddress)
if (gravatar) {
@@ -42,15 +50,4 @@ const Avatar = ({ value, className, size, ownerEthAddress }) => {
)
}
-Avatar.defaultProps = {
- size: 35,
-}
-
-Avatar.propTypes = {
- value: PropTypes.string.isRequired,
- size: PropTypes.number,
- className: PropTypes.string,
- ownerEthAddress: PropTypes.string,
-}
-
export default CSSModules(Avatar, styles)
diff --git a/src/front/shared/components/Coins/Coins.tsx b/src/front/shared/components/Coins/Coins.tsx
index 3eec0232ce..6204e2fe15 100644
--- a/src/front/shared/components/Coins/Coins.tsx
+++ b/src/front/shared/components/Coins/Coins.tsx
@@ -1,27 +1,24 @@
import React from 'react'
-import PropTypes from 'prop-types'
-
import CSSModules from 'react-css-modules'
import styles from './Coins.scss'
import Coin from 'components/Coin/Coin'
-
-const Coins = ({ className, names, size }) => (
-
-
-
-
-)
-
-Coins.defaultProps = {
- size: 40,
+type ComponentProps = {
+ names: string[]
+ size?: number
+ className?: string
}
-Coins.propTypes = {
- names: PropTypes.array.isRequired,
- size: PropTypes.number,
- className: PropTypes.string,
+const Coins = (props: ComponentProps) => {
+ const { className, names, size = 40 } = props
+
+ return (
+
+
+
+
+ )
}
export default CSSModules(Coins, styles)
diff --git a/src/front/shared/components/Confirm/Confirm.tsx b/src/front/shared/components/Confirm/Confirm.tsx
index 7ac0bcf27e..16f5fd002e 100644
--- a/src/front/shared/components/Confirm/Confirm.tsx
+++ b/src/front/shared/components/Confirm/Confirm.tsx
@@ -1,6 +1,4 @@
import React from 'react'
-import PropTypes from 'prop-types'
-
import cssModules from 'react-css-modules'
import styles from './Confirm.scss'
@@ -9,33 +7,36 @@ import Button from 'components/controls/Button/Button'
import Center from 'components/layout/Center/Center'
import { FormattedMessage } from 'react-intl'
-const Confirm = ({ rootClassName, isConfirm, isReject, title, animation }) => (
-
-
-
{title}
-
-
-
-
-
-
-)
+type ComponentProps = {
+ rootClassName: string
+ isConfirm: () => void
+ isReject: () => void
+ title: () => JSX.Element
+ animation: boolean
+}
-Confirm.propTypes = {
- Center: PropTypes.node,
- rootClassName: PropTypes.string,
- isConfirm: PropTypes.func.isRequired,
- isReject: PropTypes.func.isRequired,
- title: PropTypes.string.isRequired,
- animation: PropTypes.bool,
+const Confirm = (props: ComponentProps) => {
+ const { rootClassName, isConfirm, isReject, title, animation } = props
+
+ return (
+
+
+
{title}
+
+
+
+
+
+
+ )
}
export default cssModules(Confirm, styles, { allowMultiple: true })
diff --git a/src/front/shared/components/FaqExpandableItem/FaqExpandableItem.tsx b/src/front/shared/components/FaqExpandableItem/FaqExpandableItem.tsx
index 2e41c04123..d8321b6bcc 100644
--- a/src/front/shared/components/FaqExpandableItem/FaqExpandableItem.tsx
+++ b/src/front/shared/components/FaqExpandableItem/FaqExpandableItem.tsx
@@ -1,22 +1,23 @@
import React from 'react'
-import PropTypes from 'prop-types'
-
import CSSModules from 'react-css-modules'
import styles from './FaqExpandableItem.scss'
-
import Href from 'components/Href/Href'
-const FaqExpandableItem = ({ link, question }) => (
-
-
- {question}
-
-
-)
+type ComponentProps = {
+ question: string
+ link: string
+}
+
+const FaqExpandableItem = (props: ComponentProps) => {
+ const { link, question } = props
-FaqExpandableItem.propTypes = {
- question: PropTypes.string.isRequired,
- link: PropTypes.string.isRequired,
+ return (
+
+
+ {question}
+
+
+ )
}
export default CSSModules(FaqExpandableItem, styles)
diff --git a/src/front/shared/components/InvoiceInfoBlock/InvoiceInfoBlock.tsx b/src/front/shared/components/InvoiceInfoBlock/InvoiceInfoBlock.tsx
index 71958cf661..9fa9f8f2b8 100644
--- a/src/front/shared/components/InvoiceInfoBlock/InvoiceInfoBlock.tsx
+++ b/src/front/shared/components/InvoiceInfoBlock/InvoiceInfoBlock.tsx
@@ -1,18 +1,31 @@
import React from 'react'
-import PropTypes from 'prop-types'
-
import cssModules from 'react-css-modules'
import styles from './InvoiceInfoBlock.scss'
import { FormattedMessage } from 'react-intl'
+type ComponentProps = {
+ invoiceData: {
+ invoiceNumber: number
+ amount: number
+ id: number
+ destAddress: string
+ fromAddress: string
+ label: string
+ type: string
+ }
+}
-const InvoiceInfoBlock = (props) => {
+const InvoiceInfoBlock = (props: ComponentProps) => {
const { invoiceData } = props
- let bip0020link = `bitcoin:${(invoiceData.destination) ? invoiceData.destination : invoiceData.fromAddress}`
+ let bip0020link = `bitcoin:${(invoiceData.destAddress) ? invoiceData.destAddress : invoiceData.fromAddress}`
+
bip0020link = `${bip0020link}?amount=${invoiceData.amount}`
bip0020link = `${bip0020link}&label=Invoice-${invoiceData.id}-${invoiceData.invoiceNumber}`
- if (invoiceData.label) bip0020link = `${bip0020link}&message=${encodeURI(invoiceData.label)}`
+
+ if (invoiceData.label) {
+ bip0020link = `${bip0020link}&message=${encodeURI(invoiceData.label)}`
+ }
return (
@@ -32,8 +45,4 @@ const InvoiceInfoBlock = (props) => {
)
}
-InvoiceInfoBlock.propTypes = {
- invoiceData: PropTypes.object,
-}
-
export default cssModules(InvoiceInfoBlock, styles, { allowMultiple: true })
diff --git a/src/front/shared/components/QR/QR.tsx b/src/front/shared/components/QR/QR.tsx
index 6ab85c186c..e024b1ff9a 100644
--- a/src/front/shared/components/QR/QR.tsx
+++ b/src/front/shared/components/QR/QR.tsx
@@ -1,17 +1,20 @@
import React, { Component } from 'react'
import CSSModules from 'react-css-modules'
import cx from 'classnames'
-import PropTypes from 'prop-types'
-import InlineLoader from 'components/loaders/InlineLoader/InlineLoader'
import animateFetching from 'components/loaders/ContentLoader/ElementLoading.scss'
import styles from './QR.scss'
-/**
- * @todo Amount support?
- */
+type ComponentProps = {
+ address: string
+}
+
+type ComponentState = {
+ renderQr: boolean
+}
+
@CSSModules({ ...styles, ...animateFetching }, { allowMultiple: true })
-export default class QR extends Component
{
+export default class QR extends Component {
constructor(props) {
super(props)
@@ -21,10 +24,6 @@ export default class QR extends Component {
}
}
- static propTypes = {
- address: PropTypes.string.isRequired,
- }
-
componentDidMount() {
setTimeout(() => {
this.setState({ renderQr: true })
diff --git a/src/front/shared/components/Timer/Timer.ts b/src/front/shared/components/Timer/Timer.ts
index da16f1efc4..20fb901c07 100644
--- a/src/front/shared/components/Timer/Timer.ts
+++ b/src/front/shared/components/Timer/Timer.ts
@@ -1,25 +1,21 @@
-import React, { Component } from 'react'
+import { Component } from 'react'
-import PropTypes from 'prop-types'
-
-
-export default class TimerButton extends Component {
-
- static propTypes = {
- timeLeft: PropTypes.number, // seconds
- handleClick: PropTypes.func,
- }
+type ComponentProps = {
+ timeLeft?: number // seconds
+ handleClick: () => void
+}
- static defaultProps = {
- timeLeft: 10,
- }
+type ComponentState = {
+ timeLeft: number
+}
+export default class TimerButton extends Component {
timer = null
constructor(props) {
super(props)
- const { timeLeft } = props
+ const { timeLeft = 10 } = props
this.state = {
timeLeft,
diff --git a/src/front/shared/components/controls/Flip/Flip.tsx b/src/front/shared/components/controls/Flip/Flip.tsx
index 501933f9a5..21145f3a3b 100644
--- a/src/front/shared/components/controls/Flip/Flip.tsx
+++ b/src/front/shared/components/controls/Flip/Flip.tsx
@@ -1,23 +1,23 @@
import React from 'react'
-import PropTypes from 'prop-types'
-
import CSSModules from 'react-css-modules'
import styles from './Flip.scss'
-
-const Flip = ({ onClick, className }) => (
- //@ts-ignore
-
-)
-
-Flip.propTypes = {
- onClick: PropTypes.func,
- className: PropTypes.string,
+type ComponentProps = {
+ onClick: () => void
+ className?: string
}
-Flip.defaulProps = {
- className: '',
-}
+const Flip = (props: ComponentProps) => {
+ const { onClick, className = '' } = props
+ return (
+
+ )
+}
export default CSSModules(Flip, styles)
diff --git a/src/front/shared/components/controls/Toggle/Toggle.tsx b/src/front/shared/components/controls/Toggle/Toggle.tsx
index df54698e4c..190d36e27a 100644
--- a/src/front/shared/components/controls/Toggle/Toggle.tsx
+++ b/src/front/shared/components/controls/Toggle/Toggle.tsx
@@ -1,20 +1,23 @@
import React from 'react'
-import PropTypes from 'prop-types'
-
import CSSModules from 'react-css-modules'
import styles from './Toggle.scss'
+type ComponentProps = {
+ checked: boolean
+ onChange: (arg: boolean) => void
+ dataTut?: string
+ isDisabled?: boolean
+}
-const Toggle = ({ checked, onChange, dataTut = null, isDisabled = false }) => (
-
-)
-
-Toggle.propTypes = {
- checked: PropTypes.bool.isRequired,
- onChange: PropTypes.func.isRequired,
+const Toggle = (props: ComponentProps) => {
+ const { checked, onChange, dataTut = null, isDisabled = false } = props
+
+ return (
+
+ )
}
export default CSSModules(Toggle, styles, { allowMultiple: true })
diff --git a/src/front/shared/components/controls/WithdrawButton/WithdrawButton.tsx b/src/front/shared/components/controls/WithdrawButton/WithdrawButton.tsx
index f843ab6497..70bd410ba9 100644
--- a/src/front/shared/components/controls/WithdrawButton/WithdrawButton.tsx
+++ b/src/front/shared/components/controls/WithdrawButton/WithdrawButton.tsx
@@ -1,15 +1,15 @@
-import React, { Fragment } from 'react'
-import PropTypes from 'prop-types'
-import config from 'app-config'
+import React from 'react'
import cx from 'classnames'
-
import CSSModules from 'react-css-modules'
import styles from './WithdrawButton.scss'
-import ReactTooltip from 'react-tooltip'
-import { FormattedMessage } from 'react-intl'
+type ComponentProps = {
+ onClick: () => void
+ disable: boolean
+ children: JSX.Element | JSX.Element[]
+}
-const WithdrawButton = (props) => {
+const WithdrawButton = (props: ComponentProps) => {
const {
onClick,
children,
@@ -17,21 +17,17 @@ const WithdrawButton = (props) => {
...rest
} = props
+ const doNothing = () => undefined
+
const styleName = cx('withdrawButton', {
'disable': disable,
})
return (
-