Converted delete-post modal to EPM based modal

refs https://github.com/TryGhost/Team/issues/559

- moved the modal component class and template into a `components/modals/` directory to keep the top-level dir cleaner
- migrated component class to glimmer syntax
- moved route transition behaviour directly into the class to avoid weird route-action indirection

ghost/admin/app/components/modal-delete-post.hbs

@@ -1,15 +0,0 @@
-<header class="modal-header">
-    <h1>Are you sure you want to delete this {{this.post.displayName}}?</h1>
-</header>
-<a class="close" href="" role="button" title="Close" {{action "closeModal"}}>{{svg-jar "close"}}<span class="hidden">Close</span></a>
-
-<div class="modal-body">
-    <p>
-        You're about to delete "<strong>{{this.post.title}}</strong>". This is permanent! We warned you, k?
-    </p>
-</div>
-
-<div class="modal-footer">
-    <button {{action "closeModal"}} class="gh-btn"><span>Cancel</span></button>
-    <GhTaskButton @buttonText="Delete" @successText="Deleted" @task={{this.deletePost}} @class="gh-btn gh-btn-red gh-btn-icon" />
-</div>

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

@@ -1,52 +0,0 @@
-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({
-    notifications: service(),
-
-    post: alias('model.post'),
-    onSuccess: alias('model.onSuccess'),
-
-    actions: {
-        confirm() {
-            this.deletePost.perform();
-        }
-    },
-
-    _deletePost() {
-        let post = this.post;
-
-        // definitely want to clear the data store and post of any unsaved,
-        // client-generated tags
-        post.updateTags();
-
-        return post.destroyRecord();
-    },
-
-    _success() {
-        // clear any previous error messages
-        this.notifications.closeAlerts('post.delete');
-
-        // trigger the success action
-        if (this.onSuccess) {
-            this.onSuccess();
-        }
-    },
-
-    _failure(error) {
-        this.notifications.showAPIError(error, {key: 'post.delete.failed'});
-    },
-
-    deletePost: task(function* () {
-        try {
-            yield this._deletePost();
-            this._success();
-        } catch (e) {
-            this._failure(e);
-        } finally {
-            this.send('closeModal');
-        }
-    }).drop()
-});

ghost/admin/app/components/modals/delete-post.hbs

@@ -0,0 +1,23 @@
+<div class="modal-content">
+    <header class="modal-header">
+        <h1>Are you sure you want to delete this {{@data.post.displayName}}?</h1>
+    </header>
+    <button type="button" class="close" title="Close" {{on "click" @close}}>{{svg-jar "close"}}<span class="hidden">Close</span></button>
+
+    <div class="modal-body">
+        <p>
+            You're about to delete "<strong>{{@data.post.title}}</strong>".
+            This is permanent! We warned you, k?
+        </p>
+    </div>
+
+    <div class="modal-footer">
+        <button type="button" class="gh-btn" {{on "click" @close}}><span>Cancel</span></button>
+        <GhTaskButton
+            @buttonText="Delete"
+            @successText="Deleted"
+            @task={{this.deletePostTask}}
+            @class="gh-btn gh-btn-red gh-btn-icon"
+        />
+    </div>
+</div>

ghost/admin/app/components/modals/delete-post.js

@@ -0,0 +1,26 @@
+import Component from '@glimmer/component';
+import {inject as service} from '@ember/service';
+import {task} from 'ember-concurrency-decorators';
+
+export default class DeletePostModalComponent extends Component {
+    @service notifications;
+    @service router;
+
+    @task
+    *deletePostTask() {
+        try {
+            const {post} = this.args.data;
+
+            // clear the data store and post of any unsaved client-generated tags before deleting
+            post.updateTags();
+            yield post.destroyRecord();
+
+            this.notifications.closeAlerts('post.delete');
+            this.router.transitionTo(post.displayName === 'page' ? 'pages' : 'posts');
+        } catch (error) {
+            this.notifications.showAPIError(error, {key: 'post.delete.failed'});
+        } finally {
+            this.args.close();
+        }
+    }
+}

ghost/admin/app/controllers/editor.js

@@ -95,6 +95,7 @@ export default Controller.extend({
     config: service(),
     feature: service(),
     membersCountCache: service(),
+    modals: service(),
     notifications: service(),
     router: service(),
     slugGenerator: service(),
@@ -106,7 +107,6 @@ export default Controller.extend({
 
     leaveEditorTransition: null,
     shouldFocusTitle: false,
-    showDeletePostModal: false,
     showLeaveEditorModal: false,
     showReAuthenticateModal: false,
     showEmailPreviewModal: false,
@@ -275,7 +275,7 @@ export default Controller.extend({
             return transition.retry();
         },
 
-        toggleDeletePostModal() {
+        openDeletePostModal() {
             if (!this.get('post.isNew')) {
                 this.modals.open('modals/delete-post', {
                     post: this.post

ghost/admin/app/routes/editor.js

@@ -67,10 +67,6 @@ export default AuthenticatedRoute.extend(ShortcutsRoute, {
             this.controller.send('toggleReAuthenticateModal');
         },
 
-        redirectToContentScreen(displayName) {
-            this.transitionTo(displayName === 'page' ? 'pages' : 'posts');
-        },
-
         willTransition(transition) {
             // exit early if an upgrade is required because our extended route
             // class will abort the transition and show an error

ghost/admin/app/templates/editor.hbs

@@ -108,7 +108,7 @@
             <GhPostSettingsMenu
                 @post={{this.post}}
                 @toggleEmailPreviewModal={{action "toggleEmailPreviewModal"}}
-                @deletePost={{action "toggleDeletePostModal"}}
+                @deletePost={{action "openDeletePostModal"}}
                 @updateSlugTask={{this.updateSlugTask}}
                 @savePostTask={{this.savePostTask}}
             />
@@ -123,13 +123,6 @@
         {{/if}}
     </button>
 
-    {{#if this.showDeletePostModal}}
-        <GhFullscreenModal @modal="delete-post"
-            @model={{hash post=this.post onSuccess=(route-action 'redirectToContentScreen' this.post.displayName)}}
-            @close={{action "toggleDeletePostModal"}}
-            @modifier="action wide" />
-    {{/if}}
-
     {{#if this.showLeaveEditorModal}}
         <GhFullscreenModal @modal="leave-editor"
             @confirm={{action "leaveEditor"}}