Unverified Commit 2c4cdf01 authored by Amaury Martiny's avatar Amaury Martiny Committed by GitHub

Merge pull request #139 from paritytech/am-fix-form

Fix form
parents 739f1eff ef9c645e
......@@ -54,7 +54,6 @@
"react-markdown": "^3.3.4",
"react-router-dom": "^4.2.2",
"react-scripts": "1.1.4",
"react-tooltip": "^3.6.1",
"recompose": "^0.27.1",
"rxjs": "^6.2.0"
},
......
......@@ -4,7 +4,7 @@
// SPDX-License-Identifier: BSD-3-Clause
import React, { Component } from 'react';
import { AccountCard, Card, FormField } from 'fether-ui';
import { AccountCard, Card, Form as FetherForm } from 'fether-ui';
import Blockies from 'react-blockies';
import { inject, observer } from 'mobx-react';
import { Link } from 'react-router-dom';
......@@ -79,7 +79,7 @@ class AccountName extends Component {
<div className='text'>
<p>Please give this account a name:</p>
</div>
<FormField
<FetherForm.Field
label='Name'
onChange={this.handleChangeName}
required
......
......@@ -4,7 +4,7 @@
// SPDX-License-Identifier: BSD-3-Clause
import React, { Component } from 'react';
import { AccountCard, FormField } from 'fether-ui';
import { AccountCard, Form as FetherForm } from 'fether-ui';
import { inject, observer } from 'mobx-react';
@inject('createAccountStore')
......@@ -55,7 +55,7 @@ class AccountPassword extends Component {
<p>Secure your account with a password:</p>
</div>
<FormField
<FetherForm.Field
label='Password'
onChange={this.handlePasswordChange}
required
......@@ -63,7 +63,7 @@ class AccountPassword extends Component {
value={password}
/>
<FormField
<FetherForm.Field
label='Confirm'
onChange={this.handleConfirmChange}
required
......
......@@ -4,7 +4,7 @@
// SPDX-License-Identifier: BSD-3-Clause
import React, { Component } from 'react';
import { AccountCard, FormField } from 'fether-ui';
import { AccountCard, Form as FetherForm } from 'fether-ui';
import debounce from 'lodash/debounce';
import { inject, observer } from 'mobx-react';
......@@ -77,11 +77,12 @@ class AccountRewritePhrase extends Component {
</p>
)}
</div>
<FormField
input={
<textarea onChange={this.handleChange} required value={value} />
}
<FetherForm.Field
as='textarea'
label='Recovery phrase'
onChange={this.handleChange}
required
value={value}
/>
<nav className='form-nav -space-around'>
......
......@@ -29,13 +29,6 @@ const Router =
@inject('healthStore', 'onboardingStore')
@observer
class App extends Component {
componentDidCatch () {
if (process.env.NODE_ENV !== 'development') {
// Redirect to '/' on errors
window.location.href = '/';
}
}
render () {
return (
<Router>
......
......@@ -4,7 +4,7 @@
// SPDX-License-Identifier: BSD-3-Clause
import React, { Component } from 'react';
import { FormField, Header } from 'fether-ui';
import { Form as FetherForm, Header } from 'fether-ui';
import { inject, observer } from 'mobx-react';
import ReactMarkdown from 'react-markdown';
......@@ -54,14 +54,11 @@ class Onboarding extends Component {
<div className='window_content'>
<div className='box -padded'>
<FormField
input={
<ReactMarkdown
className='terms-and-conditions'
renderers={reactMarkdownOptions}
source={this.state.markdown}
/>
}
<FetherForm.Field
as={ReactMarkdown}
className='terms-and-conditions'
renderers={reactMarkdownOptions}
source={this.state.markdown}
label='Please read carefully'
/>
</div>
......
......@@ -39,6 +39,7 @@
.account_name {
color: $black;
font-weight: 500;
margin-bottom: 0.1rem;
}
.account_address {
......
......@@ -37,13 +37,6 @@ jest.mock('./parityStore', () => ({
}
}));
jest.mock('./tokensStore', () => ({
tokens: {
ETH: { decimals: 18 },
foo: { decimals: 18 }
}
}));
const mockTx = {
amount: 0.01, // In Ether or in token
gasPrice: 4, // in Gwei
......@@ -117,9 +110,13 @@ describe('method send', () => {
sendStore.setTx(mockTx);
});
test.skip('should call transfer$ if the token is Erc20 and subscribe to it', () => {
test('should call makeContract$ if the token is Erc20 ', () => {
sendStore.send(mockErc20Token);
expect(sendStore.contract.transfer$).toHaveBeenCalled();
expect(lightJs.makeContract$).toHaveBeenCalled();
});
test.skip('should call transfer$ if the token is Erc20 and subscribe to it', () => {
// TODO
});
test('should call post$ if the token is ETH and subscribe to it', () => {
......
......@@ -33,7 +33,6 @@
"dependencies": {
"react-blockies": "^1.3.0",
"react-content-loader": "^3.1.2",
"react-tooltip": "^3.6.1",
"semantic-ui-css": "^2.3.2",
"semantic-ui-react": "^0.81.3"
},
......
......@@ -18,7 +18,7 @@ export const Address = ({ address, short, ...otherProps }) => (
address
)
) : (
<Placeholder height={18} width={100} />
<Placeholder height={14} width={100} />
)}
</div>
);
......
......@@ -4,8 +4,9 @@
// SPDX-License-Identifier: BSD-3-Clause
import React, { PureComponent } from 'react';
import { Popup } from 'semantic-ui-react';
import PropTypes from 'prop-types';
import ReactTooltip from 'react-tooltip';
import 'semantic-ui-css/components/popup.min.css';
export class ClickToCopy extends PureComponent {
static defaultProps = {
......@@ -21,10 +22,6 @@ export class ClickToCopy extends PureComponent {
copied: false
};
componentWillUnmount () {
window.clearTimeout(this.timeout);
}
handleCopy = () => {
// https://hackernoon.com/copying-text-to-clipboard-with-javascript-df4d4988697f
// Note react-copy-to-clipboard created a bug, https://github.com/nkbt/react-copy-to-clipboard/issues/92
......@@ -36,35 +33,27 @@ export class ClickToCopy extends PureComponent {
document.body.removeChild(el);
this.setState({ copied: true });
// Show the copied state only for 1s
if (this.timeout) {
window.clearTimeout(this.timeout);
}
this.timeout = window.setTimeout(
() => this.setState({ copied: false }),
1000
);
};
handleResetCopied = () => {};
handleResetCopied = () => this.setState({ copied: false });
render () {
const { children, label, ...otherProps } = this.props;
const { children, label, textToCopy, ...otherProps } = this.props;
const { copied } = this.state;
return (
<div data-tip='' onClick={this.handleCopy}>
{children}
<ReactTooltip
effect='solid'
event='mouseover'
eventOff='mouseout'
place='bottom'
getContent={[() => (copied ? 'Copied.' : label), 50]}
{...otherProps}
/>
</div>
<Popup
content={copied ? 'Copied.' : 'Click to copy'}
inverted
onClose={this.handleResetCopied}
position='bottom center'
size='mini'
trigger={
<div onClick={this.handleCopy} {...otherProps}>
{children}
</div>
}
/>
);
}
}
......@@ -21,7 +21,9 @@ export const Field = ({
content={meta && (meta.error || meta.submitError)}
inverted
on='click'
open={meta && !meta.pristine && !meta.valid && !meta.dirtySinceLastSubmit}
open={
!!meta && !meta.pristine && !meta.valid && !meta.dirtySinceLastSubmit
}
position='top center'
size='mini'
trigger={<T {...input} {...otherProps} />}
......
......@@ -9667,13 +9667,6 @@ react-scripts@1.1.4:
optionalDependencies:
fsevents "^1.1.3"
react-tooltip@^3.6.1:
version "3.6.1"
resolved "https://registry.yarnpkg.com/react-tooltip/-/react-tooltip-3.6.1.tgz#2ca993baa50d7e0271b8d13c6024445a883842eb"
dependencies:
classnames "^2.2.5"
prop-types "^15.6.0"
react@^16.3.2, react@^16.4.0:
version "16.4.1"
resolved "https://registry.yarnpkg.com/react/-/react-16.4.1.tgz#de51ba5764b5dbcd1f9079037b862bd26b82fe32"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment