From f15671c74b7948a2c27dfddf895339f3f42a135e Mon Sep 17 00:00:00 2001 From: Jaco Greeff Date: Mon, 12 Dec 2016 22:45:09 +0100 Subject: [PATCH] UI interface completed, to be tested --- js/src/modals/UpgradeParity/Info/index.js | 0 js/src/modals/UpgradeParity/Info/info.js | 31 ----- js/src/modals/UpgradeParity/Updating/index.js | 17 --- .../modals/UpgradeParity/Updating/updating.js | 31 ----- js/src/modals/UpgradeParity/upgradeParity.css | 26 ++++ js/src/modals/UpgradeParity/upgradeParity.js | 125 +++++++++++++++++- js/src/modals/UpgradeParity/upgradeStore.js | 22 ++- js/src/ui/Modal/Busy/busy.js | 10 +- js/src/ui/Modal/modal.css | 37 +++--- 9 files changed, 186 insertions(+), 113 deletions(-) delete mode 100644 js/src/modals/UpgradeParity/Info/index.js delete mode 100644 js/src/modals/UpgradeParity/Info/info.js delete mode 100644 js/src/modals/UpgradeParity/Updating/index.js delete mode 100644 js/src/modals/UpgradeParity/Updating/updating.js create mode 100644 js/src/modals/UpgradeParity/upgradeParity.css diff --git a/js/src/modals/UpgradeParity/Info/index.js b/js/src/modals/UpgradeParity/Info/index.js deleted file mode 100644 index e69de29bb..000000000 diff --git a/js/src/modals/UpgradeParity/Info/info.js b/js/src/modals/UpgradeParity/Info/info.js deleted file mode 100644 index 539559710..000000000 --- a/js/src/modals/UpgradeParity/Info/info.js +++ /dev/null @@ -1,31 +0,0 @@ -// Copyright 2015, 2016 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 { observer } from 'mobx-react'; -import React, { Component, PropTypes } from 'react'; - -@observer -export default class Info extends Component { - static propTypes = { - store: PropTypes.object.isRequired - } - - render () { - return ( -
info
- ); - } -} diff --git a/js/src/modals/UpgradeParity/Updating/index.js b/js/src/modals/UpgradeParity/Updating/index.js deleted file mode 100644 index 59e363f11..000000000 --- a/js/src/modals/UpgradeParity/Updating/index.js +++ /dev/null @@ -1,17 +0,0 @@ -// Copyright 2015, 2016 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 './updating'; diff --git a/js/src/modals/UpgradeParity/Updating/updating.js b/js/src/modals/UpgradeParity/Updating/updating.js deleted file mode 100644 index f1bbc722a..000000000 --- a/js/src/modals/UpgradeParity/Updating/updating.js +++ /dev/null @@ -1,31 +0,0 @@ -// Copyright 2015, 2016 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 { observer } from 'mobx-react'; -import React, { Component, PropTypes } from 'react'; - -@observer -export default class Updating extends Component { - static propTypes = { - store: PropTypes.object.isRequired - } - - render () { - return ( -
hello
- ); - } -} diff --git a/js/src/modals/UpgradeParity/upgradeParity.css b/js/src/modals/UpgradeParity/upgradeParity.css new file mode 100644 index 000000000..962bbc58c --- /dev/null +++ b/js/src/modals/UpgradeParity/upgradeParity.css @@ -0,0 +1,26 @@ +/* Copyright 2015, 2016 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 . +*/ + +.error { + padding-top: 1.5em; +} + +.infoStep { + div+div { + padding-top: 1.5em; + } +} diff --git a/js/src/modals/UpgradeParity/upgradeParity.js b/js/src/modals/UpgradeParity/upgradeParity.js index 4c4d9f1ef..c1ba9d395 100644 --- a/js/src/modals/UpgradeParity/upgradeParity.js +++ b/js/src/modals/UpgradeParity/upgradeParity.js @@ -18,14 +18,13 @@ import { observer } from 'mobx-react'; import React, { Component, PropTypes } from 'react'; import { FormattedMessage } from 'react-intl'; -import { Button, Modal } from '~/ui'; +import { Button } from '~/ui'; import { CancelIcon, DoneIcon, NextIcon, SnoozeIcon } from '~/ui/Icons'; - -import Info from './Info'; -import Updating from './Updating'; +import Modal, { Busy, Completed } from '~/ui/Modal'; import ModalStore, { STEP_COMPLETED, STEP_ERROR, STEP_INFO, STEP_UPDATING } from './modalStore'; import UpgradeStore from './upgradeStore'; +import styles from './upgradeParity.css'; @observer export default class UpgradeParity extends Component { @@ -43,6 +42,22 @@ export default class UpgradeParity extends Component { return ( , + , + this.store.step === STEP_ERROR + ? + : + ] } visible> { this.renderStep() } @@ -105,12 +120,110 @@ export default class UpgradeParity extends Component { } renderStep () { + const { available, consensusCapability, error, upgrading, version } = this.store.upgrade; + + const currentversion = this.renderVersion(version); + const newversion = upgrading + ? this.renderVersion(upgrading.version) + : this.renderVersion(available.version); + switch (this.store.step) { case STEP_INFO: - return ; + let consensusInfo = null; + if (consensusCapability === 'capable') { + consensusInfo = ( +
+ +
+ ); + } else if (consensusCapability.capableUntil) { + consensusInfo = ( +
+ +
+ ); + } else if (consensusCapability.incapableSince) { + consensusInfo = ( +
+ +
+ ); + } + + return ( +
+
+ +
+ { consensusInfo } +
+ ); case STEP_UPDATING: - return ; + return ( + + } /> + ); + + case STEP_COMPLETED: + return ( + + + + ); + + case STEP_ERROR: + return ( + +
+ +
+
+ { error.message } +
+ + ); } } + + renderVersion (versionInfo) { + const { track, version } = versionInfo; + + return `${version.major}.${version.minor}.${version.patch}-${track}`; + } } diff --git a/js/src/modals/UpgradeParity/upgradeStore.js b/js/src/modals/UpgradeParity/upgradeStore.js index ea3dabbe2..8ac2f24b0 100644 --- a/js/src/modals/UpgradeParity/upgradeStore.js +++ b/js/src/modals/UpgradeParity/upgradeStore.js @@ -21,6 +21,8 @@ const CHECK_INTERVAL = 1 * 60 * 1000; export default class UpgradeStore { @observable available = null; @observable consensusCapability = null; + @observable upgrading = null; + @observable version = null; constructor (api) { this._api = api; @@ -29,22 +31,28 @@ export default class UpgradeStore { setInterval(this.checkUpgrade, CHECK_INTERVAL); } - @action setAvailableUpgrade (available, consensusCapability) { + @action setUpgrading () { + this.upgrading = this.available; + } + + @action setVersions (available, version, consensusCapability) { transaction(() => { this.available = available; this.consensusCapability = consensusCapability; + this.version = version; }); } checkUpgrade = () => { - return Promise + Promise .all([ this._api.parity.upgradeReady(), - this._api.parity.consensusCapability() + this._api.parity.consensusCapability(), + this._api.parity.versionInfo() ]) - .then(([available, consensusCapability]) => { - console.log('[checkUpgrade]', 'available:', available, 'consensusCapability:', consensusCapability); - this.setAvailableUpgrade(available, consensusCapability); + .then(([available, consensusCapability, version]) => { + console.log('[checkUpgrade]', 'available:', available, 'version:', version, 'consensusCapability:', consensusCapability); + this.setVersions(available, version, consensusCapability); }) .catch((error) => { console.warn('checkUpgrade', error); @@ -52,6 +60,8 @@ export default class UpgradeStore { } executeUpgrade = () => { + this.setUpgrading(); + return this._api.parity.executeUpgrade(); } } diff --git a/js/src/ui/Modal/Busy/busy.js b/js/src/ui/Modal/Busy/busy.js index 5bbf8b010..62f879a96 100644 --- a/js/src/ui/Modal/Busy/busy.js +++ b/js/src/ui/Modal/Busy/busy.js @@ -16,17 +16,19 @@ import React, { Component, PropTypes } from 'react'; +import { nodeOrStringProptype } from '~/util/proptypes'; + import styles from './busy.css'; export default class Busy extends Component { static propTypes = { - title: PropTypes.string, - state: PropTypes.string, - children: PropTypes.node + children: PropTypes.node, + state: nodeOrStringProptype(), + title: nodeOrStringProptype() } render () { - const { children, title, state } = this.props; + const { children, state, title } = this.props; return (
diff --git a/js/src/ui/Modal/modal.css b/js/src/ui/Modal/modal.css index b50e8cb9a..723ddda69 100644 --- a/js/src/ui/Modal/modal.css +++ b/js/src/ui/Modal/modal.css @@ -14,16 +14,17 @@ /* You should have received a copy of the GNU General Public License /* along with Parity. If not, see . */ + .actions { background: rgba(0, 0, 0, 0.25) !important; -} -.actions button:not([disabled]) { - color: white !important; -} + button:not([disabled]) { + color: white !important; -.actions button:not([disabled]) svg { - fill: white !important; + svg { + fill: white !important; + } + } } .body { @@ -36,26 +37,26 @@ .content { transform: translate(0px, 0px) !important; transition: none !important; -} -.content>div { - background: rgba(0, 0, 0, 0.5) !important; - transition: none !important; + &>div { + background: rgba(0, 0, 0, 0.5) !important; + transition: none !important; + } } .title { + background: rgba(0, 0, 0, 0.25) !important; padding: 1em; margin-bottom: 0; - background: rgba(0, 0, 0, 0.25) !important; -} -.title h3 { - margin: 0; - text-transform: uppercase; -} + h3 { + margin: 0; + text-transform: uppercase; + } -.title .steps { - margin-bottom: -1em; + .steps { + margin-bottom: -1em; + } } .waiting {