States for auto updater check on settings page

v1.0.6 release

auto-updater.js

@@ -5,7 +5,9 @@ const { autoUpdater } = require('electron-updater')
 
 class Updater {
 
-  constructor (log) {
+  constructor (renderProcess, log) {
+
+    this.renderProcess = renderProcess
     autoUpdater.logger = log
     autoUpdater.logger.transports.file.level = 'info'
   }
@@ -24,40 +26,41 @@ class Updater {
 
       if (process.env.NODE_ENV !== 'development')
         autoUpdater.checkForUpdates()
+      else
+        setTimeout(() => this.renderProcess.send('updateNotAvailable'), 3000)
     })
 
     autoUpdater.on('checking-for-update', () => {
       console.log('Checking for updates...')
-      mb.window.webContents.send('updateChecking')
+      this.renderProcess.send('updateChecking')
     })
 
     autoUpdater.on('update-not-available', (ev, info) => {
 
       console.log('Update not available')
 
-      mb.window.webContents.send('updateNotAvailable')
+      this.renderProcess.send('updateNotAvailable')
     })
 
     autoUpdater.on('update-available', (updateInfo) => {
 
       console.log('Update available', updateInfo)
-      updateAvailable = updateInfo
-      mb.window.webContents.send('updateStatus', JSON.stringify(updateAvailable))
+      this.renderProcess.send('updateStatus', JSON.stringify(updateInfo))
     })
 
     autoUpdater.on('download-progress', (progress) => {
       console.log('Download progress', progress);
-      mb.window.webContents.send('updateDownloadProgress', JSON.stringify(progress))
+      this.renderProcess.send('updateDownloadProgress', JSON.stringify(progress))
     })
 
     autoUpdater.on('update-downloaded', (ev, info) => {
       console.log('Update downloaded')
-      mb.window.webContents.send('updateReady')
+      this.renderProcess.send('updateReady')
     })
 
     autoUpdater.on('error', (ev, err) => {
       console.log('Update error', err)
-      mb.window.webContents.send('updateError')
+      this.renderProcess.send('updateError')
     })
   }
 }

index.js

@@ -17,16 +17,11 @@ log.info(app.getName())
 log.info(app.getVersion())
 console.log(app.getName(), app.getVersion())
 
-// Start event handling for the auto updater
-const autoUpdater = new Updater(log)
-autoUpdater.handleEvents()
-
 // resolve user $PATH env variable
 require('fix-path')()
 
-if (process.env.NODE_ENV === 'development') {
+if (process.env.NODE_ENV === 'development')
   require('electron-debug')({ showDevTools: true })
-}
 
 const installExtensions = () => {
   return new Promise((resolve, reject) => {
@@ -94,6 +89,10 @@ function launchMenuBar () {
 
       mb.window.credentials = credentials
 
+      // Start event handling for the auto updater
+      const autoUpdater = new Updater(mb.window.webContents, log)
+      autoUpdater.handleEvents()
+
       mb.on('ready', () => {
         console.log('Menubar ready')
         mb.tray.setTitle(' Login')

package.json

@@ -1,6 +1,6 @@
 {
   "name": "jira-timer",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "Jira Timer",
   "productName": "Jira Timer",
   "main": "index.js",
@@ -38,6 +38,7 @@
       "index.html",
       "index.js",
       "jira-worklogs.js",
+      "auto-updater.js",
       "node_modules/",
       "package.json",
       "!**/signing/"

src/components/button.js

@@ -23,7 +23,6 @@ const ButtonStyled = styled.span`
   border: 1px solid transparent;
   border-radius: 3.01px;
   position: relative;
-  font-weight: 500;
   z-index: 1;
 
   &:hover {
@@ -76,6 +75,7 @@ const ButtonStyled = styled.span`
 
     &:hover {
       cursor: not-allowed;
+      background-color: #ebecf0;
     }
   `}
 `

src/containers/settings/settings-container.js

@@ -3,6 +3,7 @@ import React, { Component, Fragment } from 'react'
 import { Redirect } from 'react-router-dom'
 import { connect } from 'react-redux'
 import { userLogout } from '../../modules/user'
+import { setChecking } from '../../modules/updater'
 import { Margin } from 'styled-components-spacing'
 import styled from 'styled-components'
 import FooterContainer from '../footer/footer-container'
@@ -27,6 +28,8 @@ class SettingsContainer extends Component {
   }
 
   onCheckForUpdates () {
+    console.log('Checking for updates')
+    this.props.setChecking(true)
     ipcRenderer.send('updateStatus')
   }
 
@@ -68,7 +71,19 @@ class SettingsContainer extends Component {
           <Margin bottom={2}>App version v{this.props.version}</Margin>
 
           <FlexContainer>
-            <Button primary onClick={this.onCheckForUpdates}>Check for updates</Button>
+            <div>
+              <Button
+                primary
+                onClick={this.onCheckForUpdates}
+                loading={this.props.updatesChecking}
+              >
+                {!this.props.updatesChecking ? ('Check for updates') : ('Checking for updates...')}
+              </Button>
+
+              {!this.props.updateAvailable && (
+                <Margin top={2}>No updates available</Margin>
+              )}
+            </div>
           </FlexContainer>
         </Section>
       </Fragment>
@@ -108,13 +123,16 @@ const FlexContainer = styled.div`
 `
 
 const mapDispatchToProps = {
-  userLogout
+  userLogout,
+  setChecking
 }
 
 const mapStateToProps = state => ({
   authToken: state.user.authToken,
   profile: state.user.profile,
   version: state.updater.version,
+  updateAvailable: state.updater.updateAvailable,
+  updatesChecking: state.updater.checking,
 })
 
 export default connect(mapStateToProps, mapDispatchToProps)(SettingsContainer)

src/index.js

@@ -20,7 +20,7 @@ import store from './lib/create-store'
 import api from './lib/api'
 import { storeState } from './lib/storage'
 import { addWorklogs, setUpdating, fetchWorklogs } from './modules/worklog'
-import { setVersion, setUpdateInfo, setDownloaded } from './modules/updater'
+import { setVersion, setUpdateInfo, setDownloaded, setChecking, setUpdateAvailable } from './modules/updater'
 import { setAuthToken, setJiraDomain } from './modules/user'
 import AppContainer from 'containers/app/app-container'
 
@@ -71,9 +71,16 @@ ipcRenderer.on('updateStatus', (event, info) => {
   var updateInfo = JSON.parse(info)
   console.log('updateStatus', updateInfo)
   store.dispatch(setUpdateInfo(updateInfo))
+  store.dispatch(setChecking(false))
 })
 
 ipcRenderer.on('updateReady', () => {
   console.log('updateReady')
   store.dispatch(setDownloaded())
 })
+
+ipcRenderer.on('updateNotAvailable', () => {
+  console.log('updateNotAvailable')
+  store.dispatch(setUpdateAvailable(false))
+  store.dispatch(setChecking(false))
+})

src/modules/updater.js

@@ -4,11 +4,15 @@ import Immutable from 'seamless-immutable'
 const SET_VERSION = 'jt/updater/SET_VERSION'
 const SET_UPDATE_INFO = 'jt/updater/SET_UPDATE_INFO'
 const SET_DOWNLOADED = 'jt/updater/SET_DOWNLOADED'
+const SET_AVAILABLE = 'jt/updater/SET_AVAILABLE'
+const SET_CHECKING = 'jt/updater/SET_CHECKING'
 
 export const initialState = Immutable({
   version: null,
   updateInfo: null,
-  downloaded: false
+  downloaded: false,
+  checking: false,
+  updateAvailable: false,
 })
 
 // Reducer
@@ -24,6 +28,12 @@ export default function reducer (state = initialState, action = {}) {
     case SET_DOWNLOADED:
       return state.set('downloaded', true)
 
+    case SET_AVAILABLE:
+      return state.set('updateAvailable', action.available)
+
+    case SET_CHECKING:
+      return state.set('checking', action.checking)
+
     default: return state
   }
 }
@@ -42,3 +52,13 @@ export const setUpdateInfo = updateInfo => ({
 export const setDownloaded = () => ({
   type: SET_DOWNLOADED
 })
+
+export const setUpdateAvailable = available => ({
+  type: SET_AVAILABLE,
+  available
+})
+
+export const setChecking = checking => ({
+  type: SET_CHECKING,
+  checking
+})