Added ability to delete integrations (#1057)

no issue
- adds delete integration modal, and delete button on the integration page to trigger it

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

@@ -0,0 +1,25 @@
+import ModalComponent from 'ghost-admin/components/modal-base';
+import {alias} from '@ember/object/computed';
+import {inject as service} from '@ember/service';
+import {task} from 'ember-concurrency';
+
+export default ModalComponent.extend({
+    router: service(),
+    notifications: service(),
+    integration: alias('model'),
+    actions: {
+        confirm() {
+            this.deleteIntegration.perform();
+        }
+    },
+    deleteIntegration: task(function* () {
+        try {
+            yield this.confirm();
+            this.router.transitionTo('settings.integrations');
+        } catch (error) {
+            this.notifications.showAPIError(error, {key: 'integration.delete.failed'});
+        } finally {
+            this.send('closeModal');
+        }
+    }).drop()
+});

ghost/admin/app/controllers/settings/integration.js

@@ -63,6 +63,18 @@ export default Controller.extend({
             return transition.retry();
         },
 
+        deleteIntegration() {
+            this.integration.destroyRecord();
+        },
+
+        confirmIntegrationDeletion() {
+            this.set('showDeleteIntegrationModal', true);
+        },
+
+        cancelIntegrationDeletion() {
+            this.set('showDeleteIntegrationModal', false);
+        },
+      
         confirmWebhookDeletion(webhook) {
             this.set('webhookToDelete', webhook);
         },
@@ -74,6 +86,7 @@ export default Controller.extend({
         deleteWebhook() {
             return this.webhookToDelete.destroyRecord();
         }
+
     },
 
     save: task(function* () {

ghost/admin/app/routes/settings/integration.js

@@ -46,7 +46,7 @@ export default AuthenticatedRoute.extend(styleBody, CurrentUserSettings, {
         willTransition(transition) {
             let {controller} = this;
 
-            if (controller.integration.hasDirtyAttributes) {
+            if (!controller.integration.isDeleted && controller.integration.hasDirtyAttributes) {
                 transition.abort();
                 controller.send('toggleUnsavedChangesModal', transition);
                 return;

ghost/admin/app/templates/components/modal-delete-integration.hbs

@@ -0,0 +1,13 @@
+<header class="modal-header">
+    <h1>Are you sure?</h1>
+</header>
+<a class="close" href="" title="Close" {{action "closeModal"}}>{{svg-jar "close"}}<span class="hidden">Close</span></a>
+<div class="modal-body">
+    <p>
+        Deleting this integration will remove all webhooks and api keys associated with it.
+    </p>
+</div>
+<div class="modal-footer">
+    <button {{action "closeModal"}} class="gh-btn"><span>Cancel</span></button>
+    {{gh-task-button "Delete Integration" successText="Deleted" task=deleteIntegration class="gh-btn gh-btn-red gh-btn-icon"}}
+</div>

ghost/admin/app/templates/settings/integration.hbs

@@ -166,6 +166,9 @@
             </tfoot>
         </table>
     </div>
+    <button class="gh-btn gh-btn-red gh-btn-icon" {{action "confirmIntegrationDeletion"}}>
+        <span> Delete Integration </span>
+    </button>
 </section>
 
 {{#if showUnsavedChangesModal}}
@@ -175,6 +178,13 @@
         modifier="action wide"}}
 {{/if}}
 
+{{#if showDeleteIntegrationModal}}
+    {{gh-fullscreen-modal "delete-integration"
+        confirm=(action "deleteIntegration")
+        close=(action "cancelIntegrationDeletion")
+        modifier="action wide"}}
+{{/if}}
+        
 {{#if webhookToDelete}}
     {{gh-fullscreen-modal "delete-webhook"
         confirm=(action "deleteWebhook")