[ui] Signing in with a token explicitly sets the region dropdown activeRegion

ui/app/controllers/settings/tokens.js

@@ -23,7 +23,7 @@ export default class Tokens extends Controller {
   @service token;
   @service store;
   @service router;
-
+  @service system;
   queryParams = ['code', 'state', 'jwtAuthMethod'];
 
   @tracked secret = this.token.secret;
@@ -164,6 +164,14 @@ export default class Tokens extends Controller {
           // Refetch the token and associated policies
           this.token.get('fetchSelfTokenAndPolicies').perform().catch();
 
+          if (!this.system.activeRegion) {
+            this.system.get('defaultRegion').then((res) => {
+              if (res.region) {
+                this.system.set('activeRegion', res.region);
+              }
+            });
+          }
+
           this.signInStatus = 'success';
           this.token.set('tokenNotFound', false);
         },

ui/app/services/system.js

@@ -57,7 +57,7 @@ export default class SystemService extends Service {
     });
   }
 
-  @computed
+  @computed('token.selfToken')
   get defaultRegion() {
     const token = this.token;
     return PromiseObject.create({

ui/app/templates/components/region-switcher.hbs

@@ -12,10 +12,13 @@
       @tagName="div"
       @triggerClass={{this.decoration}}
       @options={{this.sortedRegions}}
-      @selected={{this.system.activeRegion}}
+      @selected={{or this.system.activeRegion 'Select a Region'}}
       @searchEnabled={{false}}
       @onChange={{action this.gotoRegion}} as |region|>
-      <span class="ember-power-select-prefix">Region: </span>{{region}}
+      {{#if this.system.activeRegion}}
+        <span class="ember-power-select-prefix">Region: </span>
+      {{/if}}
+      {{region}}
     </PowerSelect>
   </span>
 {{else}}

ui/mirage/config.js

@@ -708,7 +708,12 @@ export default function () {
     return this.serialize(volume);
   });
 
-  this.get('/agent/members', function ({ agents, regions }) {
+  this.get('/agent/members', function ({ agents, regions }, req) {
+    const tokenPresent = req.requestHeaders['X-Nomad-Token'];
+    if (!tokenPresent) {
+      return new Response(403, {}, 'Forbidden');
+    }
+
     const firstRegion = regions.first();
     return {
       ServerRegion: firstRegion ? firstRegion.id : null,

ui/tests/acceptance/regions-test.js

@@ -15,6 +15,7 @@ import JobsList from 'nomad-ui/tests/pages/jobs/list';
 import ClientsList from 'nomad-ui/tests/pages/clients/list';
 import Layout from 'nomad-ui/tests/pages/layout';
 import Allocation from 'nomad-ui/tests/pages/allocations/detail';
+import Tokens from 'nomad-ui/tests/pages/settings/tokens';
 
 module('Acceptance | regions (only one)', function (hooks) {
   setupApplicationTest(hooks);
@@ -218,4 +219,26 @@ module('Acceptance | regions (many)', function (hooks) {
       }
     });
   });
+
+  test('Signing in sets the active region', async function (assert) {
+    window.localStorage.clear();
+    let managementToken = server.create('token');
+    await Tokens.visit();
+    assert.equal(
+      Layout.navbar.regionSwitcher.text,
+      'Select a Region',
+      'Region picker says "Select a Region" before signing in'
+    );
+    await Tokens.secret(managementToken.secretId).submit();
+    assert.equal(
+      window.localStorage.nomadActiveRegion,
+      'global',
+      'Region is set in localStorage after signing in'
+    );
+    assert.equal(
+      Layout.navbar.regionSwitcher.text,
+      'Region: global',
+      'Region picker says "Region: global" after signing in'
+    );
+  });
 });

ui/tests/unit/adapters/job-test.js

@@ -468,6 +468,9 @@ module('Unit | Adapter | Job', function (hooks) {
   });
 
   test('when the region is set to the default region, requests are made without the region query param', async function (assert) {
+    const secret = 'here is the secret';
+    this.subject().set('token.secret', secret);
+
     await this.initializeUI({ region: 'region-1' });
 
     const { pretender } = this.server;