new InputAddressSelect component (#3071)

* basic address autocomplete

* validate input, propagate changes

* show IdentityIcon in menu

* show IdentityIcon next to input

* refactoring, better variable names, linting

* show default IdentityIcon if search by name

* port #3065 over

* show accounts in the beginning

* show accounts before contacts

* filter deleted accounts

* UX improvements

- limit number of search results shown
- hint text

* only render identity icon if valid address

* UX improvements

- align IdentityIcon
- better hint text

* align label & error with other inputs

This probably needs to be changed soon again. Therefore this ugly hack has been put in place.

* Align component with coding style for app

* Use standard/tested AddressAutocmplete (WIP)

* Address selection & inputs operational

* Update TODOs, remove unused CSS

* only handle input changes when editing

* Simplify

* Cleanup unused modules

* Add contracts to address search

* Updates Address Selector to handle valid input address #3071

* Added Address Selector to contracts read queries

js/src/views/Contract/Queries/inputQuery.js

@@ -19,7 +19,7 @@ import React, { Component, PropTypes } from 'react';
 import LinearProgress from 'material-ui/LinearProgress';
 import { Card, CardActions, CardTitle, CardText } from 'material-ui/Card';
 
-import { Button, Input } from '../../../ui';
+import { Button, Input, InputAddressSelect } from '../../../ui';
 
 import styles from './queries.css';
 
@@ -124,8 +124,8 @@ export default class InputQuery extends Component {
     const { name, type } = input;
     const label = `${name ? `${name}: ` : ''}${type}`;
 
-    const onChange = (event) => {
-      const value = event.target.value;
+    const onChange = (event, input) => {
+      const value = event && event.target.value || input;
       const { values } = this.state;
 
       this.setState({
@@ -136,6 +136,19 @@ export default class InputQuery extends Component {
       });
     };
 
+    if (type === 'address') {
+      return (
+        <div key={ name }>
+          <InputAddressSelect
+            hint={ type }
+            label={ label }
+            required
+            onChange={ onChange }
+          />
+        </div>
+      );
+    }
+
     return (
       <div key={ name }>
         <Input