[#31] Remove jQuery

* [x] Strip jQuery in ember-cli-build.js
* [x] Try to ember-data to use ember-fetch instead of $.ajax
* [x] app/adapters/application.js added the authorization: <bearer token> header to outgoing requests
* [x] ma-create-media guards against disabled button
* [x] updated dependencies

app/adapters/application.js

@@ -1,12 +1,28 @@
-import DS from 'ember-data';
-import DataAdapterMixin from 'ember-simple-auth/mixins/data-adapter-mixin';
+import { get } from '@ember/object';
+import { inject as service } from '@ember/service';
+import JSONAPIAdapter from 'ember-data/adapters/json-api';
+import AdapterFetchMixin from 'ember-fetch/mixins/adapter-fetch';
 import config from 'mir/config/environment';
 
-export default DS.JSONAPIAdapter.extend(DataAdapterMixin, {
+export default JSONAPIAdapter.extend(AdapterFetchMixin, {
+  session: service(),
+
   /* Ember */
   host: config.DS.host,
   namespace: config.DS.namespace,
 
-  /* ember-simple-auth */
-  authorizer: 'authorizer:oauth2'
+  /* DataAdapterMixin */
+  authorizer: 'authorizer:oauth2',
+
+  /* mir */
+  ajaxOptions() {
+    const authorizer = get(this, 'authorizer');
+    const options = this._super(...arguments) || {};
+    options.headers = options.headers || {};
+    options.headers['Content-Type'] = 'application/vnd.api+json';
+    get(this, 'session').authorize(authorizer, (headerName, headerValue) => {
+      options.headers[headerName] = headerValue;
+    });
+    return options;
+  }
 });

app/components/ma-create-media.js

@@ -1,5 +1,5 @@
 import Component from '@ember/component';
-import { computed, get, getProperties, set } from '@ember/object';
+import { computed, get, set } from '@ember/object';
 import { alias, or } from '@ember/object/computed';
 import { inject as service } from '@ember/service';
 import Changeset from 'ember-changeset';
@@ -16,7 +16,6 @@ export default Component.extend({
   isLoading: false,
   tagName: 'form',
 
-  hasCompleted: false,
   media: null,
 
   errors: alias('errorMessageKeys'),
@@ -37,14 +36,6 @@ export default Component.extend({
   onFailure: () => {}, // noOp callback if caller doesn't pass onFailure in.
   onSuccess: () => {}, // noOp callback if caller doesn't pass onSuccess in.
 
-  didDestroyElement() {
-    let { hasCompleted, media } = getProperties(this, 'hasCompleted', 'media');
-    if (!hasCompleted) {
-      // `media` creation was not completed, so cleanup the bare `media` model.
-      if (media !== null) media.destroyRecord();
-    }
-  },
-
   init() {
     this._super(...arguments);
     set(this, 'errorMessageKeys', []);
@@ -73,16 +64,12 @@ export default Component.extend({
       .save()
       .then((/* data */) => {
         set(this, 'isLoading', false);
-        // set hasCompleted to prevent `didDestroyElement` from deleting model
-        set(this, 'hasCompleted', true);
         let onSuccess = get(this, 'onSuccess');
         if (typeof onSuccess === 'function') onSuccess();
         return;
       })
       .catch(error => {
         set(this, 'isLoading', false);
-        // set hasCompleted to prevent `didDestroyElement` from deleting model
-        set(this, 'hasCompleted', false);
         this._handleError(error);
         let onFailure = get(this, 'onFailure');
         if (typeof onFailure === 'function') onFailure();
@@ -100,7 +87,8 @@ export default Component.extend({
 
   actions: {
     add(changeset) {
-      this._createMedia(changeset);
+      let isDisabled = get(this, 'isDisabled');
+      if (!isDisabled) this._createMedia(changeset);
     }
   }
 });

app/routes/media/new.js

@@ -1,12 +1,11 @@
 import Route from '@ember/routing/route';
 import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';
-import { get, getProperties, set } from '@ember/object';
+import { get, set } from '@ember/object';
 import Changeset from 'ember-changeset';
 import lookupValidator from 'ember-changeset-validations';
 import MediaValidations from 'mir/validations/media';
 
 export default Route.extend(AuthenticatedRouteMixin, {
-  hasCompleted: false,
   media: null,
 
   model() {
@@ -20,25 +19,18 @@ export default Route.extend(AuthenticatedRouteMixin, {
   },
 
   deactivate() {
-    // `model()` creates a stub media model and sets it to the changeset, this
+    let media = get(this, 'media');
+    // `model()` creates an empty media model and sets it to the changeset, this
     // creates an Ember Data model that'll be listed on the index route if the
-    // user aborts adding a new one, so we use hasCompleted to determine if it
-    // was created, and clean it up if not created.
-    let { hasCompleted, media } = getProperties(this, 'hasCompleted', 'media');
-    if (!hasCompleted) {
-      // `media` creation was not completed, cleanup the bare `media` model.
-      try {
-        media.destroyRecord();
-      } catch (error) {
-        /* Ignore: Only occurs in testing */
-      }
-    }
+    // user aborts adding a new one, so we call rollbackAttributes to cleanup
+    // any unsaved models.
+    // `media` was never saved, cleanup empty `media` model.
+    media.rollbackAttributes();
   },
 
   actions: {
     onCreated() {
       // set hasCompleted to prevent `deactivate` from deleting new model
-      set(this, 'hasCompleted', true);
       return this.transitionTo('index');
     }
   }

ember-cli-build.js

@@ -7,7 +7,6 @@ const VERSION = GETENVJSON().version;
 
 module.exports = function(defaults) {
   let app = new EmberApp(defaults, {
-    // Add options here
     fingerprint: {
       extensions: ['css', 'gif', 'js', 'jpg', 'png', 'map', 'svg']
     },
@@ -30,6 +29,10 @@ module.exports = function(defaults) {
 
     svgJar: {
       sourceDirs: ['public/images']
+    },
+
+    vendorFiles: {
+      'jquery.js': null // removes jQuery from build
     }
   });
 

mirage/config.js

@@ -71,5 +71,7 @@ export default function() {
   this.del('/medias/:id', (schema, request) => {
     let media = schema.medias.find(request.params.id);
     media.destroy();
+    // TODO: Hacks
+    return { data: null }; // i shouldn't have to return anything here
   });
 }

package.json

@@ -46,7 +46,7 @@
     "ember-cli-one-script": "^0.0.1",
     "ember-cli-qunit": "4.3.2",
     "ember-cli-release": "^1.0.0-beta.2",
-    "ember-cli-sass": "^7.1.4",
+    "ember-cli-sass": "^7.1.5",
     "ember-cli-shims": "^1.1.0",
     "ember-cli-sri": "^2.1.1",
     "ember-cli-template-lint": "^0.7.5",
@@ -57,16 +57,16 @@
     "ember-export-application-global": "^2.0.0",
     "ember-fetch": "^3.4.4",
     "ember-i18n": "^5.1.0",
-    "ember-i18n-changeset-validations": "^1.0.0",
+    "ember-i18n-changeset-validations": "^1.1.0",
     "ember-load-initializers": "^1.0.0",
     "ember-page-title": "^4.0.3",
     "ember-resolver": "^4.5.0",
     "ember-route-action-helper": "^2.0.6",
-    "ember-simple-auth": "^1.4.2",
+    "ember-simple-auth": "^1.5.0",
     "ember-source": "~3.0.0",
     "ember-svg-jar": "^0.12.0",
     "ember-test-component": "^0.2.1",
-    "eslint": "^4.17.0",
+    "eslint": "^4.18.0",
     "eslint-config-prettier": "^2.9.0",
     "eslint-plugin-ember": "^5.0.0",
     "eslint-plugin-prettier": "^2.6.0",

tests/acceptance/media/new-test.js

@@ -51,7 +51,6 @@ module('Application | media/new', function(hooks) {
     });
 
     test('can add and delete valid media', async function(assert) {
-      server.logging = true;
       assert.expect(3);
       // create an OAuth token w/ ember-cli-mirage
       await visit('/media/new');