UI: Proper task group breadcrumb on the allocation pages

ui/app/routes/allocations/allocation.js

@@ -14,18 +14,20 @@ export default Route.extend(WithWatchers, {
   // Allocation breadcrumbs extend from job / task group breadcrumbs
   // even though the route structure does not.
   breadcrumbs(model) {
+    const jobQueryParams = qpBuilder({
+      jobNamespace: model.get('job.namespace.name') || 'default',
+    });
+
     return [
-      { label: 'Jobs', args: ['jobs.index'] },
+      { label: 'Jobs', args: ['jobs.index', jobQueryParams] },
       ...jobCrumbs(model.get('job')),
       {
         label: model.get('taskGroupName'),
         args: [
           'jobs.job.task-group',
-          model.get('job'),
+          model.get('job.plainId'),
           model.get('taskGroupName'),
-          qpBuilder({
-            jobNamespace: model.get('namespace.name') || 'default',
-          }),
+          jobQueryParams,
         ],
       },
       {

ui/app/routes/jobs/job/task-group.js

@@ -12,6 +12,7 @@ export default Route.extend(WithWatchers, {
         label: model.get('name'),
         args: [
           'jobs.job.task-group',
+          model.get('job'),
           model.get('name'),
           qpBuilder({ jobNamespace: model.get('job.namespace.name') || 'default' }),
         ],

ui/app/services/system.js

@@ -113,7 +113,7 @@ export default Service.extend({
 
       // If the namespace in localStorage is no longer in the cluster, it needs to
       // be cleared from localStorage
-      this.set('activeNamespace', null);
+      window.localStorage.removeItem('nomadActiveNamespace');
       return this.get('namespaces').findBy('id', 'default');
     },
     set(key, value) {

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

@@ -204,3 +204,70 @@ moduleForAcceptance('Acceptance | task detail (no addresses)', {
 test('when the task has no addresses, the addresses table is not shown', function(assert) {
   assert.notOk(Task.hasAddresses, 'No addresses table');
 });
+
+moduleForAcceptance('Acceptance | task detail (different namespace)', {
+  beforeEach() {
+    server.create('agent');
+    server.create('node');
+    server.create('namespace');
+    server.create('namespace', { id: 'other-namespace' });
+    server.create('job', { createAllocations: false, namespaceId: 'other-namespace' });
+    allocation = server.create('allocation', 'withTaskWithPorts');
+    task = server.db.taskStates.where({ allocationId: allocation.id })[0];
+
+    Task.visit({ id: allocation.id, name: task.name });
+  },
+});
+
+test('breadcrumbs match jobs / job / task group / allocation / task', function(assert) {
+  const { jobId, taskGroup } = allocation;
+  const job = server.db.jobs.find(jobId);
+
+  Task.breadcrumbFor('jobs.index').visit();
+  andThen(() => {
+    assert.equal(
+      currentURL(),
+      '/jobs?namespace=other-namespace',
+      'Jobs breadcrumb links correctly'
+    );
+  });
+  andThen(() => {
+    Task.visit({ id: allocation.id, name: task.name });
+  });
+  andThen(() => {
+    Task.breadcrumbFor('jobs.job.index').visit();
+  });
+  andThen(() => {
+    assert.equal(
+      currentURL(),
+      `/jobs/${job.id}?namespace=other-namespace`,
+      'Job breadcrumb links correctly'
+    );
+  });
+  andThen(() => {
+    Task.visit({ id: allocation.id, name: task.name });
+  });
+  andThen(() => {
+    Task.breadcrumbFor('jobs.job.task-group').visit();
+  });
+  andThen(() => {
+    assert.equal(
+      currentURL(),
+      `/jobs/${job.id}/${taskGroup}?namespace=other-namespace`,
+      'Task Group breadcrumb links correctly'
+    );
+  });
+  andThen(() => {
+    Task.visit({ id: allocation.id, name: task.name });
+  });
+  andThen(() => {
+    Task.breadcrumbFor('allocations.allocation').visit();
+  });
+  andThen(() => {
+    assert.equal(
+      currentURL(),
+      `/allocations/${allocation.id}`,
+      'Allocations breadcrumb links correctly'
+    );
+  });
+});