diff --git a/src/browser/components/UpdaterPage.jsx b/src/browser/components/UpdaterPage.jsx index 3526b619..7fa356e9 100644 --- a/src/browser/components/UpdaterPage.jsx +++ b/src/browser/components/UpdaterPage.jsx @@ -1,6 +1,6 @@ const React = require('react'); const propTypes = require('prop-types'); -const {Button, Navbar} = require('react-bootstrap'); +const {Button, Navbar, ProgressBar} = require('react-bootstrap'); function InstallButton(props) { if (props.notifyOnly) { @@ -37,34 +37,49 @@ function UpdaterPage(props) { {' to learn more.'}

- - -
- - + -
-
+ : + + +
+ + +
+
+ } ); } UpdaterPage.propTypes = { notifyOnly: propTypes.bool.isRequired, + isDownloading: propTypes.bool.isRequired, + progress: propTypes.number, onClickInstall: propTypes.func.isRequired, onClickDownload: propTypes.func.isRequired, onClickReleaseNotes: propTypes.func.isRequired, diff --git a/src/browser/updater.jsx b/src/browser/updater.jsx index 7d6cc606..a6a1d74d 100644 --- a/src/browser/updater.jsx +++ b/src/browser/updater.jsx @@ -1,5 +1,6 @@ const React = require('react'); const ReactDOM = require('react-dom'); +const propTypes = require('prop-types'); const {ipcRenderer} = require('electron'); const url = require('url'); const UpdaterPage = require('./components/UpdaterPage.jsx'); @@ -7,24 +8,59 @@ const UpdaterPage = require('./components/UpdaterPage.jsx'); const thisURL = url.parse(location.href, true); const notifyOnly = thisURL.query.notifyOnly === 'true'; +class UpdaterPageContainer extends React.Component { + constructor(props) { + super(props); + this.state = props.initialState; + } + + componentDidMount() { + ipcRenderer.on('start-download', () => { + this.setState({ + isDownloading: true + }); + }); + ipcRenderer.on('progress', (event, progress) => { + this.setState({ + progress + }); + }); + } + + render() { + return ( + { + ipcRenderer.send('click-release-notes'); + }} + onClickSkip={() => { + ipcRenderer.send('click-skip'); + }} + onClickRemind={() => { + ipcRenderer.send('click-remind'); + }} + onClickInstall={() => { + ipcRenderer.send('click-install'); + }} + onClickDownload={() => { + ipcRenderer.send('click-download'); + }} + /> + ); + } +} + +UpdaterPageContainer.propTypes = { + notifyOnly: propTypes.bool, + initialState: propTypes.object +}; + ReactDOM.render( - { - ipcRenderer.send('click-release-notes'); - }} - onClickSkip={() => { - ipcRenderer.send('click-skip'); - }} - onClickRemind={() => { - ipcRenderer.send('click-remind'); - }} - onClickInstall={() => { - ipcRenderer.send('click-install'); - }} - onClickDownload={() => { - ipcRenderer.send('click-download'); - }} + initialState={{isDownloading: false, progress: 0}} />, document.getElementById('content') ); diff --git a/src/main/autoUpdater.js b/src/main/autoUpdater.js index 8c22f47c..63f57c54 100644 --- a/src/main/autoUpdater.js +++ b/src/main/autoUpdater.js @@ -102,8 +102,12 @@ function initialize(appState, mainWindow, notifyOnly = false) { }, INTERVAL_48_HOURS_IN_MS); updaterModal.close(); }).on('click-install', () => { + updaterModal.webContents.send('start-download'); + autoUpdater.signals.progress((data) => { // eslint-disable-line max-nested-callbacks + updaterModal.send('progress', Math.floor(data.percent)); + console.log('progress:', data); + }); downloadAndInstall(); - updaterModal.close(); }).on('click-download', () => { shell.openExternal('https://about.mattermost.com/download/#mattermostApps'); }).on('click-release-notes', () => {