Merge remote-tracking branch 'origin/master' into check-updates

Cargo.lock

@@ -1306,7 +1306,7 @@ dependencies = [
 [[package]]
 name = "parity-ui-precompiled"
 version = "1.4.0"
-source = "git+https://github.com/ethcore/js-precompiled.git#2397280818ec4e4502b379f788f2eecdbc63abb4"
+source = "git+https://github.com/ethcore/js-precompiled.git#b29e2a151561ae41aa27af3b226522844ae8aae2"
 dependencies = [
  "parity-dapps-glue 1.4.0 (registry+https://github.com/rust-lang/crates.io-index)",
 ]

ethcore/light/src/net/context.rs

@@ -16,7 +16,7 @@
 
 //! I/O and event context generalizations.
 
-use network::{NetworkContext, PeerId};
+use network::{NetworkContext, PeerId, NodeId};
 
 use super::{Announcement, LightProtocol, ReqId};
 use super::error::Error;
@@ -41,8 +41,12 @@ pub trait IoContext {
 
 	/// Get a peer's protocol version.
 	fn protocol_version(&self, peer: PeerId) -> Option<u8>;
+
+	/// Persistent peer id
+	fn persistent_peer_id(&self, peer: PeerId) -> Option<NodeId>;
 }
 
+
 impl<'a> IoContext for NetworkContext<'a> {
 	fn send(&self, peer: PeerId, packet_id: u8, packet_body: Vec<u8>) {
 		if let Err(e) = self.send(peer, packet_id, packet_body) {
@@ -67,6 +71,10 @@ impl<'a> IoContext for NetworkContext<'a> {
 	fn protocol_version(&self, peer: PeerId) -> Option<u8> {
 		self.protocol_version(self.subprotocol_name(), peer)
 	}
+
+	fn persistent_peer_id(&self, peer: PeerId) -> Option<NodeId> {
+		self.session_info(peer).and_then(|info| info.id)
+	}
 }
 
 /// Context for a protocol event.
@@ -75,6 +83,9 @@ pub trait EventContext {
 	/// disconnected/connected peer.
 	fn peer(&self) -> PeerId;
 
+	/// Returns the relevant's peer persistent Id (aka NodeId).
+	fn persistent_peer_id(&self, peer: PeerId) -> Option<NodeId>;
+
 	/// Make a request from a peer.
 	fn request_from(&self, peer: PeerId, request: Request) -> Result<ReqId, Error>;
 
@@ -101,7 +112,14 @@ pub struct Ctx<'a> {
 }
 
 impl<'a> EventContext for Ctx<'a> {
-	fn peer(&self) -> PeerId { self.peer }
+	fn peer(&self) -> PeerId {
+		self.peer
+	}
+
+	fn persistent_peer_id(&self, id: PeerId) -> Option<NodeId> {
+		self.io.persistent_peer_id(id)
+	}
+
 	fn request_from(&self, peer: PeerId, request: Request) -> Result<ReqId, Error> {
 		self.proto.request_from(self.io, &peer, request)
 	}

ethcore/light/src/net/tests/mod.rs

@@ -21,7 +21,7 @@ use ethcore::blockchain_info::BlockChainInfo;
 use ethcore::client::{BlockChainClient, EachBlockWith, TestBlockChainClient};
 use ethcore::ids::BlockId;
 use ethcore::transaction::SignedTransaction;
-use network::PeerId;
+use network::{PeerId, NodeId};
 
 use net::buffer_flow::FlowParams;
 use net::context::IoContext;
@@ -68,6 +68,10 @@ impl IoContext for Expect {
 	fn protocol_version(&self, _peer: PeerId) -> Option<u8> {
 		Some(super::MAX_PROTOCOL_VERSION)
 	}
+
+	fn persistent_peer_id(&self, _peer: PeerId) -> Option<NodeId> {
+		None
+	}
 }
 
 // can't implement directly for Arc due to cross-crate orphan rules.

ethcore/src/client/chain_notify.rs

@@ -40,6 +40,14 @@ pub trait ChainNotify : Send + Sync {
 	fn stop(&self) {
 		// does nothing by default
 	}
+
+	/// fires when new transactions are received from a peer
+	fn transactions_received(&self,
+		_hashes: Vec<H256>,
+		_peer_id: usize,
+	) {
+		// does nothing by default
+	}
 }
 
 impl IpcConfig for ChainNotify { }

ethcore/src/client/client.rs

@@ -584,11 +584,15 @@ impl Client {
 	}
 
 	/// Import transactions from the IO queue
-	pub fn import_queued_transactions(&self, transactions: &[Bytes]) -> usize {
+	pub fn import_queued_transactions(&self, transactions: &[Bytes], peer_id: usize) -> usize {
 		trace!(target: "external_tx", "Importing queued");
 		let _timer = PerfTimer::new("import_queued_transactions");
 		self.queue_transactions.fetch_sub(transactions.len(), AtomicOrdering::SeqCst);
-		let txs = transactions.iter().filter_map(|bytes| UntrustedRlp::new(bytes).as_val().ok()).collect();
+		let txs: Vec<SignedTransaction> = transactions.iter().filter_map(|bytes| UntrustedRlp::new(bytes).as_val().ok()).collect();
+		let hashes: Vec<_> = txs.iter().map(|tx| tx.hash()).collect();
+		self.notify(|notify| {
+			notify.transactions_received(hashes.clone(), peer_id);
+		});
 		let results = self.miner.import_external_transactions(self, txs);
 		results.len()
 	}
@@ -1303,14 +1307,14 @@ impl BlockChainClient for Client {
 		(*self.build_last_hashes(self.chain.read().best_block_hash())).clone()
 	}
 
-	fn queue_transactions(&self, transactions: Vec<Bytes>) {
+	fn queue_transactions(&self, transactions: Vec<Bytes>, peer_id: usize) {
 		let queue_size = self.queue_transactions.load(AtomicOrdering::Relaxed);
 		trace!(target: "external_tx", "Queue size: {}", queue_size);
 		if queue_size > MAX_TX_QUEUE_SIZE {
 			debug!("Ignoring {} transactions: queue is full", transactions.len());
 		} else {
 			let len = transactions.len();
-			match self.io_channel.lock().send(ClientIoMessage::NewTransactions(transactions)) {
+			match self.io_channel.lock().send(ClientIoMessage::NewTransactions(transactions, peer_id)) {
 				Ok(_) => {
 					self.queue_transactions.fetch_add(len, AtomicOrdering::SeqCst);
 				}

ethcore/src/client/test_client.rs

@@ -661,7 +661,7 @@ impl BlockChainClient for TestBlockChainClient {
 		unimplemented!();
 	}
 
-	fn queue_transactions(&self, transactions: Vec<Bytes>) {
+	fn queue_transactions(&self, transactions: Vec<Bytes>, _peer_id: usize) {
 		// import right here
 		let txs = transactions.into_iter().filter_map(|bytes| UntrustedRlp::new(&bytes).as_val().ok()).collect();
 		self.miner.import_external_transactions(self, txs);

ethcore/src/client/traits.rs

@@ -203,7 +203,7 @@ pub trait BlockChainClient : Sync + Send {
 	fn last_hashes(&self) -> LastHashes;
 
 	/// Queue transactions for importing.
-	fn queue_transactions(&self, transactions: Vec<Bytes>);
+	fn queue_transactions(&self, transactions: Vec<Bytes>, peer_id: usize);
 
 	/// list all transactions
 	fn pending_transactions(&self) -> Vec<SignedTransaction>;

ethcore/src/service.rs

@@ -39,7 +39,7 @@ pub enum ClientIoMessage {
 	/// A block is ready
 	BlockVerified,
 	/// New transaction RLPs are ready to be imported
-	NewTransactions(Vec<Bytes>),
+	NewTransactions(Vec<Bytes>, usize),
 	/// Begin snapshot restoration
 	BeginRestoration(ManifestData),
 	/// Feed a state chunk to the snapshot service
@@ -196,7 +196,9 @@ impl IoHandler<ClientIoMessage> for ClientIoHandler {
 
 		match *net_message {
 			ClientIoMessage::BlockVerified => { self.client.import_verified_blocks(); }
-			ClientIoMessage::NewTransactions(ref transactions) => { self.client.import_queued_transactions(transactions); }
+			ClientIoMessage::NewTransactions(ref transactions, peer_id) => {
+				self.client.import_queued_transactions(transactions, peer_id);
+			}
 			ClientIoMessage::BeginRestoration(ref manifest) => {
 				if let Err(e) = self.snapshot.init_restore(manifest.clone(), true) {
 					warn!("Failed to initialize snapshot restoration: {}", e);

js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "parity.js",
-  "version": "0.2.114",
+  "version": "0.2.120",
   "main": "release/index.js",
   "jsnext:main": "src/index.js",
   "author": "Parity Team <admin@parity.io>",

js/src/api/util/identity.js

@@ -1,7 +1,28 @@
+// Copyright 2015, 2016 Parity Technologies (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 blockies from 'blockies';
 
+// jsdom doesn't have all the browser features, blockies fail
+const TEST_ENV = process.env.NODE_ENV === 'test';
+
 export function createIdentityImg (address, scale = 8) {
-  return blockies({
+  return TEST_ENV
+    ? ''
+    : blockies({
       seed: (address || '').toLowerCase(),
       size: 8,
       scale

js/src/contracts/dappreg.js

@@ -22,8 +22,12 @@ export default class DappReg {
     this.getInstance();
   }
 
+  getContract () {
+    return this._registry.getContract('dappreg');
+  }
+
   getInstance () {
-    return this._registry.getContractInstance('dappreg');
+    return this.getContract().then((contract) => contract.instance);
   }
 
   count () {

js/src/dapps/localtx/Transaction/transaction.js

@@ -48,7 +48,6 @@ class BaseTransaction extends Component {
         <IdentityIcon
           address={ transaction.from }
           />
-        0x{ transaction.nonce.toString(16) }
       </div>
     );
   }

js/src/dapps/localtx/Transaction/transaction.spec.js

@@ -34,7 +34,7 @@ describe('dapps/localtx/Transaction', () => {
     it('renders without crashing', () => {
       const transaction = {
         hash: '0x1234567890',
-        nonce: 15,
+        nonce: new BigNumber(15),
         gasPrice: new BigNumber(10),
         gas: new BigNumber(10)
       };

js/src/i18n/store.js

@@ -19,11 +19,14 @@ import { action, observable, transaction } from 'mobx';
 import { addLocaleData } from 'react-intl';
 import de from 'react-intl/locale-data/de';
 import en from 'react-intl/locale-data/en';
+import store from 'store';
 
 import languages from './languages';
 import deMessages from './de';
 import enMessages from './en';
 
+const LS_STORE_KEY = '_parity::locale';
+
 let instance = null;
 const isProduction = process.env.NODE_ENV === 'production';
 
@@ -45,10 +48,21 @@ export default class Store {
   @observable messages = MESSAGES[DEFAULT];
   @observable isDevelopment = !isProduction;
 
+  constructor () {
+    const savedLocale = store.get(LS_STORE_KEY);
+
+    this.locale = (savedLocale && LOCALES.includes(savedLocale))
+      ? savedLocale
+      : DEFAULT;
+    this.messages = MESSAGES[this.locale];
+  }
+
   @action setLocale (locale) {
     transaction(() => {
       this.locale = locale;
       this.messages = MESSAGES[locale];
+
+      store.set(LS_STORE_KEY, locale);
     });
   }
 

js/src/main.js

@@ -15,10 +15,9 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import React, { Component, PropTypes } from 'react';
-import { Redirect, Router, Route, IndexRoute } from 'react-router';
+import { Router } from 'react-router';
-
-import { Accounts, Account, Addresses, Address, Application, Contract, Contracts, WriteContract, Wallet, Dapp, Dapps, Settings, SettingsBackground, SettingsParity, SettingsProxy, SettingsViews, Signer, Status } from '~/views';
 
+import routes from './routes';
 import styles from './reset.css';
 
 export default class MainApplication extends Component {
@@ -26,73 +25,11 @@ export default class MainApplication extends Component {
     routerHistory: PropTypes.any.isRequired
   };
 
-  handleDeprecatedRoute = (nextState, replace) => {
-    const { address } = nextState.params;
-    const redirectMap = {
-      account: 'accounts',
-      address: 'addresses',
-      contract: 'contracts'
-    };
-
-    const oldRoute = nextState.routes[0].path;
-    const newRoute = Object.keys(redirectMap).reduce((newRoute, key) => {
-      return newRoute.replace(new RegExp(`^/${key}`), '/' + redirectMap[key]);
-    }, oldRoute);
-
-    console.warn(`Route "${oldRoute}" is deprecated. Please use "${newRoute}"`);
-    replace(newRoute.replace(':address', address));
-  }
-
   render () {
     const { routerHistory } = this.props;
 
     return (
-      <Router className={ styles.reset } history={ routerHistory }>
+      <Router className={ styles.reset } history={ routerHistory } routes={ routes } />
-        <Redirect from='/' to='/accounts' />
-        <Redirect from='/auth' to='/accounts' query={ {} } />
-        <Redirect from='/settings' to='/settings/views' />
-
-        { /** Backward Compatible links */ }
-        <Route path='/account/:address' onEnter={ this.handleDeprecatedRoute } />
-        <Route path='/address/:address' onEnter={ this.handleDeprecatedRoute } />
-        <Route path='/contract/:address' onEnter={ this.handleDeprecatedRoute } />
-
-        <Route path='/' component={ Application }>
-          <Route path='accounts'>
-            <IndexRoute component={ Accounts } />
-            <Route path=':address' component={ Account } />
-            <Route path='/wallet/:address' component={ Wallet } />
-          </Route>
-
-          <Route path='addresses'>
-            <IndexRoute component={ Addresses } />
-            <Route path=':address' component={ Address } />
-          </Route>
-
-          <Route path='apps' component={ Dapps } />
-          <Route path='app/:id' component={ Dapp } />
-
-          <Route path='contracts'>
-            <IndexRoute component={ Contracts } />
-            <Route path='develop' component={ WriteContract } />
-            <Route path=':address' component={ Contract } />
-          </Route>
-
-          <Route path='settings' component={ Settings }>
-            <Route path='background' component={ SettingsBackground } />
-            <Route path='proxy' component={ SettingsProxy } />
-            <Route path='views' component={ SettingsViews } />
-            <Route path='parity' component={ SettingsParity } />
-          </Route>
-
-          <Route path='signer' component={ Signer } />
-
-          <Route path='status'>
-            <IndexRoute component={ Status } />
-            <Route path=':subpage' component={ Status } />
-          </Route>
-        </Route>
-      </Router>
     );
   }
 }

js/src/modals/AddAddress/addAddress.js

@@ -14,31 +14,29 @@
 // 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 ContentAdd from 'material-ui/svg-icons/content/add';
 import ContentClear from 'material-ui/svg-icons/content/clear';
+import { observer } from 'mobx-react';
+import React, { Component, PropTypes } from 'react';
+import { FormattedMessage } from 'react-intl';
 
-import { Button, Modal, Form, Input, InputAddress } from '~/ui';
+import { Button, Form, Input, InputAddress, Modal } from '~/ui';
-import { ERRORS, validateAddress, validateName } from '~/util/validation';
 
+import Store from './store';
+
+@observer
 export default class AddAddress extends Component {
   static contextTypes = {
     api: PropTypes.object.isRequired
   }
 
   static propTypes = {
-    contacts: PropTypes.object.isRequired,
     address: PropTypes.string,
-    onClose: PropTypes.func
+    contacts: PropTypes.object.isRequired,
+    onClose: PropTypes.func.isRequired
   };
 
-  state = {
+  store = new Store(this.context.api, this.props.contacts);
-    address: '',
-    addressError: ERRORS.invalidAddress,
-    name: '',
-    nameError: ERRORS.invalidName,
-    description: ''
-  };
 
   componentWillMount () {
     if (this.props.address) {
@@ -49,109 +47,113 @@ export default class AddAddress extends Component {
   render () {
     return (
       <Modal
-        visible
         actions={ this.renderDialogActions() }
-        title='add saved address'>
+        title={
+          <FormattedMessage
+            id='addAddress.label'
+            defaultMessage='add saved address' />
+        }
+        visible>
         { this.renderFields() }
       </Modal>
     );
   }
 
   renderDialogActions () {
-    const { addressError, nameError } = this.state;
+    const { hasError } = this.store;
-    const hasError = !!(addressError || nameError);
 
     return ([
       <Button
         icon={ <ContentClear /> }
-        label='Cancel'
+        label={
-        onClick={ this.onClose } />,
+          <FormattedMessage
+            id='addAddress.button.close'
+            defaultMessage='Cancel' />
+        }
+        onClick={ this.onClose }
+        ref='closeButton' />,
       <Button
-        icon={ <ContentAdd /> }
-        label='Save Address'
         disabled={ hasError }
-        onClick={ this.onAdd } />
+        icon={ <ContentAdd /> }
+        label={
+          <FormattedMessage
+            id='addAddress.button.add'
+            defaultMessage='Save Address' />
+        }
+        onClick={ this.onAdd }
+        ref='addButton' />
     ]);
   }
 
   renderFields () {
-    const { address, addressError, description, name, nameError } = this.state;
+    const { address, addressError, description, name, nameError } = this.store;
 
     return (
       <Form>
         <InputAddress
-          label='network address'
-          hint='the network address for the entry'
-          error={ addressError }
-          value={ address }
-          disabled={ !!this.props.address }
           allowCopy={ false }
-          onChange={ this.onEditAddress } />
+          disabled={ !!this.props.address }
+          error={ addressError }
+          hint={
+            <FormattedMessage
+              id='addAddress.input.address.hint'
+              defaultMessage='the network address for the entry' />
+          }
+          label={
+            <FormattedMessage
+              id='addAddress.input.address.label'
+              defaultMessage='network address' />
+          }
+          onChange={ this.onEditAddress }
+          ref='inputAddress'
+          value={ address } />
         <Input
-          label='address name'
-          hint='a descriptive name for the entry'
           error={ nameError }
-          value={ name }
+          hint={
-          onChange={ this.onEditName } />
+            <FormattedMessage
+              id='addAddress.input.name.hint'
+              defaultMessage='a descriptive name for the entry' />
+          }
+          label={
+            <FormattedMessage
+              id='addAddress.input.name.label'
+              defaultMessage='address name' />
+          }
+          onChange={ this.onEditName }
+          ref='inputName'
+          value={ name } />
         <Input
-          multiLine
+          hint={
-          rows={ 1 }
+            <FormattedMessage
-          label='(optional) address description'
+              id='addAddress.input.description.hint'
-          hint='an expanded description for the entry'
+              defaultMessage='an expanded description for the entry' />
-          value={ description }
+          }
-          onChange={ this.onEditDescription } />
+          label={
+            <FormattedMessage
+              id='addAddress.input.description.label'
+              defaultMessage='(optional) address description' />
+          }
+          onChange={ this.onEditDescription }
+          ref='inputDescription'
+          value={ description } />
       </Form>
     );
   }
 
-  onEditAddress = (event, _address) => {
+  onEditAddress = (event, address) => {
-    const { contacts } = this.props;
+    this.store.setAddress(address);
-    let { address, addressError } = validateAddress(_address);
-
-    if (!addressError) {
-      const contact = contacts[address];
-
-      if (contact) {
-        addressError = ERRORS.duplicateAddress;
-      }
-    }
-
-    this.setState({
-      address,
-      addressError
-    });
   }
 
   onEditDescription = (event, description) => {
-    this.setState({
+    this.store.setDescription(description);
-      description
-    });
   }
 
-  onEditName = (event, _name) => {
+  onEditName = (event, name) => {
-    const { name, nameError } = validateName(_name);
+    this.store.setName(name);
-
-    this.setState({
-      name,
-      nameError
-    });
   }
 
   onAdd = () => {
-    const { api } = this.context;
+    this.store.add();
-    const { address, name, description } = this.state;
-
-    Promise.all([
-      api.parity.setAccountName(address, name),
-      api.parity.setAccountMeta(address, {
-        description,
-        timestamp: Date.now(),
-        deleted: false
-      })
-    ]).catch((error) => {
-      console.error('onAdd', error);
-    });
-
     this.props.onClose();
   }
 

js/src/modals/AddAddress/addAddress.spec.js

@@ -0,0 +1,32 @@
+// Copyright 2015, 2016 Parity Technologies (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 { shallow } from 'enzyme';
+import React from 'react';
+
+import AddAddress from './';
+
+describe('modals/AddAddress', () => {
+  describe('rendering', () => {
+    it('renders defaults', () => {
+      expect(
+        shallow(
+          <AddAddress />
+        )
+      ).to.be.ok;
+    });
+  });
+});

js/src/modals/AddAddress/store.js

@@ -0,0 +1,87 @@
+// Copyright 2015, 2016 Parity Technologies (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 { action, computed, transaction, observable } from 'mobx';
+
+import { ERRORS, validateAddress, validateName } from '~/util/validation';
+
+export default class Store {
+  @observable address = '';
+  @observable addressError = ERRORS.invalidAddress;
+  @observable createError = null;
+  @observable description = '';
+  @observable name = '';
+  @observable nameError = ERRORS.invalidName;
+
+  constructor (api, contacts) {
+    this._api = api;
+    this._contacts = contacts;
+  }
+
+  @computed get hasError () {
+    return !!(this.addressError || this.nameError);
+  }
+
+  @action setAddress = (_address) => {
+    let { address, addressError } = validateAddress(_address);
+
+    if (!addressError) {
+      const contact = this._contacts[address];
+
+      if (contact) {
+        addressError = ERRORS.duplicateAddress;
+      }
+    }
+
+    transaction(() => {
+      this.address = address;
+      this.addressError = addressError;
+    });
+  }
+
+  @action setCreateError = (error) => {
+    this.createError = error;
+  }
+
+  @action setDescription = (description) => {
+    this.description = description;
+  }
+
+  @action setName = (_name) => {
+    const { name, nameError } = validateName(_name);
+
+    transaction(() => {
+      this.name = name;
+      this.nameError = nameError;
+    });
+  }
+
+  add () {
+    return Promise
+      .all([
+        this._api.parity.setAccountName(this.address, this.name),
+        this._api.parity.setAccountMeta(this.address, {
+          description: this.description,
+          timestamp: Date.now(),
+          deleted: false
+        })
+      ])
+      .catch((error) => {
+        console.warn('Store:add', error);
+        this.setCreateError(error);
+      });
+  }
+}

js/src/modals/AddAddress/store.spec.js

@@ -0,0 +1,128 @@
+// Copyright 2015, 2016 Parity Technologies (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 sinon from 'sinon';
+
+import Store from './store';
+
+import { TEST_ADDR_A, TEST_ADDR_B, TEST_CONTACTS } from './store.test.js';
+
+describe('modals/AddAddress/store', () => {
+  let store;
+
+  describe('@action', () => {
+    beforeEach(() => {
+      store = new Store(null, TEST_CONTACTS);
+    });
+
+    describe('setAddress', () => {
+      it('successfully sets non-existent addresses', () => {
+        store.setAddress(TEST_ADDR_B);
+
+        expect(store.addressError).to.be.null;
+        expect(store.address).to.equal(TEST_ADDR_B);
+      });
+
+      it('fails on invalid addresses', () => {
+        store.setAddress('0xinvalid');
+
+        expect(store.addressError).not.to.be.null;
+      });
+
+      it('fails when an address is already added', () => {
+        store.setAddress(TEST_ADDR_A);
+
+        expect(store.addressError).not.to.be.null;
+      });
+    });
+
+    describe('setName', () => {
+      it('sucessfully sets valid names', () => {
+        const name = 'Test Name';
+
+        store.setName(name);
+
+        expect(store.nameError).to.be.null;
+        expect(store.name).to.equal(name);
+      });
+
+      it('fails when name is invalid', () => {
+        store.setName(null);
+
+        expect(store.nameError).not.to.be.null;
+      });
+    });
+  });
+
+  describe('@computed', () => {
+    beforeEach(() => {
+      store = new Store(null, TEST_CONTACTS);
+    });
+
+    describe('hasError', () => {
+      beforeEach(() => {
+        store.setAddress(TEST_ADDR_B);
+        store.setName('Test Name');
+      });
+
+      it('returns false proper inputs', () => {
+        expect(store.hasError).to.be.false;
+      });
+
+      it('returns true with addressError', () => {
+        store.setAddress(TEST_ADDR_A);
+
+        expect(store.addressError).not.to.be.null;
+        expect(store.hasError).to.be.true;
+      });
+
+      it('returns true with nameError', () => {
+        store.setName(null);
+
+        expect(store.nameError).not.to.be.null;
+        expect(store.hasError).to.be.true;
+      });
+    });
+  });
+
+  describe('methods', () => {
+    let api;
+
+    beforeEach(() => {
+      api = {
+        parity: {
+          setAccountMeta: sinon.stub().resolves(true),
+          setAccountName: sinon.stub().resolves(true)
+        }
+      };
+      store = new Store(api, {});
+    });
+
+    describe('add', () => {
+      it('calls setAccountMeta', () => {
+        store.add();
+
+        expect(api.parity.setAccountMeta).to.have.been.called;
+      });
+
+      it('calls setAccountName', () => {
+        store.add();
+
+        expect(api.parity.setAccountName).to.have.been.called;
+      });
+    });
+  });
+});

js/src/modals/AddAddress/store.test.js

@@ -0,0 +1,28 @@
+// Copyright 2015, 2016 Parity Technologies (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/>.
+
+const TEST_ADDR_A = '0x63Cf90D3f0410092FC0fca41846f596223979195';
+const TEST_ADDR_B = '0x00A40dEfa9933e82244bE542Fa7F8748eCCdd457';
+
+const TEST_CONTACTS = {
+  [TEST_ADDR_A]: { name: 'test', meta: {} }
+};
+
+export {
+  TEST_ADDR_A,
+  TEST_ADDR_B,
+  TEST_CONTACTS
+};

js/src/modals/ExecuteContract/DetailsStep/detailsStep.js

@@ -58,23 +58,23 @@ export default class DetailsStep extends Component {
       <Form>
         { this.renderWarning() }
         <AddressSelect
-          label='from account'
-          hint='the account to transact with'
-          value={ fromAddress }
-          error={ fromAddressError }
           accounts={ accounts }
           balances={ balances }
-          onChange={ onFromAddressChange } />
+          error={ fromAddressError }
+          hint='the account to transact with'
+          label='from account'
+          onChange={ onFromAddressChange }
+          value={ fromAddress } />
         { this.renderFunctionSelect() }
         { this.renderParameters() }
         <div className={ styles.columns }>
           <div>
             <Input
-              label='transaction value (in ETH)'
-              hint='the amount to send to with the transaction'
-              value={ amount }
               error={ amountError }
-              onSubmit={ onAmountChange } />
+              hint='the amount to send to with the transaction'
+              label='transaction value (in ETH)'
+              onSubmit={ onAmountChange }
+              value={ amount } />
           </div>
           <div>
             <Checkbox

js/src/modals/ExecuteContract/DetailsStep/detailsStep.spec.js

@@ -0,0 +1,83 @@
+// Copyright 2015, 2016 Parity Technologies (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 { mount } from 'enzyme';
+import React from 'react';
+import sinon from 'sinon';
+
+import { ContextProvider, muiTheme } from '~/ui';
+
+import DetailsStep from './';
+
+import { CONTRACT } from '../executeContract.test.js';
+
+let component;
+let onAmountChange;
+let onClose;
+let onFromAddressChange;
+let onFuncChange;
+let onGasEditClick;
+let onValueChange;
+
+function render (props) {
+  onAmountChange = sinon.stub();
+  onClose = sinon.stub();
+  onFromAddressChange = sinon.stub();
+  onFuncChange = sinon.stub();
+  onGasEditClick = sinon.stub();
+  onValueChange = sinon.stub();
+
+  component = mount(
+    <ContextProvider api={ {} } muiTheme={ muiTheme } store={ {} }>
+      <DetailsStep
+        { ...props }
+        contract={ CONTRACT }
+        onAmountChange={ onAmountChange }
+        onClose={ onClose }
+        onFromAddressChange={ onFromAddressChange }
+        onFuncChange={ onFuncChange }
+        onGasEditClick={ onGasEditClick }
+        onValueChange={ onValueChange } />
+    </ContextProvider>
+  );
+
+  return component;
+}
+
+describe('modals/ExecuteContract/DetailsStep', () => {
+  it('renders', () => {
+    expect(render({ accounts: {}, values: [ true ], valuesError: [ null ] })).to.be.ok;
+  });
+
+  describe('parameter values', () => {
+    beforeEach(() => {
+      render({
+        accounts: {},
+        func: CONTRACT.functions[0],
+        values: [ false ],
+        valuesError: [ null ]
+      });
+    });
+
+    describe('bool parameters', () => {
+      it('toggles from false to true', () => {
+        component.find('DropDownMenu').last().simulate('change', { target: { value: 'true' } });
+
+        expect(onValueChange).to.have.been.calledWith(null, 0, true);
+      });
+    });
+  });
+});

js/src/modals/ExecuteContract/executeContract.js

@@ -25,6 +25,7 @@ import ContentClear from 'material-ui/svg-icons/content/clear';
 import NavigationArrowBack from 'material-ui/svg-icons/navigation/arrow-back';
 import NavigationArrowForward from 'material-ui/svg-icons/navigation/arrow-forward';
 
+import { toWei } from '~/api/util/wei';
 import { BusyStep, Button, CompletedStep, GasPriceEditor, IdentityIcon, Modal, TxHash } from '~/ui';
 import { MAX_GAS_ESTIMATION } from '~/util/constants';
 import { validateAddress, validateUint } from '~/util/validation';
@@ -56,12 +57,12 @@ class ExecuteContract extends Component {
   }
 
   static propTypes = {
-    isTest: PropTypes.bool,
-    fromAddress: PropTypes.string,
     accounts: PropTypes.object,
     balances: PropTypes.object,
-    contract: PropTypes.object,
+    contract: PropTypes.object.isRequired,
+    fromAddress: PropTypes.string,
     gasLimit: PropTypes.object.isRequired,
+    isTest: PropTypes.bool,
     onClose: PropTypes.func.isRequired,
     onFromAddressChange: PropTypes.func.isRequired
   }
@@ -77,11 +78,11 @@ class ExecuteContract extends Component {
     funcError: null,
     gasEdit: false,
     rejected: false,
-    step: STEP_DETAILS,
     sending: false,
+    step: STEP_DETAILS,
+    txhash: null,
     values: [],
-    valuesError: [],
+    valuesError: []
-    txhash: null
   }
 
   componentDidMount () {
@@ -255,10 +256,6 @@ class ExecuteContract extends Component {
         valueError = validateAddress(_value).addressError;
         break;
 
-      case 'bool':
-        value = _value === 'true';
-        break;
-
       case 'uint':
         valueError = validateUint(_value).valueError;
         break;
@@ -278,13 +275,12 @@ class ExecuteContract extends Component {
   }
 
   estimateGas = (_fromAddress) => {
-    const { api } = this.context;
     const { fromAddress } = this.props;
     const { amount, func, values } = this.state;
     const options = {
       gas: MAX_GAS_ESTIMATION,
       from: _fromAddress || fromAddress,
-      value: api.util.toWei(amount || 0)
+      value: toWei(amount || 0)
     };
 
     if (!func) {

js/src/modals/ExecuteContract/executeContract.spec.js

@@ -0,0 +1,69 @@
+// Copyright 2015, 2016 Parity Technologies (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 { shallow } from 'enzyme';
+import React from 'react';
+import sinon from 'sinon';
+
+import ExecuteContract from './';
+
+import { CONTRACT, STORE } from './executeContract.test.js';
+
+let component;
+let onClose;
+let onFromAddressChange;
+
+function render (props) {
+  onClose = sinon.stub();
+  onFromAddressChange = sinon.stub();
+
+  component = shallow(
+    <ExecuteContract
+      { ...props }
+      contract={ CONTRACT }
+      onClose={ onClose }
+      onFromAddressChange={ onFromAddressChange } />,
+      { context: { api: {}, store: STORE } }
+  ).find('ExecuteContract').shallow();
+
+  return component;
+}
+
+describe('modals/ExecuteContract/DetailsStep', () => {
+  it('renders', () => {
+    expect(render({ accounts: {} })).to.be.ok;
+  });
+
+  describe('instance functions', () => {
+    beforeEach(() => {
+      render({
+        accounts: {}
+      });
+    });
+
+    describe('onValueChange', () => {
+      it('toggles boolean from false to true', () => {
+        component.setState({
+          func: CONTRACT.functions[0],
+          values: [false]
+        });
+        component.instance().onValueChange(null, 0, true);
+
+        expect(component.state().values).to.deep.equal([true]);
+      });
+    });
+  });
+});

js/src/modals/ExecuteContract/executeContract.test.js

@@ -0,0 +1,64 @@
+// Copyright 2015, 2016 Parity Technologies (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 BigNumber from 'bignumber.js';
+import sinon from 'sinon';
+
+const CONTRACT = {
+  functions: [
+    {
+      name: 'test_a',
+      signature: 'test_a',
+      estimateGas: sinon.stub().resolves(new BigNumber(123)),
+      inputs: [
+        {
+          name: 'test_bool',
+          kind: {
+            type: 'bool'
+          }
+        }
+      ],
+      abi: {
+        inputs: [
+          {
+            name: 'test_bool',
+            type: 'bool'
+          }
+        ]
+      }
+    }
+  ]
+};
+
+const STORE = {
+  dispatch: sinon.stub(),
+  subscribe: sinon.stub(),
+  getState: () => {
+    return {
+      balances: {
+        balances: {}
+      },
+      nodeStatus: {
+        gasLimit: new BigNumber(123)
+      }
+    };
+  }
+};
+
+export {
+  CONTRACT,
+  STORE
+};

js/src/redux/providers/personalActions.js

@@ -19,6 +19,8 @@ import { isEqual } from 'lodash';
 import { fetchBalances } from './balancesActions';
 import { attachWallets } from './walletActions';
 
+import MethodDecodingStore from '~/ui/MethodDecoding/methodDecodingStore';
+
 export function personalAccountsInfo (accountsInfo) {
   const accounts = {};
   const contacts = {};
@@ -41,6 +43,9 @@ export function personalAccountsInfo (accountsInfo) {
       }
     });
 
+  // Load user contracts for Method Decoding
+  MethodDecodingStore.loadContracts(contracts);
+
   return (dispatch) => {
     const data = {
       accountsInfo,

js/src/redux/providers/signerReducer.js

@@ -62,7 +62,7 @@ export default handleActions({
   signerSuccessConfirmRequest (state, action) {
     const { id, txHash } = action.payload;
     const confirmed = Object.assign(
-      state.pending.find(p => p.id === id),
+      state.pending.find(p => p.id === id) || { id },
       { result: txHash, status: 'confirmed' }
     );
 

js/src/routes.js

@@ -0,0 +1,119 @@
+// Copyright 2015, 2016 Parity Technologies (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 {
+  Accounts, Account, Addresses, Address, Application,
+  Contract, Contracts, WriteContract, Wallet, Dapp, Dapps,
+  Settings, SettingsBackground, SettingsParity, SettingsProxy,
+  SettingsViews, Signer, Status
+} from '~/views';
+
+function handleDeprecatedRoute (nextState, replace) {
+  const { address } = nextState.params;
+  const redirectMap = {
+    account: 'accounts',
+    address: 'addresses',
+    contract: 'contracts'
+  };
+
+  const oldRoute = nextState.routes[0].path;
+  const newRoute = Object.keys(redirectMap).reduce((newRoute, key) => {
+    return newRoute.replace(new RegExp(`^/${key}`), '/' + redirectMap[key]);
+  }, oldRoute);
+
+  console.warn(`Route "${oldRoute}" is deprecated. Please use "${newRoute}"`);
+  replace(newRoute.replace(':address', address));
+}
+
+function redirectTo (path) {
+  return (nextState, replace) => {
+    replace(path);
+  };
+}
+
+const accountsRoutes = [
+  { path: ':address', component: Account },
+  { path: '/wallet/:address', component: Wallet }
+];
+
+const addressesRoutes = [
+  { path: ':address', component: Address }
+];
+
+const contractsRoutes = [
+  { path: 'develop', component: WriteContract },
+  { path: ':address', component: Contract }
+];
+
+const settingsRoutes = [
+  { path: 'background', component: SettingsBackground },
+  { path: 'proxy', component: SettingsProxy },
+  { path: 'views', component: SettingsViews },
+  { path: 'parity', component: SettingsParity }
+];
+
+const statusRoutes = [
+  { path: ':subpage', component: Status }
+];
+
+const routes = [
+  // Backward Compatible routes
+  { path: '/account/:address', onEnter: handleDeprecatedRoute },
+  { path: '/address/:address', onEnter: handleDeprecatedRoute },
+  { path: '/contract/:address', onEnter: handleDeprecatedRoute },
+
+  { path: '/', onEnter: redirectTo('/accounts') },
+  { path: '/auth', onEnter: redirectTo('/accounts') },
+  { path: '/settings', onEnter: redirectTo('/settings/views') },
+
+  {
+    path: '/',
+    component: Application,
+    childRoutes: [
+      {
+        path: 'accounts',
+        indexRoute: { component: Accounts },
+        childRoutes: accountsRoutes
+      },
+      {
+        path: 'addresses',
+        indexRoute: { component: Addresses },
+        childRoutes: addressesRoutes
+      },
+      {
+        path: 'contracts',
+        indexRoute: { component: Contracts },
+        childRoutes: contractsRoutes
+      },
+      {
+        path: 'status',
+        indexRoute: { component: Status },
+        childRoutes: statusRoutes
+      },
+      {
+        path: 'settings',
+        component: Settings,
+        childRoutes: settingsRoutes
+      },
+
+      { path: 'apps', component: Dapps },
+      { path: 'app/:id', component: Dapp },
+      { path: 'signer', component: Signer }
+    ]
+  }
+];
+
+export default routes;

js/src/ui/Form/AddressSelect/addressSelect.js

@@ -16,6 +16,7 @@
 
 import React, { Component, PropTypes } from 'react';
 import { MenuItem } from 'material-ui';
+import { isEqual, pick } from 'lodash';
 
 import AutoComplete from '../AutoComplete';
 import IdentityIcon from '../../IdentityIcon';
@@ -31,19 +32,20 @@ export default class AddressSelect extends Component {
   }
 
   static propTypes = {
-    disabled: PropTypes.bool,
+    onChange: PropTypes.func.isRequired,
+
     accounts: PropTypes.object,
+    allowInput: PropTypes.bool,
+    balances: PropTypes.object,
     contacts: PropTypes.object,
     contracts: PropTypes.object,
-    wallets: PropTypes.object,
+    disabled: PropTypes.bool,
-    label: PropTypes.string,
-    hint: PropTypes.string,
     error: PropTypes.string,
-    value: PropTypes.string,
+    hint: PropTypes.string,
+    label: PropTypes.string,
     tokens: PropTypes.object,
-    onChange: PropTypes.func.isRequired,
+    value: PropTypes.string,
-    allowInput: PropTypes.bool,
+    wallets: PropTypes.object
-    balances: PropTypes.object
   }
 
   state = {
@@ -53,6 +55,9 @@ export default class AddressSelect extends Component {
     value: ''
   }
 
+  // Cache autocomplete items
+  items = {}
+
   entriesFromProps (props = this.props) {
     const { accounts = {}, contacts = {}, contracts = {}, wallets = {} } = props;
 
@@ -76,6 +81,15 @@ export default class AddressSelect extends Component {
     return { autocompleteEntries, entries };
   }
 
+  shouldComponentUpdate (nextProps, nextState) {
+    const keys = [ 'error', 'value' ];
+
+    const prevValues = pick(this.props, keys);
+    const nextValues = pick(nextProps, keys);
+
+    return !isEqual(prevValues, nextValues);
+  }
+
   componentWillMount () {
     const { value } = this.props;
     const { entries, autocompleteEntries } = this.entriesFromProps();
@@ -143,14 +157,21 @@ export default class AddressSelect extends Component {
   renderItem = (entry) => {
     const { address, name } = entry;
 
-    return {
+    const _balance = this.getBalance(address);
+    const balance = _balance ? _balance.toNumber() : _balance;
+
+    if (!this.items[address] || this.items[address].balance !== balance) {
+      this.items[address] = {
         text: name && name.toUpperCase() || address,
         value: this.renderMenuItem(address),
-      address
+        address, balance
       };
     }
 
-  renderBalance (address) {
+    return this.items[address];
+  }
+
+  getBalance (address) {
     const { balances = {} } = this.props;
     const balance = balances[address];
 
@@ -164,7 +185,12 @@ export default class AddressSelect extends Component {
       return null;
     }
 
-    const value = fromWei(ethToken.value);
+    return ethToken.value;
+  }
+
+  renderBalance (address) {
+    const balance = this.getBalance(address);
+    const value = fromWei(balance);
 
     return (
       <div className={ styles.balance }>

js/src/ui/Form/AutoComplete/autocomplete.css

@@ -0,0 +1,24 @@
+/* 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/>.
+*/
+
+.item {
+  &:last-child {
+    &.divider {
+      display: none;
+    }
+  }
+}

js/src/ui/Form/AutoComplete/autocomplete.js

@@ -21,13 +21,18 @@ import { PopoverAnimationVertical } from 'material-ui/Popover';
 
 import { isEqual } from 'lodash';
 
+import styles from './autocomplete.css';
+
 // Hack to prevent "Unknown prop `disableFocusRipple` on <hr> tag" error
 class Divider extends Component {
   static muiName = MUIDivider.muiName;
 
   render () {
     return (
-      <div style={ { margin: '0.25em 0' } }>
+      <div
+        style={ { margin: '0.25em 0' } }
+        className={ [styles.item, styles.divider].join(' ') }
+      >
         <MUIDivider style={ { height: 2 } } />
       </div>
     );
@@ -143,11 +148,16 @@ export default class AutoComplete extends Component {
 
       if (renderItem && typeof renderItem === 'function') {
         item = renderItem(entry);
+
+        // Add the item class to the entry
+        const classNames = [ styles.item ].concat(item.value.props.className);
+        item.value = React.cloneElement(item.value, { className: classNames.join(' ') });
       } else {
         item = {
           text: entry,
           value: (
             <MenuItem
+              className={ styles.item }
               primaryText={ entry }
             />
           )
@@ -160,6 +170,7 @@ export default class AutoComplete extends Component {
       }
 
       item.divider = currentDivider;
+      item.entry = entry;
 
       return item;
     }).filter((item) => item !== undefined);
@@ -215,13 +226,8 @@ export default class AutoComplete extends Component {
       return;
     }
 
-    const { entries } = this.props;
+    const { dataSource } = this.state;
-
+    const { entry } = dataSource[idx];
-    const entriesArray = (entries instanceof Array)
-      ? entries
-      : Object.values(entries);
-
-    const entry = entriesArray[idx];
 
     this.handleOnChange(entry);
     this.setState({ entry, open: false });

js/src/ui/Form/Input/input.js

@@ -18,6 +18,8 @@ import React, { Component, PropTypes } from 'react';
 import { TextField } from 'material-ui';
 import { noop } from 'lodash';
 
+import { nodeOrStringProptype } from '~/util/proptypes';
+
 import CopyToClipboard from '../../CopyToClipboard';
 
 import styles from './input.css';
@@ -41,18 +43,21 @@ const NAME_ID = ' ';
 
 export default class Input extends Component {
   static propTypes = {
-    children: PropTypes.node,
-    className: PropTypes.string,
-    disabled: PropTypes.bool,
-    readOnly: PropTypes.bool,
     allowCopy: PropTypes.oneOfType([
       PropTypes.string,
       PropTypes.bool
     ]),
-    floatCopy: PropTypes.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    disabled: PropTypes.bool,
     error: PropTypes.string,
-    hint: PropTypes.string,
+    readOnly: PropTypes.bool,
-    label: PropTypes.string,
+    floatCopy: PropTypes.bool,
+    hint: nodeOrStringProptype(),
+    hideUnderline: PropTypes.bool,
+    label: nodeOrStringProptype(),
+    max: PropTypes.any,
+    min: PropTypes.any,
     multiLine: PropTypes.bool,
     onBlur: PropTypes.func,
     onChange: PropTypes.func,
@@ -61,26 +66,26 @@ export default class Input extends Component {
     rows: PropTypes.number,
     type: PropTypes.string,
     submitOnBlur: PropTypes.bool,
-    hideUnderline: PropTypes.bool,
+    style: PropTypes.object,
     value: PropTypes.oneOfType([
-      PropTypes.number, PropTypes.string
+      PropTypes.number,
-    ]),
+      PropTypes.string
-    min: PropTypes.any,
+    ])
-    max: PropTypes.any,
-    style: PropTypes.object
   };
 
   static defaultProps = {
-    submitOnBlur: true,
-    readOnly: false,
     allowCopy: false,
     hideUnderline: false,
     floatCopy: false,
+    readOnly: false,
+    submitOnBlur: true,
     style: {}
   }
 
   state = {
-    value: typeof this.props.value === 'undefined' ? '' : this.props.value
+    value: typeof this.props.value === 'undefined'
+      ? ''
+      : this.props.value
   }
 
   componentWillReceiveProps (newProps) {
@@ -114,38 +119,29 @@ export default class Input extends Component {
           autoComplete='off'
           className={ className }
           errorText={ error }
-
           floatingLabelFixed
           floatingLabelText={ label }
-
+          fullWidth
           hintText={ hint }
           id={ NAME_ID }
           inputStyle={ inputStyle }
-          fullWidth
-
           max={ max }
           min={ min }
-
           multiLine={ multiLine }
           name={ NAME_ID }
-
           onBlur={ this.onBlur }
           onChange={ this.onChange }
           onKeyDown={ this.onKeyDown }
           onPaste={ this.onPaste }
-
           readOnly={ readOnly }
           rows={ rows }
           style={ textFieldStyle }
           type={ type || 'text' }
-
           underlineDisabledStyle={ UNDERLINE_DISABLED }
           underlineStyle={ readOnly ? UNDERLINE_READONLY : UNDERLINE_NORMAL }
           underlineFocusStyle={ readOnly ? { display: 'none' } : null }
           underlineShow={ !hideUnderline }
-
+          value={ value }>
-          value={ value }
-        >
           { children }
         </TextField>
       </div>
@@ -159,11 +155,14 @@ export default class Input extends Component {
     if (!allowCopy) {
       return null;
     }
+
     const text = typeof allowCopy === 'string'
       ? allowCopy
       : value;
 
-    const style = hideUnderline ? {} : { position: 'relative', top: '2px' };
+    const style = hideUnderline
+      ? {}
+      : { position: 'relative', top: '2px' };
 
     return (
       <div className={ styles.copy } style={ style }>

js/src/ui/Form/InputAddress/inputAddress.js

@@ -18,28 +18,30 @@ import React, { Component, PropTypes } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 
-import Input from '../Input';
-import IdentityIcon from '../../IdentityIcon';
 import util from '~/api/util';
+import { nodeOrStringProptype } from '~/util/proptypes';
+
+import IdentityIcon from '../../IdentityIcon';
+import Input from '../Input';
 
 import styles from './inputAddress.css';
 
 class InputAddress extends Component {
   static propTypes = {
+    accountsInfo: PropTypes.object,
+    allowCopy: PropTypes.bool,
     className: PropTypes.string,
     disabled: PropTypes.bool,
     error: PropTypes.string,
-    label: PropTypes.string,
+    hideUnderline: PropTypes.bool,
-    hint: PropTypes.string,
+    hint: nodeOrStringProptype(),
-    value: PropTypes.string,
+    label: nodeOrStringProptype(),
-    accountsInfo: PropTypes.object,
-    tokens: PropTypes.object,
-    text: PropTypes.bool,
     onChange: PropTypes.func,
     onSubmit: PropTypes.func,
-    hideUnderline: PropTypes.bool,
+    small: PropTypes.bool,
-    allowCopy: PropTypes.bool,
+    text: PropTypes.bool,
-    small: PropTypes.bool
+    tokens: PropTypes.object,
+    value: PropTypes.string
   };
 
   static defaultProps = {
@@ -49,8 +51,8 @@ class InputAddress extends Component {
   };
 
   render () {
-    const { className, disabled, error, label, hint, value, text } = this.props;
+    const { className, disabled, error, hint, label, text, value } = this.props;
-    const { small, allowCopy, hideUnderline, onSubmit, accountsInfo, tokens } = this.props;
+    const { accountsInfo, allowCopy, hideUnderline, onSubmit, small, tokens } = this.props;
 
     const account = accountsInfo[value] || tokens[value];
 
@@ -68,17 +70,20 @@ class InputAddress extends Component {
     return (
       <div className={ containerClasses.join(' ') }>
         <Input
+          allowCopy={ allowCopy && (disabled ? value : false) }
           className={ classes.join(' ') }
           disabled={ disabled }
-          label={ label }
-          hint={ hint }
           error={ error }
-          value={ text && account ? account.name : value }
+          hideUnderline={ hideUnderline }
+          hint={ hint }
+          label={ label }
           onChange={ this.handleInputChange }
           onSubmit={ onSubmit }
-          allowCopy={ allowCopy && (disabled ? value : false) }
+          value={
-          hideUnderline={ hideUnderline }
+            text && account
-        />
+              ? account.name
+              : value
+          } />
         { icon }
       </div>
     );
@@ -128,8 +133,8 @@ class InputAddress extends Component {
 }
 
 function mapStateToProps (state) {
-  const { accountsInfo } = state.personal;
   const { tokens } = state.balances;
+  const { accountsInfo } = state.personal;
 
   return {
     accountsInfo,

js/src/ui/Form/Select/select.js

@@ -46,26 +46,26 @@ export default class Select extends Component {
   }
 
   render () {
-    const { disabled, error, label, hint, value, children, className, onBlur, onChange, onKeyDown } = this.props;
+    const { children, className, disabled, error, hint, label, onBlur, onChange, onKeyDown, value } = this.props;
 
     return (
       <SelectField
-        className={ className }
         autoComplete='off'
+        className={ className }
         disabled={ disabled }
         errorText={ error }
         floatingLabelFixed
         floatingLabelText={ label }
         fullWidth
         hintText={ hint }
-        name={ NAME_ID }
         id={ NAME_ID }
-        underlineDisabledStyle={ UNDERLINE_DISABLED }
+        name={ NAME_ID }
-        underlineStyle={ UNDERLINE_NORMAL }
-        value={ value }
         onBlur={ onBlur }
         onChange={ onChange }
-        onKeyDown={ onKeyDown }>
+        onKeyDown={ onKeyDown }
+        underlineDisabledStyle={ UNDERLINE_DISABLED }
+        underlineStyle={ UNDERLINE_NORMAL }
+        value={ value }>
         { children }
       </SelectField>
     );

js/src/ui/Form/TypedInput/typedInput.js

@@ -289,9 +289,8 @@ export default class TypedInput extends Component {
       return (
         <MenuItem
           key={ bool }
-          value={ bool }
           label={ bool }
-        >
+          value={ bool }>
           { bool }
         </MenuItem>
       );
@@ -299,19 +298,23 @@ export default class TypedInput extends Component {
 
     return (
       <Select
-        label={ label }
-        hint={ hint }
-        value={ value ? 'true' : 'false' }
         error={ error }
+        hint={ hint }
+        label={ label }
         onChange={ this.onChangeBool }
-      >
+        value={
+          value
+            ? 'true'
+            : 'false'
+        }>
         { boolitems }
       </Select>
     );
   }
 
   onChangeBool = (event, _index, value) => {
-    this.props.onChange(value === 'true');
+    // NOTE: event.target.value added for enzyme simulated event testing
+    this.props.onChange((value || event.target.value) === 'true');
   }
 
   onEthTypeChange = () => {

js/src/ui/Form/TypedInput/typedInput.spec.js

@@ -0,0 +1,70 @@
+// Copyright 2015, 2016 Parity Technologies (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 { mount } from 'enzyme';
+import React from 'react';
+import sinon from 'sinon';
+
+import { ContextProvider, muiTheme } from '~/ui';
+import { ABI_TYPES } from '~/util/abi';
+
+import TypedInput from './';
+
+let component;
+let onChange;
+
+function render (props) {
+  onChange = sinon.stub();
+  component = mount(
+    <ContextProvider api={ {} } muiTheme={ muiTheme } store={ {} }>
+      <TypedInput
+        { ...props }
+        onChange={ onChange } />
+    </ContextProvider>
+  );
+
+  return component;
+}
+
+describe('ui/Form/TypedInput', () => {
+  describe('bool selection', () => {
+    beforeEach(() => {
+      render({ param: { type: ABI_TYPES.BOOL } });
+    });
+
+    it('renders', () => {
+      expect(component).to.be.ok;
+    });
+
+    it('calls onChange when value changes', () => {
+      component.find('DropDownMenu').simulate('change', { target: { value: 'true' } });
+
+      expect(onChange).to.have.been.called;
+    });
+
+    it("calls onChange(true) when value changes to 'true'", () => {
+      component.find('DropDownMenu').simulate('change', { target: { value: 'true' } });
+
+      expect(onChange).to.have.been.calledWith(true);
+    });
+
+    it("calls onChange(false) when value changes to 'false'", () => {
+      component.find('DropDownMenu').simulate('change', { target: { value: 'false' } });
+
+      expect(onChange).to.have.been.calledWith(false);
+    });
+  });
+});

js/src/ui/IdentityIcon/identityIcon.js

@@ -19,6 +19,8 @@ import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import ContractIcon from 'material-ui/svg-icons/action/code';
 
+import { createIdentityImg } from '~/api/util/identity';
+
 import styles from './identityIcon.css';
 
 class IdentityIcon extends Component {
@@ -29,12 +31,12 @@ class IdentityIcon extends Component {
   static propTypes = {
     address: PropTypes.string,
     button: PropTypes.bool,
-    className: PropTypes.string,
     center: PropTypes.bool,
-    padded: PropTypes.bool,
+    className: PropTypes.string,
     inline: PropTypes.bool,
-    tiny: PropTypes.bool,
+    images: PropTypes.object.isRequired,
-    images: PropTypes.object.isRequired
+    padded: PropTypes.bool,
+    tiny: PropTypes.bool
   }
 
   state = {
@@ -75,7 +77,7 @@ class IdentityIcon extends Component {
     }
 
     this.setState({
-      iconsrc: api.util.createIdentityImg(_address, scale)
+      iconsrc: createIdentityImg(_address, scale)
     });
   }
 
@@ -105,16 +107,20 @@ class IdentityIcon extends Component {
       return (
         <ContractIcon
           className={ classes }
-          style={ { width: size, height: size, background: '#eee' } } />
+          style={ {
+            width: size,
+            height: size,
+            background: '#eee'
+          } } />
       );
     }
 
     return (
       <img
         className={ classes }
-        src={ iconsrc }
+        height={ size }
         width={ size }
-        height={ size } />
+        src={ iconsrc } />
     );
   }
 }

js/src/ui/MethodDecoding/methodDecoding.js

@@ -17,16 +17,14 @@
 import BigNumber from 'bignumber.js';
 import React, { Component, PropTypes } from 'react';
 import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
 import CircularProgress from 'material-ui/CircularProgress';
 
-import Contracts from '~/contracts';
 import { Input, InputAddress } from '../Form';
+import MethodDecodingStore from './methodDecodingStore';
 
 import styles from './methodDecoding.css';
 
 const ASCII_INPUT = /^[a-z0-9\s,?;.:/!()-_@'"#]+$/i;
-const CONTRACT_CREATE = '0x60606040';
 const TOKEN_METHODS = {
   '0xa9059cbb': 'transfer(to,value)'
 };
@@ -38,19 +36,17 @@ class MethodDecoding extends Component {
 
   static propTypes = {
     address: PropTypes.string.isRequired,
-    tokens: PropTypes.object,
+    token: PropTypes.object,
     transaction: PropTypes.object,
     historic: PropTypes.bool
   }
 
   state = {
     contractAddress: null,
-    method: null,
     methodName: null,
     methodInputs: null,
     methodParams: null,
     methodSignature: null,
-    token: null,
     isContract: false,
     isDeploy: false,
     isReceived: false,
@@ -59,14 +55,29 @@ class MethodDecoding extends Component {
     inputType: 'auto'
   }
 
-  componentWillMount () {
+  methodDecodingStore = MethodDecodingStore.get(this.context.api);
-    const lookupResult = this.lookup();
 
-    if (typeof lookupResult === 'object' && typeof lookupResult.then === 'function') {
+  componentWillMount () {
-      lookupResult.then(() => this.setState({ isLoading: false }));
+    const { address, transaction } = this.props;
-    } else {
+
-      this.setState({ isLoading: false });
+    this
-    }
+      .methodDecodingStore
+      .lookup(address, transaction)
+      .then((lookup) => {
+        const newState = {
+          methodName: lookup.name,
+          methodInputs: lookup.inputs,
+          methodParams: lookup.params,
+          methodSignature: lookup.signature,
+
+          isContract: lookup.contract,
+          isDeploy: lookup.deploy,
+          isLoading: false,
+          isReceived: lookup.received
+        };
+
+        this.setState(newState);
+      });
   }
 
   render () {
@@ -116,7 +127,8 @@ class MethodDecoding extends Component {
   }
 
   renderAction () {
-    const { methodName, methodInputs, methodSignature, token, isDeploy, isReceived, isContract } = this.state;
+    const { token } = this.props;
+    const { methodName, methodInputs, methodSignature, isDeploy, isReceived, isContract } = this.state;
 
     if (isDeploy) {
       return this.renderDeploy();
@@ -378,7 +390,7 @@ class MethodDecoding extends Component {
   }
 
   renderTokenValue (value) {
-    const { token } = this.state;
+    const { token } = this.props;
 
     return (
       <span className={ styles.tokenValue }>
@@ -436,96 +448,18 @@ class MethodDecoding extends Component {
     });
   }
 
-  lookup () {
-    const { transaction } = this.props;
-
-    if (!transaction) {
-      return;
 }
 
-    const { api } = this.context;
+function mapStateToProps (initState, initProps) {
-    const { address, tokens } = this.props;
+  const { tokens } = initState.balances;
+  const { address } = initProps;
 
-    const isReceived = transaction.to === address;
+  const token = (tokens || {})[address];
-    const contractAddress = isReceived ? transaction.from : transaction.to;
-    const input = transaction.input || transaction.data;
 
-    const token = (tokens || {})[contractAddress];
+  return () => {
-    this.setState({ token, isReceived, contractAddress });
+    return { token };
-
+  };
-    if (!input || input === '0x') {
-      return;
 }
-
-    const { signature, paramdata } = api.util.decodeCallData(input);
-    this.setState({ methodSignature: signature, methodParams: paramdata });
-
-    if (!signature || signature === CONTRACT_CREATE || transaction.creates) {
-      this.setState({ isDeploy: true });
-      return;
-    }
-
-    if (contractAddress === '0x') {
-      return;
-    }
-
-    return api.eth
-      .getCode(contractAddress || transaction.creates)
-      .then((bytecode) => {
-        const isContract = bytecode && /^(0x)?([0]*[1-9a-f]+[0]*)+$/.test(bytecode);
-
-        this.setState({ isContract });
-
-        if (!isContract) {
-          return;
-        }
-
-        return Contracts.get()
-          .signatureReg
-          .lookup(signature)
-          .then((method) => {
-            let methodInputs = null;
-            let methodName = null;
-
-            if (method && method.length) {
-              const { methodParams } = this.state;
-              const abi = api.util.methodToAbi(method);
-
-              methodName = abi.name;
-              methodInputs = api.util
-                .decodeMethodInput(abi, methodParams)
-                .map((value, index) => {
-                  const type = abi.inputs[index].type;
-
-                  return { type, value };
-                });
-            }
-
-            this.setState({
-              method,
-              methodName,
-              methodInputs,
-              bytecode
-            });
-          });
-      })
-      .catch((error) => {
-        console.warn('lookup', error);
-      });
-  }
-}
-
-function mapStateToProps (state) {
-  const { tokens } = state.balances;
-
-  return { tokens };
-}
-
-function mapDispatchToProps (dispatch) {
-  return bindActionCreators({}, dispatch);
-}
-
 export default connect(
-  mapStateToProps,
+  mapStateToProps
-  mapDispatchToProps
 )(MethodDecoding);

js/src/ui/MethodDecoding/methodDecodingStore.js

@@ -0,0 +1,216 @@
+// 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 Contracts from '~/contracts';
+import Abi from '~/abi';
+import * as abis from '~/contracts/abi';
+
+const CONTRACT_CREATE = '0x60606040';
+
+let instance = null;
+
+export default class MethodDecodingStore {
+
+  api = null;
+
+  _isContract = {};
+  _methods = {};
+
+  constructor (api, contracts = {}) {
+    this.api = api;
+
+    // Load the signatures from the local ABIs
+    Object.keys(abis).forEach((abiKey) => {
+      this.loadFromAbi(abis[abiKey]);
+    });
+
+    this.addContracts(contracts);
+  }
+
+  addContracts (contracts = {}) {
+    // Load the User defined contracts
+    Object.values(contracts).forEach((contract) => {
+      if (!contract || !contract.meta || !contract.meta.abi) {
+        return;
+      }
+      this.loadFromAbi(contract.meta.abi);
+    });
+  }
+
+  loadFromAbi (_abi) {
+    const abi = new Abi(_abi);
+    abi
+      .functions
+      .map((f) => ({ sign: f.signature, abi: f.abi }))
+      .forEach((mapping) => {
+        const sign = (/^0x/.test(mapping.sign) ? '' : '0x') + mapping.sign;
+        this._methods[sign] = mapping.abi;
+      });
+  }
+
+  static get (api, contracts = {}) {
+    if (!instance) {
+      instance = new MethodDecodingStore(api, contracts);
+    }
+
+    // Set API if not set yet
+    if (!instance.api) {
+      instance.api = api;
+    }
+
+    return instance;
+  }
+
+  static loadContracts (contracts = {}) {
+    if (!instance) {
+      // Just create the instance with null API
+      MethodDecodingStore.get(null, contracts);
+    } else {
+      instance.addContracts(contracts);
+    }
+  }
+
+  /**
+   * Looks up a transaction in the context of the given
+   * address
+   *
+   * @param  {String} address      The address contract
+   * @param  {Object} transaction  The transaction to lookup
+   * @return {Promise}             The result of the lookup. Resolves with:
+   *      {
+   *        contract: Boolean,
+   *        deploy: Boolean,
+   *        inputs: Array,
+   *        name: String,
+   *        params: Array,
+   *        received: Boolean,
+   *        signature: String
+   *      }
+   */
+  lookup (address, transaction) {
+    const result = {};
+
+    if (!transaction) {
+      return Promise.resolve(result);
+    }
+
+    const isReceived = transaction.to === address;
+    const contractAddress = isReceived ? transaction.from : transaction.to;
+    const input = transaction.input || transaction.data;
+
+    result.received = isReceived;
+
+    // No input, should be a ETH transfer
+    if (!input || input === '0x') {
+      return Promise.resolve(result);
+    }
+
+    const { signature, paramdata } = this.api.util.decodeCallData(input);
+    result.signature = signature;
+    result.params = paramdata;
+
+    // Contract deployment
+    if (!signature || signature === CONTRACT_CREATE || transaction.creates) {
+      return Promise.resolve({ ...result, deploy: true });
+    }
+
+    return this
+      .isContract(contractAddress || transaction.creates)
+      .then((isContract) => {
+        result.contract = isContract;
+
+        if (!isContract) {
+          return result;
+        }
+
+        return this
+          .fetchMethodAbi(signature)
+          .then((abi) => {
+            let methodName = null;
+            let methodInputs = null;
+
+            if (abi) {
+              methodName = abi.name;
+              methodInputs = this.api.util
+                .decodeMethodInput(abi, paramdata)
+                .map((value, index) => {
+                  const type = abi.inputs[index].type;
+                  return { type, value };
+                });
+            }
+
+            return {
+              ...result,
+              name: methodName,
+              inputs: methodInputs
+            };
+          });
+      })
+      .catch((error) => {
+        console.warn('lookup', error);
+      });
+  }
+
+  fetchMethodAbi (signature) {
+    if (this._methods[signature] !== undefined) {
+      return Promise.resolve(this._methods[signature]);
+    }
+
+    this._methods[signature] = Contracts.get()
+      .signatureReg
+      .lookup(signature)
+      .then((method) => {
+        let abi = null;
+
+        if (method && method.length) {
+          abi = this.api.util.methodToAbi(method);
+        }
+
+        this._methods[signature] = abi;
+        return this._methods[signature];
+      });
+
+    return Promise.resolve(this._methods[signature]);
+  }
+
+  /**
+   * Checks (and caches) if the given address is a
+   * Contract or not, from its fetched bytecode
+   */
+  isContract (contractAddress) {
+    // If zero address, it isn't a contract
+    if (/^(0x)?0*$/.test(contractAddress)) {
+      return Promise.resolve(false);
+    }
+
+    if (this._isContract[contractAddress]) {
+      return Promise.resolve(this._isContract[contractAddress]);
+    }
+
+    this._isContract[contractAddress] = this.api.eth
+      .getCode(contractAddress)
+      .then((bytecode) => {
+        // Is a contract if the address contains *valid* bytecode
+        const _isContract = bytecode && /^(0x)?([0]*[1-9a-f]+[0]*)+$/.test(bytecode);
+
+        this._isContract[contractAddress] = _isContract;
+        return this._isContract[contractAddress];
+      });
+
+    return Promise.resolve(this._isContract[contractAddress]);
+  }
+
+}

js/src/ui/Modal/modal.js

@@ -42,11 +42,11 @@ class Modal extends Component {
     className: PropTypes.string,
     compact: PropTypes.bool,
     current: PropTypes.number,
-    waiting: PropTypes.array,
+    settings: PropTypes.object.isRequired,
     steps: PropTypes.array,
     title: nodeOrStringProptype(),
     visible: PropTypes.bool.isRequired,
-    settings: PropTypes.object.isRequired
+    waiting: PropTypes.array
   }
 
   render () {
@@ -55,23 +55,23 @@ class Modal extends Component {
     const contentStyle = muiTheme.parity.getBackgroundStyle(null, settings.backgroundSeed);
     const header = (
       <Title
-        current={ current }
         busy={ busy }
-        waiting={ waiting }
+        current={ current }
         steps={ steps }
-        title={ title } />
+        title={ title }
+        waiting={ waiting } />
     );
     const classes = `${styles.dialog} ${className}`;
 
     return (
       <Dialog
-        className={ classes }
         actions={ actions }
+        actionsContainerClassName={ styles.actions }
         actionsContainerStyle={ ACTIONS_STYLE }
         autoDetectWindowHeight={ false }
         autoScrollBodyContent
-        actionsContainerClassName={ styles.actions }
         bodyClassName={ styles.body }
+        className={ classes }
         contentClassName={ styles.content }
         contentStyle={ contentStyle }
         modal
@@ -82,7 +82,12 @@ class Modal extends Component {
         style={ DIALOG_STYLE }
         title={ header }
         titleStyle={ TITLE_STYLE }>
-        <Container light compact={ compact } style={ { transition: 'none' } }>
+        <Container
+          compact={ compact }
+          light
+          style={
+            { transition: 'none' }
+          }>
           { children }
         </Container>
       </Dialog>

js/src/util/dapps.js

@@ -0,0 +1,208 @@
+// Copyright 2015, 2016 Parity Technologies (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 BigNumber from 'bignumber.js';
+import { pick, range, uniq } from 'lodash';
+
+import Contracts from '~/contracts';
+import { hashToImageUrl } from '~/redux/util';
+import { bytesToHex } from '~/api/util/format';
+
+import builtinApps from '~/views/Dapps/builtin.json';
+
+function getHost (api) {
+  const host = process.env.DAPPS_URL ||
+    (
+      process.env.NODE_ENV === 'production'
+      ? api.dappsUrl
+      : ''
+    );
+
+  if (host === '/') {
+    return '';
+  }
+
+  return host;
+}
+
+export function subscribeToChanges (api, dappReg, callback) {
+  return dappReg
+    .getContract()
+    .then((dappRegContract) => {
+      const dappRegInstance = dappRegContract.instance;
+
+      const signatures = ['MetaChanged', 'OwnerChanged', 'Registered']
+        .map((event) => dappRegInstance[event].signature);
+
+      return api.eth
+        .newFilter({
+          fromBlock: '0',
+          toBlock: 'latest',
+          address: dappRegInstance.address,
+          topics: [ signatures ]
+        })
+      .then((filterId) => {
+        return api
+          .subscribe('eth_blockNumber', () => {
+            if (filterId > -1) {
+              api.eth
+                .getFilterChanges(filterId)
+                .then((logs) => {
+                  return dappRegContract.parseEventLogs(logs);
+                })
+                .then((events) => {
+                  if (events.length === 0) {
+                    return [];
+                  }
+
+                  // Return uniq IDs which changed meta-data
+                  const ids = uniq(events.map((event) => bytesToHex(event.params.id.value)));
+                  callback(ids);
+                });
+            }
+          })
+          .then((blockSubId) => {
+            return {
+              block: blockSubId,
+              filter: filterId
+            };
+          });
+      });
+    });
+}
+
+export function fetchBuiltinApps () {
+  const { dappReg } = Contracts.get();
+
+  return Promise
+    .all(builtinApps.map((app) => dappReg.getImage(app.id)))
+    .then((imageIds) => {
+      return builtinApps.map((app, index) => {
+        app.type = 'builtin';
+        app.image = hashToImageUrl(imageIds[index]);
+        return app;
+      });
+    })
+    .catch((error) => {
+      console.warn('DappsStore:fetchBuiltinApps', error);
+    });
+}
+
+export function fetchLocalApps (api) {
+  return fetch(`${getHost(api)}/api/apps`)
+    .then((response) => {
+      return response.ok
+        ? response.json()
+        : [];
+    })
+    .then((apps) => {
+      return apps
+        .map((app) => {
+          app.type = 'local';
+          app.visible = true;
+          return app;
+        })
+        .filter((app) => app.id && !['ui'].includes(app.id));
+    })
+    .catch((error) => {
+      console.warn('DappsStore:fetchLocal', error);
+    });
+}
+
+export function fetchRegistryAppIds () {
+  const { dappReg } = Contracts.get();
+
+  return dappReg
+    .count()
+    .then((count) => {
+      const promises = range(0, count.toNumber()).map((index) => dappReg.at(index));
+      return Promise.all(promises);
+    })
+    .then((appsInfo) => {
+      const appIds = appsInfo
+        .map(([appId, owner]) => bytesToHex(appId))
+        .filter((appId) => {
+          return (new BigNumber(appId)).gt(0) && !builtinApps.find((app) => app.id === appId);
+        });
+
+      return appIds;
+    })
+    .catch((error) => {
+      console.warn('DappsStore:fetchRegistryAppIds', error);
+    });
+}
+
+export function fetchRegistryApp (api, dappReg, appId) {
+  return Promise
+    .all([
+      dappReg.getImage(appId),
+      dappReg.getContent(appId),
+      dappReg.getManifest(appId)
+    ])
+    .then(([ imageId, contentId, manifestId ]) => {
+      const app = {
+        id: appId,
+        image: hashToImageUrl(imageId),
+        contentHash: bytesToHex(contentId).substr(2),
+        manifestHash: bytesToHex(manifestId).substr(2),
+        type: 'network',
+        visible: true
+      };
+
+      return fetchManifest(api, app.manifestHash)
+        .then((manifest) => {
+          if (manifest) {
+            app.manifestHash = null;
+
+            // Add usefull manifest fields to app
+            Object.assign(app, pick(manifest, ['author', 'description', 'name', 'version']));
+          }
+
+          return app;
+        });
+    })
+    .then((app) => {
+      // Keep dapps that has a Manifest File and an Id
+      const dapp = (app.manifestHash || !app.id) ? null : app;
+      return dapp;
+    })
+    .catch((error) => {
+      console.warn('DappsStore:fetchRegistryApp', error);
+    });
+}
+
+export function fetchManifest (api, manifestHash) {
+  if (/^(0x)?0+/.test(manifestHash)) {
+    return Promise.resolve(null);
+  }
+
+  return fetch(
+      `${getHost(api)}/api/content/${manifestHash}/`,
+      { redirect: 'follow', mode: 'cors' }
+    )
+    .then((response) => {
+      return response.ok
+        ? response.json()
+        : null;
+    })
+    .then((manifest) => {
+      return manifest;
+    })
+    .catch((error) => {
+      console.warn('DappsStore:fetchManifest', error);
+      return null;
+    });
+}

js/src/views/Account/Transactions/transactions.js

@@ -19,7 +19,7 @@ import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 
 import etherscan from '~/3rdparty/etherscan';
-import { Container, TxList } from '~/ui';
+import { Container, TxList, Loading } from '~/ui';
 
 import styles from './transactions.css';
 
@@ -60,19 +60,32 @@ class Transactions extends Component {
   }
 
   render () {
-    const { address } = this.props;
-    const { hashes } = this.state;
-
     return (
       <Container title='transactions'>
-        <TxList
+        { this.renderTransactionList() }
-          address={ address }
-          hashes={ hashes } />
         { this.renderEtherscanFooter() }
       </Container>
     );
   }
 
+  renderTransactionList () {
+    const { address } = this.props;
+    const { hashes, loading } = this.state;
+
+    if (loading) {
+      return (
+        <Loading />
+      );
+    }
+
+    return (
+      <TxList
+        address={ address }
+        hashes={ hashes }
+      />
+    );
+  }
+
   renderEtherscanFooter () {
     const { traceMode } = this.props;
 

js/src/views/Dapp/dapp.js

@@ -31,7 +31,7 @@ export default class Dapp extends Component {
     params: PropTypes.object
   };
 
-  store = new DappsStore(this.context.api);
+  store = DappsStore.get(this.context.api);
 
   render () {
     const { dappsUrl } = this.context.api;

js/src/views/Dapps/dapps.js

@@ -36,7 +36,7 @@ export default class Dapps extends Component {
     api: PropTypes.object.isRequired
   }
 
-  store = new DappsStore(this.context.api);
+  store = DappsStore.get(this.context.api);
 
   render () {
     let externalOverlay = null;

js/src/views/Dapps/dappsStore.js

@@ -14,17 +14,21 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-import BigNumber from 'bignumber.js';
 import { action, computed, observable, transaction } from 'mobx';
 import store from 'store';
 
 import Contracts from '~/contracts';
-import { hashToImageUrl } from '~/redux/util';
+import {
-
+  fetchBuiltinApps, fetchLocalApps,
-import builtinApps from './builtin.json';
+  fetchRegistryAppIds, fetchRegistryApp,
+  subscribeToChanges
+} from '~/util/dapps';
 
 const LS_KEY_DISPLAY = 'displayApps';
 const LS_KEY_EXTERNAL_ACCEPT = 'acceptExternal';
+const BUILTIN_APPS_KEY = 'BUILTIN_APPS_KEY';
+
+let instance = null;
 
 export default class DappsStore {
   @observable apps = [];
@@ -32,23 +36,138 @@ export default class DappsStore {
   @observable modalOpen = false;
   @observable externalOverlayVisible = true;
 
+  _api = null;
+  _subscriptions = {};
+
+  _cachedApps = {};
   _manifests = {};
+  _registryAppsIds = null;
 
   constructor (api) {
     this._api = api;
 
     this.loadExternalOverlay();
-    this.readDisplayApps();
+    this.loadApps();
+    this.subscribeToChanges();
+  }
+
+  loadApps () {
+    const { dappReg } = Contracts.get();
 
     Promise
       .all([
-        this._fetchBuiltinApps(),
+        this.fetchBuiltinApps().then((apps) => this.addApps(apps)),
-        this._fetchLocalApps(),
+        this.fetchLocalApps().then((apps) => this.addApps(apps)),
-        this._fetchRegistryApps()
+        this.fetchRegistryApps(dappReg).then((apps) => this.addApps(apps))
       ])
       .then(this.writeDisplayApps);
   }
 
+  static get (api) {
+    if (!instance) {
+      instance = new DappsStore(api);
+    } else {
+      instance.loadApps();
+    }
+
+    return instance;
+  }
+
+  subscribeToChanges () {
+    const { dappReg } = Contracts.get();
+
+    // Unsubscribe from previous subscriptions, if any
+    if (this._subscriptions.block) {
+      this._api.unsubscribe(this._subscriptions.block);
+    }
+
+    if (this._subscriptions.filter) {
+      this._api.eth.uninstallFilter(this._subscriptions.filter);
+    }
+
+    // Subscribe to dapps reg changes
+    subscribeToChanges(this._api, dappReg, (appIds) => {
+      const updates = appIds.map((appId) => {
+        return this.fetchRegistryApp(dappReg, appId, true);
+      });
+
+      Promise
+        .all(updates)
+        .then((apps) => {
+          this.addApps(apps);
+        });
+    }).then((subscriptions) => {
+      this._subscriptions = subscriptions;
+    });
+  }
+
+  fetchBuiltinApps (force = false) {
+    if (!force && this._cachedApps[BUILTIN_APPS_KEY] !== undefined) {
+      return Promise.resolve(this._cachedApps[BUILTIN_APPS_KEY]);
+    }
+
+    this._cachedApps[BUILTIN_APPS_KEY] = fetchBuiltinApps()
+      .then((apps) => {
+        this._cachedApps[BUILTIN_APPS_KEY] = apps;
+        return apps;
+      });
+
+    return Promise.resolve(this._cachedApps[BUILTIN_APPS_KEY]);
+  }
+
+  fetchLocalApps () {
+    return fetchLocalApps(this._api);
+  }
+
+  fetchRegistryAppIds (force = false) {
+    if (!force && this._registryAppsIds) {
+      return Promise.resolve(this._registryAppsIds);
+    }
+
+    this._registryAppsIds = fetchRegistryAppIds()
+      .then((appIds) => {
+        this._registryAppsIds = appIds;
+        return this._registryAppsIds;
+      });
+
+    return Promise.resolve(this._registryAppsIds);
+  }
+
+  fetchRegistryApp (dappReg, appId, force = false) {
+    if (!force && this._cachedApps[appId] !== undefined) {
+      return Promise.resolve(this._cachedApps[appId]);
+    }
+
+    this._cachedApps[appId] = fetchRegistryApp(this._api, dappReg, appId)
+      .then((dapp) => {
+        this._cachedApps[appId] = dapp;
+        return dapp;
+      });
+
+    return Promise.resolve(this._cachedApps[appId]);
+  }
+
+  fetchRegistryApps (dappReg) {
+    return this
+      .fetchRegistryAppIds()
+      .then((appIds) => {
+        const promises = appIds.map((appId) => {
+          // Fetch the Dapp and display it ASAP
+          return this
+            .fetchRegistryApp(dappReg, appId)
+            .then((app) => {
+              if (app) {
+                this.addApps([ app ]);
+              }
+
+              return app;
+            });
+        });
+
+        return Promise.all(promises);
+      });
+  }
+
   @computed get sortedBuiltin () {
     return this.apps.filter((app) => app.type === 'builtin');
   }
@@ -112,9 +231,17 @@ export default class DappsStore {
     store.set(LS_KEY_DISPLAY, this.displayApps);
   }
 
-  @action addApps = (apps) => {
+  @action addApps = (_apps) => {
     transaction(() => {
+      const apps = _apps.filter((app) => app);
+
+      // Get new apps IDs if available
+      const newAppsIds = apps
+        .map((app) => app.id)
+        .filter((id) => id);
+
       this.apps = this.apps
+        .filter((app) => !app.id || !newAppsIds.includes(app.id))
         .concat(apps || [])
         .sort((a, b) => a.name.localeCompare(b.name));
 
@@ -128,159 +255,4 @@ export default class DappsStore {
       this.displayApps = Object.assign({}, this.displayApps, visibility);
     });
   }
-
-  _getHost (api) {
-    const host = process.env.DAPPS_URL || (process.env.NODE_ENV === 'production'
-      ? this._api.dappsUrl
-      : '');
-
-    if (host === '/') {
-      return '';
-    }
-
-    return host;
-  }
-
-  _fetchBuiltinApps () {
-    const { dappReg } = Contracts.get();
-
-    return Promise
-      .all(builtinApps.map((app) => dappReg.getImage(app.id)))
-      .then((imageIds) => {
-        this.addApps(
-          builtinApps.map((app, index) => {
-            app.type = 'builtin';
-            app.image = hashToImageUrl(imageIds[index]);
-            return app;
-          })
-        );
-      })
-      .catch((error) => {
-        console.warn('DappsStore:fetchBuiltinApps', error);
-      });
-  }
-
-  _fetchLocalApps () {
-    return fetch(`${this._getHost()}/api/apps`)
-      .then((response) => {
-        return response.ok
-          ? response.json()
-          : [];
-      })
-      .then((apps) => {
-        return apps
-          .map((app) => {
-            app.type = 'local';
-            app.visible = true;
-            return app;
-          })
-          .filter((app) => app.id && !['ui'].includes(app.id));
-      })
-      .then(this.addApps)
-      .catch((error) => {
-        console.warn('DappsStore:fetchLocal', error);
-      });
-  }
-
-  _fetchRegistryApps () {
-    const { dappReg } = Contracts.get();
-
-    return dappReg
-      .count()
-      .then((_count) => {
-        const count = _count.toNumber();
-        const promises = [];
-
-        for (let index = 0; index < count; index++) {
-          promises.push(dappReg.at(index));
-        }
-
-        return Promise.all(promises);
-      })
-      .then((appsInfo) => {
-        const appIds = appsInfo
-          .map(([appId, owner]) => this._api.util.bytesToHex(appId))
-          .filter((appId) => {
-            return (new BigNumber(appId)).gt(0) && !builtinApps.find((app) => app.id === appId);
-          });
-
-        return Promise
-          .all([
-            Promise.all(appIds.map((appId) => dappReg.getImage(appId))),
-            Promise.all(appIds.map((appId) => dappReg.getContent(appId))),
-            Promise.all(appIds.map((appId) => dappReg.getManifest(appId)))
-          ])
-          .then(([imageIds, contentIds, manifestIds]) => {
-            return appIds.map((appId, index) => {
-              const app = {
-                id: appId,
-                image: hashToImageUrl(imageIds[index]),
-                contentHash: this._api.util.bytesToHex(contentIds[index]).substr(2),
-                manifestHash: this._api.util.bytesToHex(manifestIds[index]).substr(2),
-                type: 'network',
-                visible: true
-              };
-
-              return app;
-            });
-          });
-      })
-      .then((apps) => {
-        return Promise
-          .all(apps.map((app) => this._fetchManifest(app.manifestHash)))
-          .then((manifests) => {
-            return apps.map((app, index) => {
-              const manifest = manifests[index];
-
-              if (manifest) {
-                app.manifestHash = null;
-                Object.keys(manifest)
-                  .filter((key) => ['author', 'description', 'name', 'version'].includes(key))
-                  .forEach((key) => {
-                    app[key] = manifest[key];
-                  });
-              }
-
-              return app;
-            });
-          })
-          .then((apps) => {
-            return apps.filter((app) => {
-              return !app.manifestHash && app.id;
-            });
-          });
-      })
-      .then(this.addApps)
-      .catch((error) => {
-        console.warn('DappsStore:fetchRegistry', error);
-      });
-  }
-
-  _fetchManifest (manifestHash) {
-    if (/^(0x)?0+/.test(manifestHash)) {
-      return Promise.resolve(null);
-    }
-
-    if (this._manifests[manifestHash]) {
-      return Promise.resolve(this._manifests[manifestHash]);
-    }
-
-    return fetch(`${this._getHost()}/api/content/${manifestHash}/`, { redirect: 'follow', mode: 'cors' })
-      .then((response) => {
-        return response.ok
-          ? response.json()
-          : null;
-      })
-      .then((manifest) => {
-        if (manifest) {
-          this._manifests[manifestHash] = manifest;
-        }
-
-        return manifest;
-      })
-      .catch((error) => {
-        console.warn('DappsStore:fetchManifest', error);
-        return null;
-      });
-  }
 }

js/src/views/WriteContract/writeContract.css

@@ -32,6 +32,10 @@
   flex: 1;
   flex-direction: row;
 
+  // Fallback for browsers not supporting `calc`
+  min-height: 90vh;
+  min-height: calc(100vh - 8em);
+
   > * {
     margin: 0;
 

js/test/mocha.config.js

@@ -15,11 +15,13 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import 'isomorphic-fetch';
+import 'mock-local-storage';
 
 import es6Promise from 'es6-promise';
 es6Promise.polyfill();
 
-import 'mock-local-storage';
+import injectTapEventPlugin from 'react-tap-event-plugin';
+injectTapEventPlugin();
 
 import chai from 'chai';
 import chaiAsPromised from 'chai-as-promised';

rpc/src/v1/impls/signing.rs

@@ -18,7 +18,7 @@
 
 use std::sync::{Arc, Weak};
 use transient_hashmap::TransientHashMap;
-use util::{U256, Mutex};
+use util::{U256, Mutex, Hashable};
 
 use ethcore::account_provider::AccountProvider;
 use ethcore::miner::MinerService;
@@ -180,7 +180,8 @@ impl<C: 'static, M: 'static> EthSigning for SigningQueueClient<C, M> where
 	C: MiningBlockChainClient,
 	M: MinerService,
 {
-	fn sign(&self, ready: Ready<RpcH520>, address: RpcH160, hash: RpcH256) {
+	fn sign(&self, ready: Ready<RpcH520>, address: RpcH160, data: RpcBytes) {
+		let hash = data.0.sha3().into();
 		let res = self.active().and_then(|_| self.dispatch(RpcConfirmationPayload::Signature((address, hash).into())));
 		self.handle_dispatch(res, |response| {
 			match response {

rpc/src/v1/impls/signing_unsafe.rs

@@ -17,6 +17,7 @@
 //! Unsafe Signing RPC implementation.
 
 use std::sync::{Arc, Weak};
+use util::Hashable;
 
 use ethcore::account_provider::AccountProvider;
 use ethcore::miner::MinerService;
@@ -83,7 +84,8 @@ impl<C: 'static, M: 'static> EthSigning for SigningUnsafeClient<C, M> where
 	C: MiningBlockChainClient,
 	M: MinerService,
 {
-	fn sign(&self, ready: Ready<RpcH520>, address: RpcH160, hash: RpcH256) {
+	fn sign(&self, ready: Ready<RpcH520>, address: RpcH160, data: RpcBytes) {
+		let hash = data.0.sha3().into();
 		let result = match self.handle(RpcConfirmationPayload::Signature((address, hash).into())) {
 			Ok(RpcConfirmationResponse::Signature(signature)) => Ok(signature),
 			Err(e) => Err(e),

rpc/src/v1/tests/helpers/sync_provider.rs

@@ -105,13 +105,13 @@ impl SyncProvider for TestSyncProvider {
 				first_seen: 10,
 				propagated_to: map![
 					128.into() => 16
-				]
+				],
 			},
 			5.into() => TransactionStats {
 				first_seen: 16,
 				propagated_to: map![
 					16.into() => 1
-				]
+				],
 			}
 		]
 	}

rpc/src/v1/tests/mocked/eth.rs

@@ -18,11 +18,11 @@ use std::str::FromStr;
 use std::collections::HashMap;
 use std::sync::Arc;
 use std::time::{Instant, Duration};
-use rustc_serialize::hex::ToHex;
+use rustc_serialize::hex::{FromHex, ToHex};
 use time::get_time;
 use rlp;
 
-use util::{Uint, U256, Address, H256, FixedHash, Mutex};
+use util::{Uint, U256, Address, H256, FixedHash, Mutex, Hashable};
 use ethcore::account_provider::AccountProvider;
 use ethcore::client::{TestBlockChainClient, EachBlockWith, Executed, TransactionId};
 use ethcore::log_entry::{LocalizedLogEntry, LogEntry};
@@ -294,8 +294,8 @@ fn rpc_eth_sign() {
 
 	let account = tester.accounts_provider.new_account("abcd").unwrap();
 	tester.accounts_provider.unlock_account_permanently(account, "abcd".into()).unwrap();
-	let message = H256::from("0x0cc175b9c0f1b6a831c399e26977266192eb5ffee6ae2fec3ad71c777531578f");
+	let message = "0cc175b9c0f1b6a831c399e26977266192eb5ffee6ae2fec3ad71c777531578f".from_hex().unwrap();
-	let signed = tester.accounts_provider.sign(account, None, message).unwrap();
+	let signed = tester.accounts_provider.sign(account, None, message.sha3()).unwrap();
 
 	let req = r#"{
 		"jsonrpc": "2.0",

rpc/src/v1/tests/mocked/signing.rs

@@ -26,7 +26,7 @@ use v1::types::ConfirmationResponse;
 use v1::tests::helpers::TestMinerService;
 use v1::tests::mocked::parity;
 
-use util::{Address, FixedHash, Uint, U256, H256, ToPretty};
+use util::{Address, FixedHash, Uint, U256, ToPretty, Hashable};
 use ethcore::account_provider::AccountProvider;
 use ethcore::client::TestBlockChainClient;
 use ethcore::transaction::{Transaction, Action};
@@ -186,11 +186,11 @@ fn should_check_status_of_request_when_its_resolved() {
 fn should_sign_if_account_is_unlocked() {
 	// given
 	let tester = eth_signing();
-	let hash: H256 = 5.into();
+	let data = vec![5u8];
 	let acc = tester.accounts.new_account("test").unwrap();
 	tester.accounts.unlock_account_permanently(acc, "test".into()).unwrap();
 
-	let signature = tester.accounts.sign(acc, None, hash).unwrap();
+	let signature = tester.accounts.sign(acc, None, data.sha3()).unwrap();
 
 	// when
 	let request = r#"{
@@ -198,7 +198,7 @@ fn should_sign_if_account_is_unlocked() {
 		"method": "eth_sign",
 		"params": [
 			""#.to_owned() + format!("0x{:?}", acc).as_ref() + r#"",
-			""# + format!("0x{:?}", hash).as_ref() + r#""
+			""# + format!("0x{}", data.to_hex()).as_ref() + r#""
 		],
 		"id": 1
 	}"#;

rpc/src/v1/traits/eth_signing.rs

@@ -17,14 +17,14 @@
 //! Eth rpc interface.
 
 use v1::helpers::auto_args::{WrapAsync, Ready};
-use v1::types::{H160, H256, H520, TransactionRequest, RichRawTransaction};
+use v1::types::{Bytes, H160, H256, H520, TransactionRequest, RichRawTransaction};
 
 build_rpc_trait! {
 	/// Signing methods implementation relying on unlocked accounts.
 	pub trait EthSigning {
-		/// Signs the data with given address signature.
+		/// Signs the hash of data with given address signature.
 		#[rpc(async, name = "eth_sign")]
-		fn sign(&self, Ready<H520>, H160, H256);
+		fn sign(&self, Ready<H520>, H160, Bytes);
 
 		/// Sends transaction; will block waiting for signer to return the
 		/// transaction hash.

rpc/src/v1/types/sync.rs

@@ -157,7 +157,7 @@ impl From<SyncTransactionStats> for TransactionStats {
 			propagated_to: s.propagated_to
 				.into_iter()
 				.map(|(id, count)| (id.into(), count))
-				.collect()
+				.collect(),
 		}
 	}
 }
@@ -208,7 +208,7 @@ mod tests {
 			first_seen: 100,
 			propagated_to: map![
 				10.into() => 50
-			]
+			],
 		};
 
 		let serialized = serde_json::to_string(&stats).unwrap();

sync/src/api.rs

@@ -335,6 +335,11 @@ impl ChainNotify for EthSync {
 		self.sync_handler.snapshot_service.abort_restore();
 		self.network.stop().unwrap_or_else(|e| warn!("Error stopping network: {:?}", e));
 	}
+
+	fn transactions_received(&self, hashes: Vec<H256>, peer_id: PeerId) {
+		let mut sync = self.sync_handler.sync.write();
+		sync.transactions_received(hashes, peer_id);
+	}
 }
 
 /// LES event handler.
@@ -344,7 +349,7 @@ struct TxRelay(Arc<BlockChainClient>);
 impl LightHandler for TxRelay {
 	fn on_transactions(&self, ctx: &EventContext, relay: &[::ethcore::transaction::SignedTransaction]) {
 		trace!(target: "les", "Relaying {} transactions from peer {}", relay.len(), ctx.peer());
-		self.0.queue_transactions(relay.iter().map(|tx| ::rlp::encode(tx).to_vec()).collect())
+		self.0.queue_transactions(relay.iter().map(|tx| ::rlp::encode(tx).to_vec()).collect(), ctx.peer())
 	}
 }
 

sync/src/chain.rs

@@ -432,6 +432,13 @@ impl ChainSync {
 		self.transactions_stats.stats()
 	}
 
+	/// Updates transactions were received by a peer
+	pub fn transactions_received(&mut self, hashes: Vec<H256>, peer_id: PeerId) {
+		if let Some(mut peer_info) = self.peers.get_mut(&peer_id) {
+			peer_info.last_sent_transactions.extend(&hashes);
+		}
+	}
+
 	/// Abort all sync activity
 	pub fn abort(&mut self, io: &mut SyncIo) {
 		self.reset_and_continue(io);
@@ -1409,7 +1416,7 @@ impl ChainSync {
 			let tx = rlp.as_raw().to_vec();
 			transactions.push(tx);
 		}
-		io.chain().queue_transactions(transactions);
+		io.chain().queue_transactions(transactions, peer_id);
 		Ok(())
 	}
 

sync/src/transactions_stats.rs

@@ -112,7 +112,7 @@ mod tests {
 			propagated_to: hash_map![
 				enodeid1 => 2,
 				enodeid2 => 1
-			]
+			],
 		}));
 	}
 

util/network/src/lib.rs

@@ -99,7 +99,7 @@ pub use stats::NetworkStats;
 pub use session::SessionInfo;
 
 use io::TimerToken;
-pub use node_table::is_valid_node_url;
+pub use node_table::{is_valid_node_url, NodeId};
 
 const PROTOCOL_VERSION: u32 = 4;