Ui 2 package upgrades (#6076)

* Upgrade to React 15.6

* Import PropTypes from prop-types

* Update package.json

* UI version in built version

* Cleanup /api/health status failures

* Check reponse.ok

* Add icons to view dapps

* Adjust layout for dapps

* Slightly darker balance background

* Adjust shadows

js/package.json

@@ -179,8 +179,9 @@
     "loglevel": "1.4.1",
     "moment": "2.17.0",
     "promise-worker": "1.1.1",
-    "react": "15.4.2",
-    "react-dom": "15.4.2",
+    "prop-types": "15.5.10",
+    "react": "15.6.1",
+    "react-dom": "15.6.1",
     "react-inspector": "paritytech/react-inspector",
     "react-intl": "2.1.5",
     "react-router": "3.0.0",
@@ -198,7 +199,6 @@
     "utf8": "2.1.2",
     "web3": "0.17.0-beta",
     "whatwg-fetch": "2.0.1",
-    "worker-loader": "^0.8.0",
-    "yarn": "^0.21.3"
+    "worker-loader": "^0.8.0"
   }
 }

js/src/dapps/chaindeploy/Contract/contract.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import ListItem, { Header, Row } from '../ListItem';
 

js/src/dapps/chaindeploy/Dapp/dapp.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import ListItem, { Header, Row } from '../ListItem';
 

js/src/dapps/chaindeploy/ListItem/Header/header.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import Icon from '../Icon';
 

js/src/dapps/chaindeploy/ListItem/Icon/icon.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import styles from '../listItem.css';
 

js/src/dapps/chaindeploy/ListItem/Row/row.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import Icon from '../Icon';
 

js/src/dapps/chaindeploy/ListItem/listItem.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import styles from './listItem.css';
 

js/src/dapps/dappreg/Button/button.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import styles from './button.css';
 

js/src/dapps/dappreg/Card/card.js

@@ -15,8 +15,9 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import keycode from 'keycode';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
 import ReactDOM from 'react-dom';
+import PropTypes from 'prop-types';
 
 import styles from './card.css';
 

js/src/dapps/dappreg/DappCard/dappCard.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import Card from '../Card';
 import DappsStore from '../dappsStore';

js/src/dapps/dappreg/DappModal/dappModal.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import DappsStore from '../dappsStore';

js/src/dapps/dappreg/Dapps/dapps.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import CreateDappCard from '../CreateDappCard';
 import DappCard from '../DappCard';

js/src/dapps/dappreg/Input/input.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import styles from './input.css';
 

js/src/dapps/dappreg/Modal/modal.js

@@ -15,8 +15,9 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import keycode from 'keycode';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
 import ReactDOM from 'react-dom';
+import PropTypes from 'prop-types';
 
 import Button from '../Button';
 

js/src/dapps/dappreg/ModalDelete/modalDelete.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import Modal from '../Modal';
 

js/src/dapps/dappreg/ModalRegister/modalRegister.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import { observer } from 'mobx-react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import DappsStore from '../dappsStore';

js/src/dapps/dappreg/ModalUpdate/modalUpdate.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import Modal from '../Modal';
 

js/src/dapps/dappreg/SelectAccount/selectAccount.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import { observer } from 'mobx-react';
+import PropTypes from 'prop-types';
 
 import DappsStore from '../dappsStore';
 

js/src/dapps/githubhint/Button/button.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import styles from './button.css';
 

js/src/dapps/githubhint/Events/events.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import moment from 'moment';
+import PropTypes from 'prop-types';
 
 import styles from './events.css';
 

js/src/dapps/localtx/IdentityIcon/identityIcon.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import styles from './identityIcon.css';

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

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import BigNumber from 'bignumber.js';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import classnames from 'classnames';
 
 import { api } from '../parity';

js/src/dapps/registry/Accounts/accounts.js

@@ -14,10 +14,11 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import AccountIcon from 'material-ui/svg-icons/action/account-circle';
+import PropTypes from 'prop-types';
 
 import { init } from './actions';
 import IdentityIcon from '../IdentityIcon';

js/src/dapps/registry/Application/application.js

@@ -13,7 +13,8 @@
 
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import getMuiTheme from 'material-ui/styles/getMuiTheme';
 import lightBaseTheme from 'material-ui/styles/baseThemes/lightBaseTheme';

js/src/dapps/registry/Container.js

@@ -14,9 +14,10 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
+import PropTypes from 'prop-types';
 
 import { nullableProptype } from '@parity/shared/util/proptypes';
 

js/src/dapps/registry/Events/events.js

@@ -14,12 +14,13 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { Card, CardHeader, CardActions, CardText } from 'material-ui/Card';
 import Toggle from 'material-ui/Toggle';
 import moment from 'moment';
+import PropTypes from 'prop-types';
 
 import { bytesToHex } from '../parity';
 import Hash from '../ui/hash';

js/src/dapps/registry/IdentityIcon/identityIcon.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import styles from './identityIcon.css';

js/src/dapps/registry/Lookup/lookup.js

@@ -14,7 +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 React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { Card, CardHeader, CardText } from 'material-ui/Card';
@@ -24,6 +24,7 @@ import TextField from 'material-ui/TextField';
 import DropDownMenu from 'material-ui/DropDownMenu';
 import MenuItem from 'material-ui/MenuItem';
 import keycode from 'keycode';
+import PropTypes from 'prop-types';
 
 import { nullableProptype } from '@parity/shared/util/proptypes';
 

js/src/dapps/registry/Names/names.js

@@ -14,7 +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 React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { Card, CardHeader, CardText } from 'material-ui/Card';
@@ -23,6 +23,7 @@ import DropDownMenu from 'material-ui/DropDownMenu';
 import MenuItem from 'material-ui/MenuItem';
 import RaisedButton from 'material-ui/RaisedButton';
 import CheckIcon from 'material-ui/svg-icons/navigation/check';
+import PropTypes from 'prop-types';
 
 import { nullableProptype } from '@parity/shared/util/proptypes';
 

js/src/dapps/registry/Records/records.js

@@ -14,7 +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 React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { Card, CardHeader, CardText } from 'material-ui/Card';
@@ -23,6 +23,7 @@ import DropDownMenu from 'material-ui/DropDownMenu';
 import MenuItem from 'material-ui/MenuItem';
 import RaisedButton from 'material-ui/RaisedButton';
 import SaveIcon from 'material-ui/svg-icons/content/save';
+import PropTypes from 'prop-types';
 
 import { nullableProptype } from '@parity/shared/util/proptypes';
 

js/src/dapps/registry/Reverse/reverse.js

@@ -14,12 +14,13 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import {
   Card, CardHeader, CardText, TextField, DropDownMenu, MenuItem, RaisedButton
 } from 'material-ui';
+import PropTypes from 'prop-types';
 
 import { nullableProptype } from '@parity/shared/util/proptypes';
 

js/src/dapps/registry/ui/address.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
 
 import { nullableProptype } from '@parity/shared/util/proptypes';
 

js/src/dapps/registry/ui/hash.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
 
 import etherscanUrl from '../util/etherscan-url';
 

js/src/dapps/signaturereg/Button/button.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import styles from './button.css';
 

js/src/dapps/signaturereg/Events/events.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { formatBlockNumber, formatBlockTimestamp, formatSignature } from '../format';
 import { attachEvents } from '../services';

js/src/dapps/signaturereg/Header/header.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import styles from './header.css';
 import blocks from '@parity/shared/assets/images/dapps/blocks-350.jpg';

js/src/dapps/signaturereg/IdentityIcon/identityIcon.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import styles from './identityIcon.css';

js/src/dapps/signaturereg/Import/import.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import { callRegister, postRegister } from '../services';

js/src/dapps/tokendeploy/AddressSelect/addressSelect.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import styles from './addressSelect.css';

js/src/dapps/tokendeploy/Application/Header/header.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import PAGES from '../pages';
 import styles from './header.css';

js/src/dapps/tokendeploy/Application/application.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import { attachInstances } from '../services';

js/src/dapps/tokendeploy/Container/container.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import styles from './container.css';
 

js/src/dapps/tokendeploy/Deploy/Deployment/deployment.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../../parity';
 import Container from '../../Container';

js/src/dapps/tokendeploy/Deploy/Event/event.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import moment from 'moment';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../../parity';
 import { getCoin, txLink } from '../../services';

js/src/dapps/tokendeploy/Deploy/Events/events.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../../parity';
 import Container from '../../Container';

js/src/dapps/tokendeploy/IdentityIcon/identityIcon.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import styles from './identityIcon.css';

js/src/dapps/tokendeploy/Overview/Owner/owner.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import IdentityIcon from '../../IdentityIcon';
 import Token from '../Token';

js/src/dapps/tokendeploy/Overview/Token/token.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { totalSupply, getCoin } from '../../services';
 import styles from './token.css';

js/src/dapps/tokendeploy/Overview/overview.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import BigNumber from 'bignumber.js';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { loadOwnedTokens } from '../services';
 import Container from '../Container';

js/src/dapps/tokendeploy/Transfer/Event/event.js

@@ -16,7 +16,8 @@
 
 // TODO: This is a copy & paste for Deploy/Event -> render() different. Not very DRY
 import moment from 'moment';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../../parity';
 import { txLink } from '../../services';

js/src/dapps/tokendeploy/Transfer/Send/send.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import BigNumber from 'bignumber.js';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { eip20 } from '@parity/shared/contracts/abi';
 

js/src/dapps/tokenreg/Accounts/AccountSelector/account-selector.js

@@ -14,10 +14,11 @@
 // 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 React, { Component } from 'react';
 import { List, ListItem } from 'material-ui/List';
 import Subheader from 'material-ui/Subheader';
 import Avatar from 'material-ui/Avatar';
+import PropTypes from 'prop-types';
 
 import IdentityIcon from '../../IdentityIcon';
 

js/src/dapps/tokenreg/Actions/Query/query.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { Dialog, FlatButton, SelectField, MenuItem } from 'material-ui';
 

js/src/dapps/tokenreg/Actions/Register/register.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { Dialog, FlatButton } from 'material-ui';
 

js/src/dapps/tokenreg/Actions/component.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { RaisedButton } from 'material-ui';
 import ActionSearchIcon from 'material-ui/svg-icons/action/search';

js/src/dapps/tokenreg/Application/application.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import getMuiTheme from 'material-ui/styles/getMuiTheme';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 

js/src/dapps/tokenreg/Chip/chip.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { Chip } from 'material-ui';
 

js/src/dapps/tokenreg/Container.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
 
 import Application from './Application';
 

js/src/dapps/tokenreg/IdentityIcon/identityIcon.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import styles from './identityIcon.css';

js/src/dapps/tokenreg/Inputs/Text/input-text.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { TextField } from 'material-ui';
 import CheckIcon from 'material-ui/svg-icons/navigation/check';

js/src/dapps/tokenreg/Loading/loading.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import CircularProgress from 'material-ui/CircularProgress';
+import PropTypes from 'prop-types';
 
 import styles from './loading.css';
 

js/src/dapps/tokenreg/Status/status.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { api } from '../parity';
 import Chip from '../Chip';

js/src/dapps/tokenreg/Tokens/Token/add-meta.js

@@ -14,9 +14,10 @@
 // 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 React, { Component } from 'react';
 import { Dialog, RaisedButton, FlatButton, SelectField, MenuItem } from 'material-ui';
 import AddIcon from 'material-ui/svg-icons/content/add';
+import PropTypes from 'prop-types';
 
 import InputText from '../../Inputs/Text';
 import { ADDRESS_TYPE, URL_TYPE } from '../../Inputs/validation';

js/src/dapps/tokenreg/Tokens/Token/token.js

@@ -14,9 +14,10 @@
 // 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 React, { Component } from 'react';
 import Paper from 'material-ui/Paper';
 import { RaisedButton, SelectField, MenuItem } from 'material-ui';
+import PropTypes from 'prop-types';
 
 import FindIcon from 'material-ui/svg-icons/action/find-in-page';
 import DeleteIcon from 'material-ui/svg-icons/action/delete';

js/src/dapps/tokenreg/Tokens/Token/tokenContainer.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
 
 import Token from './token';
 

js/src/dapps/tokenreg/Tokens/container.js

@@ -14,8 +14,9 @@
 // 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 React, { Component } from 'react';
 import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
 
 import Tokens from './tokens';
 

js/src/dapps/tokenreg/Tokens/tokens.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import Token from './Token';
 import Loading from '../Loading';

js/src/shared/config/dappsViews.json

@@ -7,7 +7,8 @@
     "description": "Display the accounts",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "address card"
   },
   {
     "id": "account",
@@ -28,7 +29,8 @@
     "description": "Display the accounts added to the addressbook",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "address book"
   },
   {
     "id": "address",
@@ -49,7 +51,8 @@
     "description": "Display the contracts added to the addressbook",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "puzzle"
   },
   {
     "id": "contract",
@@ -70,7 +73,8 @@
     "description": "Allow setting of accounts to use by default for dapps",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "users"
   },
   {
     "id": "dappMethods",
@@ -80,7 +84,8 @@
     "description": "Allow setting of dapp permissions on a per method level",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "map signs"
   },
   {
     "id": "dappVisible",
@@ -90,7 +95,8 @@
     "description": "Allow setting of visible dapps",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "hide"
   },
   {
     "id": "develop",
@@ -100,7 +106,8 @@
     "description": "Create new contracts",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "connectdevelop"
   },
   {
     "id": "home",
@@ -110,7 +117,8 @@
     "description": "Display the status of the node, recently accessed applications, accounts and news",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "home"
   },
   {
     "id": "playground",
@@ -131,7 +139,8 @@
     "description": "Display the current and historic Signer requests",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "exchange"
   },
   {
     "id": "settings",
@@ -141,7 +150,8 @@
     "description": "Allows the configuraion of all Parity & Parity-UI related options",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "settings"
   },
   {
     "id": "status",
@@ -151,7 +161,8 @@
     "description": "Displays an overview of the node including settings, logs and connections",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "feed"
   },
   {
     "id": "vaults",
@@ -161,7 +172,8 @@
     "description": "Allows the management of the Account Vaults, including creation, locking and account assignment",
     "author": "Parity Team <admin@ethcore.io>",
     "version": "2.0.0",
-    "visible": true
+    "visible": true,
+    "semantic-icon": "archive"
   },
   {
     "id": "wallet",

js/src/shared/redux/providers/status.js

@@ -255,7 +255,17 @@ export default class Status {
     // Support Parity-Extension.
     const uiUrl = this._api.transport.uiUrlWithProtocol || '';
 
-    return fetch(`${uiUrl}/api/health`).then(res => res.json());
+    return fetch(`${uiUrl}/api/health`)
+      .then((response) => {
+        if (!response.ok) {
+          return {};
+        }
+
+        return response.json();
+      })
+      .catch(() => {
+        return {};
+      });
   }
 
   /**

js/src/shared/util/proptypes.js

@@ -14,7 +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 { PropTypes } from 'react';
+import PropTypes from 'prop-types';
 
 export function arrayOrObjectProptype () {
   return PropTypes.oneOfType([

js/src/shell/Application/application.js

@@ -15,9 +15,10 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
 
 import { Errors } from '@parity/ui';
 

js/src/shell/Connection/connection.js

@@ -14,9 +14,10 @@
 // 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 React, { Component } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
 
 import { Input } from '@parity/ui';
 import { CompareIcon, ComputerIcon, DashboardIcon, VpnIcon } from '@parity/ui/Icons';

js/src/shell/Dapp/dapp.js

@@ -14,9 +14,10 @@
 // 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 React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { FormattedMessage } from 'react-intl';
+import PropTypes from 'prop-types';
 
 import DappsStore from '../Dapps/dappsStore';
 

js/src/shell/DappRequests/Request/request.js

@@ -14,7 +14,8 @@
 // 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, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 import { Button } from '@parity/ui';

js/src/shell/Dapps/dapps.js

@@ -16,9 +16,10 @@
 
 import { omitBy } from 'lodash';
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
 
 import { Checkbox, DappCard, Page, SectionList } from '@parity/ui';
 
@@ -81,10 +82,10 @@ class Dapps extends Component {
           />
         }
       >
-        <div>{ this.renderList(this.store.visibleViews) }</div>
-        <div>{ this.renderList(this.store.visibleLocal) }</div>
-        <div>{ this.renderList(this.store.visibleBuiltin) }</div>
-        <div>{ this.renderList(this.store.visibleNetwork, externalOverlay) }</div>
+        { this.renderList(this.store.visibleViews) }
+        { this.renderList(this.store.visibleLocal) }
+        { this.renderList(this.store.visibleBuiltin) }
+        { this.renderList(this.store.visibleNetwork, externalOverlay) }
       </Page>
     );
   }
@@ -93,6 +94,7 @@ class Dapps extends Component {
     return (
       <SectionList
         items={ items }
+        noStretch
         overlay={ overlay }
         renderItem={ this.renderApp }
       />

js/src/shell/FirstRun/TnC/tnc.js

@@ -14,7 +14,8 @@
 // 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, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import ReactMarkdown from 'react-markdown';
 

js/src/shell/FirstRun/firstRun.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';

js/src/shell/ParityBar/parityBar.js

@@ -16,7 +16,8 @@
 
 import { throttle } from 'lodash';
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
 import { FormattedMessage } from 'react-intl';
 import { Link } from 'react-router';

js/src/shell/Requests/requests.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import ReactDOM from 'react-dom';
 import { connect } from 'react-redux';

js/src/shell/Signer/Embedded/embedded.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import BigNumber from 'bignumber.js';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';

js/src/shell/Signer/components/Account/AccountLink/accountLink.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { Link } from 'react-router';
 

js/src/shell/Signer/components/Account/account.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { IdentityIcon, IdentityName } from '@parity/ui';
 

js/src/shell/Signer/components/DecryptRequest/decryptRequest.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
 

js/src/shell/Signer/components/RequestOrigin/requestOrigin.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 import IdentityIcon from '@parity/ui/IdentityIcon';

js/src/shell/Signer/components/RequestPending/requestPending.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import DecryptRequest from '../DecryptRequest';
 import SignRequest from '../SignRequest';

js/src/shell/Signer/components/SignRequest/signRequest.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
 

js/src/shell/Signer/components/TransactionMainDetails/transactionMainDetails.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import ReactTooltip from 'react-tooltip';
 

js/src/shell/Signer/components/TransactionPending/transactionPending.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
 

js/src/shell/Signer/components/TransactionPendingForm/transactionPendingForm.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 import { PrevIcon } from '@parity/ui/Icons';

js/src/shell/Signer/components/TransactionPendingFormConfirm/transactionPendingFormConfirm.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import keycode from 'keycode';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
 import { FormattedMessage } from 'react-intl';
 import ReactTooltip from 'react-tooltip';

js/src/shell/Signer/components/TransactionPendingFormReject/transactionPendingFormReject.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 import { Button } from '@parity/ui';

js/src/shell/Signer/components/TxHashLink/txHashLink.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 import { txLink } from '~/3rdparty/etherscan/links';
 

js/src/shell/Snackbar/snackbar.js

@@ -14,7 +14,8 @@
 // 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, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 

js/src/shell/Status/Consensus/consensus.js

@@ -14,7 +14,8 @@
 // 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, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 export default function Consensus ({ upgradeStore }) {

js/src/shell/Status/Upgrade/upgrade.js

@@ -14,7 +14,8 @@
 // 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, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 export default function Upgrade ({ upgradeStore }) {

js/src/shell/Status/status.js

@@ -14,7 +14,8 @@
 // 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, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 
 import { BlockStatus } from '@parity/ui';

js/src/shell/SyncWarning/syncWarning.js

@@ -14,7 +14,8 @@
 // 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 React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
 import store from 'store';

js/src/shell/UpgradeParity/upgradeParity.js

@@ -15,7 +15,8 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import { observer } from 'mobx-react';
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 import { Button, Portal } from '@parity/ui';

js/src/shell/index.js

@@ -46,6 +46,8 @@ import Dapps from './Dapps';
 
 injectTapEventPlugin();
 
+console.log('UI version', process.env.UI_VERSION);
+
 if (process.env.NODE_ENV === 'development') {
   // Expose the React Performance Tools on the`window` object
   const Perf = require('react-addons-perf');