mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-03-11 02:12:21 -05:00
Added placeholder comment CTA button to emails
fixes https://github.com/TryGhost/Team/issues/2725 - Added to emails if labs flag enabled, comments enabled and comment CTA button enabled - Links to comment section - Design and styling not added yet
This commit is contained in:
Simon Backx
parent
56cbb15e37
commit
66c20710ba
4 changed files with 132 additions and 8 deletions
|
|
@ -25,6 +25,7 @@ class EmailServiceWrapper {
|
|||
const sentry = require('../../../shared/sentry');
|
||||
const membersRepository = membersService.api.members;
|
||||
const limitService = require('../limits');
|
||||
const labs = require('../../../shared/labs');
|
||||
|
||||
const mobiledocLib = require('../../lib/mobiledoc');
|
||||
const lexicalLib = require('../../lib/lexical');
|
||||
|
|
@ -68,7 +69,8 @@ class EmailServiceWrapper {
|
|||
linkTracking,
|
||||
memberAttributionService: memberAttribution.service,
|
||||
audienceFeedbackService: audienceFeedback.service,
|
||||
outboundLinkTagger: memberAttribution.outboundLinkTagger
|
||||
outboundLinkTagger: memberAttribution.outboundLinkTagger,
|
||||
labs
|
||||
});
|
||||
|
||||
const sendingService = new SendingService({
|
||||
|
|
|
|||
|
|
@ -59,6 +59,7 @@ class EmailRenderer {
|
|||
#memberAttributionService;
|
||||
#outboundLinkTagger;
|
||||
#audienceFeedbackService;
|
||||
#labs;
|
||||
|
||||
/**
|
||||
* @param {object} dependencies
|
||||
|
|
@ -76,6 +77,7 @@ class EmailRenderer {
|
|||
* @param {object} dependencies.memberAttributionService
|
||||
* @param {object} dependencies.audienceFeedbackService
|
||||
* @param {object} dependencies.outboundLinkTagger
|
||||
* @param {object} dependencies.labs
|
||||
*/
|
||||
constructor({
|
||||
settingsCache,
|
||||
|
|
@ -89,7 +91,8 @@ class EmailRenderer {
|
|||
linkTracking,
|
||||
memberAttributionService,
|
||||
audienceFeedbackService,
|
||||
outboundLinkTagger
|
||||
outboundLinkTagger,
|
||||
labs
|
||||
}) {
|
||||
this.#settingsCache = settingsCache;
|
||||
this.#settingsHelpers = settingsHelpers;
|
||||
|
|
@ -103,6 +106,7 @@ class EmailRenderer {
|
|||
this.#memberAttributionService = memberAttributionService;
|
||||
this.#audienceFeedbackService = audienceFeedbackService;
|
||||
this.#outboundLinkTagger = outboundLinkTagger;
|
||||
this.#labs = labs;
|
||||
}
|
||||
|
||||
getSubject(post) {
|
||||
|
|
@ -559,6 +563,9 @@ class EmailRenderer {
|
|||
0
|
||||
).href.replace('--uuid--', '%%{uuid}%%');
|
||||
|
||||
const commentUrl = new URL(postUrl);
|
||||
commentUrl.hash = '#ghost-comments-root';
|
||||
|
||||
const data = {
|
||||
site: {
|
||||
title: this.#settingsCache.get('title'),
|
||||
|
|
@ -574,6 +581,7 @@ class EmailRenderer {
|
|||
post: {
|
||||
title: post.get('title'),
|
||||
url: postUrl,
|
||||
commentUrl: commentUrl.href,
|
||||
authors,
|
||||
publishedAt,
|
||||
feature_image: postFeatureImage,
|
||||
|
|
@ -584,7 +592,8 @@ class EmailRenderer {
|
|||
|
||||
newsletter: {
|
||||
name: newsletter.get('name'),
|
||||
showPostTitleSection: newsletter.get('show_post_title_section')
|
||||
showPostTitleSection: newsletter.get('show_post_title_section'),
|
||||
showCommentCta: newsletter.get('show_comment_cta') && this.#settingsCache.get('comments_enabled') !== 'off' && this.#labs.isSet('makingItRain')
|
||||
},
|
||||
|
||||
//CSS
|
||||
|
|
|
|||
|
|
@ -82,7 +82,7 @@
|
|||
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%">
|
||||
<tr>
|
||||
<td class="{{classes.meta}}">
|
||||
By {{post.authors}} – <span class="post-meta-date">{{post.publishedAt}} – </span><a href="{{post.url}}" class="view-online-link">View online →</a>
|
||||
By {{post.authors}} – <span class="post-meta-date">{{post.publishedAt}} – </span><a href="{{post.url}}" class="view-online-link">View online →</a>{{#if newsletter.showCommentCta}} <a href="{{post.commentUrl}}" class="view-online-link">Comment</a>{{/if}}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
|
@ -129,14 +129,22 @@
|
|||
|
||||
<!-- END MAIN CONTENT AREA -->
|
||||
|
||||
{{#if feedbackButtons }}
|
||||
{{#if (or feedbackButtons newsletter.showCommentCta) }}
|
||||
<tr>
|
||||
<td dir="ltr" width="100%" style="background-color: #ffffff; text-align: center; padding: 40px 4px; border-bottom: 1px solid #e5eff5" align="center">
|
||||
<h3 style="text-align: center; margin-bottom: 22px; font-size: 17px; letter-spacing: -0.2px; margin-top: 0 !important;">Give feedback on this post</h3>
|
||||
{{#if feedbackButtons }}
|
||||
<h3 style="text-align: center; margin-bottom: 22px; font-size: 17px; letter-spacing: -0.2px; margin-top: 0 !important;">Give feedback on this post</h3>
|
||||
{{/if}}
|
||||
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="margin: auto; width: auto !important;">
|
||||
<tr>
|
||||
{{> feedbackButton feedbackButtons href=feedbackButtons.likeHref buttonText='More like this' iconUrl="https://static.ghost.org/v5.0.0/images/more-like-this.png" }}
|
||||
{{> feedbackButton feedbackButtons href=feedbackButtons.dislikeHref buttonText='Less like this' iconUrl="https://static.ghost.org/v5.0.0/images/less-like-this.png" }}
|
||||
{{#if feedbackButtons }}
|
||||
{{> feedbackButton feedbackButtons href=feedbackButtons.likeHref buttonText='More like this' iconUrl="https://static.ghost.org/v5.0.0/images/more-like-this.png" }}
|
||||
{{> feedbackButton feedbackButtons href=feedbackButtons.dislikeHref buttonText='Less like this' iconUrl="https://static.ghost.org/v5.0.0/images/less-like-this.png" }}
|
||||
{{/if}}
|
||||
{{#if newsletter.showCommentCta}}
|
||||
{{!-- TODO: replace image with comment image --}}
|
||||
{{> feedbackButton href=post.commentUrl buttonText='Comment' iconUrl="https://static.ghost.org/v5.0.0/images/less-like-this.png" }}
|
||||
{{/if}}
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -80,6 +80,9 @@ describe('Email renderer', function () {
|
|||
emailRenderer = new EmailRenderer({
|
||||
urlUtils: {
|
||||
urlFor: () => 'http://example.com/subdirectory'
|
||||
},
|
||||
labs: {
|
||||
isSet: () => true
|
||||
}
|
||||
});
|
||||
newsletter = createModel({
|
||||
|
|
@ -178,6 +181,9 @@ describe('Email renderer', function () {
|
|||
const emailRenderer = new EmailRenderer({
|
||||
urlUtils: {
|
||||
urlFor: () => 'http://example.com'
|
||||
},
|
||||
labs: {
|
||||
isSet: () => true
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -220,6 +226,9 @@ describe('Email renderer', function () {
|
|||
getNoReplyAddress: () => {
|
||||
return 'reply@example.com';
|
||||
}
|
||||
},
|
||||
labs: {
|
||||
isSet: () => true
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -277,6 +286,9 @@ describe('Email renderer', function () {
|
|||
getNoReplyAddress: () => {
|
||||
return 'reply@example.com';
|
||||
}
|
||||
},
|
||||
labs: {
|
||||
isSet: () => true
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -317,6 +329,9 @@ describe('Email renderer', function () {
|
|||
},
|
||||
getPostUrl: () => {
|
||||
return 'http://example.com/post-id';
|
||||
},
|
||||
labs: {
|
||||
isSet: () => true
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -353,6 +368,9 @@ describe('Email renderer', function () {
|
|||
},
|
||||
getPostUrl: () => {
|
||||
return 'http://example.com/post-id';
|
||||
},
|
||||
labs: {
|
||||
isSet: () => true
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -378,6 +396,9 @@ describe('Email renderer', function () {
|
|||
},
|
||||
getPostUrl: () => {
|
||||
return 'http://example.com/post-id';
|
||||
},
|
||||
labs: {
|
||||
isSet: () => true
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -467,6 +488,9 @@ describe('Email renderer', function () {
|
|||
u.searchParams.append('source_tracking', newsletter?.get('name') ?? 'site');
|
||||
return u;
|
||||
}
|
||||
},
|
||||
labs: {
|
||||
isSet: () => true
|
||||
}
|
||||
});
|
||||
let basePost;
|
||||
|
|
@ -913,6 +937,7 @@ describe('Email renderer', function () {
|
|||
|
||||
describe('getTemplateData', function () {
|
||||
let settings = {};
|
||||
let labsEnabled = true;
|
||||
const emailRenderer = new EmailRenderer({
|
||||
audienceFeedbackService: {
|
||||
buildLink: (_uuid, _postId, score) => {
|
||||
|
|
@ -937,11 +962,15 @@ describe('Email renderer', function () {
|
|||
},
|
||||
getPostUrl: () => {
|
||||
return 'http://example.com';
|
||||
},
|
||||
labs: {
|
||||
isSet: () => labsEnabled
|
||||
}
|
||||
});
|
||||
|
||||
beforeEach(function () {
|
||||
settings = {};
|
||||
labsEnabled = true;
|
||||
});
|
||||
|
||||
it('uses default accent color', async function () {
|
||||
|
|
@ -1014,6 +1043,82 @@ describe('Email renderer', function () {
|
|||
body: 'post-content-sans-serif'
|
||||
});
|
||||
});
|
||||
|
||||
it('show comment CTA is disabled if labs disabled', async function () {
|
||||
labsEnabled = false;
|
||||
settings.comments_enabled = 'all';
|
||||
const html = '';
|
||||
const post = createModel({
|
||||
posts_meta: createModel({}),
|
||||
loaded: ['posts_meta'],
|
||||
published_at: new Date(0)
|
||||
});
|
||||
const newsletter = createModel({
|
||||
title_font_category: 'serif',
|
||||
title_alignment: 'left',
|
||||
body_font_category: 'sans_serif',
|
||||
show_comment_cta: true
|
||||
});
|
||||
const data = await emailRenderer.getTemplateData({post, newsletter, html, addPaywall: false});
|
||||
assert.equal(data.newsletter.showCommentCta, false);
|
||||
});
|
||||
|
||||
it('show comment CTA is disabled if comments disabled', async function () {
|
||||
labsEnabled = true;
|
||||
settings.comments_enabled = 'off';
|
||||
const html = '';
|
||||
const post = createModel({
|
||||
posts_meta: createModel({}),
|
||||
loaded: ['posts_meta'],
|
||||
published_at: new Date(0)
|
||||
});
|
||||
const newsletter = createModel({
|
||||
title_font_category: 'serif',
|
||||
title_alignment: 'left',
|
||||
body_font_category: 'sans_serif',
|
||||
show_comment_cta: true
|
||||
});
|
||||
const data = await emailRenderer.getTemplateData({post, newsletter, html, addPaywall: false});
|
||||
assert.equal(data.newsletter.showCommentCta, false);
|
||||
});
|
||||
|
||||
it('show comment CTA is disabled if disabled', async function () {
|
||||
labsEnabled = true;
|
||||
settings.comments_enabled = 'all';
|
||||
const html = '';
|
||||
const post = createModel({
|
||||
posts_meta: createModel({}),
|
||||
loaded: ['posts_meta'],
|
||||
published_at: new Date(0)
|
||||
});
|
||||
const newsletter = createModel({
|
||||
title_font_category: 'serif',
|
||||
title_alignment: 'left',
|
||||
body_font_category: 'sans_serif',
|
||||
show_comment_cta: false
|
||||
});
|
||||
const data = await emailRenderer.getTemplateData({post, newsletter, html, addPaywall: false});
|
||||
assert.equal(data.newsletter.showCommentCta, false);
|
||||
});
|
||||
|
||||
it('show comment CTA is enabled if all enabled', async function () {
|
||||
labsEnabled = true;
|
||||
settings.comments_enabled = 'all';
|
||||
const html = '';
|
||||
const post = createModel({
|
||||
posts_meta: createModel({}),
|
||||
loaded: ['posts_meta'],
|
||||
published_at: new Date(0)
|
||||
});
|
||||
const newsletter = createModel({
|
||||
title_font_category: 'serif',
|
||||
title_alignment: 'left',
|
||||
body_font_category: 'sans_serif',
|
||||
show_comment_cta: true
|
||||
});
|
||||
const data = await emailRenderer.getTemplateData({post, newsletter, html, addPaywall: false});
|
||||
assert.equal(data.newsletter.showCommentCta, true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('createUnsubscribeUrl', function () {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue