Added test preview email to post email settings

no issue
TryGhost · Nov 5, 2019 · 6901edf · 6901edf
1 parent 7f63e3c
commit 6901edf
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 18 deletions.
diff --git a/app/components/gh-post-settings-menu.js b/app/components/gh-post-settings-menu.js
@@ -15,6 +15,7 @@ export default Component.extend(SettingsMenuMixin, {
     feature: service(),
     store: service(),
     config: service(),
+    ajax: service(),
     ghostPaths: service(),
     notifications: service(),
     slugGenerator: service(),
@@ -27,6 +28,7 @@ export default Component.extend(SettingsMenuMixin, {
     _showSettingsMenu: false,
     _showThrobbers: false,
 
+    emailTestScratch: '',
     canonicalUrlScratch: alias('post.canonicalUrlScratch'),
     customExcerptScratch: alias('post.customExcerptScratch'),
     codeinjectionFootScratch: alias('post.codeinjectionFootScratch'),
@@ -46,7 +48,7 @@ export default Component.extend(SettingsMenuMixin, {
     twitterDescription: or('twitterDescriptionScratch', 'customExcerptScratch', 'seoDescription'),
     twitterImage: or('post.twitterImage', 'post.featureImage'),
     twitterTitle: or('twitterTitleScratch', 'seoTitle'),
-    emailSubject: alias('emailSubjectScratch', 'post.title'),
+    emailSubject: or('emailSubjectScratch', 'post.title'),
 
     showVisibilityInput: or('session.user.isOwner', 'session.user.isAdmin', 'session.user.isEditor'),
 
@@ -410,6 +412,19 @@ export default Component.extend(SettingsMenuMixin, {
                 return this.savePost.perform();
             });
         },
+
+        async sendTestEmail() {
+            const resourceId = this.post.id;
+            const testEmail = this.emailTestScratch;
+            const url = this.get('ghostPaths.url').api('/email_preview/posts', resourceId);
+            const data = {emails: [testEmail]};
+            const options = {
+                data,
+                dataType: 'json'
+            };
+            console.log('Resource id', resourceId, url, options);
+            await this.ajax.post(url, options);
+        },
 
         setEmailSubject(emailSubject) {
             // Grab the post and current stored email subject

diff --git a/app/components/modal-post-email-preview.js b/app/components/modal-post-email-preview.js
@@ -22,7 +22,7 @@ export default ModalComponent.extend({
             const url = this.get('ghostPaths.url').api('/email_preview/posts', resourceId);
             let htmlData = this.get('previewHtml');
             if (!htmlData) {
-                const response = await this.ajax.request(`${url}`);
+                const response = await this.ajax.request(url);
                 let [emailPreview] = response.email_previews;
                 htmlData = emailPreview.html;
             }

diff --git a/app/templates/components/gh-post-settings-menu.hbs b/app/templates/components/gh-post-settings-menu.hbs
@@ -339,22 +339,21 @@
                                 {{/gh-form-group}}
                                 <div class="form-group">
                                     <label>Test and Preview</label>
-                                    <div class="gh-twitter-preview">
-                                        {{#if twitterImage}}
-                                            <div class="gh-twitter-preview-image" style={{background-image-style twitterImage}}></div>
-                                        {{/if}}
-                                        <div class="gh-twitter-preview-content">
-                                            <div class="gh-twitter-preview-title">{{twitterTitle}}</div>
-                                            <div class="gh-twitter-preview-description">{{truncate twitterDescription 155}}</div>
-                                            <div class="gh-twitter-preview-footer">
-                                                <div class="gh-twitter-preview-footer-left">
-                                                    {{config.blogDomain}}
-                                                </div>
-                                                <div class="gh-twitter-preview-footer-right">
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
+                                        {{gh-text-input
+                                            class="post-setting-email-test"
+                                            id="email-test"
+                                            name="post-setting-email-test"
+                                            placeholder=(truncate 'noreply@example.com' 40)
+                                            value=(readonly emailTestScratch)
+                                            input=(action (mut emailTestScratch) value="target.value")
+                                            stopEnterKeyDownPropagation=true
+                                            data-test-field="email-test"}}
+                                    <button type="button" class="gh-btn gh-btn-icon w-100 mt4 mb4"
+                                        onclick={{action "sendTestEmail"}} data-test-button="send-test-email">
+                                        <span>
+                                            Send Test Email
+                                        </span>
+                                    </button>
                                     <button type="button" class="gh-btn gh-btn-icon"
                                         onclick={{action "toggleEmailPreview"}} data-test-button="toggle-email-preview">
                                         <span>