Add functionalities to multi-sig wallet (#3729)
* WIP Sending tokens in multi-sig wallet * Working Token transfer for multi-sig wallet #3282 * Add operation hash to transfer modal * Add existing wallet from address #3282 * Wallet delete redirect to Wallets/Accounts #3282 * Rightly check balance in Transfer // Get all accounts balances #3282 * Fix linting * Better Header UI for Wallet * Use the `~` webpack alias * Use Webpack `~` alias
This commit is contained in:
Nicolas Gotchac
Jaco Greeff
parent
be90245ecb
commit
8dbd56888d
@ -189,15 +189,21 @@ export default class Contract {
|
||||
});
|
||||
}
|
||||
|
||||
_encodeOptions (func, options, values) {
|
||||
getCallData = (func, options, values) => {
|
||||
let data = options.data;
|
||||
|
||||
const tokens = func ? this._abi.encodeTokens(func.inputParamTypes(), values) : null;
|
||||
const call = tokens ? func.encodeCall(tokens) : null;
|
||||
|
||||
if (options.data && options.data.substr(0, 2) === '0x') {
|
||||
options.data = options.data.substr(2);
|
||||
if (data && data.substr(0, 2) === '0x') {
|
||||
data = data.substr(2);
|
||||
}
|
||||
options.data = `0x${options.data || ''}${call || ''}`;
|
||||
|
||||
return `0x${data || ''}${call || ''}`;
|
||||
}
|
||||
|
||||
_encodeOptions (func, options, values) {
|
||||
options.data = this.getCallData(func, options, values);
|
||||
return options;
|
||||
}
|
||||
|
||||
@ -209,10 +215,10 @@ export default class Contract {
|
||||
|
||||
_bindFunction = (func) => {
|
||||
func.call = (options, values = []) => {
|
||||
const callData = this._encodeOptions(func, this._addOptionsTo(options), values);
|
||||
const callParams = this._encodeOptions(func, this._addOptionsTo(options), values);
|
||||
|
||||
return this._api.eth
|
||||
.call(callData)
|
||||
.call(callParams)
|
||||
.then((encoded) => func.decodeOutput(encoded))
|
||||
.then((tokens) => tokens.map((token) => token.value))
|
||||
.then((returns) => returns.length === 1 ? returns[0] : returns);
|
||||
|
||||
@ -1,3 +1,19 @@
|
||||
// Copyright 2015, 2016 Ethcore (UK) Ltd.
|
||||
// This file is part of Parity.
|
||||
|
||||
// Parity is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU General Public License as published by
|
||||
// the Free Software Foundation, either version 3 of the License, or
|
||||
// (at your option) any later version.
|
||||
|
||||
// Parity is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU General Public License for more details.
|
||||
|
||||
// You should have received a copy of the GNU General Public License
|
||||
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
import React, { Component, PropTypes } from 'react';
|
||||
import { Card, CardHeader, CardText } from 'material-ui/Card';
|
||||
import TextField from 'material-ui/TextField';
|
||||
|
||||
@ -16,18 +16,62 @@
|
||||
|
||||
import React, { Component, PropTypes } from 'react';
|
||||
|
||||
import { Form, TypedInput, Input, AddressSelect } from '../../../ui';
|
||||
import { parseAbiType } from '../../../util/abi';
|
||||
import { Form, TypedInput, Input, AddressSelect, InputAddress } from '~/ui';
|
||||
import { parseAbiType } from '~/util/abi';
|
||||
|
||||
import styles from '../createWallet.css';
|
||||
|
||||
export default class WalletDetails extends Component {
|
||||
static propTypes = {
|
||||
accounts: PropTypes.object.isRequired,
|
||||
wallet: PropTypes.object.isRequired,
|
||||
errors: PropTypes.object.isRequired,
|
||||
onChange: PropTypes.func.isRequired
|
||||
onChange: PropTypes.func.isRequired,
|
||||
walletType: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
render () {
|
||||
const { walletType } = this.props;
|
||||
|
||||
if (walletType === 'WATCH') {
|
||||
return this.renderWatchDetails();
|
||||
}
|
||||
|
||||
return this.renderMultisigDetails();
|
||||
}
|
||||
|
||||
renderWatchDetails () {
|
||||
const { wallet, errors } = this.props;
|
||||
|
||||
return (
|
||||
<Form>
|
||||
<InputAddress
|
||||
label='wallet address'
|
||||
hint='the wallet contract address'
|
||||
value={ wallet.address }
|
||||
error={ errors.address }
|
||||
onChange={ this.onAddressChange }
|
||||
/>
|
||||
|
||||
<Input
|
||||
label='wallet name'
|
||||
hint='the local name for this wallet'
|
||||
value={ wallet.name }
|
||||
error={ errors.name }
|
||||
onChange={ this.onNameChange }
|
||||
/>
|
||||
|
||||
<Input
|
||||
label='wallet description (optional)'
|
||||
hint='the local description for this wallet'
|
||||
value={ wallet.description }
|
||||
onChange={ this.onDescriptionChange }
|
||||
/>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
||||
renderMultisigDetails () {
|
||||
const { accounts, wallet, errors } = this.props;
|
||||
|
||||
return (
|
||||
@ -64,27 +108,34 @@ export default class WalletDetails extends Component {
|
||||
param={ parseAbiType('address[]') }
|
||||
/>
|
||||
|
||||
<TypedInput
|
||||
label='required owners'
|
||||
hint='number of required owners to accept a transaction'
|
||||
value={ wallet.required }
|
||||
error={ errors.required }
|
||||
onChange={ this.onRequiredChange }
|
||||
param={ parseAbiType('uint') }
|
||||
/>
|
||||
<div className={ styles.splitInput }>
|
||||
<TypedInput
|
||||
label='required owners'
|
||||
hint='number of required owners to accept a transaction'
|
||||
value={ wallet.required }
|
||||
error={ errors.required }
|
||||
onChange={ this.onRequiredChange }
|
||||
param={ parseAbiType('uint') }
|
||||
min={ 1 }
|
||||
/>
|
||||
|
||||
<TypedInput
|
||||
label='wallet day limit'
|
||||
hint='number of days to wait for other owners confirmation'
|
||||
value={ wallet.daylimit }
|
||||
error={ errors.daylimit }
|
||||
onChange={ this.onDaylimitChange }
|
||||
param={ parseAbiType('uint') }
|
||||
/>
|
||||
<TypedInput
|
||||
label='wallet day limit'
|
||||
hint='number of days to wait for other owners confirmation'
|
||||
value={ wallet.daylimit }
|
||||
error={ errors.daylimit }
|
||||
onChange={ this.onDaylimitChange }
|
||||
param={ parseAbiType('uint') }
|
||||
/>
|
||||
</div>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
||||
onAddressChange = (_, address) => {
|
||||
this.props.onChange({ address });
|
||||
}
|
||||
|
||||
onAccoutChange = (_, account) => {
|
||||
this.props.onChange({ account });
|
||||
}
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
|
||||
import React, { Component, PropTypes } from 'react';
|
||||
|
||||
import { CompletedStep, IdentityIcon, CopyToClipboard } from '../../../ui';
|
||||
import { CompletedStep, IdentityIcon, CopyToClipboard } from '~/ui';
|
||||
|
||||
import styles from '../createWallet.css';
|
||||
|
||||
@ -34,15 +34,21 @@ export default class WalletInfo extends Component {
|
||||
daylimit: PropTypes.oneOfType([
|
||||
PropTypes.string,
|
||||
PropTypes.number
|
||||
]).isRequired
|
||||
]).isRequired,
|
||||
|
||||
deployed: PropTypes.bool
|
||||
};
|
||||
|
||||
render () {
|
||||
const { address, required, daylimit, name } = this.props;
|
||||
const { address, required, daylimit, name, deployed } = this.props;
|
||||
|
||||
return (
|
||||
<CompletedStep>
|
||||
<div><code>{ name }</code> has been deployed at</div>
|
||||
<div>
|
||||
<code>{ name }</code>
|
||||
<span> has been </span>
|
||||
<span> { deployed ? 'deployed' : 'added' } at </span>
|
||||
</div>
|
||||
<div>
|
||||
<CopyToClipboard data={ address } label='copy address to clipboard' />
|
||||
<IdentityIcon address={ address } inline center className={ styles.identityicon } />
|
||||
@ -63,9 +69,9 @@ export default class WalletInfo extends Component {
|
||||
}
|
||||
|
||||
renderOwners () {
|
||||
const { account, owners } = this.props;
|
||||
const { account, owners, deployed } = this.props;
|
||||
|
||||
return [].concat(account, owners).map((address, id) => (
|
||||
return [].concat(deployed ? account : null, owners).filter((a) => a).map((address, id) => (
|
||||
<div key={ id } className={ styles.owner }>
|
||||
<IdentityIcon address={ address } inline center className={ styles.identityicon } />
|
||||
<div className={ styles.address }>{ this.addressToString(address) }</div>
|
||||
|
||||
17
js/src/modals/CreateWallet/WalletType/index.js
Normal file
17
js/src/modals/CreateWallet/WalletType/index.js
Normal file
@ -0,0 +1,17 @@
|
||||
// Copyright 2015, 2016 Ethcore (UK) Ltd.
|
||||
// This file is part of Parity.
|
||||
|
||||
// Parity is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU General Public License as published by
|
||||
// the Free Software Foundation, either version 3 of the License, or
|
||||
// (at your option) any later version.
|
||||
|
||||
// Parity is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU General Public License for more details.
|
||||
|
||||
// You should have received a copy of the GNU General Public License
|
||||
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
export default from './walletType.js';
|
||||
58
js/src/modals/CreateWallet/WalletType/walletType.js
Normal file
58
js/src/modals/CreateWallet/WalletType/walletType.js
Normal file
@ -0,0 +1,58 @@
|
||||
// Copyright 2015, 2016 Ethcore (UK) Ltd.
|
||||
// This file is part of Parity.
|
||||
|
||||
// Parity is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU General Public License as published by
|
||||
// the Free Software Foundation, either version 3 of the License, or
|
||||
// (at your option) any later version.
|
||||
|
||||
// Parity is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU General Public License for more details.
|
||||
|
||||
// You should have received a copy of the GNU General Public License
|
||||
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
import React, { Component, PropTypes } from 'react';
|
||||
|
||||
import { RadioButtons } from '~/ui';
|
||||
|
||||
// import styles from '../createWallet.css';
|
||||
|
||||
export default class WalletType extends Component {
|
||||
static propTypes = {
|
||||
onChange: PropTypes.func.isRequired,
|
||||
type: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
render () {
|
||||
const { type } = this.props;
|
||||
|
||||
return (
|
||||
<RadioButtons
|
||||
name='contractType'
|
||||
value={ type }
|
||||
values={ this.getTypes() }
|
||||
onChange={ this.onTypeChange }
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
getTypes () {
|
||||
return [
|
||||
{
|
||||
label: 'Multi-Sig wallet', key: 'MULTISIG',
|
||||
description: 'A standard multi-signature Wallet'
|
||||
},
|
||||
{
|
||||
label: 'Watch a wallet', key: 'WATCH',
|
||||
description: 'Add an existing wallet to your accounts'
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
onTypeChange = (type) => {
|
||||
this.props.onChange(type.key);
|
||||
}
|
||||
}
|
||||
@ -37,3 +37,22 @@
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.splitInput {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
> * {
|
||||
flex: 1;
|
||||
|
||||
margin: 0 0.25em;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -21,8 +21,9 @@ import ActionDone from 'material-ui/svg-icons/action/done';
|
||||
import ContentClear from 'material-ui/svg-icons/content/clear';
|
||||
import NavigationArrowForward from 'material-ui/svg-icons/navigation/arrow-forward';
|
||||
|
||||
import { Button, Modal, TxHash, BusyStep } from '../../ui';
|
||||
import { Button, Modal, TxHash, BusyStep } from '~/ui';
|
||||
|
||||
import WalletType from './WalletType';
|
||||
import WalletDetails from './WalletDetails';
|
||||
import WalletInfo from './WalletInfo';
|
||||
import CreateWalletStore from './createWalletStore';
|
||||
@ -64,7 +65,7 @@ export default class CreateWallet extends Component {
|
||||
visible
|
||||
actions={ this.renderDialogActions() }
|
||||
current={ stage }
|
||||
steps={ steps }
|
||||
steps={ steps.map((s) => s.title) }
|
||||
waiting={ waiting }
|
||||
>
|
||||
{ this.renderPage() }
|
||||
@ -98,24 +99,35 @@ export default class CreateWallet extends Component {
|
||||
required={ this.store.wallet.required }
|
||||
daylimit={ this.store.wallet.daylimit }
|
||||
name={ this.store.wallet.name }
|
||||
|
||||
deployed={ this.store.deployed }
|
||||
/>
|
||||
);
|
||||
|
||||
default:
|
||||
case 'DETAILS':
|
||||
return (
|
||||
<WalletDetails
|
||||
accounts={ accounts }
|
||||
wallet={ this.store.wallet }
|
||||
errors={ this.store.errors }
|
||||
walletType={ this.store.walletType }
|
||||
onChange={ this.store.onChange }
|
||||
/>
|
||||
);
|
||||
|
||||
default:
|
||||
case 'TYPE':
|
||||
return (
|
||||
<WalletType
|
||||
onChange={ this.store.onTypeChange }
|
||||
type={ this.store.walletType }
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
renderDialogActions () {
|
||||
const { step, hasErrors, rejected, onCreate } = this.store;
|
||||
const { step, hasErrors, rejected, onCreate, onNext, onAdd } = this.store;
|
||||
|
||||
const cancelBtn = (
|
||||
<Button
|
||||
@ -149,12 +161,11 @@ export default class CreateWallet extends Component {
|
||||
/>
|
||||
);
|
||||
|
||||
const createBtn = (
|
||||
const nextBtn = (
|
||||
<Button
|
||||
icon={ <NavigationArrowForward /> }
|
||||
label='Create'
|
||||
disabled={ hasErrors }
|
||||
onClick={ onCreate }
|
||||
label='Next'
|
||||
onClick={ onNext }
|
||||
/>
|
||||
);
|
||||
|
||||
@ -169,9 +180,30 @@ export default class CreateWallet extends Component {
|
||||
case 'INFO':
|
||||
return [ doneBtn ];
|
||||
|
||||
default:
|
||||
case 'DETAILS':
|
||||
return [ cancelBtn, createBtn ];
|
||||
if (this.store.walletType === 'WATCH') {
|
||||
return [ cancelBtn, (
|
||||
<Button
|
||||
icon={ <NavigationArrowForward /> }
|
||||
label='Add'
|
||||
disabled={ hasErrors }
|
||||
onClick={ onAdd }
|
||||
/>
|
||||
) ];
|
||||
}
|
||||
|
||||
return [ cancelBtn, (
|
||||
<Button
|
||||
icon={ <NavigationArrowForward /> }
|
||||
label='Create'
|
||||
disabled={ hasErrors }
|
||||
onClick={ onCreate }
|
||||
/>
|
||||
) ];
|
||||
|
||||
default:
|
||||
case 'TYPE':
|
||||
return [ cancelBtn, nextBtn ];
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -16,26 +16,29 @@
|
||||
|
||||
import { observable, computed, action, transaction } from 'mobx';
|
||||
|
||||
import { ERRORS, validateUint, validateAddress, validateName } from '../../util/validation';
|
||||
import { ERROR_CODES } from '../../api/transport/error';
|
||||
import { validateUint, validateAddress, validateName } from '../../util/validation';
|
||||
import { ERROR_CODES } from '~/api/transport/error';
|
||||
|
||||
import { wallet as walletAbi } from '../../contracts/abi';
|
||||
import { wallet as walletCode } from '../../contracts/code';
|
||||
import Contract from '~/api/contract';
|
||||
import { wallet as walletAbi } from '~/contracts/abi';
|
||||
import { wallet as walletCode } from '~/contracts/code';
|
||||
|
||||
import WalletsUtils from '~/util/wallets';
|
||||
|
||||
const STEPS = {
|
||||
TYPE: { title: 'wallet type' },
|
||||
DETAILS: { title: 'wallet details' },
|
||||
DEPLOYMENT: { title: 'wallet deployment', waiting: true },
|
||||
INFO: { title: 'wallet informaton' }
|
||||
};
|
||||
|
||||
const STEPS_KEYS = Object.keys(STEPS);
|
||||
|
||||
export default class CreateWalletStore {
|
||||
@observable step = null;
|
||||
@observable rejected = false;
|
||||
|
||||
@observable deployState = null;
|
||||
@observable deployError = null;
|
||||
@observable deployed = false;
|
||||
|
||||
@observable txhash = null;
|
||||
|
||||
@ -49,45 +52,103 @@ export default class CreateWalletStore {
|
||||
name: '',
|
||||
description: ''
|
||||
};
|
||||
@observable walletType = 'MULTISIG';
|
||||
|
||||
@observable errors = {
|
||||
account: null,
|
||||
address: null,
|
||||
owners: null,
|
||||
required: null,
|
||||
daylimit: null,
|
||||
|
||||
name: ERRORS.invalidName
|
||||
name: null
|
||||
};
|
||||
|
||||
@computed get stage () {
|
||||
return STEPS_KEYS.findIndex((k) => k === this.step);
|
||||
return this.stepsKeys.findIndex((k) => k === this.step);
|
||||
}
|
||||
|
||||
@computed get hasErrors () {
|
||||
return !!Object.values(this.errors).find((e) => !!e);
|
||||
return !!Object.keys(this.errors)
|
||||
.filter((errorKey) => {
|
||||
if (this.walletType === 'WATCH') {
|
||||
return ['address', 'name'].includes(errorKey);
|
||||
}
|
||||
|
||||
return errorKey !== 'address';
|
||||
})
|
||||
.find((key) => !!this.errors[key]);
|
||||
}
|
||||
|
||||
steps = Object.values(STEPS).map((s) => s.title);
|
||||
waiting = Object.values(STEPS)
|
||||
.map((s, idx) => ({ idx, waiting: s.waiting }))
|
||||
.filter((s) => s.waiting)
|
||||
.map((s) => s.idx);
|
||||
@computed get stepsKeys () {
|
||||
return this.steps.map((s) => s.key);
|
||||
}
|
||||
|
||||
@computed get steps () {
|
||||
return Object
|
||||
.keys(STEPS)
|
||||
.map((key) => {
|
||||
return {
|
||||
...STEPS[key],
|
||||
key
|
||||
};
|
||||
})
|
||||
.filter((step) => {
|
||||
return (this.walletType !== 'WATCH' || step.key !== 'DEPLOYMENT');
|
||||
});
|
||||
}
|
||||
|
||||
@computed get waiting () {
|
||||
this.steps
|
||||
.map((s, idx) => ({ idx, waiting: s.waiting }))
|
||||
.filter((s) => s.waiting)
|
||||
.map((s) => s.idx);
|
||||
}
|
||||
|
||||
constructor (api, accounts) {
|
||||
this.api = api;
|
||||
|
||||
this.step = STEPS_KEYS[0];
|
||||
this.step = this.stepsKeys[0];
|
||||
this.wallet.account = Object.values(accounts)[0].address;
|
||||
this.validateWallet(this.wallet);
|
||||
}
|
||||
|
||||
@action onTypeChange = (type) => {
|
||||
this.walletType = type;
|
||||
this.validateWallet(this.wallet);
|
||||
}
|
||||
|
||||
@action onNext = () => {
|
||||
const stepIndex = this.stepsKeys.findIndex((k) => k === this.step) + 1;
|
||||
this.step = this.stepsKeys[stepIndex];
|
||||
}
|
||||
|
||||
@action onChange = (_wallet) => {
|
||||
const newWallet = Object.assign({}, this.wallet, _wallet);
|
||||
const { errors, wallet } = this.validateWallet(newWallet);
|
||||
this.validateWallet(newWallet);
|
||||
}
|
||||
|
||||
transaction(() => {
|
||||
this.wallet = wallet;
|
||||
this.errors = errors;
|
||||
});
|
||||
@action onAdd = () => {
|
||||
if (this.hasErrors) {
|
||||
return;
|
||||
}
|
||||
|
||||
const walletContract = new Contract(this.api, walletAbi).at(this.wallet.address);
|
||||
|
||||
return Promise
|
||||
.all([
|
||||
WalletsUtils.fetchRequire(walletContract),
|
||||
WalletsUtils.fetchOwners(walletContract),
|
||||
WalletsUtils.fetchDailylimit(walletContract)
|
||||
])
|
||||
.then(([ require, owners, dailylimit ]) => {
|
||||
transaction(() => {
|
||||
this.wallet.owners = owners;
|
||||
this.wallet.required = require.toNumber();
|
||||
this.wallet.dailylimit = dailylimit.limit;
|
||||
});
|
||||
|
||||
return this.addWallet(this.wallet);
|
||||
});
|
||||
}
|
||||
|
||||
@action onCreate = () => {
|
||||
@ -97,7 +158,7 @@ export default class CreateWalletStore {
|
||||
|
||||
this.step = 'DEPLOYMENT';
|
||||
|
||||
const { account, owners, required, daylimit, name, description } = this.wallet;
|
||||
const { account, owners, required, daylimit } = this.wallet;
|
||||
|
||||
const options = {
|
||||
data: walletCode,
|
||||
@ -108,24 +169,9 @@ export default class CreateWalletStore {
|
||||
.newContract(walletAbi)
|
||||
.deploy(options, [ owners, required, daylimit ], this.onDeploymentState)
|
||||
.then((address) => {
|
||||
return Promise
|
||||
.all([
|
||||
this.api.parity.setAccountName(address, name),
|
||||
this.api.parity.setAccountMeta(address, {
|
||||
abi: walletAbi,
|
||||
wallet: true,
|
||||
timestamp: Date.now(),
|
||||
deleted: false,
|
||||
description,
|
||||
name
|
||||
})
|
||||
])
|
||||
.then(() => {
|
||||
transaction(() => {
|
||||
this.wallet.address = address;
|
||||
this.step = 'INFO';
|
||||
});
|
||||
});
|
||||
this.deployed = true;
|
||||
this.wallet.address = address;
|
||||
return this.addWallet(this.wallet);
|
||||
})
|
||||
.catch((error) => {
|
||||
if (error.code === ERROR_CODES.REQUEST_REJECTED) {
|
||||
@ -138,6 +184,27 @@ export default class CreateWalletStore {
|
||||
});
|
||||
}
|
||||
|
||||
@action addWallet = (wallet) => {
|
||||
const { address, name, description } = wallet;
|
||||
|
||||
return Promise
|
||||
.all([
|
||||
this.api.parity.setAccountName(address, name),
|
||||
this.api.parity.setAccountMeta(address, {
|
||||
abi: walletAbi,
|
||||
wallet: true,
|
||||
timestamp: Date.now(),
|
||||
deleted: false,
|
||||
description,
|
||||
name,
|
||||
tags: ['wallet']
|
||||
})
|
||||
])
|
||||
.then(() => {
|
||||
this.step = 'INFO';
|
||||
});
|
||||
}
|
||||
|
||||
onDeploymentState = (error, data) => {
|
||||
if (error) {
|
||||
return console.error('createWallet::onDeploymentState', error);
|
||||
@ -173,13 +240,15 @@ export default class CreateWalletStore {
|
||||
}
|
||||
}
|
||||
|
||||
validateWallet = (_wallet) => {
|
||||
@action validateWallet = (_wallet) => {
|
||||
const addressValidation = validateAddress(_wallet.address);
|
||||
const accountValidation = validateAddress(_wallet.account);
|
||||
const requiredValidation = validateUint(_wallet.required);
|
||||
const daylimitValidation = validateUint(_wallet.daylimit);
|
||||
const nameValidation = validateName(_wallet.name);
|
||||
|
||||
const errors = {
|
||||
address: addressValidation.addressError,
|
||||
account: accountValidation.addressError,
|
||||
required: requiredValidation.valueError,
|
||||
daylimit: daylimitValidation.valueError,
|
||||
@ -188,12 +257,16 @@ export default class CreateWalletStore {
|
||||
|
||||
const wallet = {
|
||||
..._wallet,
|
||||
address: addressValidation.address,
|
||||
account: accountValidation.address,
|
||||
required: requiredValidation.value,
|
||||
daylimit: daylimitValidation.value,
|
||||
name: nameValidation.name
|
||||
};
|
||||
|
||||
return { errors, wallet };
|
||||
transaction(() => {
|
||||
this.wallet = wallet;
|
||||
this.errors = errors;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -19,7 +19,7 @@ import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
|
||||
import { ConfirmDialog, IdentityIcon, IdentityName, Input } from '~/ui';
|
||||
import { newError } from '../../redux/actions';
|
||||
import { newError } from '~/redux/actions';
|
||||
|
||||
import styles from './deleteAccount.css';
|
||||
|
||||
|
||||
@ -239,11 +239,7 @@ export default class Details extends Component {
|
||||
}
|
||||
|
||||
renderTokenSelect () {
|
||||
const { balance, images, tag, wallet } = this.props;
|
||||
|
||||
if (wallet) {
|
||||
return null;
|
||||
}
|
||||
const { balance, images, tag } = this.props;
|
||||
|
||||
return (
|
||||
<TokenSelect
|
||||
|
||||
@ -16,7 +16,11 @@
|
||||
|
||||
import { observable, computed, action, transaction } from 'mobx';
|
||||
import BigNumber from 'bignumber.js';
|
||||
import { uniq } from 'lodash';
|
||||
|
||||
import { wallet as walletAbi } from '~/contracts/abi';
|
||||
import { bytesToHex } from '~/api/util/format';
|
||||
import Contract from '~/api/contract';
|
||||
import ERRORS from './errors';
|
||||
import { ERROR_CODES } from '~/api/transport/error';
|
||||
import { DEFAULT_GAS, DEFAULT_GASPRICE, MAX_GAS_ESTIMATION } from '../../util/constants';
|
||||
@ -71,6 +75,9 @@ export default class TransferStore {
|
||||
gasLimit = null;
|
||||
onClose = null;
|
||||
|
||||
senders = null;
|
||||
sendersBalances = null;
|
||||
|
||||
isWallet = false;
|
||||
wallet = null;
|
||||
|
||||
@ -108,19 +115,23 @@ export default class TransferStore {
|
||||
constructor (api, props) {
|
||||
this.api = api;
|
||||
|
||||
const { account, balance, gasLimit, senders, onClose } = props;
|
||||
const { account, balance, gasLimit, senders, onClose, newError, sendersBalances } = props;
|
||||
|
||||
this.account = account;
|
||||
this.balance = balance;
|
||||
this.gasLimit = gasLimit;
|
||||
this.onClose = onClose;
|
||||
this.isWallet = account && account.wallet;
|
||||
this.newError = newError;
|
||||
|
||||
if (this.isWallet) {
|
||||
this.wallet = props.wallet;
|
||||
this.walletContract = new Contract(this.api, walletAbi);
|
||||
}
|
||||
|
||||
if (senders) {
|
||||
this.senders = senders;
|
||||
this.sendersBalances = sendersBalances;
|
||||
this.senderError = ERRORS.requireSender;
|
||||
}
|
||||
}
|
||||
@ -217,6 +228,10 @@ export default class TransferStore {
|
||||
this.txhash = txhash;
|
||||
this.busyState = 'Your transaction has been posted to the network';
|
||||
});
|
||||
|
||||
if (this.isWallet) {
|
||||
return this._attachWalletOperation(txhash);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
this.sending = false;
|
||||
@ -224,6 +239,34 @@ export default class TransferStore {
|
||||
});
|
||||
}
|
||||
|
||||
@action _attachWalletOperation = (txhash) => {
|
||||
let ethSubscriptionId = null;
|
||||
|
||||
return this.api.subscribe('eth_blockNumber', () => {
|
||||
this.api.eth
|
||||
.getTransactionReceipt(txhash)
|
||||
.then((tx) => {
|
||||
if (!tx) {
|
||||
return;
|
||||
}
|
||||
|
||||
const logs = this.walletContract.parseEventLogs(tx.logs);
|
||||
const operations = uniq(logs
|
||||
.filter((log) => log && log.params && log.params.operation)
|
||||
.map((log) => bytesToHex(log.params.operation.value)));
|
||||
|
||||
if (operations.length > 0) {
|
||||
this.operation = operations[0];
|
||||
}
|
||||
|
||||
this.api.unsubscribe(ethSubscriptionId);
|
||||
ethSubscriptionId = null;
|
||||
});
|
||||
}).then((subId) => {
|
||||
ethSubscriptionId = subId;
|
||||
});
|
||||
}
|
||||
|
||||
@action _onUpdateAll = (valueAll) => {
|
||||
this.valueAll = valueAll;
|
||||
this.recalculateGas();
|
||||
@ -355,19 +398,29 @@ export default class TransferStore {
|
||||
}
|
||||
|
||||
@action recalculate = () => {
|
||||
const { account, balance } = this;
|
||||
const { account } = this;
|
||||
|
||||
if (!account || !balance) {
|
||||
if (!account || !this.balance) {
|
||||
return;
|
||||
}
|
||||
|
||||
const balance = this.senders
|
||||
? this.sendersBalances[this.sender]
|
||||
: this.balance;
|
||||
|
||||
if (!balance) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { gas, gasPrice, tag, valueAll, isEth } = this;
|
||||
|
||||
const gasTotal = new BigNumber(gasPrice || 0).mul(new BigNumber(gas || 0));
|
||||
const balance_ = balance.tokens.find((b) => tag === b.token.tag);
|
||||
|
||||
const availableEth = new BigNumber(balance.tokens[0].value);
|
||||
const available = new BigNumber(balance_.value);
|
||||
const format = new BigNumber(balance_.token.format || 1);
|
||||
|
||||
const senderBalance = this.balance.tokens.find((b) => tag === b.token.tag);
|
||||
const available = new BigNumber(senderBalance.value);
|
||||
const format = new BigNumber(senderBalance.token.format || 1);
|
||||
|
||||
let { value, valueError } = this;
|
||||
let totalEth = gasTotal;
|
||||
@ -409,26 +462,52 @@ export default class TransferStore {
|
||||
return this._getTransferMethod().postTransaction(options, values);
|
||||
}
|
||||
|
||||
estimateGas () {
|
||||
const { options, values } = this._getTransferParams(true);
|
||||
return this._getTransferMethod(true).estimateGas(options, values);
|
||||
_estimateGas (forceToken = false) {
|
||||
const { options, values } = this._getTransferParams(true, forceToken);
|
||||
return this._getTransferMethod(true, forceToken).estimateGas(options, values);
|
||||
}
|
||||
|
||||
_getTransferMethod (gas = false) {
|
||||
estimateGas () {
|
||||
if (this.isEth || !this.isWallet) {
|
||||
return this._estimateGas();
|
||||
}
|
||||
|
||||
return Promise
|
||||
.all([
|
||||
this._estimateGas(true),
|
||||
this._estimateGas()
|
||||
])
|
||||
.then((results) => results[0].plus(results[1]));
|
||||
}
|
||||
|
||||
_getTransferMethod (gas = false, forceToken = false) {
|
||||
const { isEth, isWallet } = this;
|
||||
|
||||
if (isEth && !isWallet) {
|
||||
if (isEth && !isWallet && !forceToken) {
|
||||
return gas ? this.api.eth : this.api.parity;
|
||||
}
|
||||
|
||||
if (isWallet) {
|
||||
if (isWallet && !forceToken) {
|
||||
return this.wallet.instance.execute;
|
||||
}
|
||||
|
||||
return this.token.contract.instance.transfer;
|
||||
}
|
||||
|
||||
_getTransferParams (gas = false) {
|
||||
_getData (gas = false) {
|
||||
const { isEth, isWallet } = this;
|
||||
|
||||
if (!isWallet || isEth) {
|
||||
return this.data && this.data.length ? this.data : '';
|
||||
}
|
||||
|
||||
const func = this._getTransferMethod(gas, true);
|
||||
const { options, values } = this._getTransferParams(gas, true);
|
||||
|
||||
return this.token.contract.getCallData(func, options, values);
|
||||
}
|
||||
|
||||
_getTransferParams (gas = false, forceToken = false) {
|
||||
const { isEth, isWallet } = this;
|
||||
|
||||
const to = (isEth && !isWallet) ? this.recipient
|
||||
@ -446,27 +525,30 @@ export default class TransferStore {
|
||||
options.gas = MAX_GAS_ESTIMATION;
|
||||
}
|
||||
|
||||
if (isEth && !isWallet) {
|
||||
if (isEth && !isWallet && !forceToken) {
|
||||
options.value = this.api.util.toWei(this.value || 0);
|
||||
|
||||
if (this.data && this.data.length) {
|
||||
options.data = this.data;
|
||||
}
|
||||
options.data = this._getData(gas);
|
||||
|
||||
return { options, values: [] };
|
||||
}
|
||||
|
||||
const values = isWallet
|
||||
? [
|
||||
this.recipient,
|
||||
this.api.util.toWei(this.value || 0),
|
||||
this.data || ''
|
||||
]
|
||||
: [
|
||||
this.recipient,
|
||||
new BigNumber(this.value || 0).mul(this.token.format).toFixed(0)
|
||||
if (isWallet && !forceToken) {
|
||||
const to = isEth ? this.recipient : this.token.contract.address;
|
||||
const value = isEth ? this.api.util.toWei(this.value || 0) : new BigNumber(0);
|
||||
|
||||
const values = [
|
||||
to, value,
|
||||
this._getData(gas)
|
||||
];
|
||||
|
||||
return { options, values };
|
||||
}
|
||||
|
||||
const values = [
|
||||
this.recipient,
|
||||
new BigNumber(this.value || 0).mul(this.token.format).toFixed(0)
|
||||
];
|
||||
|
||||
return { options, values };
|
||||
}
|
||||
|
||||
|
||||
@ -18,6 +18,7 @@ import React, { Component, PropTypes } from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import { observer } from 'mobx-react';
|
||||
import { pick } from 'lodash';
|
||||
|
||||
import ActionDoneAll from 'material-ui/svg-icons/action/done-all';
|
||||
import ContentClear from 'material-ui/svg-icons/content/clear';
|
||||
@ -25,7 +26,7 @@ import NavigationArrowBack from 'material-ui/svg-icons/navigation/arrow-back';
|
||||
import NavigationArrowForward from 'material-ui/svg-icons/navigation/arrow-forward';
|
||||
|
||||
import { newError } from '~/ui/Errors/actions';
|
||||
import { BusyStep, CompletedStep, Button, IdentityIcon, Modal, TxHash } from '~/ui';
|
||||
import { BusyStep, CompletedStep, Button, IdentityIcon, Modal, TxHash, Input } from '~/ui';
|
||||
import { nullableProptype } from '~/util/proptypes';
|
||||
|
||||
import Details from './Details';
|
||||
@ -45,10 +46,10 @@ class Transfer extends Component {
|
||||
gasLimit: PropTypes.object.isRequired,
|
||||
images: PropTypes.object.isRequired,
|
||||
|
||||
account: PropTypes.object,
|
||||
senders: nullableProptype(PropTypes.object),
|
||||
sendersBalances: nullableProptype(PropTypes.object),
|
||||
account: PropTypes.object,
|
||||
balance: PropTypes.object,
|
||||
balances: PropTypes.object,
|
||||
wallet: PropTypes.object,
|
||||
onClose: PropTypes.func
|
||||
}
|
||||
@ -133,6 +134,25 @@ class Transfer extends Component {
|
||||
return (
|
||||
<CompletedStep>
|
||||
<TxHash hash={ txhash } />
|
||||
{
|
||||
this.store.operation
|
||||
? (
|
||||
<div>
|
||||
<br />
|
||||
<p>
|
||||
This transaction needs confirmation from other owners.
|
||||
<Input
|
||||
style={ { width: '50%', margin: '0 auto' } }
|
||||
value={ this.store.operation }
|
||||
label='operation hash'
|
||||
readOnly
|
||||
allowCopy
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
)
|
||||
: null
|
||||
}
|
||||
</CompletedStep>
|
||||
);
|
||||
}
|
||||
@ -277,7 +297,9 @@ function mapStateToProps (initState, initProps) {
|
||||
|
||||
return (state) => {
|
||||
const { gasLimit } = state.nodeStatus;
|
||||
return { gasLimit, wallet, senders };
|
||||
const sendersBalances = senders ? pick(state.balances.balances, Object.keys(senders)) : null;
|
||||
|
||||
return { gasLimit, wallet, senders, sendersBalances };
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -113,7 +113,7 @@ export function fetchTokens (_tokenIds) {
|
||||
export function fetchBalances (_addresses) {
|
||||
return (dispatch, getState) => {
|
||||
const { api, personal } = getState();
|
||||
const { visibleAccounts } = personal;
|
||||
const { visibleAccounts, accounts } = personal;
|
||||
|
||||
const addresses = uniq(_addresses || visibleAccounts || []);
|
||||
|
||||
@ -123,12 +123,14 @@ export function fetchBalances (_addresses) {
|
||||
|
||||
const fullFetch = addresses.length === 1;
|
||||
|
||||
const fetchedAddresses = uniq(addresses.concat(Object.keys(accounts)));
|
||||
|
||||
return Promise
|
||||
.all(addresses.map((addr) => fetchAccount(addr, api, fullFetch)))
|
||||
.all(fetchedAddresses.map((addr) => fetchAccount(addr, api, fullFetch)))
|
||||
.then((accountsBalances) => {
|
||||
const balances = {};
|
||||
|
||||
addresses.forEach((addr, idx) => {
|
||||
fetchedAddresses.forEach((addr, idx) => {
|
||||
balances[addr] = accountsBalances[idx];
|
||||
});
|
||||
|
||||
|
||||
@ -14,16 +14,18 @@
|
||||
// You should have received a copy of the GNU General Public License
|
||||
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
import { isEqual, uniq, range } from 'lodash';
|
||||
import { isEqual, uniq } from 'lodash';
|
||||
|
||||
import Contract from '../../api/contract';
|
||||
import { wallet as WALLET_ABI } from '../../contracts/abi';
|
||||
import { bytesToHex, toHex } from '../../api/util/format';
|
||||
import Contract from '~/api/contract';
|
||||
import { wallet as WALLET_ABI } from '~/contracts/abi';
|
||||
import { bytesToHex, toHex } from '~/api/util/format';
|
||||
|
||||
import { ERROR_CODES } from '../../api/transport/error';
|
||||
import { ERROR_CODES } from '~/api/transport/error';
|
||||
import { MAX_GAS_ESTIMATION } from '../../util/constants';
|
||||
|
||||
import { newError } from '../../ui/Errors/actions';
|
||||
import WalletsUtils from '~/util/wallets';
|
||||
|
||||
import { newError } from '~/ui/Errors/actions';
|
||||
|
||||
const UPDATE_OWNERS = 'owners';
|
||||
const UPDATE_REQUIRE = 'require';
|
||||
@ -247,58 +249,9 @@ function fetchWalletInfo (contract, update, getState) {
|
||||
}
|
||||
|
||||
function fetchWalletTransactions (contract) {
|
||||
const walletInstance = contract.instance;
|
||||
const signatures = {
|
||||
single: toHex(walletInstance.SingleTransact.signature),
|
||||
multi: toHex(walletInstance.MultiTransact.signature),
|
||||
deposit: toHex(walletInstance.Deposit.signature)
|
||||
};
|
||||
|
||||
return contract
|
||||
.getAllLogs({
|
||||
topics: [ [ signatures.single, signatures.multi, signatures.deposit ] ]
|
||||
})
|
||||
.then((logs) => {
|
||||
return logs.sort((logA, logB) => {
|
||||
const comp = logB.blockNumber.comparedTo(logA.blockNumber);
|
||||
|
||||
if (comp !== 0) {
|
||||
return comp;
|
||||
}
|
||||
|
||||
return logB.transactionIndex.comparedTo(logA.transactionIndex);
|
||||
});
|
||||
})
|
||||
.then((logs) => {
|
||||
const transactions = logs.map((log) => {
|
||||
const signature = toHex(log.topics[0]);
|
||||
|
||||
const value = log.params.value.value;
|
||||
const from = signature === signatures.deposit
|
||||
? log.params['_from'].value
|
||||
: contract.address;
|
||||
|
||||
const to = signature === signatures.deposit
|
||||
? contract.address
|
||||
: log.params.to.value;
|
||||
|
||||
const transaction = {
|
||||
transactionHash: log.transactionHash,
|
||||
blockNumber: log.blockNumber,
|
||||
from, to, value
|
||||
};
|
||||
|
||||
if (log.params.operation) {
|
||||
transaction.operation = bytesToHex(log.params.operation.value);
|
||||
}
|
||||
|
||||
if (log.params.data) {
|
||||
transaction.data = log.params.data.value;
|
||||
}
|
||||
|
||||
return transaction;
|
||||
});
|
||||
|
||||
return WalletsUtils
|
||||
.fetchTransactions(contract)
|
||||
.then((transactions) => {
|
||||
return {
|
||||
key: UPDATE_TRANSACTIONS,
|
||||
value: transactions
|
||||
@ -307,13 +260,8 @@ function fetchWalletTransactions (contract) {
|
||||
}
|
||||
|
||||
function fetchWalletOwners (contract) {
|
||||
const walletInstance = contract.instance;
|
||||
|
||||
return walletInstance
|
||||
.m_numOwners.call()
|
||||
.then((mNumOwners) => {
|
||||
return Promise.all(range(mNumOwners.toNumber()).map((idx) => walletInstance.getOwner.call({}, [ idx ])));
|
||||
})
|
||||
return WalletsUtils
|
||||
.fetchOwners(contract)
|
||||
.then((value) => {
|
||||
return {
|
||||
key: UPDATE_OWNERS,
|
||||
@ -323,10 +271,8 @@ function fetchWalletOwners (contract) {
|
||||
}
|
||||
|
||||
function fetchWalletRequire (contract) {
|
||||
const walletInstance = contract.instance;
|
||||
|
||||
return walletInstance
|
||||
.m_required.call()
|
||||
return WalletsUtils
|
||||
.fetchRequire(contract)
|
||||
.then((value) => {
|
||||
return {
|
||||
key: UPDATE_REQUIRE,
|
||||
@ -336,22 +282,12 @@ function fetchWalletRequire (contract) {
|
||||
}
|
||||
|
||||
function fetchWalletDailylimit (contract) {
|
||||
const walletInstance = contract.instance;
|
||||
|
||||
return Promise
|
||||
.all([
|
||||
walletInstance.m_dailyLimit.call(),
|
||||
walletInstance.m_spentToday.call(),
|
||||
walletInstance.m_lastDay.call()
|
||||
])
|
||||
.then((values) => {
|
||||
return WalletsUtils
|
||||
.fetchDailylimit(contract)
|
||||
.then((value) => {
|
||||
return {
|
||||
key: UPDATE_DAILYLIMIT,
|
||||
value: {
|
||||
limit: values[0],
|
||||
spent: values[1],
|
||||
last: values[2]
|
||||
}
|
||||
value
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
@ -120,7 +120,7 @@ export default class AutoComplete extends Component {
|
||||
switch (keycode(event)) {
|
||||
case 'down':
|
||||
const { menu } = muiAutocomplete.refs;
|
||||
menu.handleKeyDown(event);
|
||||
menu && menu.handleKeyDown(event);
|
||||
this.setState({ fakeBlur: true });
|
||||
break;
|
||||
|
||||
@ -133,7 +133,7 @@ export default class AutoComplete extends Component {
|
||||
const e = new CustomEvent('down');
|
||||
e.which = 40;
|
||||
|
||||
muiAutocomplete.handleKeyDown(e);
|
||||
muiAutocomplete && muiAutocomplete.handleKeyDown(e);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
@ -66,7 +66,8 @@ export default class Input extends Component {
|
||||
PropTypes.number, PropTypes.string
|
||||
]),
|
||||
min: PropTypes.any,
|
||||
max: PropTypes.any
|
||||
max: PropTypes.any,
|
||||
style: PropTypes.object
|
||||
};
|
||||
|
||||
static defaultProps = {
|
||||
@ -74,7 +75,8 @@ export default class Input extends Component {
|
||||
readOnly: false,
|
||||
allowCopy: false,
|
||||
hideUnderline: false,
|
||||
floatCopy: false
|
||||
floatCopy: false,
|
||||
style: {}
|
||||
}
|
||||
|
||||
state = {
|
||||
@ -89,7 +91,8 @@ export default class Input extends Component {
|
||||
|
||||
render () {
|
||||
const { value } = this.state;
|
||||
const { children, className, hideUnderline, disabled, error, label, hint, multiLine, rows, type, min, max } = this.props;
|
||||
const { children, className, hideUnderline, disabled, error, label } = this.props;
|
||||
const { hint, multiLine, rows, type, min, max, style } = this.props;
|
||||
|
||||
const readOnly = this.props.readOnly || disabled;
|
||||
|
||||
@ -105,7 +108,7 @@ export default class Input extends Component {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={ styles.container }>
|
||||
<div className={ styles.container } style={ style }>
|
||||
{ this.renderCopyButton() }
|
||||
<TextField
|
||||
autoComplete='off'
|
||||
|
||||
@ -37,7 +37,10 @@ export default class RadioButtons extends Component {
|
||||
render () {
|
||||
const { value, values } = this.props;
|
||||
|
||||
const index = parseInt(value);
|
||||
const index = Number.isNaN(parseInt(value))
|
||||
? values.findIndex((val) => val.key === value)
|
||||
: parseInt(value);
|
||||
|
||||
const selectedValue = typeof value !== 'object' ? values[index] : value;
|
||||
const key = this.getKey(selectedValue, index);
|
||||
|
||||
|
||||
@ -40,7 +40,14 @@ export default class TypedInput extends Component {
|
||||
error: PropTypes.any,
|
||||
value: PropTypes.any,
|
||||
label: PropTypes.string,
|
||||
hint: PropTypes.string
|
||||
hint: PropTypes.string,
|
||||
min: PropTypes.number,
|
||||
max: PropTypes.number
|
||||
};
|
||||
|
||||
static defaultProps = {
|
||||
min: null,
|
||||
max: null
|
||||
};
|
||||
|
||||
render () {
|
||||
@ -90,16 +97,22 @@ export default class TypedInput extends Component {
|
||||
};
|
||||
|
||||
const style = {
|
||||
width: 32,
|
||||
height: 32,
|
||||
width: 24,
|
||||
height: 24,
|
||||
padding: 0
|
||||
};
|
||||
|
||||
const plusStyle = {
|
||||
...style,
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.25)',
|
||||
borderRadius: '50%'
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div style={ { marginTop: '0.75em' } }>
|
||||
<IconButton
|
||||
iconStyle={ iconStyle }
|
||||
style={ style }
|
||||
style={ plusStyle }
|
||||
onTouchTap={ this.onAddField }
|
||||
>
|
||||
<AddIcon />
|
||||
@ -145,7 +158,7 @@ export default class TypedInput extends Component {
|
||||
}
|
||||
|
||||
renderNumber () {
|
||||
const { label, value, error, param, hint } = this.props;
|
||||
const { label, value, error, param, hint, min, max } = this.props;
|
||||
|
||||
return (
|
||||
<Input
|
||||
@ -153,9 +166,10 @@ export default class TypedInput extends Component {
|
||||
hint={ hint }
|
||||
value={ value }
|
||||
error={ error }
|
||||
onSubmit={ this.onSubmit }
|
||||
onChange={ this.onChange }
|
||||
type='number'
|
||||
min={ param.signed ? null : 0 }
|
||||
min={ min !== null ? min : (param.signed ? null : 0) }
|
||||
max={ max !== null ? max : null }
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
107
js/src/util/wallets.js
Normal file
107
js/src/util/wallets.js
Normal file
@ -0,0 +1,107 @@
|
||||
// Copyright 2015, 2016 Ethcore (UK) Ltd.
|
||||
// This file is part of Parity.
|
||||
|
||||
// Parity is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU General Public License as published by
|
||||
// the Free Software Foundation, either version 3 of the License, or
|
||||
// (at your option) any later version.
|
||||
|
||||
// Parity is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU General Public License for more details.
|
||||
|
||||
// You should have received a copy of the GNU General Public License
|
||||
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
import { range } from 'lodash';
|
||||
|
||||
import { bytesToHex, toHex } from '~/api/util/format';
|
||||
|
||||
export default class WalletsUtils {
|
||||
|
||||
static fetchRequire (walletContract) {
|
||||
return walletContract.instance.m_required.call();
|
||||
}
|
||||
|
||||
static fetchOwners (walletContract) {
|
||||
const walletInstance = walletContract.instance;
|
||||
return walletInstance
|
||||
.m_numOwners.call()
|
||||
.then((mNumOwners) => {
|
||||
return Promise.all(range(mNumOwners.toNumber()).map((idx) => walletInstance.getOwner.call({}, [ idx ])));
|
||||
});
|
||||
}
|
||||
|
||||
static fetchDailylimit (walletContract) {
|
||||
const walletInstance = walletContract.instance;
|
||||
|
||||
return Promise
|
||||
.all([
|
||||
walletInstance.m_dailyLimit.call(),
|
||||
walletInstance.m_spentToday.call(),
|
||||
walletInstance.m_lastDay.call()
|
||||
])
|
||||
.then(([ limit, spent, last ]) => ({
|
||||
limit, spent, last
|
||||
}));
|
||||
}
|
||||
|
||||
static fetchTransactions (walletContract) {
|
||||
const walletInstance = walletContract.instance;
|
||||
const signatures = {
|
||||
single: toHex(walletInstance.SingleTransact.signature),
|
||||
multi: toHex(walletInstance.MultiTransact.signature),
|
||||
deposit: toHex(walletInstance.Deposit.signature)
|
||||
};
|
||||
|
||||
return walletContract
|
||||
.getAllLogs({
|
||||
topics: [ [ signatures.single, signatures.multi, signatures.deposit ] ]
|
||||
})
|
||||
.then((logs) => {
|
||||
return logs.sort((logA, logB) => {
|
||||
const comp = logB.blockNumber.comparedTo(logA.blockNumber);
|
||||
|
||||
if (comp !== 0) {
|
||||
return comp;
|
||||
}
|
||||
|
||||
return logB.transactionIndex.comparedTo(logA.transactionIndex);
|
||||
});
|
||||
})
|
||||
.then((logs) => {
|
||||
const transactions = logs.map((log) => {
|
||||
const signature = toHex(log.topics[0]);
|
||||
|
||||
const value = log.params.value.value;
|
||||
const from = signature === signatures.deposit
|
||||
? log.params['_from'].value
|
||||
: walletContract.address;
|
||||
|
||||
const to = signature === signatures.deposit
|
||||
? walletContract.address
|
||||
: log.params.to.value;
|
||||
|
||||
const transaction = {
|
||||
transactionHash: log.transactionHash,
|
||||
blockNumber: log.blockNumber,
|
||||
from, to, value
|
||||
};
|
||||
|
||||
if (log.params.operation) {
|
||||
transaction.operation = bytesToHex(log.params.operation.value);
|
||||
}
|
||||
|
||||
if (log.params.data) {
|
||||
transaction.data = log.params.data.value;
|
||||
}
|
||||
|
||||
return transaction;
|
||||
});
|
||||
|
||||
return transactions;
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
@ -25,16 +25,23 @@ import styles from './header.css';
|
||||
export default class Header extends Component {
|
||||
static contextTypes = {
|
||||
api: PropTypes.object
|
||||
}
|
||||
};
|
||||
|
||||
static propTypes = {
|
||||
account: PropTypes.object,
|
||||
balance: PropTypes.object
|
||||
}
|
||||
balance: PropTypes.object,
|
||||
className: PropTypes.string,
|
||||
children: PropTypes.node
|
||||
};
|
||||
|
||||
static defaultProps = {
|
||||
className: '',
|
||||
children: null
|
||||
};
|
||||
|
||||
render () {
|
||||
const { api } = this.context;
|
||||
const { account, balance } = this.props;
|
||||
const { account, balance, className, children } = this.props;
|
||||
const { address, meta, uuid } = account;
|
||||
|
||||
if (!account) {
|
||||
@ -46,7 +53,7 @@ export default class Header extends Component {
|
||||
: <div className={ styles.uuidline }>uuid: { uuid }</div>;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className={ className }>
|
||||
<Container>
|
||||
<IdentityIcon
|
||||
address={ address } />
|
||||
@ -74,6 +81,7 @@ export default class Header extends Component {
|
||||
dappsUrl={ api.dappsUrl }
|
||||
/>
|
||||
</div>
|
||||
{ children }
|
||||
</Container>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -86,8 +86,15 @@ class Accounts extends Component {
|
||||
{ this.renderNewWalletDialog() }
|
||||
{ this.renderActionbar() }
|
||||
|
||||
{ this.renderAccounts() }
|
||||
{ this.renderWallets() }
|
||||
<Page>
|
||||
<Tooltip
|
||||
className={ styles.accountTooltip }
|
||||
text='your accounts are visible for easy access, allowing you to edit the meta information, make transfers, view transactions and fund the account'
|
||||
/>
|
||||
|
||||
{ this.renderWallets() }
|
||||
{ this.renderAccounts() }
|
||||
</Page>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -115,18 +122,13 @@ class Accounts extends Component {
|
||||
const { searchValues, sortOrder } = this.state;
|
||||
|
||||
return (
|
||||
<Page>
|
||||
<List
|
||||
search={ searchValues }
|
||||
accounts={ accounts }
|
||||
balances={ balances }
|
||||
empty={ !hasAccounts }
|
||||
order={ sortOrder }
|
||||
handleAddSearchToken={ this.onAddSearchToken } />
|
||||
<Tooltip
|
||||
className={ styles.accountTooltip }
|
||||
text='your accounts are visible for easy access, allowing you to edit the meta information, make transfers, view transactions and fund the account' />
|
||||
</Page>
|
||||
<List
|
||||
search={ searchValues }
|
||||
accounts={ accounts }
|
||||
balances={ balances }
|
||||
empty={ !hasAccounts }
|
||||
order={ sortOrder }
|
||||
handleAddSearchToken={ this.onAddSearchToken } />
|
||||
);
|
||||
}
|
||||
|
||||
@ -139,17 +141,15 @@ class Accounts extends Component {
|
||||
const { searchValues, sortOrder } = this.state;
|
||||
|
||||
return (
|
||||
<Page>
|
||||
<List
|
||||
link='wallet'
|
||||
search={ searchValues }
|
||||
accounts={ wallets }
|
||||
balances={ balances }
|
||||
empty={ !hasWallets }
|
||||
order={ sortOrder }
|
||||
handleAddSearchToken={ this.onAddSearchToken }
|
||||
/>
|
||||
</Page>
|
||||
<List
|
||||
link='wallet'
|
||||
search={ searchValues }
|
||||
accounts={ wallets }
|
||||
balances={ balances }
|
||||
empty={ !hasWallets }
|
||||
order={ sortOrder }
|
||||
handleAddSearchToken={ this.onAddSearchToken }
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -19,7 +19,7 @@ import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
|
||||
import { ConfirmDialog, IdentityIcon, IdentityName } from '~/ui';
|
||||
import { newError } from '../../../redux/actions';
|
||||
import { newError } from '~/redux/actions';
|
||||
|
||||
import styles from '../address.css';
|
||||
|
||||
@ -27,16 +27,17 @@ class Delete extends Component {
|
||||
static contextTypes = {
|
||||
api: PropTypes.object.isRequired,
|
||||
router: PropTypes.object
|
||||
}
|
||||
};
|
||||
|
||||
static propTypes = {
|
||||
route: PropTypes.string.isRequired,
|
||||
|
||||
address: PropTypes.string,
|
||||
account: PropTypes.object,
|
||||
route: PropTypes.string.isRequired,
|
||||
visible: PropTypes.bool,
|
||||
onClose: PropTypes.func,
|
||||
newError: PropTypes.func
|
||||
}
|
||||
};
|
||||
|
||||
render () {
|
||||
const { account, visible } = this.props;
|
||||
|
||||
@ -23,7 +23,7 @@ import ContentCreate from 'material-ui/svg-icons/content/create';
|
||||
import EyeIcon from 'material-ui/svg-icons/image/remove-red-eye';
|
||||
import ContentClear from 'material-ui/svg-icons/content/clear';
|
||||
|
||||
import { newError } from '../../redux/actions';
|
||||
import { newError } from '~/redux/actions';
|
||||
import { setVisibleAccounts } from '~/redux/providers/personalActions';
|
||||
|
||||
import { EditMeta, ExecuteContract } from '~/modals';
|
||||
|
||||
@ -19,7 +19,7 @@ import { action, computed, observable, transaction } from 'mobx';
|
||||
import store from 'store';
|
||||
|
||||
import Contracts from '~/contracts';
|
||||
import { hashToImageUrl } from '../../redux/util';
|
||||
import { hashToImageUrl } from '~/redux/util';
|
||||
|
||||
import builtinApps from './builtin.json';
|
||||
|
||||
|
||||
@ -18,7 +18,7 @@ import React, { Component, PropTypes } from 'react';
|
||||
|
||||
import ReactTooltip from 'react-tooltip';
|
||||
|
||||
import { MethodDecoding } from '../../../../ui';
|
||||
import { MethodDecoding } from '~/ui';
|
||||
|
||||
import * as tUtil from '../util/transaction';
|
||||
import Account from '../Account';
|
||||
|
||||
@ -64,7 +64,7 @@ export default class TransactionPending extends Component {
|
||||
}
|
||||
|
||||
render () {
|
||||
const { className, id, transaction, store } = this.props;
|
||||
const { className, id, transaction, store, isTest } = this.props;
|
||||
const { from, value } = transaction;
|
||||
const { totalValue } = this.state;
|
||||
|
||||
@ -76,6 +76,7 @@ export default class TransactionPending extends Component {
|
||||
id={ id }
|
||||
value={ value }
|
||||
from={ from }
|
||||
isTest={ isTest }
|
||||
fromBalance={ fromBalance }
|
||||
className={ styles.transactionDetails }
|
||||
transaction={ transaction }
|
||||
|
||||
@ -17,6 +17,6 @@
|
||||
import { createAction } from 'redux-actions';
|
||||
|
||||
import { identity } from '../util';
|
||||
import { withError } from '../../../redux/util';
|
||||
import { withError } from '~/redux/util';
|
||||
|
||||
export const copyToClipboard = createAction('copy toClipboard', identity, withError(identity));
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
import { createAction } from 'redux-actions';
|
||||
|
||||
import { identity } from '../util';
|
||||
import { withError } from '../../../redux/util';
|
||||
import { withError } from '~/redux/util';
|
||||
|
||||
export const updateLogging = createAction(
|
||||
'update logging', identity, withError(flag => `logging updated to ${flag}`)
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
import { createAction } from 'redux-actions';
|
||||
|
||||
import { identity } from '../util';
|
||||
import { withError } from '../../../redux/util';
|
||||
import { withError } from '~/redux/util';
|
||||
|
||||
export const error = createAction('error rpc', identity,
|
||||
withError(() => 'error processing rpc call. check console for details', 'error')
|
||||
|
||||
@ -18,7 +18,7 @@ import React, { Component, PropTypes } from 'react';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import { clearStatusLogs, toggleStatusLogs, toggleStatusRefresh } from '../../../../redux/actions';
|
||||
import { clearStatusLogs, toggleStatusLogs, toggleStatusRefresh } from '~/redux/actions';
|
||||
|
||||
import Debug from '../../components/Debug';
|
||||
import Status from '../../components/Status';
|
||||
|
||||
@ -20,13 +20,13 @@ import ReactTooltip from 'react-tooltip';
|
||||
import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
|
||||
import { confirmOperation, revokeOperation } from '../../../redux/providers/walletActions';
|
||||
import { bytesToHex } from '../../../api/util/format';
|
||||
import { Container, InputAddress, Button, IdentityIcon } from '../../../ui';
|
||||
import { TxRow } from '../../../ui/TxList/txList';
|
||||
import { confirmOperation, revokeOperation } from '~/redux/providers/walletActions';
|
||||
import { bytesToHex } from '~/api/util/format';
|
||||
import { Container, InputAddress, Button, IdentityIcon } from '~/ui';
|
||||
import { TxRow } from '~/ui/TxList/txList';
|
||||
|
||||
import styles from '../wallet.css';
|
||||
import txListStyles from '../../../ui/TxList/txList.css';
|
||||
import txListStyles from '~/ui/TxList/txList.css';
|
||||
|
||||
class WalletConfirmations extends Component {
|
||||
static contextTypes = {
|
||||
|
||||
@ -15,9 +15,8 @@
|
||||
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
import React, { Component, PropTypes } from 'react';
|
||||
import moment from 'moment';
|
||||
|
||||
import { Container, InputAddress } from '../../../ui';
|
||||
import { Container, InputAddress } from '~/ui';
|
||||
|
||||
import styles from '../wallet.css';
|
||||
|
||||
@ -29,18 +28,21 @@ export default class WalletDetails extends Component {
|
||||
static propTypes = {
|
||||
owners: PropTypes.array,
|
||||
require: PropTypes.object,
|
||||
dailylimit: PropTypes.object
|
||||
className: PropTypes.string
|
||||
};
|
||||
|
||||
static defaultProps = {
|
||||
className: ''
|
||||
};
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className={ styles.details }>
|
||||
<Container title='Owners'>
|
||||
{ this.renderOwners() }
|
||||
</Container>
|
||||
const { className } = this.props;
|
||||
|
||||
return (
|
||||
<div className={ [ styles.details, className ].join(' ') }>
|
||||
<Container title='Details'>
|
||||
{ this.renderDetails() }
|
||||
{ this.renderOwners() }
|
||||
</Container>
|
||||
</div>
|
||||
);
|
||||
@ -70,17 +72,12 @@ export default class WalletDetails extends Component {
|
||||
}
|
||||
|
||||
renderDetails () {
|
||||
const { require, dailylimit } = this.props;
|
||||
const { api } = this.context;
|
||||
const { require } = this.props;
|
||||
|
||||
if (!dailylimit || !dailylimit.limit) {
|
||||
if (!require) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const limit = api.util.fromWei(dailylimit.limit).toFormat(3);
|
||||
const spent = api.util.fromWei(dailylimit.spent).toFormat(3);
|
||||
const date = moment(dailylimit.last.toNumber() * 24 * 3600 * 1000);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<p>
|
||||
@ -88,14 +85,6 @@ export default class WalletDetails extends Component {
|
||||
<span className={ styles.detail }>{ require.toFormat() } owners</span>
|
||||
<span>to validate any action (transactions, modifications).</span>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<span className={ styles.detail }>{ spent }<span className={ styles.eth } /></span>
|
||||
<span>has been spent today, out of</span>
|
||||
<span className={ styles.detail }>{ limit }<span className={ styles.eth } /></span>
|
||||
<span>set as the daily limit, which has been reset on</span>
|
||||
<span className={ styles.detail }>{ date.format('LL') }</span>
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -16,11 +16,11 @@
|
||||
|
||||
import React, { Component, PropTypes } from 'react';
|
||||
|
||||
import { bytesToHex } from '../../../api/util/format';
|
||||
import { Container } from '../../../ui';
|
||||
import { TxRow } from '../../../ui/TxList/txList';
|
||||
import { bytesToHex } from '~/api/util/format';
|
||||
import { Container } from '~/ui';
|
||||
import { TxRow } from '~/ui/TxList/txList';
|
||||
|
||||
import txListStyles from '../../../ui/TxList/txList.css';
|
||||
import txListStyles from '~/ui/TxList/txList.css';
|
||||
|
||||
export default class WalletTransactions extends Component {
|
||||
static propTypes = {
|
||||
|
||||
@ -23,7 +23,6 @@
|
||||
|
||||
> * {
|
||||
flex: 1;
|
||||
margin: 0.125em;
|
||||
height: auto;
|
||||
|
||||
&:first-child {
|
||||
@ -36,6 +35,38 @@
|
||||
}
|
||||
}
|
||||
|
||||
.owners {
|
||||
margin-top: 0.75em;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
padding: 1em 0.5em 0.5em;
|
||||
|
||||
> * {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.info {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.header {
|
||||
flex: 1;
|
||||
margin-right: 0.25em;
|
||||
}
|
||||
|
||||
.details {
|
||||
flex: 1;
|
||||
margin-left: 0.25em;
|
||||
}
|
||||
|
||||
> * {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.detail {
|
||||
font-size: 1.125em;
|
||||
color: white;
|
||||
|
||||
@ -17,18 +17,23 @@
|
||||
import React, { Component, PropTypes } from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import moment from 'moment';
|
||||
|
||||
import ContentCreate from 'material-ui/svg-icons/content/create';
|
||||
import ActionDelete from 'material-ui/svg-icons/action/delete';
|
||||
import ContentSend from 'material-ui/svg-icons/content/send';
|
||||
|
||||
import { EditMeta, Transfer } from '../../modals';
|
||||
import { Actionbar, Button, Page, Loading } from '../../ui';
|
||||
import { nullableProptype } from '~/util/proptypes';
|
||||
import { EditMeta, Transfer } from '~/modals';
|
||||
import { Actionbar, Button, Page, Loading } from '~/ui';
|
||||
|
||||
import Delete from '../Address/Delete';
|
||||
import Header from '../Account/Header';
|
||||
import WalletDetails from './Details';
|
||||
import WalletConfirmations from './Confirmations';
|
||||
import WalletTransactions from './Transactions';
|
||||
|
||||
import { setVisibleAccounts } from '../../redux/providers/personalActions';
|
||||
import { setVisibleAccounts } from '~/redux/providers/personalActions';
|
||||
|
||||
import styles from './wallet.css';
|
||||
|
||||
@ -59,17 +64,18 @@ class Wallet extends Component {
|
||||
|
||||
static propTypes = {
|
||||
setVisibleAccounts: PropTypes.func.isRequired,
|
||||
balance: nullableProptype(PropTypes.object.isRequired),
|
||||
images: PropTypes.object.isRequired,
|
||||
address: PropTypes.string.isRequired,
|
||||
wallets: PropTypes.object.isRequired,
|
||||
wallet: PropTypes.object.isRequired,
|
||||
balances: PropTypes.object.isRequired,
|
||||
isTest: PropTypes.bool.isRequired
|
||||
};
|
||||
|
||||
state = {
|
||||
showEditDialog: false,
|
||||
showTransferDialog: false
|
||||
showTransferDialog: false,
|
||||
showDeleteDialog: false
|
||||
};
|
||||
|
||||
componentDidMount () {
|
||||
@ -96,34 +102,74 @@ class Wallet extends Component {
|
||||
}
|
||||
|
||||
render () {
|
||||
const { wallets, balances, address } = this.props;
|
||||
const { wallets, balance, address } = this.props;
|
||||
|
||||
const wallet = (wallets || {})[address];
|
||||
const balance = (balances || {})[address];
|
||||
|
||||
if (!wallet) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const { owners, require, dailylimit } = this.props.wallet;
|
||||
|
||||
return (
|
||||
<div className={ styles.wallet }>
|
||||
{ this.renderEditDialog(wallet) }
|
||||
{ this.renderTransferDialog() }
|
||||
{ this.renderDeleteDialog(wallet) }
|
||||
{ this.renderActionbar() }
|
||||
<Page>
|
||||
<Header
|
||||
account={ wallet }
|
||||
balance={ balance }
|
||||
/>
|
||||
<div className={ styles.info }>
|
||||
<Header
|
||||
className={ styles.header }
|
||||
account={ wallet }
|
||||
balance={ balance }
|
||||
>
|
||||
{ this.renderInfos() }
|
||||
</Header>
|
||||
|
||||
<WalletDetails
|
||||
className={ styles.details }
|
||||
owners={ owners }
|
||||
require={ require }
|
||||
dailylimit={ dailylimit }
|
||||
/>
|
||||
</div>
|
||||
{ this.renderDetails() }
|
||||
</Page>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderInfos () {
|
||||
const { dailylimit } = this.props.wallet;
|
||||
const { api } = this.context;
|
||||
|
||||
if (!dailylimit || !dailylimit.limit) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const limit = api.util.fromWei(dailylimit.limit).toFormat(3);
|
||||
const spent = api.util.fromWei(dailylimit.spent).toFormat(3);
|
||||
const date = moment(dailylimit.last.toNumber() * 24 * 3600 * 1000);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<br />
|
||||
<p>
|
||||
<span className={ styles.detail }>{ spent }<span className={ styles.eth } /></span>
|
||||
<span>has been spent today, out of</span>
|
||||
<span className={ styles.detail }>{ limit }<span className={ styles.eth } /></span>
|
||||
<span>set as the daily limit, which has been reset on</span>
|
||||
<span className={ styles.detail }>{ date.format('LL') }</span>
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderDetails () {
|
||||
const { address, isTest, wallet } = this.props;
|
||||
const { owners, require, dailylimit, confirmations, transactions } = wallet;
|
||||
const { owners, require, confirmations, transactions } = wallet;
|
||||
|
||||
if (!isTest || !owners || !require) {
|
||||
return (
|
||||
@ -134,13 +180,6 @@ class Wallet extends Component {
|
||||
}
|
||||
|
||||
return [
|
||||
<WalletDetails
|
||||
key='details'
|
||||
owners={ owners }
|
||||
require={ require }
|
||||
dailylimit={ dailylimit }
|
||||
/>,
|
||||
|
||||
<WalletConfirmations
|
||||
key='confirmations'
|
||||
owners={ owners }
|
||||
@ -160,9 +199,7 @@ class Wallet extends Component {
|
||||
}
|
||||
|
||||
renderActionbar () {
|
||||
const { address, balances } = this.props;
|
||||
|
||||
const balance = balances[address];
|
||||
const { balance } = this.props;
|
||||
const showTransferButton = !!(balance && balance.tokens);
|
||||
|
||||
const buttons = [
|
||||
@ -172,6 +209,11 @@ class Wallet extends Component {
|
||||
label='transfer'
|
||||
disabled={ !showTransferButton }
|
||||
onClick={ this.onTransferClick } />,
|
||||
<Button
|
||||
key='delete'
|
||||
icon={ <ActionDelete /> }
|
||||
label='delete wallet'
|
||||
onClick={ this.showDeleteDialog } />,
|
||||
<Button
|
||||
key='editmeta'
|
||||
icon={ <ContentCreate /> }
|
||||
@ -186,6 +228,18 @@ class Wallet extends Component {
|
||||
);
|
||||
}
|
||||
|
||||
renderDeleteDialog (account) {
|
||||
const { showDeleteDialog } = this.state;
|
||||
|
||||
return (
|
||||
<Delete
|
||||
account={ account }
|
||||
visible={ showDeleteDialog }
|
||||
route='/accounts'
|
||||
onClose={ this.closeDeleteDialog } />
|
||||
);
|
||||
}
|
||||
|
||||
renderEditDialog (wallet) {
|
||||
const { showEditDialog } = this.state;
|
||||
|
||||
@ -208,15 +262,13 @@ class Wallet extends Component {
|
||||
return null;
|
||||
}
|
||||
|
||||
const { wallets, balances, images, address } = this.props;
|
||||
const { wallets, balance, images, address } = this.props;
|
||||
const wallet = wallets[address];
|
||||
const balance = balances[address];
|
||||
|
||||
return (
|
||||
<Transfer
|
||||
account={ wallet }
|
||||
balance={ balance }
|
||||
balances={ balances }
|
||||
images={ images }
|
||||
onClose={ this.onTransferClose }
|
||||
/>
|
||||
@ -238,6 +290,14 @@ class Wallet extends Component {
|
||||
onTransferClose = () => {
|
||||
this.onTransferClick();
|
||||
}
|
||||
|
||||
closeDeleteDialog = () => {
|
||||
this.setState({ showDeleteDialog: false });
|
||||
}
|
||||
|
||||
showDeleteDialog = () => {
|
||||
this.setState({ showDeleteDialog: true });
|
||||
}
|
||||
}
|
||||
|
||||
function mapStateToProps (_, initProps) {
|
||||
@ -248,12 +308,14 @@ function mapStateToProps (_, initProps) {
|
||||
const { wallets } = state.personal;
|
||||
const { balances } = state.balances;
|
||||
const { images } = state;
|
||||
|
||||
const wallet = state.wallet.wallets[address] || {};
|
||||
const balance = balances[address] || null;
|
||||
|
||||
return {
|
||||
isTest,
|
||||
wallets,
|
||||
balances,
|
||||
balance,
|
||||
images,
|
||||
address,
|
||||
wallet
|
||||
|
||||
Loading…
Reference in New Issue
Block a user