UI: Include the region query param on the View Raw File link in the task fs explorer

CHANGELOG.md

@@ -24,6 +24,7 @@ BUG FIXES:
  * ui: Fixed runtime error when clicking "Run Job" while a prefix filter is set [[GH-8412](https://github.com/hashicorp/nomad/issues/8412)]
  * ui: Fixed the absence of the region query parameter on various actions, such as job stop, allocation restart, node drain. [[GH-8477](https://github.com/hashicorp/nomad/issues/8477)]
  * ui: Fixed issue where an orphaned child job would make it so navigating to a job detail page would hang the UI [[GH-8319](https://github.com/hashicorp/nomad/issues/8319)]
+ * ui: Fixed issue where clicking View Raw File in a non-default region would not provide the region param resulting in a 404 [[GH-8509](https://github.com/hashicorp/nomad/issues/8509)]
  * vault: Fixed a bug where vault identity policies not considered in permissions check [[GH-7732](https://github.com/hashicorp/nomad/issues/7732)]
 
 ## 0.12.0 (July 9, 2020)

ui/app/components/fs/file.js

@@ -12,6 +12,7 @@ import classic from 'ember-classic-decorator';
 @classNames('boxed-section', 'task-log')
 export default class File extends Component {
   @service token;
+  @service system;
 
   'data-test-file-viewer' = true;
 
@@ -54,7 +55,11 @@ export default class File extends Component {
   get catUrl() {
     const taskUrlPrefix = this.taskState ? `${this.taskState.name}/` : '';
     const encodedPath = encodeURIComponent(`${taskUrlPrefix}${this.file}`);
-    return `/v1/client/fs/cat/${this.allocation.id}?path=${encodedPath}`;
+    let apiPath = `/v1/client/fs/cat/${this.allocation.id}?path=${encodedPath}`;
+    if (this.system.shouldIncludeRegion) {
+      apiPath += `&region=${this.system.activeRegion}`;
+    }
+    return apiPath;
   }
 
   @computed('isLarge', 'mode')

ui/tests/integration/fs/file-test.js

@@ -13,15 +13,22 @@ module('Integration | Component | fs/file', function(hooks) {
 
   hooks.beforeEach(function() {
     this.server = new Pretender(function() {
-      this.get('/v1/regions', () => [200, {}, JSON.stringify(['default'])]);
+      this.get('/v1/agent/members', () => [
+        200,
+        {},
+        JSON.stringify({ ServerRegion: 'default', Members: [] }),
+      ]);
+      this.get('/v1/regions', () => [200, {}, JSON.stringify(['default', 'region-2'])]);
       this.get('/v1/client/fs/stream/:alloc_id', () => [200, {}, logEncode(['Hello World'], 0)]);
       this.get('/v1/client/fs/cat/:alloc_id', () => [200, {}, 'Hello World']);
       this.get('/v1/client/fs/readat/:alloc_id', () => [200, {}, 'Hello World']);
     });
+    this.system = this.owner.lookup('service:system');
   });
 
   hooks.afterEach(function() {
     this.server.shutdown();
+    window.localStorage.clear();
   });
 
   const commonTemplate = hbs`
@@ -145,6 +152,26 @@ module('Integration | Component | fs/file', function(hooks) {
     );
   });
 
+  test('The view raw button respects the active region', async function(assert) {
+    const region = 'region-2';
+    window.localStorage.nomadActiveRegion = region;
+
+    const props = makeProps(fileStat('image/png', 1234));
+    this.setProperties(props);
+
+    await this.system.get('regions');
+    await render(commonTemplate);
+
+    const rawLink = find('[data-test-log-action="raw"]');
+    assert.equal(
+      rawLink.getAttribute('href'),
+      `/v1/client/fs/cat/${props.allocation.id}?path=${encodeURIComponent(
+        `${props.taskState.name}/${props.file}`
+      )}&region=${region}`,
+      'Raw link href includes the active region from local storage'
+    );
+  });
+
   test('The head and tail buttons are not shown when the file is small', async function(assert) {
     const props = makeProps(fileStat('application/json', 5000));
     this.setProperties(props);