Remove ember-invoke-action (#978)

closes TryGhost/Ghost#9477
- remove ember-invoke-action in favor of straight function calls

ghost/admin/app/components/gh-cm-editor.js

@@ -2,13 +2,12 @@
 import Component from '@ember/component';
 import RSVP from 'rsvp';
 import boundOneWay from 'ghost-admin/utils/bound-one-way';
-import {InvokeActionMixin} from 'ember-invoke-action';
 import {assign} from '@ember/polyfills';
 import {bind, once, scheduleOnce} from '@ember/runloop';
 import {inject as service} from '@ember/service';
 import {task} from 'ember-concurrency';
 
-const CmEditorComponent = Component.extend(InvokeActionMixin, {
+const CmEditorComponent = Component.extend({
     lazyLoader: service(),
 
     classNameBindings: ['isFocused:focus'],
@@ -24,6 +23,11 @@ const CmEditorComponent = Component.extend(InvokeActionMixin, {
     autofocus: false,
 
     _editor: null, // reference to CodeMirror editor
+
+    // Allowed actions
+    'focus-in': () => {},
+    update: () => {},
+
     _value: boundOneWay('value'), // make sure a value exists
 
     didReceiveAttrs() {
@@ -52,7 +56,7 @@ const CmEditorComponent = Component.extend(InvokeActionMixin, {
 
     actions: {
         updateFromTextarea(value) {
-            this.invokeAction('update', value);
+            this.update(value);
         }
     },
 
@@ -104,20 +108,12 @@ const CmEditorComponent = Component.extend(InvokeActionMixin, {
     },
 
     _update(codeMirror, changeObj) {
-        once(this, this._invokeUpdateAction, codeMirror.getValue(), codeMirror, changeObj);
-    },
-
-    _invokeUpdateAction(...args) {
-        this.invokeAction('update', ...args);
+        once(this, this.update, codeMirror.getValue(), codeMirror, changeObj);
     },
 
     _focus(codeMirror, event) {
         this.set('isFocused', true);
-        once(this, this._invokeFocusAction, codeMirror.getValue(), codeMirror, event);
-    },
-
-    _invokeFocusAction(...args) {
-        this.invokeAction('focus-in', ...args);
+        once(this, this.get('focus-in'), codeMirror.getValue(), codeMirror, event);
     },
 
     _blur(/* codeMirror, event */) {

ghost/admin/app/components/gh-file-uploader.js

@@ -7,7 +7,6 @@ import {
 } from 'ghost-admin/services/ajax';
 import {computed} from '@ember/object';
 import {htmlSafe} from '@ember/string';
-import {invokeAction} from 'ember-invoke-action';
 import {isBlank} from '@ember/utils';
 import {isArray as isEmberArray} from '@ember/array';
 import {run} from '@ember/runloop';
@@ -41,6 +40,13 @@ export default Component.extend({
     failureMessage: null,
     uploadPercentage: 0,
 
+    // Allowed actions
+    fileSelected: () => {},
+    uploadStarted: () => {},
+    uploadFinished: () => {},
+    uploadSuccess: () => {},
+    uploadFailed: () => {},
+
     formData: computed('file', function () {
         let paramName = this.get('paramName');
         let file = this.get('file');
@@ -108,7 +114,7 @@ export default Component.extend({
             let validationResult = this._validate(file);
 
             this.set('file', file);
-            invokeAction(this, 'fileSelected', file);
+            this.fileSelected(file);
 
             if (validationResult === true) {
                 run.schedule('actions', this, function () {
@@ -176,7 +182,7 @@ export default Component.extend({
         let formData = this.get('formData');
         let url = this.get('url');
 
-        invokeAction(this, 'uploadStarted');
+        this.uploadStarted();
 
         ajax.post(url, {
             data: formData,
@@ -197,7 +203,7 @@ export default Component.extend({
         }).catch((error) => {
             this._uploadFailed(error);
         }).finally(() => {
-            invokeAction(this, 'uploadFinished');
+            this.uploadFinished();
         });
     },
 
@@ -211,7 +217,7 @@ export default Component.extend({
     },
 
     _uploadSuccess(response) {
-        invokeAction(this, 'uploadSuccess', response);
+        this.uploadSuccess(response);
         this.send('reset');
     },
 
@@ -233,12 +239,12 @@ export default Component.extend({
         }
 
         this.set('failureMessage', message);
-        invokeAction(this, 'uploadFailed', error);
+        this.uploadFailed(error);
     },
 
     _validate(file) {
-        if (this.get('validate')) {
-            return invokeAction(this, 'validate', file);
+        if (this.validate) {
+            return this.validate(file);
         } else {
             return this._defaultValidator(file);
         }

ghost/admin/app/components/gh-fullscreen-modal.js

@@ -2,7 +2,6 @@ import Component from '@ember/component';
 import RSVP from 'rsvp';
 import {computed} from '@ember/object';
 import {A as emberA} from '@ember/array';
-import {invokeAction} from 'ember-invoke-action';
 import {isBlank} from '@ember/utils';
 import {run} from '@ember/runloop';
 import {inject as service} from '@ember/service';
@@ -40,27 +39,21 @@ const FullScreenModalComponent = Component.extend({
 
     actions: {
         close() {
-            // Because we return the promise from invokeAction, we have
-            // to check if "close" exists first
-            if (this.get('close')) {
-                return invokeAction(this, 'close');
-            }
-
-            return RSVP.resolve();
+            return this.close();
         },
 
         confirm() {
-            if (this.get('confirm')) {
-                return invokeAction(this, 'confirm');
-            }
-
-            return RSVP.resolve();
+            return this.confirm();
         },
 
         clickOverlay() {
             this.send('close');
         }
-    }
+    },
+
+    // Allowed actions
+    close: () => RSVP.resolve(),
+    confirm: () => RSVP.resolve()
 });
 
 FullScreenModalComponent.reopenClass({

ghost/admin/app/components/gh-image-uploader.js

@@ -8,7 +8,6 @@ import {
 } from 'ghost-admin/services/ajax';
 import {computed} from '@ember/object';
 import {htmlSafe} from '@ember/string';
-import {invokeAction} from 'ember-invoke-action';
 import {isBlank} from '@ember/utils';
 import {isArray as isEmberArray} from '@ember/array';
 import {run} from '@ember/runloop';
@@ -48,6 +47,14 @@ export default Component.extend({
     _defaultUploadUrl: '/uploads/',
     _showUnsplash: false,
 
+    // Allowed actions
+    fileSelected: () => {},
+    update: () => {},
+    uploadStarted: () => {},
+    uploadFinished: () => {},
+    uploadSuccess: () => {},
+    uploadFailed: () => {},
+
     // TODO: this wouldn't be necessary if the server could accept direct
     // file uploads
     formData: computed('file', function () {
@@ -102,7 +109,7 @@ export default Component.extend({
             let validationResult = this._validate(file);
 
             this.set('file', file);
-            invokeAction(this, 'fileSelected', file);
+            this.fileSelected(file);
 
             if (validationResult === true) {
                 run.schedule('actions', this, function () {
@@ -133,7 +140,7 @@ export default Component.extend({
 
         saveUrl() {
             let url = this.get('url');
-            invokeAction(this, 'update', url);
+            this.update(url);
         }
     },
 
@@ -170,10 +177,6 @@ export default Component.extend({
         }
     },
 
-    _uploadStarted() {
-        invokeAction(this, 'uploadStarted');
-    },
-
     _uploadProgress(event) {
         if (event.lengthComputable) {
             run(() => {
@@ -183,15 +186,11 @@ export default Component.extend({
         }
     },
 
-    _uploadFinished() {
-        invokeAction(this, 'uploadFinished');
-    },
-
     _uploadSuccess(response) {
         this.set('url', response);
         this.send('saveUrl');
         this.send('reset');
-        invokeAction(this, 'uploadSuccess', response);
+        this.uploadSuccess(response);
     },
 
     _uploadFailed(error) {
@@ -215,7 +214,7 @@ export default Component.extend({
         }
 
         this.set('failureMessage', message);
-        invokeAction(this, 'uploadFailed', error);
+        this.uploadFailed(error);
     },
 
     generateRequest() {
@@ -225,7 +224,7 @@ export default Component.extend({
         // CASE: we want to upload an icon and we have to POST it to a different endpoint, expecially for icons
         let url = `${ghostPaths().apiRoot}${uploadUrl}`;
 
-        this._uploadStarted();
+        this.uploadStarted();
 
         ajax.post(url, {
             data: formData,
@@ -247,13 +246,13 @@ export default Component.extend({
         }).catch((error) => {
             this._uploadFailed(error);
         }).finally(() => {
-            this._uploadFinished();
+            this.uploadFinished();
         });
     },
 
     _validate(file) {
-        if (this.get('validate')) {
-            return invokeAction(this, 'validate', file);
+        if (this.validate) {
+            return this.validate(file);
         } else {
             return this._defaultValidator(file);
         }

ghost/admin/app/components/gh-navitem-url-input.js

@@ -1,6 +1,5 @@
 import TextField from '@ember/component/text-field';
 import validator from 'npm:validator';
-import {InvokeActionMixin} from 'ember-invoke-action';
 import {computed} from '@ember/object';
 import {run} from '@ember/runloop';
 
@@ -24,9 +23,12 @@ let isRelative = function (url) {
     return !url.match(/\s/) && !validator.isURL(url) && !url.match(/^(\/\/|#|[a-zA-Z0-9-]+:)/);
 };
 
-export default TextField.extend(InvokeActionMixin, {
+export default TextField.extend({
     classNames: 'gh-input',
 
+    // Allowed actions
+    clearErrors: () => {},
+
     isBaseUrl: computed('baseUrl', 'value', function () {
         return this.get('baseUrl') === this.get('value');
     }),
@@ -73,7 +75,7 @@ export default TextField.extend(InvokeActionMixin, {
     },
 
     keyPress(event) {
-        this.invokeAction('clearErrors');
+        this.clearErrors();
 
         // enter key
         if (event.keyCode === 13) {

ghost/admin/app/components/gh-tag-settings-form.js

@@ -4,7 +4,6 @@ import Ember from 'ember';
 import boundOneWay from 'ghost-admin/utils/bound-one-way';
 import {computed} from '@ember/object';
 import {htmlSafe} from '@ember/string';
-import {invokeAction} from 'ember-invoke-action';
 import {reads} from '@ember/object/computed';
 import {inject as service} from '@ember/service';
 
@@ -19,6 +18,10 @@ export default Component.extend({
 
     isViewingSubview: false,
 
+    // Allowed actions
+    setProperty: () => {},
+    showDeleteTagModal: () => {},
+
     scratchName: boundOneWay('tag.name'),
     scratchSlug: boundOneWay('tag.slug'),
     scratchDescription: boundOneWay('tag.description'),
@@ -98,15 +101,15 @@ export default Component.extend({
 
     actions: {
         setProperty(property, value) {
-            invokeAction(this, 'setProperty', property, value);
+            this.setProperty(property, value);
         },
 
         setCoverImage(image) {
-            this.send('setProperty', 'featureImage', image);
+            this.setProperty('featureImage', image);
         },
 
         clearCoverImage() {
-            this.send('setProperty', 'featureImage', '');
+            this.setProperty('featureImage', '');
         },
 
         openMeta() {
@@ -118,7 +121,7 @@ export default Component.extend({
         },
 
         deleteTag() {
-            invokeAction(this, 'showDeleteTagModal');
+            this.showDeleteTagModal();
         }
     },
 

ghost/admin/app/components/gh-task-button.js

@@ -1,6 +1,5 @@
 import Component from '@ember/component';
 import {computed} from '@ember/object';
-import {invokeAction} from 'ember-invoke-action';
 import {isBlank} from '@ember/utils';
 import {reads} from '@ember/object/computed';
 import {task, timeout} from 'ember-concurrency';
@@ -37,6 +36,9 @@ const GhTaskButton = Component.extend({
     failureText: 'Retry',
     failureClass: 'gh-btn-red',
 
+    // Allowed actions
+    action: () => {},
+
     isRunning: reads('task.last.isRunning'),
     runningText: reads('buttonText'),
 
@@ -113,7 +115,7 @@ const GhTaskButton = Component.extend({
             return;
         }
 
-        invokeAction(this, 'action');
+        this.action();
         task.perform();
 
         this.get('_restartAnimation').perform();

ghost/admin/app/components/gh-timezone-select.js

@@ -1,7 +1,6 @@
 import Component from '@ember/component';
 import moment from 'moment';
 import {computed} from '@ember/object';
-import {invokeAction} from 'ember-invoke-action';
 import {mapBy} from '@ember/object/computed';
 import {inject as service} from '@ember/service';
 
@@ -13,6 +12,9 @@ export default Component.extend({
     activeTimezone: null,
     availableTimezones: null,
 
+    // Allowed actions
+    update: () => {},
+
     availableTimezoneNames: mapBy('availableTimezones', 'name'),
 
     hasTimezoneOverride: computed('activeTimezone', 'availableTimezoneNames', function () {
@@ -57,7 +59,7 @@ export default Component.extend({
 
     actions: {
         setTimezone(timezone) {
-            invokeAction(this, 'update', timezone);
+            this.update(timezone);
         }
     }
 });

ghost/admin/app/components/modal-base.js

@@ -1,6 +1,5 @@
 /* global key */
 import Component from '@ember/component';
-import {invokeAction} from 'ember-invoke-action';
 import {run} from '@ember/runloop';
 
 export default Component.extend({
@@ -9,6 +8,9 @@ export default Component.extend({
 
     _previousKeymasterScope: null,
 
+    // Allowed Actions
+    closeModal: () => {},
+
     didInsertElement() {
         this._super(...arguments);
         this._setupShortcuts();
@@ -25,7 +27,7 @@ export default Component.extend({
         },
 
         closeModal() {
-            invokeAction(this, 'closeModal');
+            this.closeModal();
         }
     },
 

ghost/admin/app/components/modal-delete-subscriber.js

@@ -1,9 +1,10 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
 import {alias} from '@ember/object/computed';
-import {invokeAction} from 'ember-invoke-action';
 import {task} from 'ember-concurrency';
 
 export default ModalComponent.extend({
+    // Allowed actions
+    confirm: () => {},
 
     subscriber: alias('model'),
 
@@ -14,6 +15,6 @@ export default ModalComponent.extend({
     },
 
     deleteSubscriber: task(function* () {
-        yield invokeAction(this, 'confirm');
+        yield this.confirm();
     }).drop()
 });

ghost/admin/app/components/modal-delete-tag.js

@@ -1,10 +1,11 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
 import {alias} from '@ember/object/computed';
 import {computed} from '@ember/object';
-import {invokeAction} from 'ember-invoke-action';
 import {task} from 'ember-concurrency';
 
 export default ModalComponent.extend({
+    // Allowed actions
+    confirm: () => {},
 
     tag: alias('model'),
 
@@ -20,7 +21,7 @@ export default ModalComponent.extend({
 
     deleteTag: task(function* () {
         try {
-            yield invokeAction(this, 'confirm');
+            yield this.confirm();
         } finally {
             this.send('closeModal');
         }

ghost/admin/app/components/modal-delete-theme.js

@@ -1,9 +1,10 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
 import {alias} from '@ember/object/computed';
-import {invokeAction} from 'ember-invoke-action';
 import {task} from 'ember-concurrency';
 
 export default ModalComponent.extend({
+    // Allowed actions
+    confirm: () => {},
 
     theme: alias('model.theme'),
     download: alias('model.download'),
@@ -16,7 +17,7 @@ export default ModalComponent.extend({
 
     deleteTheme: task(function* () {
         try {
-            yield invokeAction(this, 'confirm');
+            yield this.confirm();
         } finally {
             this.send('closeModal');
         }

ghost/admin/app/components/modal-delete-user.js

@@ -1,9 +1,10 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
 import {alias} from '@ember/object/computed';
-import {invokeAction} from 'ember-invoke-action';
 import {task} from 'ember-concurrency';
 
 export default ModalComponent.extend({
+    // Allowed actions
+    confirm: () => {},
 
     user: alias('model'),
 
@@ -15,7 +16,7 @@ export default ModalComponent.extend({
 
     deleteUser: task(function* () {
         try {
-            yield invokeAction(this, 'confirm');
+            yield this.confirm();
         } finally {
             this.send('closeModal');
         }

ghost/admin/app/components/modal-import-subscribers.js

@@ -1,7 +1,6 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
 import ghostPaths from 'ghost-admin/utils/ghost-paths';
 import {computed} from '@ember/object';
-import {invokeAction} from 'ember-invoke-action';
 
 export default ModalComponent.extend({
     labelText: 'Select or drag-and-drop a CSV File',
@@ -9,6 +8,9 @@ export default ModalComponent.extend({
     response: null,
     closeDisabled: false,
 
+    // Allowed actions
+    confirm: () => {},
+
     uploadUrl: computed(function () {
         return `${ghostPaths().apiRoot}/subscribers/csv/`;
     }),
@@ -25,7 +27,7 @@ export default ModalComponent.extend({
         uploadSuccess(response) {
             this.set('response', response.meta.stats);
             // invoke the passed in confirm action
-            invokeAction(this, 'confirm');
+            this.confirm();
         },
 
         confirm() {

ghost/admin/app/components/modal-leave-editor.js

@@ -1,12 +1,15 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
-import {invokeAction} from 'ember-invoke-action';
+import RSVP from 'rsvp';
 
 export default ModalComponent.extend({
     actions: {
         confirm() {
-            invokeAction(this, 'confirm').finally(() => {
+            this.confirm().finally(() => {
                 this.send('closeModal');
             });
         }
-    }
+    },
+
+    // Allowed actions
+    confirm: () => RSVP.resolve()
 });

ghost/admin/app/components/modal-leave-settings.js

@@ -1,12 +1,15 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
-import {invokeAction} from 'ember-invoke-action';
+import RSVP from 'rsvp';
 
 export default ModalComponent.extend({
     actions: {
         confirm() {
-            invokeAction(this, 'confirm').finally(() => {
+            this.confirm().finally(() => {
                 this.send('closeModal');
             });
         }
-    }
+    },
+
+    // Allowed actions
+    confirm: () => RSVP.resolve()
 });

ghost/admin/app/components/modal-suspend-user.js

@@ -1,9 +1,10 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
 import {alias} from '@ember/object/computed';
-import {invokeAction} from 'ember-invoke-action';
 import {task} from 'ember-concurrency';
 
 export default ModalComponent.extend({
+    // Allowed actions
+    confirm: () => {},
 
     user: alias('model'),
 
@@ -15,7 +16,7 @@ export default ModalComponent.extend({
 
     suspendUser: task(function* () {
         try {
-            yield invokeAction(this, 'confirm');
+            yield this.confirm();
         } finally {
             this.send('closeModal');
         }

ghost/admin/app/components/modal-transfer-owner.js

@@ -1,10 +1,12 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
-import {invokeAction} from 'ember-invoke-action';
 import {task} from 'ember-concurrency';
 
 export default ModalComponent.extend({
     user: null,
 
+    // Allowed actions
+    confirm: () => {},
+
     actions: {
         confirm() {
             this.get('transferOwnership').perform();
@@ -13,7 +15,7 @@ export default ModalComponent.extend({
 
     transferOwnership: task(function* () {
         try {
-            yield invokeAction(this, 'confirm');
+            yield this.confirm();
         } finally {
             this.send('closeModal');
         }

ghost/admin/app/components/modal-unsuspend-user.js

@@ -1,9 +1,10 @@
 import ModalComponent from 'ghost-admin/components/modal-base';
 import {alias} from '@ember/object/computed';
-import {invokeAction} from 'ember-invoke-action';
 import {task} from 'ember-concurrency';
 
 export default ModalComponent.extend({
+    // Allowed actions
+    confirm: () => {},
 
     user: alias('model'),
 
@@ -15,7 +16,7 @@ export default ModalComponent.extend({
 
     unsuspendUser: task(function* () {
         try {
-            yield invokeAction(this, 'confirm');
+            yield this.confirm();
         } finally {
             this.send('closeModal');
         }

ghost/admin/app/components/modal-upload-theme.js

@@ -6,7 +6,6 @@ import {
 } from 'ghost-admin/services/ajax';
 import {computed} from '@ember/object';
 import {get} from '@ember/object';
-import {invokeAction} from 'ember-invoke-action';
 import {mapBy, or} from '@ember/object/computed';
 import {run} from '@ember/runloop';
 import {inject as service} from '@ember/service';
@@ -125,7 +124,7 @@ export default ModalComponent.extend({
             this.set('hasWarningsOrErrors', this.get('validationErrors.length') || this.get('validationWarnings.length'));
 
             // invoke the passed in confirm action
-            invokeAction(this, 'model.uploadSuccess', theme);
+            this.get('model.uploadSuccess')(theme);
         },
 
         uploadFailed(error) {
@@ -156,8 +155,8 @@ export default ModalComponent.extend({
         },
 
         activate() {
-            invokeAction(this, 'model.activate', this.get('theme'));
-            invokeAction(this, 'closeModal');
+            this.get('model.activate')(this.get('theme'));
+            this.closeModal();
         },
 
         closeModal() {

ghost/admin/app/utils/link-component.js

@@ -1,13 +1,12 @@
 import LinkComponent from '@ember/routing/link-component';
 import {computed} from '@ember/object';
-import {invokeAction} from 'ember-invoke-action';
 
 LinkComponent.reopen({
     active: computed('attrs.params', '_routing.currentState', function () {
         let isActive = this._super(...arguments);
 
         if (typeof this.get('alternateActive') === 'function') {
-            invokeAction(this, 'alternateActive', isActive);
+            this.get('alternateActive')(isActive);
         }
 
         return isActive;

ghost/admin/package.json

@@ -76,7 +76,6 @@
     "ember-fetch": "3.4.4",
     "ember-in-viewport": "3.0.0",
     "ember-infinity": "1.0.0-beta.1",
-    "ember-invoke-action": "1.5.0",
     "ember-light-table": "1.12.2",
     "ember-load": "0.0.12",
     "ember-load-initializers": "1.0.0",

ghost/admin/yarn.lock

@@ -3785,7 +3785,7 @@ ember-inflector@^2.0.0:
   dependencies:
     ember-cli-babel "^6.0.0"
 
-ember-invoke-action@1.5.0, ember-invoke-action@^1.5.0:
+ember-invoke-action@^1.5.0:
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/ember-invoke-action/-/ember-invoke-action-1.5.0.tgz#0370f187f39f22d54ddd039cd01aa7e685edbbec"
   dependencies: