From 7d284a7e189f2f545d8cb169122be0afe977fa5d Mon Sep 17 00:00:00 2001
From: Lorenzo Alberto Maria Ambrosi <lorenzothunder.ambrosi@gmail.com>
Date: Fri, 6 Dec 2019 23:22:31 +0100
Subject: [PATCH] Add version in settings modal

Change-type: patch
Changelog-entry: Add version in settings modal
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzothunder.ambrosi@gmail.com>
---
 lib/gui/app/components/settings/settings.tsx  | 14 ++++++
 .../open-external/services/open-external.js   | 50 ++++++++++---------
 npm-shrinkwrap.json                           | 10 +++-
 package.json                                  |  1 +
 4 files changed, 51 insertions(+), 24 deletions(-)

diff --git a/lib/gui/app/components/settings/settings.tsx b/lib/gui/app/components/settings/settings.tsx
index 99215ec5..2aac757b 100644
--- a/lib/gui/app/components/settings/settings.tsx
+++ b/lib/gui/app/components/settings/settings.tsx
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import { faGithub } from '@fortawesome/free-brands-svg-icons';
 import { faCog } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import * as _ from 'lodash';
@@ -22,9 +23,11 @@ import * as propTypes from 'prop-types';
 import * as React from 'react';
 import { Badge, Button, Checkbox, Modal, Provider } from 'rendition';
 import styled from 'styled-components';
+import packageJSON = require('../../../../../package.json');
 import * as settings from '../../models/settings';
 import * as store from '../../models/store';
 import * as analytics from '../../modules/analytics';
+import { open as openExternal } from '../../os/open-external/services/open-external';
 import { colors } from '../../theme';
 
 const { useState } = React;
@@ -208,6 +211,17 @@ export const SettingsModal: any = styled(
 							</div>
 						);
 					})}
+					<div>
+						<span
+							onClick={() =>
+								openExternal(
+									'https://github.com/balena-io/etcher/blob/master/CHANGELOG.md',
+								)
+							}
+						>
+							<FontAwesomeIcon icon={faGithub} /> {packageJSON.version}
+						</span>
+					</div>
 				</div>
 
 				{_.isEmpty(warning) ? null : (
diff --git a/lib/gui/app/os/open-external/services/open-external.js b/lib/gui/app/os/open-external/services/open-external.js
index f2527ee2..ec2fcaab 100644
--- a/lib/gui/app/os/open-external/services/open-external.js
+++ b/lib/gui/app/os/open-external/services/open-external.js
@@ -21,30 +21,34 @@ const store = require('../../../models/store')
 const analytics = require('../../../modules/analytics')
 const settings = require('../../../models/settings')
 
-module.exports = function () {
-  /**
-   * @summary Open an external resource
-   * @function
-   * @public
-   *
-   * @param {String} url - url
-   *
-   * @example
-   * OSOpenExternalService.open('https://www.google.com');
-   */
-  this.open = (url) => {
-    // Don't open links if they're disabled by the env var
-    if (settings.get('disableExternalLinks')) {
-      return
-    }
+/**
+ * @summary Open an external resource
+ * @function
+ * @public
+ *
+ * @param {String} url - url
+ *
+ * @example
+ * OSOpenExternalService.open('https://www.google.com');
+ */
+const open = (url) => {
+  // Don't open links if they're disabled by the env var
+  if (settings.get('disableExternalLinks')) {
+    return
+  }
 
-    analytics.logEvent('Open external link', {
-      url,
-      applicationSessionUuid: store.getState().toJS().applicationSessionUuid
-    })
+  analytics.logEvent('Open external link', {
+    url,
+    applicationSessionUuid: store.getState().toJS().applicationSessionUuid
+  })
 
-    if (url) {
-      electron.shell.openExternal(url)
-    }
+  if (url) {
+    electron.shell.openExternal(url)
   }
 }
+
+module.exports = function () {
+  this.open = open
+}
+
+module.exports.open = open
diff --git a/npm-shrinkwrap.json b/npm-shrinkwrap.json
index ec2b0964..d190ef09 100644
--- a/npm-shrinkwrap.json
+++ b/npm-shrinkwrap.json
@@ -1018,6 +1018,14 @@
         "@fortawesome/fontawesome-common-types": "^0.2.25"
       }
     },
+    "@fortawesome/free-brands-svg-icons": {
+      "version": "5.11.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.11.2.tgz",
+      "integrity": "sha512-wKK5znpHiZ2S0VgOvbeAnYuzkk3H86rxWajD9PVpfBj3s/kySEWTFKh/uLPyxiTOx8Tsd0OGN4En/s9XudVHLQ==",
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.25"
+      }
+    },
     "@fortawesome/free-solid-svg-icons": {
       "version": "5.11.2",
       "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.11.2.tgz",
@@ -14826,4 +14834,4 @@
       }
     }
   }
-}
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index dd3dc949..a7bd11d2 100644
--- a/package.json
+++ b/package.json
@@ -41,6 +41,7 @@
   "dependencies": {
     "@fortawesome/fontawesome-free-webfonts": "^1.0.9",
     "@fortawesome/fontawesome-svg-core": "^1.2.25",
+    "@fortawesome/free-brands-svg-icons": "^5.11.2",
     "@fortawesome/free-solid-svg-icons": "^5.11.2",
     "@fortawesome/react-fontawesome": "^0.1.7",
     "angular": "1.7.6",