From 19dbe3f4ad19abfef1a56445801ab1cfccdeacf2 Mon Sep 17 00:00:00 2001
From: Nicolas Gotchac <ngotchac@gmail.com>
Date: Tue, 22 Nov 2016 16:58:11 +0100
Subject: [PATCH] Wallet Creation Modal #3282

---
 js/src/contracts/code/index.js                |  21 ++
 js/src/contracts/code/wallet.js               |  23 +++
 .../CreateAccount/NewAccount/newAccount.js    |   5 +-
 .../CreateWallet/WalletDetails/index.js       |  17 ++
 .../WalletDetails/walletDetails.js            |  88 ++++++++
 .../modals/CreateWallet/WalletInfo/index.js   |  17 ++
 .../CreateWallet/WalletInfo/walletInfo.js     |  78 +++++++
 js/src/modals/CreateWallet/createWallet.css   |  30 +++
 js/src/modals/CreateWallet/createWallet.js    | 181 +++++++++++++++++
 .../modals/CreateWallet/createWalletStore.js  | 192 ++++++++++++++++++
 js/src/modals/CreateWallet/index.js           |  17 ++
 js/src/modals/index.js                        |   2 +
 js/src/ui/Form/Input/input.js                 |   2 +-
 js/src/ui/Form/TypedInput/typedInput.js       |  17 +-
 js/src/views/Accounts/accounts.js             |  36 +++-
 15 files changed, 714 insertions(+), 12 deletions(-)
 create mode 100644 js/src/contracts/code/index.js
 create mode 100644 js/src/contracts/code/wallet.js
 create mode 100644 js/src/modals/CreateWallet/WalletDetails/index.js
 create mode 100644 js/src/modals/CreateWallet/WalletDetails/walletDetails.js
 create mode 100644 js/src/modals/CreateWallet/WalletInfo/index.js
 create mode 100644 js/src/modals/CreateWallet/WalletInfo/walletInfo.js
 create mode 100644 js/src/modals/CreateWallet/createWallet.css
 create mode 100644 js/src/modals/CreateWallet/createWallet.js
 create mode 100644 js/src/modals/CreateWallet/createWalletStore.js
 create mode 100644 js/src/modals/CreateWallet/index.js

diff --git a/js/src/contracts/code/index.js b/js/src/contracts/code/index.js
new file mode 100644
index 00000000000..baa144979f8
--- /dev/null
+++ b/js/src/contracts/code/index.js
@@ -0,0 +1,21 @@
+// 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 wallet from './wallet';
+
+export {
+  wallet
+};
diff --git a/js/src/contracts/code/wallet.js b/js/src/contracts/code/wallet.js
new file mode 100644
index 00000000000..d82099d8b85
--- /dev/null
+++ b/js/src/contracts/code/wallet.js
@@ -0,0 +1,23 @@
+// 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/>.
+
+/**
+ * @version Solidity v0.4.6
+ * @from https://github.com/ethereum/dapp-bin/blob/dd5c485359074d49f571693ae064ce78970f3d6d/wallet/wallet.sol
+ * @date 22-Nov-2016 @ 15h00 UTC
+ */
+export default '0x606060405234620000005760405162001a0b38038062001a0b833981016040528080518201919060200180519060200190919080519060200190919050505b805b83835b600060018351016001819055503373ffffffffffffffffffffffffffffffffffffffff166002600161010081101562000000570160005b5081905550600161010260003373ffffffffffffffffffffffffffffffffffffffff16815260200190815260200160002081905550600090505b825181101562000158578281815181101562000000579060200190602002015173ffffffffffffffffffffffffffffffffffffffff1660028260020161010081101562000000570160005b50819055508060020161010260008584815181101562000000579060200190602002015173ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020819055505b806001019050620000b4565b816000819055505b5050508061010581905550620001896200019c6401000000000262001837176401000000009004565b610107819055505b505b505050620001b1565b60006201518042811562000000570490505b90565b61184b80620001c06000396000f3606060405236156100f4576000357c010000000000000000000000000000000000000000000000000000000090048063173825d9146101615780632f54bf6e1461017e5780634123cb6b146101b157806352375093146101d45780635c52c2f5146101f7578063659010e7146102065780637065cb4814610229578063746c917114610246578063797af62714610269578063b20d30a91461029c578063b61d27f6146102b9578063b75c7dc61461030b578063ba51a6df14610328578063c2cf732614610345578063c41a360a14610381578063cbf0b0c0146103c8578063f00d4b5d146103e5578063f1736d861461040b575b346100005761015f5b600034111561015c577fe1fffcc4923d04b559f4d29a8bfc6cda04eb5b0d3c460751c2402c5c5cc9109c3334604051808373ffffffffffffffffffffffffffffffffffffffff1681526020018281526020019250505060405180910390a15b5b565b005b346100005761017c600480803590602001909190505061042e565b005b34610000576101996004808035906020019091905050610558565b60405180821515815260200191505060405180910390f35b34610000576101be610590565b6040518082815260200191505060405180910390f35b34610000576101e1610596565b6040518082815260200191505060405180910390f35b346100005761020461059d565b005b34610000576102136105d8565b6040518082815260200191505060405180910390f35b346100005761024460048080359060200190919050506105df565b005b3461000057610253610712565b6040518082815260200191505060405180910390f35b34610000576102846004808035906020019091905050610718565b60405180821515815260200191505060405180910390f35b34610000576102b76004808035906020019091905050610ac4565b005b34610000576102f160048080359060200190919080359060200190919080359060200190820180359060200191909192905050610aff565b604051808260001916815260200191505060405180910390f35b34610000576103266004808035906020019091905050610e6d565b005b34610000576103436004808035906020019091905050610f64565b005b34610000576103696004808035906020019091908035906020019091905050610fec565b60405180821515815260200191505060405180910390f35b346100005761039c600480803590602001909190505061106a565b604051808273ffffffffffffffffffffffffffffffffffffffff16815260200191505060405180910390f35b34610000576103e3600480803590602001909190505061108a565b005b346100005761040960048080359060200190919080359060200190919050506110d5565b005b3461000057610418611259565b6040518082815260200191505060405180910390f35b600060003660405180838380828437820191505092505050604051809103902061045781611260565b156105525761010260008473ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020549150600082141561049757610551565b60016001540360005411156104ab57610551565b6000600283610100811015610000570160005b5081905550600061010260008573ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020819055506104fb611484565b61050361157f565b7f58619076adf5bb0943d100ef88d52d7c3fd691b19d3a9071b555b651fbf418da83604051808273ffffffffffffffffffffffffffffffffffffffff16815260200191505060405180910390a15b5b5b505050565b6000600061010260008473ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020541190505b919050565b60015481565b6101075481565b6000366040518083838082843782019150509250505060405180910390206105c481611260565b156105d4576000610106819055505b5b5b50565b6101065481565b60003660405180838380828437820191505092505050604051809103902061060681611260565b1561070d5761061482610558565b1561061e5761070c565b610626611484565b60fa60015410151561063b5761063a61157f565b5b60fa60015410151561064c5761070c565b6001600081548092919060010191905055508173ffffffffffffffffffffffffffffffffffffffff166002600154610100811015610000570160005b508190555060015461010260008473ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020819055507f994a936646fe87ffe4f1e469d3d6aa417d6b855598397f323de5b449f765f0c382604051808273ffffffffffffffffffffffffffffffffffffffff16815260200191505060405180910390a15b5b5b5050565b60005481565b60008161072481611260565b15610abd57600061010860008560001916815260200190815260200160002060000160009054906101000a900473ffffffffffffffffffffffffffffffffffffffff1673ffffffffffffffffffffffffffffffffffffffff16141515610abb5761010860008460001916815260200190815260200160002060000160009054906101000a900473ffffffffffffffffffffffffffffffffffffffff1673ffffffffffffffffffffffffffffffffffffffff166101086000856000191681526020019081526020016000206001015461010860008660001916815260200190815260200160002060020160405180828054600181600116156101000203166002900480156108725780601f1061084757610100808354040283529160200191610872565b820191906000526020600020905b81548152906001019060200180831161085557829003601f168201915b505091505060006040518083038185876185025a03f192505050507fe7c957c06e9a662c1a6c77366179f5b702b97651dc28eee7d5bf1dff6e40bb4a33846101086000876000191681526020019081526020016000206001015461010860008860001916815260200190815260200160002060000160009054906101000a900473ffffffffffffffffffffffffffffffffffffffff16610108600089600019168152602001908152602001600020600201604051808673ffffffffffffffffffffffffffffffffffffffff168152602001856000191681526020018481526020018373ffffffffffffffffffffffffffffffffffffffff168152602001806020018281038252838181546001816001161561010002031660029004815260200191508054600181600116156101000203166002900480156109f45780601f106109c9576101008083540402835291602001916109f4565b820191906000526020600020905b8154815290600101906020018083116109d757829003601f168201915b5050965050505050505060405180910390a161010860008460001916815260200190815260200160002060006000820160006101000a81549073ffffffffffffffffffffffffffffffffffffffff0219169055600182016000905560028201805460018160011615610100020316600290046000825580601f10610a785750610aaf565b601f016020900490600052602060002090810190610aae91905b80821115610aaa576000816000905550600101610a92565b5090565b5b50505060019150610abc565b5b5b5b50919050565b600036604051808383808284378201915050925050506040518091039020610aeb81611260565b15610afa5781610105819055505b5b5b5050565b6000610b0a33610558565b15610e6457610b18846116ce565b15610c01577f92ca3a80853e6663fa31fa10b99225f18d4902939b4c53a9caae9043f6efd0043385878686604051808673ffffffffffffffffffffffffffffffffffffffff1681526020018581526020018473ffffffffffffffffffffffffffffffffffffffff1681526020018060200182810382528484828181526020019250808284378201915050965050505050505060405180910390a18473ffffffffffffffffffffffffffffffffffffffff168484846040518083838082843782019150509250505060006040518083038185876185025a03f1925050505060006001029050610e63565b60003643604051808484808284378201915050828152602001935050505060405180910390209050610c3281610718565b158015610c905750600061010860008360001916815260200190815260200160002060000160009054906101000a900473ffffffffffffffffffffffffffffffffffffffff1673ffffffffffffffffffffffffffffffffffffffff16145b15610e62578461010860008360001916815260200190815260200160002060000160006101000a81548173ffffffffffffffffffffffffffffffffffffffff02191690836c01000000000000000000000000908102040217905550836101086000836000191681526020019081526020016000206001018190555082826101086000846000191681526020019081526020016000206002019190828054600181600116156101000203166002900490600052602060002090601f016020900481019282601f10610d6b57803560ff1916838001178555610d99565b82800160010185558215610d99579182015b82811115610d98578235825591602001919060010190610d7d565b5b509050610dbe91905b80821115610dba576000816000905550600101610da2565b5090565b50507f1733cbb53659d713b79580f79f3f9ff215f78a7c7aa45890f3b89fc5cddfbf3281338688878760405180876000191681526020018673ffffffffffffffffffffffffffffffffffffffff1681526020018581526020018473ffffffffffffffffffffffffffffffffffffffff168152602001806020018281038252848482818152602001925080828437820191505097505050505050505060405180910390a15b5b5b5b949350505050565b60006000600061010260003373ffffffffffffffffffffffffffffffffffffffff1681526020019081526020016000205492506000831415610eae57610f5e565b8260020a915061010360008560001916815260200190815260200160002090506000828260010154161115610f5d5780600001600081548092919060010191905055508181600101600082825403925050819055507fc7fb647e59b18047309aa15aad418e5d7ca96d173ad704f1031a2c3d7591734b3385604051808373ffffffffffffffffffffffffffffffffffffffff168152602001826000191681526020019250505060405180910390a15b5b50505050565b600036604051808383808284378201915050925050506040518091039020610f8b81611260565b15610fe757600154821115610f9f57610fe6565b81600081905550610fae611484565b7facbdb084c721332ac59f9b8e392196c9eb0e4932862da8eb9beaf0dad4f550da826040518082815260200191505060405180910390a15b5b5b5050565b6000600060006000610103600087600019168152602001908152602001600020925061010260008673ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020549150600082141561104d5760009350611061565b8160020a9050600081846001015416141593505b50505092915050565b6000600260018301610100811015610000570160005b505490505b919050565b6000366040518083838082843782019150509250505060405180910390206110b181611260565b156110d0578173ffffffffffffffffffffffffffffffffffffffff16ff5b5b5b5050565b60006000366040518083838082843782019150509250505060405180910390206110fe81611260565b156112525761110c83610558565b1561111657611251565b61010260008573ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020549150600082141561115157611251565b611159611484565b8273ffffffffffffffffffffffffffffffffffffffff16600283610100811015610000570160005b5081905550600061010260008673ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020819055508161010260008573ffffffffffffffffffffffffffffffffffffffff168152602001908152602001600020819055507fb532073b38c83145e3e5135377a08bf9aab55bc0fd7c1179cd4fb995d2a5159c8484604051808373ffffffffffffffffffffffffffffffffffffffff1681526020018273ffffffffffffffffffffffffffffffffffffffff1681526020019250505060405180910390a15b5b5b50505050565b6101055481565b600060006000600061010260003373ffffffffffffffffffffffffffffffffffffffff16815260200190815260200160002054925060008314156112a35761147c565b610103600086600019168152602001908152602001600020915060008260000154141561135a5760005482600001819055506000826001018190555061010480548091906001018154818355818115116113295781836000526020600020918201910161132891905b8082111561132457600081600090555060010161130c565b5090565b5b5050508260020181905550846101048360020154815481101561000057906000526020600020900160005b50819055505b8260020a9050600081836001015416141561147b577fe1c52dc63b719ade82e8bea94cc41a0d5d28e4aaf536adb5e9cccc9ff8c1aeda3386604051808373ffffffffffffffffffffffffffffffffffffffff168152602001826000191681526020019250505060405180910390a1600182600001541115156114525761010461010360008760001916815260200190815260200160002060020154815481101561000057906000526020600020900160005b5060009055610103600086600019168152602001908152602001600020600060008201600090556001820160009055600282016000905550506001935061147c5661147a565b8160000160008154809291906001900391905055508082600101600082825417925050819055505b5b5b505050919050565b60006000610104805490509150600090505b8181101561157257610108600061010483815481101561000057906000526020600020900160005b505460001916815260200190815260200160002060006000820160006101000a81549073ffffffffffffffffffffffffffffffffffffffff0219169055600182016000905560028201805460018160011615610100020316600290046000825580601f1061152c5750611563565b601f01602090049060005260206000209081019061156291905b8082111561155e576000816000905550600101611546565b5090565b5b5050505b806001019050611496565b61157a611754565b5b5050565b6000600190505b6001548110156116ca575b600154811080156115b557506000600282610100811015610000570160005b505414155b156115c7578080600101915050611591565b5b60016001541180156115ee575060006002600154610100811015610000570160005b5054145b1561160b57600160008154809291906001900391905055506115c8565b60015481108015611631575060006002600154610100811015610000570160005b505414155b801561164f57506000600282610100811015610000570160005b5054145b156116c5576002600154610100811015610000570160005b5054600282610100811015610000570160005b5081905550806101026000600284610100811015610000570160005b505481526020019081526020016000208190555060006002600154610100811015610000570160005b50819055505b611586565b5b50565b60006116d933610558565b1561174e57610107546116ea611837565b111561170957600061010681905550611701611837565b610107819055505b610106548261010654011015801561172957506101055482610106540111155b156117485781610106600082825401925050819055506001905061174d565b600090505b5b5b919050565b60006000610104805490509150600090505b818110156117f857600060010261010482815481101561000057906000526020600020900160005b5054600019161415156117ec57610103600061010483815481101561000057906000526020600020900160005b5054600019168152602001908152602001600020600060008201600090556001820160009055600282016000905550505b5b806001019050611766565b6101048054600082559060005260206000209081019061183091905b8082111561182c576000816000905550600101611814565b5090565b5b505b5050565b600062015180428115610000570490505b9056';
+
diff --git a/js/src/modals/CreateAccount/NewAccount/newAccount.js b/js/src/modals/CreateAccount/NewAccount/newAccount.js
index 8c476634f4b..da7cb9fcff7 100644
--- a/js/src/modals/CreateAccount/NewAccount/newAccount.js
+++ b/js/src/modals/CreateAccount/NewAccount/newAccount.js
@@ -192,8 +192,6 @@ export default class CreateAccount extends Component {
               };
             });
 
-            console.log(accounts);
-
             this.setState({
               selectedAddress: addresses[0],
               accounts: accounts
@@ -201,8 +199,7 @@ export default class CreateAccount extends Component {
           });
       })
       .catch((error) => {
-        console.log('createIdentities', error);
-
+        console.error('createIdentities', error);
         setTimeout(this.createIdentities, 1000);
         this.newError(error);
       });
diff --git a/js/src/modals/CreateWallet/WalletDetails/index.js b/js/src/modals/CreateWallet/WalletDetails/index.js
new file mode 100644
index 00000000000..2663855118b
--- /dev/null
+++ b/js/src/modals/CreateWallet/WalletDetails/index.js
@@ -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 './walletDetails';
diff --git a/js/src/modals/CreateWallet/WalletDetails/walletDetails.js b/js/src/modals/CreateWallet/WalletDetails/walletDetails.js
new file mode 100644
index 00000000000..ac2e52da75e
--- /dev/null
+++ b/js/src/modals/CreateWallet/WalletDetails/walletDetails.js
@@ -0,0 +1,88 @@
+// 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 { Form, TypedInput, AddressSelect } from '../../../ui';
+import { parseAbiType } from '../../../util/abi';
+
+export default class WalletDetails extends Component {
+  static propTypes = {
+    accounts: PropTypes.object.isRequired,
+    wallet: PropTypes.object.isRequired,
+    errors: PropTypes.object.isRequired,
+    onChange: PropTypes.func.isRequired
+  };
+
+  render () {
+    const { accounts, wallet, errors } = this.props;
+
+    return (
+      <Form>
+        <AddressSelect
+          label='from account (contract owner)'
+          hint='the owner account for this contract'
+          value={ wallet.account }
+          error={ errors.account }
+          onChange={ this.onAccoutChange }
+          accounts={ accounts }
+        />
+
+        <TypedInput
+          label='other wallet owners'
+          value={ wallet.owners.slice() }
+          onChange={ this.onOwnersChange }
+          accounts={ accounts }
+          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') }
+        />
+
+        <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') }
+        />
+      </Form>
+    );
+  }
+
+  onAccoutChange = (_, account) => {
+    this.props.onChange({ account });
+  }
+
+  onOwnersChange = (owners) => {
+    this.props.onChange({ owners });
+  }
+
+  onRequiredChange = (required) => {
+    this.props.onChange({ required });
+  }
+
+  onDaylimitChange = (daylimit) => {
+    this.props.onChange({ daylimit });
+  }
+}
diff --git a/js/src/modals/CreateWallet/WalletInfo/index.js b/js/src/modals/CreateWallet/WalletInfo/index.js
new file mode 100644
index 00000000000..975e7bd59c0
--- /dev/null
+++ b/js/src/modals/CreateWallet/WalletInfo/index.js
@@ -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 './walletInfo';
diff --git a/js/src/modals/CreateWallet/WalletInfo/walletInfo.js b/js/src/modals/CreateWallet/WalletInfo/walletInfo.js
new file mode 100644
index 00000000000..93f1b7fd1a9
--- /dev/null
+++ b/js/src/modals/CreateWallet/WalletInfo/walletInfo.js
@@ -0,0 +1,78 @@
+// 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 { CompletedStep, IdentityIcon, CopyToClipboard } from '../../../ui';
+
+import styles from '../createWallet.css';
+
+export default class WalletInfo extends Component {
+  static propTypes = {
+    accounts: PropTypes.object.isRequired,
+    account: PropTypes.string.isRequired,
+    address: PropTypes.string.isRequired,
+    owners: PropTypes.array.isRequired,
+    required: PropTypes.number.isRequired,
+    daylimit: PropTypes.number.isRequired
+  };
+
+  render () {
+    const { address, required, daylimit } = this.props;
+
+    return (
+      <CompletedStep>
+        <div>Your wallet has been deployed at</div>
+        <div>
+          <CopyToClipboard data={ address } label='copy address to clipboard' />
+          <IdentityIcon address={ address } inline center className={ styles.identityicon } />
+          <div className={ styles.address }>{ address }</div>
+        </div>
+        <div>with the following owners</div>
+        <div>
+          { this.renderOwners() }
+        </div>
+        <p>
+          <code>{ required }</code> owners are required to confirm a transaction.
+        </p>
+        <p>
+          The daily limit is set to <code>{ daylimit }</code>.
+        </p>
+      </CompletedStep>
+    );
+  }
+
+  renderOwners () {
+    const { account, owners } = this.props;
+
+    return [].concat(account, owners).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>
+      </div>
+    ));
+  }
+
+  addressToString (address) {
+    const { accounts } = this.props;
+
+    if (accounts[address]) {
+      return accounts[address].name || address;
+    }
+
+    return address;
+  }
+}
diff --git a/js/src/modals/CreateWallet/createWallet.css b/js/src/modals/CreateWallet/createWallet.css
new file mode 100644
index 00000000000..c10fc0e04ed
--- /dev/null
+++ b/js/src/modals/CreateWallet/createWallet.css
@@ -0,0 +1,30 @@
+/* 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/>.
+*/
+
+.address {
+  vertical-align: top;
+  display: inline-block;
+}
+
+.identityicon {
+  margin: -8px 0.5em;
+}
+
+.owner {
+  height: 40px;
+  color: lightgrey;
+}
diff --git a/js/src/modals/CreateWallet/createWallet.js b/js/src/modals/CreateWallet/createWallet.js
new file mode 100644
index 00000000000..a6b2d3857b5
--- /dev/null
+++ b/js/src/modals/CreateWallet/createWallet.js
@@ -0,0 +1,181 @@
+// 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 { observer } from 'mobx-react';
+
+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 WalletDetails from './WalletDetails';
+import WalletInfo from './WalletInfo';
+import CreateWalletStore from './createWalletStore';
+// import styles from './createWallet.css';
+
+@observer
+export default class CreateWallet extends Component {
+  static contextTypes = {
+    api: PropTypes.object.isRequired
+  };
+
+  static propTypes = {
+    accounts: PropTypes.object.isRequired,
+    onClose: PropTypes.func.isRequired
+  };
+
+  store = new CreateWalletStore(this.context.api, this.props.accounts);
+
+  render () {
+    const { stage, steps, waiting, rejected } = this.store;
+
+    if (rejected) {
+      return (
+        <Modal
+          visible
+          title='rejected'
+          actions={ this.renderDialogActions() }
+        >
+          <BusyStep
+            title='The deployment has been rejected'
+            state='The wallet will not be created. You can safely close this window.'
+          />
+        </Modal>
+      );
+    }
+
+    return (
+      <Modal
+        visible
+        actions={ this.renderDialogActions() }
+        current={ stage }
+        steps={ steps }
+        waiting={ waiting }
+      >
+        { this.renderPage() }
+      </Modal>
+    );
+  }
+
+  renderPage () {
+    const { step } = this.store;
+    const { accounts } = this.props;
+
+    switch (step) {
+      case 'DEPLOYMENT':
+        return (
+          <BusyStep
+            title='The deployment is currently in progress'
+            state={ this.store.deployState }
+          >
+            { this.store.txhash ? (<TxHash hash={ this.store.txhash } />) : null }
+          </BusyStep>
+        );
+
+      case 'INFO':
+        return (
+          <WalletInfo
+            accounts={ accounts }
+
+            account={ this.store.wallet.account }
+            address={ this.store.wallet.address }
+            owners={ this.store.wallet.owners.slice() }
+            required={ this.store.wallet.required }
+            daylimit={ this.store.wallet.daylimit }
+          />
+        );
+
+      default:
+      case 'DETAILS':
+        return (
+          <WalletDetails
+            accounts={ accounts }
+            wallet={ this.store.wallet }
+            errors={ this.store.errors }
+            onChange={ this.store.onChange }
+          />
+        );
+    }
+  }
+
+  renderDialogActions () {
+    const { step, hasErrors, rejected, onCreate } = this.store;
+
+    const cancelBtn = (
+      <Button
+        icon={ <ContentClear /> }
+        label='Cancel'
+        onClick={ this.onClose }
+      />
+    );
+
+    const closeBtn = (
+      <Button
+        icon={ <ContentClear /> }
+        label='Close'
+        onClick={ this.onClose }
+      />
+    );
+
+    const doneBtn = (
+      <Button
+        icon={ <ActionDone /> }
+        label='Done'
+        onClick={ this.onClose }
+      />
+    );
+
+    const sendingBtn = (
+      <Button
+        icon={ <ActionDone /> }
+        label='Sending...'
+        disabled
+      />
+    );
+
+    const createBtn = (
+      <Button
+        icon={ <NavigationArrowForward /> }
+        label='Create'
+        disabled={ hasErrors }
+        onClick={ onCreate }
+      />
+    );
+
+    if (rejected) {
+      return [ closeBtn ];
+    }
+
+    switch (step) {
+      case 'DEPLOYMENT':
+        return [ closeBtn, sendingBtn ];
+
+      case 'INFO':
+        return [ doneBtn ];
+
+      default:
+      case 'DETAILS':
+        return [ cancelBtn, createBtn ];
+
+    }
+  }
+
+  onClose = () => {
+    this.props.onClose();
+  }
+}
diff --git a/js/src/modals/CreateWallet/createWalletStore.js b/js/src/modals/CreateWallet/createWalletStore.js
new file mode 100644
index 00000000000..463658f0829
--- /dev/null
+++ b/js/src/modals/CreateWallet/createWalletStore.js
@@ -0,0 +1,192 @@
+// 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 { observable, computed, action, transaction } from 'mobx';
+
+import { validateUint, validateAddress } from '../../util/validation';
+import { ERROR_CODES } from '../../api/transport/error';
+
+import { wallet as walletAbi } from '../../contracts/abi';
+import { wallet as walletCode } from '../../contracts/code';
+
+const STEPS = {
+  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 txhash = null;
+
+  @observable wallet = {
+    account: '',
+    address: '',
+    owners: [],
+    required: 1,
+    daylimit: 0
+  };
+
+  @observable errors = {
+    account: null,
+    owners: null,
+    required: null,
+    daylimit: null
+  };
+
+  @computed get stage () {
+    return STEPS_KEYS.findIndex((k) => k === this.step);
+  }
+
+  @computed get hasErrors () {
+    return !!Object.values(this.errors).find((e) => !!e);
+  }
+
+  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);
+
+  constructor (api, accounts) {
+    this.api = api;
+
+    this.step = STEPS_KEYS[0];
+    this.wallet.account = Object.values(accounts)[0].address;
+  }
+
+  @action onChange = (_wallet) => {
+    const newWallet = Object.assign({}, this.wallet, _wallet);
+    const { errors, wallet } = this.validateWallet(newWallet);
+
+    transaction(() => {
+      this.wallet = wallet;
+      this.errors = errors;
+    });
+  }
+
+  @action onCreate = () => {
+    if (this.hasErrors) {
+      return;
+    }
+
+    this.step = 'DEPLOYMENT';
+
+    const { account, owners, required, daylimit } = this.wallet;
+
+    const options = {
+      data: walletCode,
+      from: account
+    };
+
+    this.api
+      .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,
+              contract: true,
+              wallet: true,
+              timestamp: Date.now(),
+              deleted: false,
+              description: '',
+              name: ''
+            })
+          ])
+          .then(() => {
+            transaction(() => {
+              this.wallet.address = address;
+              this.step = 'INFO';
+            });
+          });
+      })
+      .catch((error) => {
+        if (error.code === ERROR_CODES.REQUEST_REJECTED) {
+          this.rejected = true;
+          return;
+        }
+
+        console.error('error deploying contract', error);
+        this.deployError = error;
+      });
+  }
+
+  onDeploymentState = (error, data) => {
+    if (error) {
+      return console.error('createWallet::onDeploymentState', error);
+    }
+
+    switch (data.state) {
+      case 'estimateGas':
+      case 'postTransaction':
+        this.deployState = 'Preparing transaction for network transmission';
+        return;
+
+      case 'checkRequest':
+        this.deployState = 'Waiting for confirmation of the transaction in the Parity Secure Signer';
+        return;
+
+      case 'getTransactionReceipt':
+        this.deployState = 'Waiting for the contract deployment transaction receipt';
+        this.txhash = data.txhash;
+        return;
+
+      case 'hasReceipt':
+      case 'getCode':
+        this.deployState = 'Validating the deployed contract code';
+        return;
+
+      case 'completed':
+        this.deployState = 'The contract deployment has been completed';
+        return;
+
+      default:
+        console.error('createWallet::onDeploymentState', 'unknow contract deployment state', data);
+        return;
+    }
+  }
+
+  validateWallet = (_wallet) => {
+    const accountValidation = validateAddress(_wallet.account);
+    const requiredValidation = validateUint(_wallet.required);
+    const daylimitValidation = validateUint(_wallet.daylimit);
+
+    const errors = {
+      account: accountValidation.addressError,
+      required: requiredValidation.valueError,
+      daylimit: daylimitValidation.valueError
+    };
+
+    const wallet = {
+      ..._wallet,
+      account: accountValidation.address,
+      required: requiredValidation.value,
+      daylimit: daylimitValidation.value
+    };
+
+    return { errors, wallet };
+  }
+}
diff --git a/js/src/modals/CreateWallet/index.js b/js/src/modals/CreateWallet/index.js
new file mode 100644
index 00000000000..5779fb553fa
--- /dev/null
+++ b/js/src/modals/CreateWallet/index.js
@@ -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 './createWallet';
diff --git a/js/src/modals/index.js b/js/src/modals/index.js
index d0f8f7afecb..5a3d49ff309 100644
--- a/js/src/modals/index.js
+++ b/js/src/modals/index.js
@@ -17,6 +17,7 @@
 import AddAddress from './AddAddress';
 import AddContract from './AddContract';
 import CreateAccount from './CreateAccount';
+import CreateWallet from './CreateWallet';
 import DeployContract from './DeployContract';
 import EditMeta from './EditMeta';
 import ExecuteContract from './ExecuteContract';
@@ -32,6 +33,7 @@ export {
   AddAddress,
   AddContract,
   CreateAccount,
+  CreateWallet,
   DeployContract,
   EditMeta,
   ExecuteContract,
diff --git a/js/src/ui/Form/Input/input.js b/js/src/ui/Form/Input/input.js
index 4dee227c6d9..ac3d20e17ee 100644
--- a/js/src/ui/Form/Input/input.js
+++ b/js/src/ui/Form/Input/input.js
@@ -78,7 +78,7 @@ export default class Input extends Component {
   }
 
   state = {
-    value: this.props.value || ''
+    value: typeof this.props.value === 'undefined' ? '' : this.props.value
   }
 
   componentWillReceiveProps (newProps) {
diff --git a/js/src/ui/Form/TypedInput/typedInput.js b/js/src/ui/Form/TypedInput/typedInput.js
index f5ec2a02f9c..5ef3ce91694 100644
--- a/js/src/ui/Form/TypedInput/typedInput.js
+++ b/js/src/ui/Form/TypedInput/typedInput.js
@@ -31,12 +31,13 @@ export default class TypedInput extends Component {
 
   static propTypes = {
     onChange: PropTypes.func.isRequired,
-    accounts: PropTypes.object.isRequired,
     param: PropTypes.object.isRequired,
 
+    accounts: PropTypes.object,
     error: PropTypes.any,
     value: PropTypes.any,
-    label: PropTypes.string
+    label: PropTypes.string,
+    hint: PropTypes.string
   };
 
   render () {
@@ -141,11 +142,12 @@ export default class TypedInput extends Component {
   }
 
   renderNumber () {
-    const { label, value, error, param } = this.props;
+    const { label, value, error, param, hint } = this.props;
 
     return (
       <Input
         label={ label }
+        hint={ hint }
         value={ value }
         error={ error }
         onSubmit={ this.onSubmit }
@@ -156,11 +158,12 @@ export default class TypedInput extends Component {
   }
 
   renderDefault () {
-    const { label, value, error } = this.props;
+    const { label, value, error, hint } = this.props;
 
     return (
       <Input
         label={ label }
+        hint={ hint }
         value={ value }
         error={ error }
         onSubmit={ this.onSubmit }
@@ -169,12 +172,13 @@ export default class TypedInput extends Component {
   }
 
   renderAddress () {
-    const { accounts, label, value, error } = this.props;
+    const { accounts, label, value, error, hint } = this.props;
 
     return (
       <InputAddressSelect
         accounts={ accounts }
         label={ label }
+        hint={ hint }
         value={ value }
         error={ error }
         onChange={ this.onChange }
@@ -184,7 +188,7 @@ export default class TypedInput extends Component {
   }
 
   renderBoolean () {
-    const { label, value, error } = this.props;
+    const { label, value, error, hint } = this.props;
 
     const boolitems = ['false', 'true'].map((bool) => {
       return (
@@ -201,6 +205,7 @@ export default class TypedInput extends Component {
     return (
       <Select
         label={ label }
+        hint={ hint }
         value={ value ? 'true' : 'false' }
         error={ error }
         onChange={ this.onChangeBool }
diff --git a/js/src/views/Accounts/accounts.js b/js/src/views/Accounts/accounts.js
index 0e7cd050033..c5ed81ca6b6 100644
--- a/js/src/views/Accounts/accounts.js
+++ b/js/src/views/Accounts/accounts.js
@@ -21,7 +21,7 @@ import ContentAdd from 'material-ui/svg-icons/content/add';
 import { uniq } from 'lodash';
 
 import List from './List';
-import { CreateAccount } from '../../modals';
+import { CreateAccount, CreateWallet } from '../../modals';
 import { Actionbar, ActionbarExport, ActionbarSearch, ActionbarSort, Button, Page, Tooltip } from '../../ui';
 
 import styles from './accounts.css';
@@ -40,6 +40,7 @@ class Accounts extends Component {
   state = {
     addressBook: false,
     newDialog: false,
+    newWalletDialog: false,
     sortOrder: '',
     searchValues: [],
     searchTokens: []
@@ -52,6 +53,7 @@ class Accounts extends Component {
     return (
       <div className={ styles.accounts }>
         { this.renderNewDialog() }
+        { this.renderNewWalletDialog() }
         { this.renderActionbar() }
         <Page>
           <List
@@ -106,6 +108,12 @@ class Accounts extends Component {
         label='new account'
         onClick={ this.onNewAccountClick } />,
 
+      <Button
+        key='newWallet'
+        icon={ <ContentAdd /> }
+        label='new wallet'
+        onClick={ this.onNewWalletClick } />,
+
       <ActionbarExport
         key='exportAccounts'
         content={ accounts }
@@ -144,6 +152,22 @@ class Accounts extends Component {
     );
   }
 
+  renderNewWalletDialog () {
+    const { accounts } = this.props;
+    const { newWalletDialog } = this.state;
+
+    if (!newWalletDialog) {
+      return null;
+    }
+
+    return (
+      <CreateWallet
+        accounts={ accounts }
+        onClose={ this.onNewWalletClose }
+      />
+    );
+  }
+
   onAddSearchToken = (token) => {
     const { searchTokens } = this.state;
     const newSearchTokens = uniq([].concat(searchTokens, token));
@@ -156,10 +180,20 @@ class Accounts extends Component {
     });
   }
 
+  onNewWalletClick = () => {
+    this.setState({
+      newWalletDialog: !this.state.newWalletDialog
+    });
+  }
+
   onNewAccountClose = () => {
     this.onNewAccountClick();
   }
 
+  onNewWalletClose = () => {
+    this.onNewWalletClick();
+  }
+
   onNewAccountUpdate = () => {
   }
 }