diff --git a/js/src/shell/Application/Requests/requests.js b/js/src/shell/Application/Requests/requests.js
index 1054cc4e2..3e06bc8fb 100644
--- a/js/src/shell/Application/Requests/requests.js
+++ b/js/src/shell/Application/Requests/requests.js
@@ -14,7 +14,6 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see .
-import { LinearProgress } from 'material-ui';
import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import ReactDOM from 'react-dom';
@@ -22,7 +21,7 @@ import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { hideRequest } from '~/redux/providers/requestsActions';
-import { MethodDecoding, IdentityIcon, ScrollableText, ShortenedHash } from '~/ui';
+import { MethodDecoding, IdentityIcon, Progress, ScrollableText, ShortenedHash } from '~/ui';
import styles from './requests.css';
@@ -100,7 +99,7 @@ class Requests extends Component {
state.type === ERROR_STATE
? null
: (
-
-
diff --git a/js/src/ui/Form/PasswordStrength/passwordStrength.spec.js b/js/src/ui/Form/PasswordStrength/passwordStrength.spec.js
index c777d1f29..43f508fee 100644
--- a/js/src/ui/Form/PasswordStrength/passwordStrength.spec.js
+++ b/js/src/ui/Form/PasswordStrength/passwordStrength.spec.js
@@ -36,25 +36,25 @@ describe('ui/Form/PasswordStrength', () => {
});
it('renders a linear progress', () => {
- expect(render({ input: INPUT_A }).find('LinearProgress')).to.be.ok;
+ expect(render({ input: INPUT_A }).find('Progress')).to.be.ok;
});
describe('compute strength', () => {
it('has low score with empty input', () => {
expect(
- render({ input: INPUT_NULL }).find('LinearProgress').props().value
+ render({ input: INPUT_NULL }).find('Progress').props().value
).to.equal(20);
});
it('has medium score', () => {
expect(
- render({ input: INPUT_A }).find('LinearProgress').props().value
+ render({ input: INPUT_A }).find('Progress').props().value
).to.equal(60);
});
it('has high score', () => {
expect(
- render({ input: INPUT_B }).find('LinearProgress').props().value
+ render({ input: INPUT_B }).find('Progress').props().value
).to.equal(100);
});
});
diff --git a/js/src/ui/Form/TypedInput/typedInput.js b/js/src/ui/Form/TypedInput/typedInput.js
index a3d7e3b7f..c3a31fe07 100644
--- a/js/src/ui/Form/TypedInput/typedInput.js
+++ b/js/src/ui/Form/TypedInput/typedInput.js
@@ -20,8 +20,6 @@ import { range } from 'lodash';
import BigNumber from 'bignumber.js';
import IconButton from 'material-ui/IconButton';
-import AddIcon from 'material-ui/svg-icons/content/add';
-import RemoveIcon from 'material-ui/svg-icons/content/remove';
import { fromWei, toWei } from '@parity/api/util/wei';
import { bytesToHex } from '@parity/api/util/format';
@@ -29,6 +27,7 @@ import { bytesToHex } from '@parity/api/util/format';
import Input from '~/ui/Form/Input';
import InputAddressSelect from '~/ui/Form/InputAddressSelect';
import Select from '~/ui/Form/Select';
+import { AddIcon, RemoveIcon } from '~/ui/Icons';
import { ABI_TYPES, parseAbiType } from '~/util/abi';
import { nodeOrStringProptype } from '~/util/proptypes';
diff --git a/js/src/ui/Icons/index.js b/js/src/ui/Icons/index.js
index 6478ed019..927385630 100644
--- a/js/src/ui/Icons/index.js
+++ b/js/src/ui/Icons/index.js
@@ -56,6 +56,7 @@ export PlayIcon from 'material-ui/svg-icons/av/play-arrow';
export PrevIcon from 'material-ui/svg-icons/navigation/arrow-back';
export PrintIcon from 'material-ui/svg-icons/action/print';
export RefreshIcon from 'material-ui/svg-icons/action/autorenew';
+export RemoveIcon from 'material-ui/svg-icons/content/remove';
export ReorderIcon from 'material-ui/svg-icons/action/reorder';
export ReplayIcon from 'material-ui/svg-icons/av/replay';
export SaveIcon from 'material-ui/svg-icons/content/save';
@@ -63,6 +64,7 @@ export SearchIcon from 'material-ui/svg-icons/action/search';
export SendIcon from 'material-ui/svg-icons/content/send';
export SettingsIcon from 'material-ui/svg-icons/action/settings';
export SnoozeIcon from 'material-ui/svg-icons/av/snooze';
+export SortIcon from 'material-ui/svg-icons/content/sort';
export StarCircleIcon from 'material-ui/svg-icons/action/stars';
export StarIcon from 'material-ui/svg-icons/toggle/star';
export StarOutlineIcon from 'material-ui/svg-icons/toggle/star-border';
diff --git a/js/src/ui/Loading/loading.js b/js/src/ui/Loading/loading.js
index 107d32dba..47c01efc0 100644
--- a/js/src/ui/Loading/loading.js
+++ b/js/src/ui/Loading/loading.js
@@ -14,30 +14,30 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see .
-import React, { Component, PropTypes } from 'react';
+import React, { PropTypes } from 'react';
import CircularProgress from 'material-ui/CircularProgress';
import styles from './loading.css';
-export default class Loading extends Component {
- static propTypes = {
- className: PropTypes.string,
- size: PropTypes.number
- };
-
- static defaultProps = {
- className: '',
- size: 2
- };
-
- render () {
- const { className, size } = this.props;
- const computedSize = size * 60;
-
- return (
-
-
-
- );
- }
+export default function Loading ({ className, size, thickness }) {
+ return (
+
+
+
+ );
}
+
+Loading.propTypes = {
+ className: PropTypes.string,
+ size: PropTypes.number,
+ thickness: PropTypes.number
+};
+
+Loading.defaultProps = {
+ className: '',
+ size: 2,
+ thickness: 3.5
+};
diff --git a/js/src/ui/MethodDecoding/methodDecoding.js b/js/src/ui/MethodDecoding/methodDecoding.js
index d143cd267..3da09fdc2 100644
--- a/js/src/ui/MethodDecoding/methodDecoding.js
+++ b/js/src/ui/MethodDecoding/methodDecoding.js
@@ -14,13 +14,13 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see .
-import { CircularProgress } from 'material-ui';
import moment from 'moment';
import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import { connect } from 'react-redux';
import { TypedInput, InputAddress } from '../Form';
+import Loading from '../Loading';
import MethodDecodingStore from './methodDecodingStore';
import styles from './methodDecoding.css';
@@ -99,7 +99,7 @@ class MethodDecoding extends Component {
if (isLoading) {
return (
-
+
);
}
diff --git a/js/src/ui/Progress/index.js b/js/src/ui/Progress/index.js
new file mode 100644
index 000000000..8d074c690
--- /dev/null
+++ b/js/src/ui/Progress/index.js
@@ -0,0 +1,17 @@
+// Copyright 2015-2017 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 .
+
+export default from './progress';
diff --git a/js/src/ui/Progress/progress.js b/js/src/ui/Progress/progress.js
new file mode 100644
index 000000000..3768ff791
--- /dev/null
+++ b/js/src/ui/Progress/progress.js
@@ -0,0 +1,50 @@
+// Copyright 2015-2017 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 .
+
+import { LinearProgress } from 'material-ui';
+import React, { PropTypes } from 'react';
+
+export default function Progress ({ className, color, determinate, max, min, style, value }) {
+ return (
+
+ );
+}
+
+Progress.propTypes = {
+ className: PropTypes.string,
+ color: PropTypes.string,
+ determinate: PropTypes.bool,
+ max: PropTypes.number,
+ min: PropTypes.number,
+ style: PropTypes.object,
+ value: PropTypes.number
+};
+
+Progress.defaultProps = {
+ determinate: false
+};
diff --git a/js/src/ui/SignerIcon/signerIcon.js b/js/src/ui/SignerIcon/signerIcon.js
index 911703a57..c15c6578a 100644
--- a/js/src/ui/SignerIcon/signerIcon.js
+++ b/js/src/ui/SignerIcon/signerIcon.js
@@ -17,9 +17,9 @@
import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux';
import { keccak_256 } from 'js-sha3'; // eslint-disable-line camelcase
-import ActionFingerprint from 'material-ui/svg-icons/action/fingerprint';
import IdentityIcon from '../IdentityIcon';
+import { FingerprintIcon } from '../Icons';
class SignerIcon extends Component {
static propTypes = {
@@ -32,7 +32,7 @@ class SignerIcon extends Component {
if (!secureToken) {
return (
-
+
);
}
diff --git a/js/src/ui/Title/title.js b/js/src/ui/Title/title.js
index 82abdb3cf..306cbcbaa 100644
--- a/js/src/ui/Title/title.js
+++ b/js/src/ui/Title/title.js
@@ -14,7 +14,6 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see .
-import { LinearProgress } from 'material-ui';
import { Step, Stepper, StepLabel } from 'material-ui/Stepper';
import React, { Component, PropTypes } from 'react';
@@ -23,6 +22,7 @@ import React, { Component, PropTypes } from 'react';
// h3 (title) can be pulled from there. (As it stands the duplication
// between the 2 has been removed, but as a short-term DRY only)
import { Title as ContainerTitle } from '~/ui/Container';
+import Progress from '~/ui/Progress';
import { nodeOrStringProptype } from '~/util/proptypes';
import styles from './title.css';
@@ -113,7 +113,7 @@ export default class Title extends Component {
return (
);
}
diff --git a/js/src/ui/Title/title.spec.js b/js/src/ui/Title/title.spec.js
index 38a23d4cb..d193fde49 100644
--- a/js/src/ui/Title/title.spec.js
+++ b/js/src/ui/Title/title.spec.js
@@ -82,8 +82,8 @@ describe('ui/Title', () => {
waiting = shallow(instance.renderWaiting());
});
- it('renders the LinearProgress', () => {
- expect(waiting.find('LinearProgress').get(0)).to.be.ok;
+ it('renders the Progress', () => {
+ expect(waiting.find('Progress').get(0)).to.be.ok;
});
});
});
diff --git a/js/src/ui/TxHash/txHash.js b/js/src/ui/TxHash/txHash.js
index c53ece870..9ffa9166c 100644
--- a/js/src/ui/TxHash/txHash.js
+++ b/js/src/ui/TxHash/txHash.js
@@ -15,7 +15,6 @@
// along with Parity. If not, see .
import BigNumber from 'bignumber.js';
-import { LinearProgress } from 'material-ui';
import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import { connect } from 'react-redux';
@@ -24,7 +23,9 @@ import { txLink } from '~/3rdparty/etherscan/links';
import Warning from '~/ui/Warning';
import { DEFAULT_GAS } from '~/util/constants';
-import ShortenedHash from '../ShortenedHash';
+import Progress from '~/ui/Progress';
+import ShortenedHash from '~/ui/ShortenedHash';
+
import styles from './txHash.css';
class TxHash extends Component {
@@ -180,10 +181,9 @@ class TxHash extends Component {
if (!(transactionReceipt && transactionReceipt.blockNumber && transactionReceipt.blockNumber.gt(0))) {
return (
-
-
diff --git a/js/src/ui/TxHash/txHash.spec.js b/js/src/ui/TxHash/txHash.spec.js
index 8e44c7e57..a76a5192c 100644
--- a/js/src/ui/TxHash/txHash.spec.js
+++ b/js/src/ui/TxHash/txHash.spec.js
@@ -114,7 +114,7 @@ describe('ui/TxHash', () => {
});
it('renders indeterminate progressbar', () => {
- expect(child.find('LinearProgress[mode="indeterminate"]')).to.have.length(1);
+ expect(child.find('Progress')).to.have.length(1);
});
it('renders waiting text', () => {
@@ -132,7 +132,7 @@ describe('ui/TxHash', () => {
});
it('renders determinate progressbar', () => {
- expect(child.find('LinearProgress[mode="determinate"]')).to.have.length(1);
+ expect(child.find('Progress[determinate]')).to.have.length(1);
});
it('renders confirmation text', () => {
diff --git a/js/src/ui/index.js b/js/src/ui/index.js
index 7ea21ac15..65ffc4065 100644
--- a/js/src/ui/index.js
+++ b/js/src/ui/index.js
@@ -47,6 +47,7 @@ export ModalBox from './ModalBox';
export muiTheme from './Theme';
export Page from './Page';
export Portal from './Portal';
+export Progress from './Progress';
export QrCode from './QrCode';
export QrScan from './QrScan';
export ScrollableText from './ScrollableText';
diff --git a/js/src/views/Contract/Queries/inputQuery.js b/js/src/views/Contract/Queries/inputQuery.js
index 7a75727f6..a7efd93be 100644
--- a/js/src/views/Contract/Queries/inputQuery.js
+++ b/js/src/views/Contract/Queries/inputQuery.js
@@ -17,13 +17,12 @@
import { isEqual } from 'lodash';
import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
-import LinearProgress from 'material-ui/LinearProgress';
import { Card, CardActions, CardTitle, CardText } from 'material-ui/Card';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { newError } from '~/redux/actions';
-import { Button, TypedInput } from '~/ui';
+import { Button, Progress, TypedInput } from '~/ui';
import { arrayOrObjectProptype } from '~/util/proptypes';
import { parseAbiType } from '~/util/abi';
@@ -126,7 +125,7 @@ class InputQuery extends Component {
if (isLoading) {
return (
-
+
);
}
diff --git a/js/src/views/ContractDevelop/contractDevelop.js b/js/src/views/ContractDevelop/contractDevelop.js
index a1ac8210e..d681ff17d 100644
--- a/js/src/views/ContractDevelop/contractDevelop.js
+++ b/js/src/views/ContractDevelop/contractDevelop.js
@@ -19,11 +19,10 @@ import { FormattedMessage } from 'react-intl';
import { observer } from 'mobx-react';
import { MenuItem, Toggle } from 'material-ui';
import { connect } from 'react-redux';
-import CircularProgress from 'material-ui/CircularProgress';
import moment from 'moment';
import { throttle } from 'lodash';
-import { Actionbar, ActionbarExport, ActionbarImport, Button, Page, Select, Input } from '~/ui';
+import { Actionbar, ActionbarExport, ActionbarImport, Button, Input, Loading, Page, Select } from '~/ui';
import { CancelIcon, ListIcon, SaveIcon, SendIcon, SettingsIcon } from '~/ui/Icons';
import Editor from '~/ui/Editor';
import { DeployContract, SaveContract, LoadContract } from '~/modals';
@@ -292,8 +291,8 @@ class ContractDevelop extends Component {
if (selectedBuild < 0) {
return (
-
@@ -312,8 +311,8 @@ class ContractDevelop extends Component {
return (
-
@@ -495,8 +494,8 @@ class ContractDevelop extends Component {
if (compiling) {
return (
-
diff --git a/js/src/views/Wallet/Confirmations/confirmations.js b/js/src/views/Wallet/Confirmations/confirmations.js
index 4cbc224a6..01b4551d3 100644
--- a/js/src/views/Wallet/Confirmations/confirmations.js
+++ b/js/src/views/Wallet/Confirmations/confirmations.js
@@ -14,7 +14,7 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see .
-import { LinearProgress, MenuItem, IconMenu } from 'material-ui';
+import { MenuItem, IconMenu } from 'material-ui';
import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import ReactTooltip from 'react-tooltip';
@@ -24,7 +24,7 @@ import { bindActionCreators } from 'redux';
import { bytesToHex } from '@parity/api/util/format';
import { confirmOperation, revokeOperation } from '~/redux/providers/walletActions';
-import { Container, InputAddress, Button, IdentityIcon } from '~/ui';
+import { Button, Container, InputAddress, IdentityIcon, Progress } from '~/ui';
import TxRow from '~/ui/TxList/TxRow';
import styles from '../wallet.css';
@@ -319,16 +319,15 @@ class WalletConfirmation extends Component {
{
pending
? (
-
)
: (
-