About: better upgrade cycle UI

stephendade · May 18, 2022 · 2be7b3f · 2be7b3f
1 parent d9421a5
commit 2be7b3f
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 3 deletions.
diff --git a/package.json b/package.json
@@ -51,6 +51,7 @@
     "lint": "eslint .",
     "eject": "react-scripts eject",
     "server": "node-env-run server --exec nodemon | pino-colada",
+    "service": "node-env-run server",
     "dev": "run-p server start",
     "version": "auto-changelog -p --commit-limit false && git add CHANGELOG.md"
   },

diff --git a/rpanion.service b/rpanion.service
@@ -5,7 +5,7 @@ After=network.target
 [Service]
 Environment=PORT=3000
 WorkingDirectory=/home/pi/Rpanion-server
-ExecStart=/usr/bin/npm run server
+ExecStart=/usr/bin/npm run service
 Restart=on-failure
 User=pi
 

diff --git a/server/aboutInfo.js b/server/aboutInfo.js
@@ -54,23 +54,27 @@ function updateRS (io) {
   // update Rpanion-server
   console.log('Upgrading')
   winston.info('Upgrading')
+  io.sockets.emit('upgradeStatus', 'InProgress')
   const ug = spawn('bash', ['./deploy/upgrade.sh'], { shell: true })
   ug.stdout.on('data', function (data) {
     console.log('stdout: ' + data.toString())
     winston.info('stdout: ' + data.toString())
     io.sockets.emit('upgradeText', data.toString())
+    io.sockets.emit('upgradeStatus', 'InProgress')
   })
 
   ug.stderr.on('data', function (data) {
     console.log('Upgrade fail: ' + data.toString())
     winston.info('Upgrade fail: ' + data.toString())
     io.sockets.emit('upgradeText', data.toString())
+    io.sockets.emit('upgradeStatus', 'InProgress')
   })
 
   ug.on('exit', function (code) {
     console.log('Upgrade complete: ' + code.toString())
     winston.info('Upgrade complete: ' + code.toString())
     io.sockets.emit('upgradeText', '---Upgrade Complete (' + code.toString() + ')---')
+    io.sockets.emit('upgradeStatus', 'Complete')
   })
 }
 

diff --git a/src/about.js b/src/about.js
@@ -20,7 +20,8 @@ class AboutPage extends basePage {
       infoMessage: null,
       showModal: false,
       showModalResult: "",
-      UpgradeStatus: ''
+      UpgradeStatus: '',
+      UpgradeIntStat: ''
     }
 
     this.upgradeTextContainer = React.createRef();
@@ -30,6 +31,9 @@ class AboutPage extends basePage {
       const prevText = this.state.UpgradeStatus
       this.setState({ UpgradeStatus: (prevText + msg) })
     }.bind(this));
+    this.socket.on('upgradeStatus', function (msg) {
+      this.setState({ UpgradeIntStat: msg })
+    }.bind(this));
     this.socket.on('reconnect', function () {
       //refresh state
       this.componentDidMount();
@@ -104,8 +108,14 @@ class AboutPage extends basePage {
         <p><Button size="sm" onClick={this.handleUpdateMaster}>Upgrade to lastest Github master</Button></p>
         <p><Button size="sm" onClick={this.confirmShutdown}>Shutdown Companion Computer</Button></p>
 
-        <div style={{ display: (this.state.UpgradeStatus !== '') ? "block" : "none" }}>
+        <div style={{ display: (this.state.UpgradeIntStat === 'InProgress' || this.state.UpgradeIntStat === 'Complete') ? "block" : "none" }}>
           <h2>Upgrade Status</h2>
+          <div style={{ display: (this.state.UpgradeIntStat === 'InProgress') ? "block" : "none" }}>
+            <p>Upgrade is in progress ... please wait</p>
+          </div>
+          <div style={{ display: (this.state.UpgradeIntStat === 'Complete') ? "block" : "none" }}>
+            <p>Upgrade complete</p>
+          </div>
           <textarea ref={this.upgradeTextContainer} readOnly rows="20" cols="60" value={this.state.UpgradeStatus}></textarea>
         </div>