Browse Source

Flow & clean

master
meriadec 7 years ago
parent
commit
195fbdbcfb
No known key found for this signature in database GPG Key ID: 1D2FC2305E2CB399
  1. 2
      src/components/CryptoCurrencyIcon.js
  2. 6
      src/components/SideBar/index.js
  3. 10
      src/components/base/FormattedVal/__tests__/__snapshots__/FormattedVal.test.js.snap
  4. 6
      src/components/base/Input/index.js
  5. 4
      src/components/base/Radio/index.js
  6. 13
      src/components/modals/ImportAccounts/AccountRow.js
  7. 6
      src/components/modals/ImportAccounts/index.js
  8. 9
      src/components/modals/ImportAccounts/steps/03-step-import.js
  9. 2
      src/components/modals/ImportAccounts/steps/04-step-finish.js

2
src/components/CryptoCurrencyIcon.js

@ -6,7 +6,7 @@ import type { CryptoCurrency } from '@ledgerhq/live-common/lib/types'
type Props = { type Props = {
currency: CryptoCurrency, currency: CryptoCurrency,
size: number, size: number,
color: string, color?: string,
} }
class CryptoCurrencyIcon extends PureComponent<Props> { class CryptoCurrencyIcon extends PureComponent<Props> {

6
src/components/SideBar/index.js

@ -79,7 +79,11 @@ class SideBar extends PureComponent<Props> {
<Box flow={4}> <Box flow={4}>
<CapsSubtitle>{t('sidebar:menu')}</CapsSubtitle> <CapsSubtitle>{t('sidebar:menu')}</CapsSubtitle>
<Box px={4} flow={2}> <Box px={4} flow={2}>
<Item icon={<IconPieChart size={16} />} linkTo="/" highlight={updateStatus === 'downloaded'}> <Item
icon={<IconPieChart size={16} />}
linkTo="/"
highlight={updateStatus === 'downloaded'}
>
{t('dashboard:title')} {t('dashboard:title')}
</Item> </Item>
<Item icon={<IconSend size={16} />} modal={MODAL_SEND}> <Item icon={<IconSend size={16} />} modal={MODAL_SEND}>

10
src/components/base/FormattedVal/__tests__/__snapshots__/FormattedVal.test.js.snap

@ -2,7 +2,7 @@
exports[`components FormattedVal renders a formatted val 1`] = ` exports[`components FormattedVal renders a formatted val 1`] = `
<div <div
className="k45ou1-0 iqaJGf e345n3-0 eoitYS" className="k45ou1-0 iqaJGf e345n3-0 kZMOmW"
color="#66be54" color="#66be54"
> >
4 4
@ -11,7 +11,7 @@ exports[`components FormattedVal renders a formatted val 1`] = `
exports[`components FormattedVal renders a percent 1`] = ` exports[`components FormattedVal renders a percent 1`] = `
<div <div
className="k45ou1-0 iqaJGf e345n3-0 eoitYS" className="k45ou1-0 iqaJGf e345n3-0 kZMOmW"
color="#66be54" color="#66be54"
> >
30 % 30 %
@ -20,7 +20,7 @@ exports[`components FormattedVal renders a percent 1`] = `
exports[`components FormattedVal shows code 1`] = ` exports[`components FormattedVal shows code 1`] = `
<div <div
className="k45ou1-0 iqaJGf e345n3-0 eoitYS" className="k45ou1-0 iqaJGf e345n3-0 kZMOmW"
color="#66be54" color="#66be54"
> >
BTC 4 BTC 4
@ -29,7 +29,7 @@ exports[`components FormattedVal shows code 1`] = `
exports[`components FormattedVal shows sign 1`] = ` exports[`components FormattedVal shows sign 1`] = `
<div <div
className="k45ou1-0 iqaJGf e345n3-0 eoitYS" className="k45ou1-0 iqaJGf e345n3-0 kZMOmW"
color="#66be54" color="#66be54"
> >
+ 4 + 4
@ -38,7 +38,7 @@ exports[`components FormattedVal shows sign 1`] = `
exports[`components FormattedVal shows sign 2`] = ` exports[`components FormattedVal shows sign 2`] = `
<div <div
className="k45ou1-0 iqaJGf e345n3-0 lkKRAD" className="k45ou1-0 iqaJGf e345n3-0 fMRVKr"
color="#ea2e49" color="#ea2e49"
> >
- 4 - 4

6
src/components/base/Input/index.js

@ -102,7 +102,7 @@ class Input extends PureComponent<Props, State> {
} }
} }
handleKeyDown = (e: SyntheticInputEvent<HTMLInputElement>) => { handleKeyDown = (e: SyntheticKeyboardEvent<HTMLInputElement>) => {
// handle enter key // handle enter key
if (e.which === 13) { if (e.which === 13) {
const { onEnter } = this.props const { onEnter } = this.props
@ -137,8 +137,8 @@ class Input extends PureComponent<Props, State> {
} }
handleSelectEverything = () => { handleSelectEverything = () => {
this._input.setSelectionRange(0, this._input.value.length) this._input && this._input.setSelectionRange(0, this._input.value.length)
this._input.focus() this._input && this._input.focus()
} }
_input = null _input = null

4
src/components/base/Radio/index.js

@ -66,8 +66,4 @@ function Radio(props: Props) {
return <Base {...props} isChecked={isChecked} onClick={() => onChange && onChange(!isChecked)} /> return <Base {...props} isChecked={isChecked} onClick={() => onChange && onChange(!isChecked)} />
} }
Radio.defaultProps = {
onChange: null,
}
export default Radio export default Radio

13
src/components/modals/ImportAccounts/AccountRow.js

@ -2,6 +2,7 @@
import React, { PureComponent } from 'react' import React, { PureComponent } from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import type { Account } from '@ledgerhq/live-common/lib/types'
import { darken } from 'styles/helpers' import { darken } from 'styles/helpers'
@ -32,20 +33,20 @@ export default class AccountRow extends PureComponent<Props, State> {
accountNameCopy: '', accountNameCopy: '',
} }
componentDidUpdate(prevProps, prevState) { componentDidUpdate(prevProps: Props, prevState: State) {
const startedEditing = !prevState.isEditing && this.state.isEditing const startedEditing = !prevState.isEditing && this.state.isEditing
if (startedEditing) { if (startedEditing) {
this._input.handleSelectEverything() this._input && this._input.handleSelectEverything()
} }
} }
handleEditClick = e => { handleEditClick = (e: SyntheticEvent<any>) => {
this.handlePreventSubmit(e) this.handlePreventSubmit(e)
const { account } = this.props const { account } = this.props
this.setState({ isEditing: true, accountNameCopy: account.name }) this.setState({ isEditing: true, accountNameCopy: account.name })
} }
handleSubmitName = e => { handleSubmitName = (e: SyntheticEvent<any>) => {
this.handlePreventSubmit(e) this.handlePreventSubmit(e)
const { account, onAccountUpdate, isChecked, onClick } = this.props const { account, onAccountUpdate, isChecked, onClick } = this.props
const { accountNameCopy } = this.state const { accountNameCopy } = this.state
@ -57,13 +58,13 @@ export default class AccountRow extends PureComponent<Props, State> {
} }
} }
handlePreventSubmit = e => { handlePreventSubmit = (e: SyntheticEvent<any>) => {
// prevent account row to be submitted // prevent account row to be submitted
e.preventDefault() e.preventDefault()
e.stopPropagation() e.stopPropagation()
} }
handleChangeName = accountNameCopy => this.setState({ accountNameCopy }) handleChangeName = (accountNameCopy: string) => this.setState({ accountNameCopy })
handleReset = () => this.setState({ isEditing: false, accountNameCopy: '' }) handleReset = () => this.setState({ isEditing: false, accountNameCopy: '' })

6
src/components/modals/ImportAccounts/index.js

@ -62,6 +62,8 @@ type Props = {
t: T, t: T,
currentDevice: ?Device, currentDevice: ?Device,
existingAccounts: Account[], existingAccounts: Account[],
closeModal: string => void,
addAccount: Account => void,
} }
type StepId = 'chooseCurrency' | 'connectDevice' | 'import' | 'finish' type StepId = 'chooseCurrency' | 'connectDevice' | 'import' | 'finish'
@ -87,7 +89,7 @@ export type StepProps = {
isAppOpened: boolean, isAppOpened: boolean,
transitionTo: StepId => void, transitionTo: StepId => void,
setState: any => void, setState: any => void,
onClickImport: void => void, onClickImport: void => Promise<void>,
onCloseModal: void => void, onCloseModal: void => void,
// scan process // scan process
@ -114,6 +116,8 @@ const INITIAL_STATE = {
currency: null, currency: null,
scannedAccounts: [], scannedAccounts: [],
checkedAccountsIds: [], checkedAccountsIds: [],
err: null,
scanStatus: 'idle',
} }
class ImportAccounts extends PureComponent<Props, State> { class ImportAccounts extends PureComponent<Props, State> {

9
src/components/modals/ImportAccounts/steps/03-step-import.js

@ -1,6 +1,7 @@
// @flow // @flow
import React, { PureComponent } from 'react' import React, { PureComponent } from 'react'
import type { Account } from '@ledgerhq/live-common/lib/types'
import { getBridgeForCurrency } from 'bridge' import { getBridgeForCurrency } from 'bridge'
@ -15,17 +16,17 @@ import type { StepProps } from '../index'
class StepImport extends PureComponent<StepProps> { class StepImport extends PureComponent<StepProps> {
componentDidMount() { componentDidMount() {
console.log(`starting import...`)
this.startScanAccountsDevice() this.startScanAccountsDevice()
} }
componentWillUnmount() { componentWillUnmount() {
console.log(`stopping import...`)
if (this.scanSubscription) { if (this.scanSubscription) {
this.scanSubscription.unsubscribe() this.scanSubscription.unsubscribe()
} }
} }
scanSubscription = null
startScanAccountsDevice() { startScanAccountsDevice() {
const { currency, currentDevice, setState } = this.props const { currency, currentDevice, setState } = this.props
try { try {
@ -79,7 +80,7 @@ class StepImport extends PureComponent<StepProps> {
}) })
} }
handleToggleAccount = account => { handleToggleAccount = (account: Account) => {
const { checkedAccountsIds, setState } = this.props const { checkedAccountsIds, setState } = this.props
const isChecked = checkedAccountsIds.find(id => id === account.id) !== undefined const isChecked = checkedAccountsIds.find(id => id === account.id) !== undefined
if (isChecked) { if (isChecked) {
@ -89,7 +90,7 @@ class StepImport extends PureComponent<StepProps> {
} }
} }
handleAccountUpdate = updatedAccount => { handleAccountUpdate = (updatedAccount: Account) => {
const { scannedAccounts, setState } = this.props const { scannedAccounts, setState } = this.props
setState({ setState({
scannedAccounts: scannedAccounts.map(account => { scannedAccounts: scannedAccounts.map(account => {

2
src/components/modals/ImportAccounts/steps/04-step-finish.js

@ -6,6 +6,8 @@ import Box from 'components/base/Box'
import Button from 'components/base/Button' import Button from 'components/base/Button'
import IconCheckCircle from 'icons/CheckCircle' import IconCheckCircle from 'icons/CheckCircle'
import type { StepProps } from '../index'
function StepFinish({ onCloseModal }: StepProps) { function StepFinish({ onCloseModal }: StepProps) {
return ( return (
<Box align="center" py={6}> <Box align="center" py={6}>

Loading…
Cancel
Save