Toggle upgrade modal via upgrade link

This commit is contained in:
Jaco Greeff 2016-12-14 15:56:01 +01:00
parent 2588aea6b2
commit 7330612bfb
6 changed files with 199 additions and 96 deletions

View File

@ -14,7 +14,7 @@
// You should have received a copy of the GNU General Public License // You should have received a copy of the GNU General Public License
// along with Parity. If not, see <http://www.gnu.org/licenses/>. // along with Parity. If not, see <http://www.gnu.org/licenses/>.
import { action, observable, transaction } from 'mobx'; import { action, computed, observable, transaction } from 'mobx';
import store from 'store'; import store from 'store';
const LS_UPDATE = '_parity::update'; const LS_UPDATE = '_parity::update';
@ -22,10 +22,10 @@ const LS_UPDATE = '_parity::update';
const A_MINUTE = 60 * 1000; const A_MINUTE = 60 * 1000;
const A_DAY = 24 * 60 * A_MINUTE; const A_DAY = 24 * 60 * A_MINUTE;
const STEP_INFO = 1; const STEP_INFO = 0;
const STEP_UPDATING = 2; const STEP_UPDATING = 1;
const STEP_COMPLETED = 3; const STEP_COMPLETED = 2;
const STEP_ERROR = 4; const STEP_ERROR = 3;
const CHECK_INTERVAL = 1 * A_MINUTE; const CHECK_INTERVAL = 1 * A_MINUTE;
@ -34,6 +34,7 @@ export default class Store {
@observable consensusCapability = null; @observable consensusCapability = null;
@observable closed = true; @observable closed = true;
@observable error = null; @observable error = null;
@observable remindAt = 0;
@observable step = 0; @observable step = 0;
@observable upgrading = null; @observable upgrading = null;
@observable version = null; @observable version = null;
@ -47,37 +48,17 @@ export default class Store {
setInterval(this.checkUpgrade, CHECK_INTERVAL); setInterval(this.checkUpgrade, CHECK_INTERVAL);
} }
@action setUpgrading () { @computed get isVisible () {
transaction(() => { return !this.closed && Date.now() >= this.remindAt;
this.upgrading = this.available;
this.setStep(STEP_UPDATING);
});
} }
@action setVersions (available, version, consensusCapability) { @action closeModal = () => {
transaction(() => { transaction(() => {
this.available = available; this.closed = true;
this.consensusCapability = consensusCapability; this.setStep(0, null);
this.version = version;
}); });
} }
checkUpgrade = () => {
Promise
.all([
this._api.parity.upgradeReady(),
this._api.parity.consensusCapability(),
this._api.parity.versionInfo()
])
.then(([available, consensusCapability, version]) => {
console.log('[checkUpgrade]', 'available:', available, 'version:', version, 'consensusCapability:', consensusCapability);
this.setVersions(available, version, consensusCapability);
})
.catch((error) => {
console.warn('checkUpgrade', error);
});
}
@action loadStorage = () => { @action loadStorage = () => {
const values = store.get(LS_UPDATE) || {}; const values = store.get(LS_UPDATE) || {};
@ -93,7 +74,22 @@ export default class Store {
@action setStep = (step, error = null) => { @action setStep = (step, error = null) => {
transaction(() => { transaction(() => {
this.error = error; this.error = error;
this.setp = step; this.step = step;
});
}
@action setUpgrading () {
transaction(() => {
this.upgrading = this.available;
this.setStep(STEP_UPDATING, null);
});
}
@action setVersions (available, version, consensusCapability) {
transaction(() => {
this.available = available;
this.consensusCapability = consensusCapability;
this.version = version;
}); });
} }
@ -112,7 +108,7 @@ export default class Store {
throw new Error('Unable to complete update'); throw new Error('Unable to complete update');
} }
this.setStep(STEP_COMPLETED); this.setStep(STEP_COMPLETED, null);
}) })
.catch((error) => { .catch((error) => {
console.error('upgradeNow', error); console.error('upgradeNow', error);
@ -120,6 +116,26 @@ export default class Store {
this.setStep(STEP_ERROR, error); this.setStep(STEP_ERROR, error);
}); });
} }
checkUpgrade = () => {
if (!this._api) {
return;
}
Promise
.all([
this._api.parity.upgradeReady(),
this._api.parity.consensusCapability(),
this._api.parity.versionInfo()
])
.then(([available, consensusCapability, version]) => {
console.log('[checkUpgrade]', 'available:', available, 'version:', version, 'consensusCapability:', consensusCapability);
this.setVersions(available, version, consensusCapability);
})
.catch((error) => {
console.warn('checkUpgrade', error);
});
}
} }
export { export {

View File

@ -0,0 +1,58 @@
// 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 <http://www.gnu.org/licenses/>.
import Store from './store';
let store;
describe('modals/UpgradeParity/store', () => {
describe('@actions', () => {
beforeEach(() => {
store = new Store();
});
describe('openModal & closeModal', () => {
it('toggles between the closed states', () => {
expect(store.closed).to.be.true;
store.openModal();
expect(store.closed).to.be.false;
store.closeModal();
expect(store.closed).to.be.true;
});
it('resets the step state upon closing', () => {
store.setStep(5, 'soem error');
store.closeModal();
expect(store.step).to.equal(0);
expect(store.error).to.be.null;
});
});
describe('setStep', () => {
it('sets the step as provided', () => {
expect(store.step).to.equal(0);
store.setStep(3);
expect(store.step).to.equal(3);
});
it('sets the error when provided', () => {
expect(store.error).to.be.null;
store.setStep(3, new Error('some error'));
expect(store.error).to.match(/some error/);
});
});
});
});

View File

@ -16,11 +16,17 @@
*/ */
.error { .error {
padding-top: 1.5em; padding-top: 1.25em;
} }
.infoStep { .infoStep {
div+div { div+div {
padding-top: 1.5em; padding-top: 1.25em;
} }
} }
.version {
display: inline;
opacity: 0.5;
white-space: normal;
}

View File

@ -19,7 +19,7 @@ import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import { Button } from '~/ui'; import { Button } from '~/ui';
import { CancelIcon, DoneIcon, NextIcon, SnoozeIcon } from '~/ui/Icons'; import { CancelIcon, DoneIcon, NextIcon } from '~/ui/Icons';
import Modal, { Busy, Completed } from '~/ui/Modal'; import Modal, { Busy, Completed } from '~/ui/Modal';
import { STEP_COMPLETED, STEP_ERROR, STEP_INFO, STEP_UPDATING } from './store'; import { STEP_COMPLETED, STEP_ERROR, STEP_INFO, STEP_UPDATING } from './store';
@ -38,7 +38,7 @@ export default class UpgradeParity extends Component {
render () { render () {
const { store } = this.props; const { store } = this.props;
if (!store.showUpgrade) { if (!store.isVisible) {
return null; return null;
} }
@ -55,11 +55,11 @@ export default class UpgradeParity extends Component {
defaultMessage='upgrading parity' />, defaultMessage='upgrading parity' />,
store.step === STEP_ERROR store.step === STEP_ERROR
? <FormattedMessage ? <FormattedMessage
id='upgradeParity.step.completed'
defaultMessage='upgrade completed' />
: <FormattedMessage
id='upgradeParity.step.error' id='upgradeParity.step.error'
defaultMessage='error' /> defaultMessage='error' />
: <FormattedMessage
id='upgradeParity.step.completed'
defaultMessage='upgrade completed' />
] } ] }
visible> visible>
{ this.renderStep() } { this.renderStep() }
@ -73,6 +73,7 @@ export default class UpgradeParity extends Component {
const closeButton = const closeButton =
<Button <Button
icon={ <CancelIcon /> } icon={ <CancelIcon /> }
key='close'
label={ label={
<FormattedMessage <FormattedMessage
id='upgradeParity.button.close' id='upgradeParity.button.close'
@ -82,6 +83,7 @@ export default class UpgradeParity extends Component {
const doneButton = const doneButton =
<Button <Button
icon={ <DoneIcon /> } icon={ <DoneIcon /> }
key='done'
label={ label={
<FormattedMessage <FormattedMessage
id='upgradeParity.button.done' id='upgradeParity.button.done'
@ -92,16 +94,9 @@ export default class UpgradeParity extends Component {
switch (store.step) { switch (store.step) {
case STEP_INFO: case STEP_INFO:
return [ return [
<Button
icon={ <SnoozeIcon /> }
label={
<FormattedMessage
id='upgradeParity.button.snooze'
defaultMessage='ask me tomorrow' />
}
onClick={ store.snoozeTillTomorrow } />,
<Button <Button
icon={ <NextIcon /> } icon={ <NextIcon /> }
key='upgrade'
label={ label={
<FormattedMessage <FormattedMessage
id='upgradeParity.button.upgrade' id='upgradeParity.button.upgrade'
@ -127,46 +122,13 @@ export default class UpgradeParity extends Component {
renderStep () { renderStep () {
const { store } = this.props; const { store } = this.props;
const currentversion = this.renderVersion(store.version); const currentversion = this.formatVersion(store);
const newversion = store.upgrading const newversion = store.upgrading
? this.renderVersion(store.upgrading.version) ? this.formatVersion(store.upgrading)
: this.renderVersion(store.available.version); : this.formatVersion(store.available);
switch (store.step) { switch (store.step) {
case STEP_INFO: case STEP_INFO:
let consensusInfo = null;
if (store.consensusCapability === 'capable') {
consensusInfo = (
<div>
<FormattedMessage
id='upgradeParity.consensus.capable'
defaultMessage='Your current Parity version is capable of handling the nework requirements.' />
</div>
);
} else if (store.consensusCapability.capableUntil) {
consensusInfo = (
<div>
<FormattedMessage
id='upgradeParity.consensus.capableUntil'
defaultMessage='Your current Parity version is capable of handling the nework requirements until block {blockNumber}'
values={ {
blockNumber: store.consensusCapability.capableUntil
} } />
</div>
);
} else if (store.consensusCapability.incapableSince) {
consensusInfo = (
<div>
<FormattedMessage
id='upgradeParity.consensus.incapableSince'
defaultMessage='Your current Parity version is incapable of handling the nework requirements since block {blockNumber}'
values={ {
blockNumber: store.consensusCapability.incapableSince
} } />
</div>
);
}
return ( return (
<div className={ styles.infoStep }> <div className={ styles.infoStep }>
<div> <div>
@ -174,11 +136,11 @@ export default class UpgradeParity extends Component {
id='upgradeParity.info.upgrade' id='upgradeParity.info.upgrade'
defaultMessage='A new version of Parity, version {newversion} is available as an upgrade from your current version {currentversion}' defaultMessage='A new version of Parity, version {newversion} is available as an upgrade from your current version {currentversion}'
values={ { values={ {
currentversion, currentversion: <div className={ styles.version }>{ currentversion }</div>,
newversion newversion: <div className={ styles.version }>{ newversion }</div>
} } /> } } />
</div> </div>
{ consensusInfo } { this.renderConsensusInfo() }
</div> </div>
); );
@ -190,7 +152,7 @@ export default class UpgradeParity extends Component {
id='upgradeParity.busy' id='upgradeParity.busy'
defaultMessage='Your upgrade to Parity {newversion} is currently in progress' defaultMessage='Your upgrade to Parity {newversion} is currently in progress'
values={ { values={ {
newversion newversion: <div className={ styles.version }>{ newversion }</div>
} } /> } } />
} /> } />
); );
@ -202,7 +164,7 @@ export default class UpgradeParity extends Component {
id='upgradeParity.completed' id='upgradeParity.completed'
defaultMessage='Your upgrade to Parity {newversion} has been successfully completed.' defaultMessage='Your upgrade to Parity {newversion} has been successfully completed.'
values={ { values={ {
newversion newversion: <div className={ styles.version }>{ newversion }</div>
} } /> } } />
</Completed> </Completed>
); );
@ -215,7 +177,7 @@ export default class UpgradeParity extends Component {
id='upgradeParity.failed' id='upgradeParity.failed'
defaultMessage='Your upgrade to Parity {newversion} has failed with an error.' defaultMessage='Your upgrade to Parity {newversion} has failed with an error.'
values={ { values={ {
newversion newversion: <div className={ styles.version }>{ newversion }</div>
} } /> } } />
</div> </div>
<div className={ styles.error }> <div className={ styles.error }>
@ -226,8 +188,63 @@ export default class UpgradeParity extends Component {
} }
} }
renderVersion (versionInfo) { renderConsensusInfo () {
const { track, version } = versionInfo; const { store } = this.props;
const { consensusCapability } = store;
if (consensusCapability) {
if (consensusCapability === 'capable') {
return (
<div>
<FormattedMessage
id='upgradeParity.consensus.capable'
defaultMessage='Your current Parity version is capable of handling the network requirements.' />
</div>
);
} else if (consensusCapability.capableUntil) {
return (
<div>
<FormattedMessage
id='upgradeParity.consensus.capableUntil'
defaultMessage='Your current Parity version is capable of handling the network requirements until block {blockNumber}'
values={ {
blockNumber: consensusCapability.capableUntil
} } />
</div>
);
} else if (consensusCapability.incapableSince) {
return (
<div>
<FormattedMessage
id='upgradeParity.consensus.incapableSince'
defaultMessage='Your current Parity version is incapable of handling the network requirements since block {blockNumber}'
values={ {
blockNumber: consensusCapability.incapableSince
} } />
</div>
);
}
}
return (
<div>
<FormattedMessage
id='upgradeParity.consensus.unknown'
defaultMessage='Your current Parity version is capable of handling the network requirements.' />
</div>
);
}
formatVersion (struct) {
if (!struct || !struct.version) {
return (
<FormattedMessage
id='upgradeParity.version.unknown'
defaultMessage='unknown' />
);
}
const { track, version } = struct.version;
return `${version.major}.${version.minor}.${version.patch}-${track}`; return `${version.major}.${version.minor}.${version.patch}-${track}`;
} }

View File

@ -36,7 +36,13 @@ export default class Title extends Component {
return ( return (
<div className={ styles.title }> <div className={ styles.title }>
<h3>{ steps ? steps[current] : title }</h3> <h3>
{
steps
? steps[current]
: title
}
</h3>
{ this.renderSteps() } { this.renderSteps() }
{ this.renderWaiting() } { this.renderWaiting() }
</div> </div>
@ -63,10 +69,10 @@ export default class Title extends Component {
renderTimeline () { renderTimeline () {
const { steps } = this.props; const { steps } = this.props;
return steps.map((label) => { return steps.map((label, index) => {
return ( return (
<Step <Step
key={ label }> key={ index }>
<StepLabel> <StepLabel>
{ label } { label }
</StepLabel> </StepLabel>

View File

@ -14,10 +14,10 @@
// You should have received a copy of the GNU General Public License // You should have received a copy of the GNU General Public License
// along with Parity. If not, see <http://www.gnu.org/licenses/>. // along with Parity. If not, see <http://www.gnu.org/licenses/>.
import { Dialog } from 'material-ui';
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { bindActionCreators } from 'redux'; import { bindActionCreators } from 'redux';
import { Dialog } from 'material-ui';
import { nodeOrStringProptype } from '~/util/proptypes'; import { nodeOrStringProptype } from '~/util/proptypes';
@ -51,7 +51,7 @@ class Modal extends Component {
render () { render () {
const { muiTheme } = this.context; const { muiTheme } = this.context;
const { actions, busy, className, current, children, compact, steps, waiting, title, visible, settings } = this.props; const { actions, busy, children, className, current, compact, settings, steps, title, visible, waiting } = this.props;
const contentStyle = muiTheme.parity.getBackgroundStyle(null, settings.backgroundSeed); const contentStyle = muiTheme.parity.getBackgroundStyle(null, settings.backgroundSeed);
const header = ( const header = (
<Title <Title