UI: Allocation file system explorer: Routing

ui/app/router.js

@@ -32,6 +32,9 @@ Router.map(function() {
     this.route('allocation', { path: '/:allocation_id' }, function() {
       this.route('task', { path: '/:name' }, function() {
         this.route('logs');
+        this.route('fs', function() {
+          this.route('path', { path: '/*path' });
+        });
       });
     });
   });

ui/app/routes/allocations/allocation/task/fs/path.js

@@ -0,0 +1,15 @@
+import Route from '@ember/routing/route';
+
+export default Route.extend({
+  model({ path }) {
+    return {
+      path: decodeURIComponent(path),
+      task: this.modelFor('allocations.allocation.task'),
+    };
+  },
+
+  setupController(controller, { path, task }) {
+    this._super(...arguments);
+    controller.setProperties({ path, model: task });
+  },
+});

ui/app/templates/allocations/allocation/task/fs.hbs

@@ -0,0 +1 @@
+{{outlet}}

ui/app/templates/allocations/allocation/task/fs/index.hbs

@@ -0,0 +1,14 @@
+{{partial "allocations/allocation/task/subnav"}}
+<section class="section full-width-section">
+  <h1 class="title">Index fs route</h1>
+  {{#if model.isRunning}}
+    Task is running, show file explorer.
+  {{else}}
+    <div data-test-not-running class="empty-message">
+      <h3 data-test-not-running-headline class="empty-message-headline">Task is not Running</h3>
+      <p data-test-not-running-body class="empty-message-body">
+        Cannot access files of a task that is not running.
+      </p>
+    </div>
+  {{/if}}
+</section>

ui/app/templates/allocations/allocation/task/fs/path.hbs

@@ -0,0 +1,4 @@
+{{partial "allocations/allocation/task/subnav"}}
+<section class="section full-width-section">
+  <h1 class="title">Path fs route <code>{{path}}</code></h1>
+</section>

ui/app/templates/allocations/allocation/task/subnav.hbs

@@ -2,5 +2,6 @@
   <ul>
     <li>{{#link-to "allocations.allocation.task.index" model.allocation model activeClass="is-active"}}Overview{{/link-to}}</li>
     <li>{{#link-to "allocations.allocation.task.logs" model.allocation model activeClass="is-active"}}Logs{{/link-to}}</li>
+    <li>{{#link-to "allocations.allocation.task.fs" model.allocation model activeClass="is-active"}}Files{{/link-to}}</li>
   </ul>
 </div>

ui/tests/acceptance/task-fs-path-test.js

@@ -0,0 +1,42 @@
+import { currentURL } from '@ember/test-helpers';
+import { Promise } from 'rsvp';
+import { module, test } from 'qunit';
+import { setupApplicationTest } from 'ember-qunit';
+import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
+import Path from 'nomad-ui/tests/pages/allocations/task/fs/path';
+
+let allocation;
+let task;
+
+module('Acceptance | task fs path', function(hooks) {
+  setupApplicationTest(hooks);
+  setupMirage(hooks);
+
+  hooks.beforeEach(async function() {
+    server.create('agent');
+    server.create('node', 'forceIPv4');
+    const job = server.create('job', { createAllocations: false });
+
+    allocation = server.create('allocation', { jobId: job.id, clientStatus: 'running' });
+    task = server.schema.taskStates.where({ allocationId: allocation.id }).models[0];
+  });
+
+  test('visiting /allocations/:allocation_id/:task_name/fs/:path', async function(assert) {
+    const paths = ['some-file.log', 'a/deep/path/to/a/file.log', '/', 'Unicode™®'];
+
+    const testPath = async filePath => {
+      await Path.visit({ id: allocation.id, name: task.name, path: filePath });
+      assert.equal(
+        currentURL(),
+        `/allocations/${allocation.id}/${task.name}/fs/${encodeURIComponent(filePath)}`,
+        'No redirect'
+      );
+      assert.ok(Path.tempTitle.includes(filePath), `Temp title includes path, ${filePath}`);
+    };
+
+    await paths.reduce(async (prev, filePath) => {
+      await prev;
+      return testPath(filePath);
+    }, Promise.resolve());
+  });
+});

ui/tests/acceptance/task-fs-test.js

@@ -0,0 +1,40 @@
+import { currentURL } from '@ember/test-helpers';
+import { module, test } from 'qunit';
+import { setupApplicationTest } from 'ember-qunit';
+import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
+import FS from 'nomad-ui/tests/pages/allocations/task/fs';
+
+let allocation;
+let task;
+
+module('Acceptance | task fs', function(hooks) {
+  setupApplicationTest(hooks);
+  setupMirage(hooks);
+
+  hooks.beforeEach(async function() {
+    server.create('agent');
+    server.create('node', 'forceIPv4');
+    const job = server.create('job', { createAllocations: false });
+
+    allocation = server.create('allocation', { jobId: job.id, clientStatus: 'running' });
+    task = server.schema.taskStates.where({ allocationId: allocation.id }).models[0];
+  });
+
+  test('visiting /allocations/:allocation_id/:task_name/fs', async function(assert) {
+    await FS.visit({ id: allocation.id, name: task.name });
+    assert.equal(currentURL(), `/allocations/${allocation.id}/${task.name}/fs`, 'No redirect');
+  });
+
+  test('when the task is not running, an empty state is shown', async function(assert) {
+    task.update({
+      finishedAt: new Date(),
+    });
+
+    await FS.visit({ id: allocation.id, name: task.name });
+    assert.ok(FS.hasEmptyState, 'Non-running task has no files');
+    assert.ok(
+      FS.emptyState.headline.includes('Task is not Running'),
+      'Empty state explains the condition'
+    );
+  });
+});

ui/tests/pages/allocations/task/fs.js

@@ -0,0 +1,12 @@
+import { create, isPresent, text, visitable } from 'ember-cli-page-object';
+
+export default create({
+  visit: visitable('/allocations/:id/:name/fs'),
+
+  hasFiles: isPresent('[data-test-file-explorer]'),
+
+  hasEmptyState: isPresent('[data-test-not-running]'),
+  emptyState: {
+    headline: text('[data-test-not-running-headline]'),
+  },
+});

ui/tests/pages/allocations/task/fs/path.js

@@ -0,0 +1,7 @@
+import { create, text, visitable } from 'ember-cli-page-object';
+
+export default create({
+  visit: visitable('/allocations/:id/:name/fs/:path'),
+
+  tempTitle: text('h1.title'),
+});