Fix wallet view

js/src/modals/CreateWallet/WalletDetails/walletDetails.js

@@ -16,18 +16,21 @@
 
 import React, { Component, PropTypes } from 'react';
 import { FormattedMessage } from 'react-intl';
+import { connect } from 'react-redux';
 
 import { Form, TypedInput, Input, AddressSelect, InputAddress } from '~/ui';
 
 import styles from '../createWallet.css';
 
-export default class WalletDetails extends Component {
+class WalletDetails extends Component {
   static propTypes = {
     accounts: PropTypes.object.isRequired,
     wallet: PropTypes.object.isRequired,
     errors: PropTypes.object.isRequired,
     onChange: PropTypes.func.isRequired,
-    walletType: PropTypes.string.isRequired
+    walletType: PropTypes.string.isRequired,
+
+    knownAddresses: PropTypes.array
   };
 
   render () {
@@ -103,7 +106,10 @@ export default class WalletDetails extends Component {
   }
 
   renderMultisigDetails () {
-    const { accounts, wallet, errors } = this.props;
+    const { accounts, knownAddresses, wallet, errors } = this.props;
+    const allowedOwners = knownAddresses
+      // Exclude sender and already owners of the wallet
+      .filter((address) => !wallet.owners.includes(address) && address !== wallet.account);
 
     return (
       <Form>
@@ -163,7 +169,7 @@ export default class WalletDetails extends Component {
         />
 
         <TypedInput
-          accounts={ accounts }
+          allowedValues={ allowedOwners }
           label={
             <FormattedMessage
               id='createWallet.details.ownersMulti.label'
@@ -249,3 +255,21 @@ export default class WalletDetails extends Component {
     this.props.onChange({ daylimit });
   }
 }
+
+function mapStateToProps (initState) {
+  const { accounts, contacts, contracts } = initState.personal;
+  const knownAddresses = [].concat(
+    Object.keys(accounts),
+    Object.keys(contacts),
+    Object.keys(contracts)
+  );
+
+  return () => ({
+    knownAddresses
+  });
+}
+
+export default connect(
+  mapStateToProps,
+  null
+)(WalletDetails);

js/src/modals/CreateWallet/WalletDetails/walletDetails.spec.js

@@ -25,6 +25,22 @@ import { ACCOUNTS } from '../createWallet.test.js';
 let component;
 let onChange;
 
+function createRedux () {
+  return {
+    dispatch: sinon.stub(),
+    subscribe: sinon.stub(),
+    getState: () => {
+      return {
+        personal: {
+          accounts: {},
+          contacts: {},
+          contracts: {}
+        }
+      };
+    }
+  };
+}
+
 function render (walletType = 'MULTISIG') {
   onChange = sinon.stub();
   component = shallow(
@@ -36,7 +52,12 @@ function render (walletType = 'MULTISIG') {
         owners: []
       } }
       walletType={ walletType }
-    />
+    />,
+    {
+      context: {
+        store: createRedux()
+      }
+    }
   );
 
   return component;

js/src/modals/CreateWallet/createWalletStore.js

@@ -283,7 +283,8 @@ export default class CreateWalletStore {
 
     const owners = _wallet.owners.filter((owner) => !/^(0x)?0*$/.test(owner));
 
-    if (_wallet.required > owners.length) {
+    // Real number of owners is owners + creator
+    if (_wallet.required > owners.length + 1) {
       requiredValidation.valueError = 'the number of required validators should be lower or equal the number of owners';
     }
 

js/src/modals/DeployContract/ParametersStep/parametersStep.js

@@ -43,7 +43,6 @@ export default class ParametersStep extends Component {
   };
 
   static propTypes = {
-    accounts: PropTypes.object.isRequired,
     onParamsChange: PropTypes.func.isRequired,
 
     inputs: PropTypes.array,
@@ -60,7 +59,7 @@ export default class ParametersStep extends Component {
   }
 
   renderConstructorInputs () {
-    const { accounts, params, paramsError } = this.props;
+    const { params, paramsError } = this.props;
     const { inputs } = this.props;
 
     if (!inputs || !inputs.length) {
@@ -78,7 +77,6 @@ export default class ParametersStep extends Component {
       return (
         <div key={ index } className={ styles.funcparams }>
           <TypedInput
-            accounts={ accounts }
             error={ error }
             isEth={ false }
             label={ label }

js/src/modals/DeployContract/deployContract.js

@@ -314,7 +314,6 @@ class DeployContract extends Component {
         return (
           <ParametersStep
             { ...this.state }
-            accounts={ accounts }
             onParamsChange={ this.onParamsChange }
             readOnly={ readOnly }
           />

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

@@ -177,7 +177,7 @@ export default class DetailsStep extends Component {
   }
 
   renderParameters () {
-    const { accounts, func, values, valuesError, onValueChange } = this.props;
+    const { func, values, valuesError, onValueChange } = this.props;
 
     if (!func) {
       return null;
@@ -197,7 +197,6 @@ export default class DetailsStep extends Component {
             value={ values[index] }
             error={ valuesError[index] }
             onChange={ onChange }
-            accounts={ accounts }
             param={ input.type }
             isEth={ false }
           />

js/src/modals/WalletSettings/walletSettings.js

@@ -34,7 +34,6 @@ class WalletSettings extends Component {
   };
 
   static propTypes = {
-    accountsInfo: PropTypes.object.isRequired,
     wallet: PropTypes.object.isRequired,
     onClose: PropTypes.func.isRequired,
     senders: PropTypes.object.isRequired
@@ -74,7 +73,7 @@ class WalletSettings extends Component {
       default:
       case 'EDIT':
         const { errors, fromString, wallet } = this.store;
-        const { accountsInfo, senders } = this.props;
+        const { senders } = this.props;
 
         return (
           <Form>
@@ -143,7 +142,6 @@ class WalletSettings extends Component {
                       }
                       value={ wallet.owners.slice() }
                       onChange={ this.store.onOwnersChange }
-                      accounts={ accountsInfo }
                       param='address[]'
                     />
 
@@ -443,13 +441,13 @@ class WalletSettings extends Component {
 }
 
 function mapStateToProps (initState, initProps) {
-  const { accountsInfo, accounts } = initState.personal;
+  const { accounts } = initState.personal;
   const { owners } = initProps.wallet;
 
   const senders = pick(accounts, owners);
 
   return () => {
-    return { accountsInfo, senders };
+    return { senders };
   };
 }
 

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

@@ -14,6 +14,7 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
+import { eq } from 'lodash';
 import React, { Component, PropTypes } from 'react';
 import ReactDOM from 'react-dom';
 import { connect } from 'react-redux';
@@ -93,6 +94,18 @@ class AddressSelect extends Component {
   }
 
   componentWillReceiveProps (nextProps) {
+    if (!eq(Object.keys(this.props.accounts), Object.keys(nextProps.accounts))) {
+      return this.setValues(nextProps);
+    }
+
+    if (!eq(Object.keys(this.props.contacts), Object.keys(nextProps.contacts))) {
+      return this.setValues(nextProps);
+    }
+
+    if (!eq(Object.keys(this.props.contracts), Object.keys(nextProps.contracts))) {
+      return this.setValues(nextProps);
+    }
+
     if (this.store.values && this.store.values.length > 0) {
       return;
     }

js/src/ui/Form/AddressSelect/addressSelectStore.js

@@ -165,7 +165,8 @@ export default class AddressSelectStore {
     const contactsN = Object.keys(contacts).length;
 
     if (accountsN + contractsN + contactsN === 0) {
-      return;
+      this.initValues = [];
+      return this.handleChange();
     }
 
     this.initValues = [

js/src/ui/Form/InputAddressSelect/inputAddressSelect.js

@@ -14,6 +14,7 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
+import { pick } from 'lodash';
 import React, { Component, PropTypes } from 'react';
 import { connect } from 'react-redux';
 
@@ -28,6 +29,7 @@ class InputAddressSelect extends Component {
     contracts: PropTypes.object.isRequired,
 
     allowCopy: PropTypes.bool,
+    allowedValues: PropTypes.array,
     className: PropTypes.string,
     error: nodeOrStringProptype(),
     hint: nodeOrStringProptype(),
@@ -38,16 +40,33 @@ class InputAddressSelect extends Component {
   };
 
   render () {
-    const { accounts, allowCopy, className, contacts, contracts, label, hint, error, value, onChange, readOnly } = this.props;
+    const { accounts, allowCopy, allowedValues, className, contacts, contracts, label, hint, error, value, onChange, readOnly } = this.props;
+    // Add the currently selected value to the list
+    // of allowed values, if any given
+    const nextAllowedValues = allowedValues
+      ? [].concat(allowedValues, value || [])
+      : null;
+
+    const filteredAccounts = nextAllowedValues
+      ? pick(accounts, nextAllowedValues)
+      : accounts;
+
+    const filteredContacts = nextAllowedValues
+      ? pick(contacts, nextAllowedValues)
+      : accounts;
+
+    const filteredContracts = nextAllowedValues
+      ? pick(contracts, nextAllowedValues)
+      : accounts;
 
     return (
       <AddressSelect
         allowCopy={ allowCopy }
         allowInput
-        accounts={ accounts }
+        accounts={ filteredAccounts }
         className={ className }
-        contacts={ contacts }
-        contracts={ contracts }
+        contacts={ filteredContacts }
+        contracts={ filteredContracts }
         error={ error }
         hint={ hint }
         label={ label }

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

@@ -40,8 +40,8 @@ export default class TypedInput extends Component {
       PropTypes.string
     ]).isRequired,
 
-    accounts: PropTypes.object,
     allowCopy: PropTypes.bool,
+    allowedValues: PropTypes.array,
     className: PropTypes.string,
     error: PropTypes.any,
     hint: nodeOrStringProptype(),
@@ -97,7 +97,7 @@ export default class TypedInput extends Component {
     const { type } = param;
 
     if (type === ABI_TYPES.ARRAY) {
-      const { accounts, className, label } = this.props;
+      const { allowedValues, className, label } = this.props;
       const { subtype, length } = param;
       const value = this.getValue() || param.default;
 
@@ -113,8 +113,8 @@ export default class TypedInput extends Component {
 
         return (
           <TypedInput
-            accounts={ accounts }
             allowCopy={ allowCopy }
+            allowedValues={ allowedValues }
             className={ className }
             key={ `${subtype.type}_${index}` }
             onChange={ onChange }
@@ -340,13 +340,13 @@ export default class TypedInput extends Component {
   }
 
   renderAddress () {
-    const { accounts, allowCopy, className, label, error, hint, readOnly } = this.props;
+    const { allowCopy, allowedValues, className, label, error, hint, readOnly } = this.props;
     const value = this.getValue();
 
     return (
       <InputAddressSelect
         allowCopy={ allowCopy }
-        accounts={ accounts }
+        allowedValues={ allowedValues }
         className={ className }
         error={ error }
         hint={ hint }

js/src/util/wallets.js

@@ -78,13 +78,39 @@ export default class WalletsUtils {
       .delegateCall(api, walletContract.address, 'fetchTransactions', [ walletContract ])
       .then((transactions) => {
         return transactions.sort((txA, txB) => {
-          const comp = txB.blockNumber.comparedTo(txA.blockNumber);
+          const bnA = txA.blockNumber;
+          const bnB = txB.blockNumber;
+
+          if (!bnA) {
+            console.warn('could not find block number in transaction', txA);
+            return 1;
+          }
+
+          if (!bnB) {
+            console.warn('could not find block number in transaction', txB);
+            return -1;
+          }
+
+          const comp = bnA.comparedTo(bnB);
 
           if (comp !== 0) {
             return comp;
           }
 
-          return txB.transactionIndex.comparedTo(txA.transactionIndex);
+          const txIdxA = txA.transactionIndex;
+          const txIdxB = txB.transactionIndex;
+
+          if (!txIdxA) {
+            console.warn('could not find transaction index in transaction', txA);
+            return 1;
+          }
+
+          if (!txIdxB) {
+            console.warn('could not find transaction index in transaction', txB);
+            return -1;
+          }
+
+          return txIdxA.comparedTo(txIdxB);
         });
       });
   }

js/src/util/wallets/consensys-wallet.js

@@ -212,6 +212,7 @@ export default class ConsensysWalletUtils {
 
           const transaction = {
             transactionHash: log.transactionHash,
+            transactionIndex: log.transactionIndex,
             blockNumber: log.blockNumber
           };