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/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/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/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
? (
-
)
: (
-