From 69627911b371f26b67b790844303fb6c22057045 Mon Sep 17 00:00:00 2001
From: Mark McDowall <mark@mcdowall.ca>
Date: Thu, 7 Feb 2019 18:44:22 -0800
Subject: [PATCH] New: Highlight currently installed version on System: Updates

---
 frontend/src/System/Updates/Updates.css        |  2 +-
 frontend/src/System/Updates/Updates.js         | 18 ++++++++++++++++--
 .../src/System/Updates/UpdatesConnector.js     | 10 +++++++++-
 3 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/frontend/src/System/Updates/Updates.css b/frontend/src/System/Updates/Updates.css
index 6abf82513..0440668d4 100644
--- a/frontend/src/System/Updates/Updates.css
+++ b/frontend/src/System/Updates/Updates.css
@@ -45,7 +45,7 @@
   font-size: 16px;
 }
 
-.branch {
+.label {
   composes: label from 'Components/Label.css';
 
   margin-left: 10px;
diff --git a/frontend/src/System/Updates/Updates.js b/frontend/src/System/Updates/Updates.js
index 8b76c1921..2012c82fd 100644
--- a/frontend/src/System/Updates/Updates.js
+++ b/frontend/src/System/Updates/Updates.js
@@ -19,6 +19,7 @@ class Updates extends Component {
 
   render() {
     const {
+      currentVersion,
       isFetching,
       isPopulated,
       updatesError,
@@ -133,13 +134,25 @@ class Updates extends Component {
                           <div className={styles.date}>{formatDate(update.releaseDate, shortDateFormat)}</div>
 
                           {
-                            update.branch !== 'master' &&
+                            update.branch === 'master' ?
+                              null:
                               <Label
-                                className={styles.branch}
+                                className={styles.label}
                               >
                                 {update.branch}
                               </Label>
                           }
+
+                          {
+                            update.version === currentVersion ?
+                              <Label
+                                className={styles.label}
+                                kind={kinds.SUCCESS}
+                              >
+                                Currently Installed
+                              </Label> :
+                              null
+                          }
                         </div>
 
                         {
@@ -189,6 +202,7 @@ class Updates extends Component {
 }
 
 Updates.propTypes = {
+  currentVersion: PropTypes.string.isRequired,
   isFetching: PropTypes.bool.isRequired,
   isPopulated: PropTypes.bool.isRequired,
   updatesError: PropTypes.object,
diff --git a/frontend/src/System/Updates/UpdatesConnector.js b/frontend/src/System/Updates/UpdatesConnector.js
index e80833d30..8836bbb94 100644
--- a/frontend/src/System/Updates/UpdatesConnector.js
+++ b/frontend/src/System/Updates/UpdatesConnector.js
@@ -12,11 +12,18 @@ import Updates from './Updates';
 
 function createMapStateToProps() {
   return createSelector(
+    (state) => state.app.version,
     (state) => state.system.updates,
     (state) => state.settings.general,
     createUISettingsSelector(),
     createCommandExecutingSelector(commandNames.APPLICATION_UPDATE),
-    (updates, generalSettings, uiSettings, isInstallingUpdate) => {
+    (
+      currentVersion,
+      updates,
+      generalSettings,
+      uiSettings,
+      isInstallingUpdate
+    ) => {
       const {
         error: updatesError,
         items
@@ -26,6 +33,7 @@ function createMapStateToProps() {
       const isPopulated = updates.isPopulated && generalSettings.isPopulated;
 
       return {
+        currentVersion,
         isFetching,
         isPopulated,
         updatesError,