From 8d8f9aaa28246920dce6ffa9a34943d4e1f01e23 Mon Sep 17 00:00:00 2001
From: Michael Lange <dingoeatingfuzz@gmail.com>
Date: Sun, 25 Oct 2020 23:25:28 -0700
Subject: [PATCH] Show the nomad agent version of the agent the UI is served
 from

---
 ui/app/services/system.js                   | 14 ++++++++++++++
 ui/app/styles/components/gutter.scss        |  9 +++++++++
 ui/app/templates/components/gutter-menu.hbs |  3 +++
 ui/mirage/config.js                         |  6 ++++++
 ui/tests/acceptance/regions-test.js         |  8 ++++++--
 5 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/ui/app/services/system.js b/ui/app/services/system.js
index 1730777b5..359c85f62 100644
--- a/ui/app/services/system.js
+++ b/ui/app/services/system.js
@@ -28,6 +28,20 @@ export default class SystemService extends Service {
     });
   }
 
+  @computed
+  get agent() {
+    const token = this.token;
+    return PromiseObject.create({
+      promise: token
+        .authorizedRawRequest(`/${namespace}/agent/self`)
+        .then(jsonWithDefault({}))
+        .then(agent => {
+          agent.version = agent.member?.Tags?.build || 'Unknown';
+          return agent;
+        }),
+    });
+  }
+
   @computed
   get defaultRegion() {
     const token = this.token;
diff --git a/ui/app/styles/components/gutter.scss b/ui/app/styles/components/gutter.scss
index f2214c36e..8ba1fd4fc 100644
--- a/ui/app/styles/components/gutter.scss
+++ b/ui/app/styles/components/gutter.scss
@@ -1,4 +1,6 @@
 .gutter {
+  display: flex;
+  flex-direction: column;
   height: 100%;
   border-right: 1px solid $grey-blue;
   overflow: hidden;
@@ -56,6 +58,13 @@
   .menu {
     z-index: $z-gutter;
   }
+
+  .gutter-footer {
+    text-align: center;
+    border-top: 1px solid lighten($grey-blue, 10%);
+    padding: 0.5em 0;
+    margin-top: auto;
+  }
 }
 
 // Treated as an element of the gutter component despite not being nested within
diff --git a/ui/app/templates/components/gutter-menu.hbs b/ui/app/templates/components/gutter-menu.hbs
index 9d0608d35..f2157ee6d 100644
--- a/ui/app/templates/components/gutter-menu.hbs
+++ b/ui/app/templates/components/gutter-menu.hbs
@@ -84,6 +84,9 @@
         <li><LinkTo @route="topology" @activeClass="is-active" data-test-gutter-link="topology">Topology</LinkTo></li>
       </ul>
     </aside>
+    <footer class="gutter-footer">
+      <span class="is-faded">v{{this.system.agent.version}}</span>
+    </footer>
   </div>
 </div>
 <div data-test-page-content class="page-column is-right">
diff --git a/ui/mirage/config.js b/ui/mirage/config.js
index c85d4c15c..2bac39cc5 100644
--- a/ui/mirage/config.js
+++ b/ui/mirage/config.js
@@ -323,6 +323,12 @@ export default function() {
     };
   });
 
+  this.get('/agent/self', function({ agents }) {
+    return {
+      member: this.serialize(agents.first()),
+    };
+  });
+
   this.get('/agent/monitor', function({ agents, nodes }, { queryParams }) {
     const serverId = queryParams.server_id;
     const clientId = queryParams.client_id;
diff --git a/ui/tests/acceptance/regions-test.js b/ui/tests/acceptance/regions-test.js
index c088fceb3..36ac55138 100644
--- a/ui/tests/acceptance/regions-test.js
+++ b/ui/tests/acceptance/regions-test.js
@@ -152,7 +152,7 @@ module('Acceptance | regions (many)', function(hooks) {
     );
   });
 
-  test('when the region is not the default region, all api requests include the region query param', async function(assert) {
+  test('when the region is not the default region, all api requests other than the agent/self request include the region query param', async function(assert) {
     window.localStorage.removeItem('nomadTokenSecret');
     const region = server.db.regions[1].id;
 
@@ -178,7 +178,11 @@ module('Acceptance | regions (many)', function(hooks) {
     );
 
     appRequests.forEach(req => {
-      assert.ok(req.url.includes(`region=${region}`), req.url);
+      if (req.url === '/v1/agent/self') {
+        assert.notOk(req.url.includes('region='), `(no region) ${req.url}`);
+      } else {
+        assert.ok(req.url.includes(`region=${region}`), req.url);
+      }
     });
   });
 });