Merge pull request #5514 from hashicorp/f-ui-ember-v3-misc

UI: Ember Upgrade, Miscellaneous Dependencies

ui/.eslintrc.js

@@ -8,11 +8,8 @@ module.exports = {
   },
   extends: 'eslint:recommended',
   parserOptions: {
-    ecmaVersion: 2017,
+    ecmaVersion: 2018,
     sourceType: 'module',
-    ecmaFeatures: {
-      experimentalObjectRestSpread: true,
-    },
   },
   rules: {
     indent: ['error', 2, { SwitchCase: 1 }],

ui/ember-cli-build.js

@@ -12,6 +12,9 @@ module.exports = function(defaults) {
     },
     svg: {
       paths: ['public/images/icons'],
+      optimize: {
+        plugins: [{ removeViewBox: false }],
+      },
     },
     codemirror: {
       modes: ['javascript'],

ui/mirage/config.js

@@ -46,11 +46,10 @@ export default function() {
       const json = this.serialize(jobs.all());
       const namespace = queryParams.namespace || 'default';
       return json
-        .filter(
-          job =>
-            namespace === 'default'
-              ? !job.NamespaceID || job.NamespaceID === namespace
-              : job.NamespaceID === namespace
+        .filter(job =>
+          namespace === 'default'
+            ? !job.NamespaceID || job.NamespaceID === namespace
+            : job.NamespaceID === namespace
         )
         .map(job => filterKeys(job, 'TaskGroups', 'NamespaceID'));
     })

ui/mirage/factories/allocation.js

@@ -31,7 +31,7 @@ export default Factory.extend({
       const taskGroup = server.db.taskGroups.findBy({ name: allocation.taskGroup });
       const resources = taskGroup.taskIds.map(id =>
         server.create(
-          'task-resources',
+          'task-resource',
           {
             allocation,
             name: server.db.tasks.find(id).name,
@@ -40,7 +40,7 @@ export default Factory.extend({
         )
       );
 
-      allocation.update({ taskResourcesIds: resources.mapBy('id') });
+      allocation.update({ taskResourceIds: resources.mapBy('id') });
     },
   }),
 
@@ -49,7 +49,7 @@ export default Factory.extend({
       const taskGroup = server.db.taskGroups.findBy({ name: allocation.taskGroup });
       const resources = taskGroup.taskIds.map(id =>
         server.create(
-          'task-resources',
+          'task-resource',
           {
             allocation,
             name: server.db.tasks.find(id).name,
@@ -58,7 +58,7 @@ export default Factory.extend({
         )
       );
 
-      allocation.update({ taskResourcesIds: resources.mapBy('id') });
+      allocation.update({ taskResourceIds: resources.mapBy('id') });
     },
   }),
 
@@ -146,7 +146,7 @@ export default Factory.extend({
     );
 
     const resources = taskGroup.taskIds.map(id =>
-      server.create('task-resources', {
+      server.create('task-resource', {
         allocation,
         name: server.db.tasks.find(id).name,
       })
@@ -157,16 +157,16 @@ export default Factory.extend({
       jobId: job.id,
       nodeId: node.id,
       taskStateIds: allocation.clientStatus === 'pending' ? [] : states.mapBy('id'),
-      taskResourcesIds: allocation.clientStatus === 'pending' ? [] : resources.mapBy('id'),
+      taskResourceIds: allocation.clientStatus === 'pending' ? [] : resources.mapBy('id'),
       taskGroup: taskGroup.name,
       name: allocation.name || `${taskGroup.name}.[${faker.random.number(10)}]`,
     });
 
     // Each allocation has a corresponding allocation stats running on some client.
     // Create that record, even though it's not a relationship.
-    server.create('client-allocation-stats', {
+    server.create('client-allocation-stat', {
       id: allocation.id,
-      _tasks: states.mapBy('name'),
+      _taskNames: states.mapBy('name'),
     });
   },
 });

ui/mirage/factories/node.js

@@ -108,9 +108,9 @@ export default Factory.extend({
   }),
 
   afterCreate(node, server) {
-    // Each node has a corresponding client stats resource that's queried via node IP.
+    // Each node has a corresponding client stat resource that's queried via node IP.
     // Create that record, even though it's not a relationship.
-    server.create('client-stats', {
+    server.create('client-stat', {
       id: node.httpAddr,
     });
 
@@ -122,7 +122,7 @@ export default Factory.extend({
       eventIds: events.mapBy('id'),
     });
 
-    server.create('client-stats', {
+    server.create('client-stat', {
       id: node.id,
     });
   },

ui/mirage/models/allocation.js

@@ -2,5 +2,5 @@ import { Model, hasMany } from 'ember-cli-mirage';
 
 export default Model.extend({
   task_states: hasMany('task-state'),
-  task_resources: hasMany('task-resources'),
+  task_resources: hasMany('task-resource'),
 });

ui/package.json

@@ -15,15 +15,20 @@
     "start": "./node_modules/ember-cli/bin/ember server",
     "test": "./node_modules/ember-cli/bin/ember test"
   },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
+  },
   "lint-staged": {
     "'{app,tests,config,lib,mirage}/**/*.js'": ["prettier --write", "git add"],
     "'app/styles/**/*.*'": ["prettier --write", "git add"]
   },
   "devDependencies": {
-    "@babel/plugin-proposal-object-rest-spread": "^7.3.4",
-    "@ember/jquery": "^0.5.2",
-    "@ember/optional-features": "^0.6.3",
-    "broccoli-asset-rev": "^2.7.0",
+    "@babel/plugin-proposal-object-rest-spread": "^7.4.3",
+    "@ember/jquery": "^0.6.0",
+    "@ember/optional-features": "^0.7.0",
+    "broccoli-asset-rev": "^3.0.0",
     "bulma": "0.6.1",
     "core-js": "^2.4.1",
     "d3-array": "^1.2.0",
@@ -34,33 +39,33 @@
     "d3-shape": "^1.2.0",
     "d3-time-format": "^2.1.0",
     "d3-transition": "^1.1.0",
-    "ember-ajax": "^4.0.1",
+    "ember-ajax": "^5.0.0",
     "ember-auto-import": "^1.2.21",
     "ember-cli": "~3.4.4",
     "ember-cli-babel": "^7.1.2",
     "ember-cli-dependency-checker": "^3.0.0",
     "ember-cli-deprecation-workflow": "^1.0.1",
-    "ember-cli-eslint": "^4.2.3",
+    "ember-cli-eslint": "^5.1.0",
     "ember-cli-funnel": "^0.6.1",
     "ember-cli-htmlbars": "^3.0.0",
     "ember-cli-htmlbars-inline-precompile": "^1.0.3",
-    "ember-cli-inject-live-reload": "^1.8.2",
+    "ember-cli-inject-live-reload": "^2.0.1",
     "ember-cli-mirage": "^0.4.3",
     "ember-cli-moment-shim": "^3.5.0",
     "ember-cli-page-object": "^1.15.1",
     "ember-cli-qunit": "^4.3.2",
-    "ember-cli-sass": "^7.1.2",
+    "ember-cli-sass": "^10.0.0",
     "ember-cli-sri": "^2.1.1",
     "ember-cli-string-helpers": "^1.5.0",
     "ember-cli-template-lint": "^1.0.0-beta.1",
     "ember-cli-uglify": "^2.1.0",
     "ember-composable-helpers": "^2.0.3",
-    "ember-concurrency": "^0.8.12",
+    "ember-concurrency": "^0.9.0",
     "ember-copy": "^1.0.0",
     "ember-data": "~3.4.0",
     "ember-data-model-fragments": "3.3.0",
     "ember-export-application-global": "^2.0.0",
-    "ember-fetch": "^3.4.3",
+    "ember-fetch": "^6.5.0",
     "ember-freestyle": "~0.10.0",
     "ember-inflector": "^3.0.0",
     "ember-inline-svg": "^0.2.1",
@@ -71,22 +76,21 @@
     "ember-power-select": "^2.2.3",
     "ember-resolver": "^5.0.1",
     "ember-responsive": "^3.0.0",
-    "ember-sinon": "^1.0.1",
+    "ember-sinon": "^2.2.0",
     "ember-source": "~3.4.0",
     "ember-test-selectors": "^2.1.0",
     "ember-truth-helpers": "^2.0.0",
-    "ember-welcome-page": "^3.2.0",
-    "eslint": "^4.13.1",
+    "eslint": "^5.16.0",
     "flat": "^4.0.0",
-    "fuse.js": "~3.2.0",
-    "husky": "^0.14.3",
+    "fuse.js": "^3.4.4",
+    "husky": "^1.3.1",
     "ivy-codemirror": "^2.1.0",
-    "lint-staged": "^6.0.0",
+    "lint-staged": "^8.1.5",
     "loader.js": "^4.7.0",
     "lodash.intersection": "^4.4.0",
     "prettier": "^1.4.4",
     "query-string": "^5.0.0",
-    "qunit-dom": "^0.7.1"
+    "sass": "^1.17.3"
   },
   "engines": {
     "node": "6.* || 8.* || >= 10.*"

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

@@ -74,7 +74,7 @@ module('Acceptance | allocation detail', function(hooks) {
 
   test('each task row should list high-level information for the task', async function(assert) {
     const task = server.db.taskStates.where({ allocationId: allocation.id }).sortBy('name')[0];
-    const taskResources = allocation.taskResourcesIds
+    const taskResources = allocation.taskResourceIds
       .map(id => server.db.taskResources.find(id))
       .sortBy('name')[0];
     const reservedPorts = taskResources.resources.Networks[0].ReservedPorts;

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

@@ -91,7 +91,7 @@ module('Acceptance | task detail', function(hooks) {
   });
 
   test('the addresses table lists all reserved and dynamic ports', async function(assert) {
-    const taskResources = allocation.taskResourcesIds
+    const taskResources = allocation.taskResourceIds
       .map(id => server.db.taskResources.find(id))
       .find(resources => resources.name === task.name);
     const reservedPorts = taskResources.resources.Networks[0].ReservedPorts;
@@ -102,7 +102,7 @@ module('Acceptance | task detail', function(hooks) {
   });
 
   test('each address row shows the label and value of the address', async function(assert) {
-    const taskResources = allocation.taskResourcesIds
+    const taskResources = allocation.taskResourceIds
       .map(id => server.db.taskResources.find(id))
       .findBy('name', task.name);
     const networkAddress = taskResources.resources.Networks[0].IP;