0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-04-15 03:01:37 -05:00

Created separate table templates for posts with emailClicks enabled

refs https://github.com/TryGhost/Team/issues/1892
This commit is contained in:
Simon Backx 2022-09-13 11:57:05 +02:00
parent e8f4e106dd
commit 06e4eb0c77
7 changed files with 322 additions and 88 deletions

View file

@ -847,3 +847,8 @@ add|ember-template-lint|no-action|13|36|13|36|addf24b8fbd6518060e412ec8b95309a05
add|ember-template-lint|no-action|16|32|16|32|5bf020bb7cafdcfbcf809310232be927a9f1b2e4|1663027200000|1673398800000|1678582800000|app/templates/posts.hbs
add|ember-template-lint|no-action|19|29|19|29|e3023c525990c1f8d1a30aa6ff20eb3bad8ec53b|1663027200000|1673398800000|1678582800000|app/templates/posts.hbs
add|ember-template-lint|no-action|22|31|22|31|cbf4e21da2010b9af11294f458ef2ad40374d4f0|1663027200000|1673398800000|1678582800000|app/templates/posts.hbs
add|ember-template-lint|no-action|10|30|10|30|7f6ae6475e94edfe22b59577ca52d10ec66835af|1663027200000|1673398800000|1678582800000|app/templates/posts-clicks.hbs
add|ember-template-lint|no-action|13|36|13|36|addf24b8fbd6518060e412ec8b95309a05254988|1663027200000|1673398800000|1678582800000|app/templates/posts-clicks.hbs
add|ember-template-lint|no-action|16|32|16|32|5bf020bb7cafdcfbcf809310232be927a9f1b2e4|1663027200000|1673398800000|1678582800000|app/templates/posts-clicks.hbs
add|ember-template-lint|no-action|19|29|19|29|e3023c525990c1f8d1a30aa6ff20eb3bad8ec53b|1663027200000|1673398800000|1678582800000|app/templates/posts-clicks.hbs
add|ember-template-lint|no-action|22|31|22|31|cbf4e21da2010b9af11294f458ef2ad40374d4f0|1663027200000|1673398800000|1678582800000|app/templates/posts-clicks.hbs

View file

@ -0,0 +1,146 @@
{{!-- template-lint-disable no-invalid-interactive --}}
<li class="gh-list-row gh-posts-list-item gh-post-list-plain-status"
{{on "mouseover" this.mouseOver}}
{{on "mouseleave" this.mouseLeave}}
...attributes
>
{{!-- Title column --}}
{{#if (and this.session.user.isContributor @post.isPublished)}}
<a href={{@post.url}} class="permalink gh-list-data gh-post-list-title" target="_blank" rel="noopener noreferrer">
<h3 class="gh-content-entry-title">
{{@post.title}} {{svg-jar "external" class="gh-post-list-external"}}
</h3>
{{#unless @hideAuthor }}
<p>
<span class="gh-content-entry-meta">
By <span class="midgrey-l2 fw5">{{post-author-names @post}}</span>
{{#if @post.primaryTag}}
in <span class="midgrey-l2 fw5">{{@post.primaryTag.name}}</span>
{{/if}}
• <span data-tooltip="{{gh-format-post-time @post.updatedAtUTC "D MMM YYYY"}}">{{gh-format-post-time @post.updatedAtUTC draft=true}}</span>
</span>
</p>
{{/unless}}
</a>
{{else}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-title">
<h3 class="gh-content-entry-title">
{{@post.title}}
</h3>
{{#unless @hideAuthor }}
<p>
<span class="gh-content-entry-meta">
By <span class="midgrey-l2 fw5">{{post-author-names @post}}</span>
{{#if @post.primaryTag}}
in <span class="midgrey-l2 fw5">{{@post.primaryTag.name}}</span>
{{/if}}
• <span data-tooltip="{{gh-format-post-time @post.updatedAtUTC "D MMM YYYY"}}">{{gh-format-post-time @post.updatedAtUTC draft=true}}</span>
</span>
</p>
{{/unless}}
</LinkTo>
{{/if}}
{{!-- Status column --}}
{{#unless @hideStatusColumn }}
{{#if (and this.session.user.isContributor @post.isPublished)}}
<a href={{@post.url}} class="permalink gh-list-data gh-post-list-status" target="_blank" rel="noopener noreferrer">
<div class="flex items-center">
<span class="gh-content-status-published nowrap">
{{svg-jar "check" class="gh-post-status-icon"}}
Published
{{#if @post.hasEmail}}
&amp; Sent
{{/if}}
</span>
</div>
</a>
{{else}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-status">
<div class="flex items-center">
{{#if @post.isScheduled}}
<span class="gh-content-status-scheduled gh-badge nowrap" title="Scheduled" data-tooltip="To be published {{if @post.newsletter "& sent at "}}{{capitalize this.scheduledText}} to {{@post.emailSegment}} members">
{{svg-jar "clock" class="gh-post-status-icon"}}
Scheduled
</span>
{{/if}}
{{#if @post.isDraft}}
<span class="gh-content-status-draft gh-badge gh-badge-pink nowrap">
{{svg-jar "pen" class="gh-post-status-icon"}}
Draft
</span>
{{/if}}
{{#if @post.isPublished}}
<span class="gh-content-status-published nowrap">
{{svg-jar "check" class="gh-post-status-icon"}}
Published
{{#if @post.hasEmail}}
&amp; Sent
{{/if}}
</span>
{{/if}}
{{#if @post.isSent}}
<span class="gh-content-status-emailed nowrap">
{{svg-jar "email-stroke" class="gh-post-status-icon"}}
Sent
</span>
{{/if}}
</div>
</LinkTo>
{{/if}}
{{/unless}}
{{!-- Opens and clicks columns --}}
{{#if (and (not-eq this.settings.membersSignupAccess "none") (not-eq this.settings.editorDefaultEmailRecipients "disabled") (not this.session.user.isContributor) this.feature.emailAnalytics (eq @post.displayName "post"))}}
{{!-- Opens column --}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-opens">
{{#if (and @post.email.trackOpens (eq @post.email.status "submitted"))}}
<div class="flex">
{{#if (and this.feature.memberAttribution (not this.feature.emailClicks))}}
<span class="gh-list-rate-bar">
<span class="gh-list-rate-number" data-tooltip="Opens: {{format-number @post.email.openedCount}}">{{@post.email.openRate}}%&nbsp;</span>
<span class="gh-list-rate-amount"><span style={{html-safe (concat "width: " @post.email.openRate "%;")}}/></span>
</span>
{{else}}
<span class="darkgrey fw5 gh-content-email-stats">
{{#if this.isHovered}}
{{format-number @post.email.openedCount}}
{{else}}
{{@post.email.openRate}}%&nbsp;
{{/if}}
</span>
{{/if}}
<span class="midgrey-l2 fw4 gh-content-email-stats-mobile">{{@post.email.openRate}}% opens</span>
</div>
{{else}}
<span class="gh-list-nodata">&mdash;</span>
{{/if}}
</LinkTo>
{{!-- Clicks column --}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-clicks">
<span class="gh-list-nodata">&mdash;</span>
</LinkTo>
{{/if}}
{{!-- Button column --}}
{{#if @post.isPublished}}
<LinkTo @route="posts.analytics" @model={{@post}} class="permalink gh-list-data">
Analytics
</LinkTo>
{{else}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-opens">
Edit
</LinkTo>
{{/if}}
</li>

View file

@ -0,0 +1,36 @@
import Component from '@glimmer/component';
import {action} from '@ember/object';
import {formatPostTime} from 'ghost-admin/helpers/gh-format-post-time';
import {inject as service} from '@ember/service';
import {tracked} from '@glimmer/tracking';
export default class PostsListItemClicks extends Component {
@service feature;
@service session;
@service settings;
@tracked isHovered = false;
get scheduledText() {
let {post} = this.args;
let text = [];
let formattedTime = formatPostTime(
post.publishedAtUTC,
{timezone: this.settings.get('timezone'), scheduled: true}
);
text.push(formattedTime);
return text.join(' ');
}
@action
mouseOver() {
this.isHovered = true;
}
@action
mouseLeave() {
this.isHovered = false;
}
}

View file

@ -1,5 +1,5 @@
{{!-- template-lint-disable no-invalid-interactive --}}
<li class="gh-list-row gh-posts-list-item {{if (or this.feature.memberAttribution this.feature.emailClicks) "gh-post-list-plain-status"}}"
<li class="gh-list-row gh-posts-list-item {{if this.feature.memberAttribution "gh-post-list-plain-status"}}"
{{on "mouseover" this.mouseOver}}
{{on "mouseleave" this.mouseLeave}}
...attributes
@ -49,7 +49,7 @@
{{/if}}
{{!-- Statuses for when the feature flag for Member Attribution is on only --}}
{{#if (or this.feature.memberAttribution this.feature.emailClicks) }}
{{#if this.feature.memberAttribution}}
{{#unless @hideStatusColumn }}
{{#if (and this.session.user.isContributor @post.isPublished)}}
<a href={{@post.url}} class="permalink gh-list-data gh-post-list-status" target="_blank" rel="noopener noreferrer">
@ -102,60 +102,56 @@
{{/unless}}
{{/if}}
{{#unless this.feature.emailClicks}}
{{#if (and this.feature.memberAttribution (not this.session.user.isContributor)) }}
{{#if @post.count.signups}}
<LinkTo @route="members" @query={{hash filterParam=(concat "signup:[" @post.id "]") }} class="permalink gh-list-data gh-post-list-signups active">
<span class="midlightgrey {{if (not (eq @post.count.signups 0)) 'darkgrey'}} fw5 gh-content-attribution-stats">{{@post.count.signups}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.signups "signup"}}</span>
</LinkTo>
{{else}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-signups">
<span class="midlightgrey {{if (not (eq @post.count.signups 0)) 'darkgrey'}} fw5 gh-content-attribution-stats">{{@post.count.signups}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.signups "signup"}}</span>
</LinkTo>
{{/if}}
{{#if (and this.feature.memberAttribution (not this.session.user.isContributor)) }}
{{#if @post.count.signups}}
<LinkTo @route="members" @query={{hash filterParam=(concat "signup:[" @post.id "]") }} class="permalink gh-list-data gh-post-list-signups active">
<span class="midlightgrey {{if (not (eq @post.count.signups 0)) 'darkgrey'}} fw5 gh-content-attribution-stats">{{@post.count.signups}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.signups "signup"}}</span>
</LinkTo>
{{else}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-signups">
<span class="midlightgrey {{if (not (eq @post.count.signups 0)) 'darkgrey'}} fw5 gh-content-attribution-stats">{{@post.count.signups}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.signups "signup"}}</span>
</LinkTo>
{{/if}}
{{/if}}
{{#if (and this.feature.memberAttribution (not this.session.user.isContributor)) }}
{{#if @post.count.conversions}}
<LinkTo @route="members" @query={{hash filterParam=(concat "conversion:[" @post.id "]") }} class="permalink gh-list-data gh-post-list-conversions active">
<span class="midlightgrey {{if (not (eq @post.count.conversions 0)) 'darkgrey'}} fw5 gh-content-attribution-stats">{{@post.count.conversions}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.conversions "conversion"}}</span>
</LinkTo>
{{else}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-conversions">
<span class="midlightgrey {{if (not (eq @post.count.conversions 0)) 'darkgrey'}} fw5 gh-content-attribution-stats">{{@post.count.conversions}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.conversions "conversion"}}</span>
</LinkTo>
{{/if}}
{{#if (and this.feature.memberAttribution (not this.session.user.isContributor)) }}
{{#if @post.count.conversions}}
<LinkTo @route="members" @query={{hash filterParam=(concat "conversion:[" @post.id "]") }} class="permalink gh-list-data gh-post-list-conversions active">
<span class="midlightgrey {{if (not (eq @post.count.conversions 0)) 'darkgrey'}} fw5 gh-content-attribution-stats">{{@post.count.conversions}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.conversions "conversion"}}</span>
</LinkTo>
{{else}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-conversions">
<span class="midlightgrey {{if (not (eq @post.count.conversions 0)) 'darkgrey'}} fw5 gh-content-attribution-stats">{{@post.count.conversions}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.conversions "conversion"}}</span>
</LinkTo>
{{/if}}
{{/unless}}
{{/if}}
{{!-- Sends/Opens columns --}}
{{#if (and (not-eq this.settings.membersSignupAccess "none") (not-eq this.settings.editorDefaultEmailRecipients "disabled") (not this.session.user.isContributor))}}
{{#if (and this.feature.emailAnalytics (eq @post.displayName "post"))}}
{{#unless this.feature.emailClicks}}
{{!-- Sends column --}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-recipients">
<div class="flex fw4">
{{#if (eq @post.email.status "submitted")}}
<span class="flex" data-tooltip={{humanize-recipient-filter @post.email.recipientFilter}}>
<span class="darkgrey fw5 gh-content-email-stats">{{format-number @post.email.emailCount}}</span>
<span class="midgrey-l2 fw4 gh-content-email-stats-mobile">{{gh-pluralize @post.email.emailCount "send"}}</span>
</span>
{{else}}
<span class="gh-list-nodata">&mdash;</span>
{{/if}}
</div>
</LinkTo>
{{/unless}}
{{!-- Sends column --}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-recipients">
<div class="flex fw4">
{{#if (eq @post.email.status "submitted")}}
<span class="flex" data-tooltip={{humanize-recipient-filter @post.email.recipientFilter}}>
<span class="darkgrey fw5 gh-content-email-stats">{{format-number @post.email.emailCount}}</span>
<span class="midgrey-l2 fw4 gh-content-email-stats-mobile">{{gh-pluralize @post.email.emailCount "send"}}</span>
</span>
{{else}}
<span class="gh-list-nodata">&mdash;</span>
{{/if}}
</div>
</LinkTo>
{{!-- Opens column --}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-opens">
{{#if (and @post.email.trackOpens (eq @post.email.status "submitted"))}}
<div class="flex">
{{#if (and this.feature.memberAttribution (not this.feature.emailClicks))}}
{{#if this.feature.memberAttribution}}
<span class="gh-list-rate-bar">
<span class="gh-list-rate-number" data-tooltip="Opens: {{format-number @post.email.openedCount}}">{{@post.email.openRate}}%&nbsp;</span>
<span class="gh-list-rate-amount"><span style={{html-safe (concat "width: " @post.email.openRate "%;")}}/></span>
@ -175,31 +171,11 @@
<span class="gh-list-nodata">&mdash;</span>
{{/if}}
</LinkTo>
{{!-- Clicks column --}}
{{#if this.feature.emailClicks}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-clicks">
<span class="gh-list-nodata">&mdash;</span>
</LinkTo>
{{/if}}
{{!-- Analytics page column --}}
{{#if this.feature.emailClicks}}
{{#if (and @post.email.trackOpens (eq @post.email.status "submitted"))}}
<LinkTo @route="posts.analytics" @model={{@post}} class="permalink gh-list-data">
Analytics
</LinkTo>
{{else}}
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-opens">
Edit
</LinkTo>
{{/if}}
{{/if}}
{{/if}}
{{/if}}
{{!-- Statuses for without the Member Attribution feature flag --}}
{{#if (not (or this.feature.memberAttribution this.feature.emailClicks)) }}
{{#unless this.feature.memberAttribution}}
{{#unless @hideStatusColumn }}
{{#if (and this.session.user.isContributor @post.isPublished)}}
<a href={{@post.url}} class="permalink gh-list-data gh-post-list-status" target="_blank" rel="noopener noreferrer">
@ -245,5 +221,5 @@
</LinkTo>
{{/if}}
{{/unless}}
{{/if}}
{{/unless}}
</li>

View file

@ -83,6 +83,14 @@ export default class PostsRoute extends AuthenticatedRoute {
setupController(controller) {
super.setupController(...arguments);
if (this.modelName === 'post') {
if (this.feature.get('emailClicks')) {
this.templateName = 'posts-clicks';
} else {
this.templateName = 'posts';
}
}
if (!controller._hasLoadedTags) {
this.store.query('tag', {limit: 'all'}).then(() => {
controller._hasLoadedTags = true;

View file

@ -0,0 +1,78 @@
<section class="gh-canvas gh-canvas-sticky">
<GhCanvasHeader class="gh-canvas-header break tablet post-header">
<GhCustomViewTitle @title={{if this.session.user.isContributor (concat this.config.blogTitle " posts") "Posts"}} @query={{reset-query-params "posts"}} />
<section class="view-actions">
<PostsList::ContentFilter
@currentUser={{this.session.user}}
@selectedType={{this.selectedType}}
@availableTypes={{this.availableTypes}}
@onTypeChange={{action "changeType"}}
@selectedVisibility={{this.selectedVisibility}}
@availableVisibilities={{this.availableVisibilities}}
@onVisibilityChange={{action "changeVisibility"}}
@selectedAuthor={{this.selectedAuthor}}
@availableAuthors={{this.availableAuthors}}
@onAuthorChange={{action "changeAuthor"}}
@selectedTag={{this.selectedTag}}
@availableTags={{this.availableTags}}
@onTagChange={{action "changeTag"}}
@selectedOrder={{this.selectedOrder}}
@availableOrders={{this.availableOrders}}
@onOrderChange={{action "changeOrder"}}
/>
<LinkTo @route="editor.new" @model="post" class="gh-btn gh-btn-primary view-actions-top-row" data-test-new-post-button={{true}}><span>New post</span></LinkTo>
</section>
</GhCanvasHeader>
<section class="view-container content-list">
<div class="gh-list-sticky">
<ol class="posts-list gh-list {{unless this.postsInfinityModel "no-posts"}} feature-memberAttribution">
{{#if this.postsInfinityModel}}
<li class="gh-list-row header">
<div class="gh-list-header gh-posts-title-header">Title</div>
<div class="gh-list-header gh-posts-status-header"></div>
{{#if (and (not-eq this.settings.membersSignupAccess "none") (not-eq this.settings.editorDefaultEmailRecipients "disabled") (not this.session.user.isContributor) this.feature.emailAnalytics)}}
<div class="gh-list-header gh-posts-opens-header">Opens</div>
<div class="gh-list-header gh-posts-sends-header">Clicks</div>
{{/if}}
<div class="gh-list-header gh-posts-button-header"></div>
</li>
{{/if}}
{{#each this.postsInfinityModel as |post|}}
<PostsList::ListItemClicks
@post={{post}}
data-test-post-id={{post.id}}
/>
{{else}}
<li class="no-posts-box">
<div class="no-posts">
{{#if this.showingAll}}
{{svg-jar "posts-placeholder" class="gh-posts-placeholder"}}
<h4>Start creating content.</h4>
<LinkTo @route="editor.new" @model="post" class="gh-btn gh-btn-green">
<span>Write a new post</span>
</LinkTo>
{{else}}
<h4>No posts match the current filter</h4>
<LinkTo @route="posts" @query={{hash type=null author=null tag=null}} class="gh-btn">
<span>Show all posts</span>
</LinkTo>
{{/if}}
</div>
</li>
{{/each}}
</ol>
</div>
<GhInfinityLoader
@infinityModel={{this.postsInfinityModel}}
@scrollable=".gh-main"
@triggerOffset={{1000}} />
</section>
{{outlet}}
</section>

View file

@ -33,33 +33,18 @@
<li class="gh-list-row header">
<div class="gh-list-header gh-posts-title-header">Title</div>
{{#unless this.feature.emailClicks}}
{{#if (and this.feature.memberAttribution (not this.session.user.isContributor)) }}
<div class="gh-list-header gh-posts-status-header"></div>
<div class="gh-list-header gh-posts-signups-header">Signups</div>
<div class="gh-list-header gh-posts-conversions-header">Paid</div>
{{/if}}
{{/unless}}
{{#if this.feature.emailClicks}}
<div class="gh-list-header gh-posts-status-header"></div>
{{#if (and this.feature.memberAttribution (not this.session.user.isContributor)) }}
<div class="gh-list-header gh-posts-status-header"></div>
<div class="gh-list-header gh-posts-signups-header">Signups</div>
<div class="gh-list-header gh-posts-conversions-header">Paid</div>
{{/if}}
{{#if (and (not-eq this.settings.membersSignupAccess "none") (not-eq this.settings.editorDefaultEmailRecipients "disabled") (not this.session.user.isContributor) this.feature.emailAnalytics)}}
{{#unless this.feature.emailClicks}}
<div class="gh-list-header gh-posts-sends-header">Sends</div>
{{/unless}}
<div class="gh-list-header gh-posts-sends-header">Sends</div>
<div class="gh-list-header gh-posts-opens-header">Opens</div>
{{/if}}
{{#if this.feature.emailClicks}}
<div class="gh-list-header gh-posts-sends-header">Clicks</div>
<div class="gh-list-header gh-posts-analytics-page-header"></div>
{{#if (or (not this.feature.memberAttribution) this.session.user.isContributor) }}
<div class="gh-list-header gh-posts-status-header">Status</div>
{{/if}}
{{#unless this.feature.emailClicks}}
{{#if (or (not this.feature.memberAttribution) this.session.user.isContributor) }}
<div class="gh-list-header gh-posts-status-header">Status</div>
{{/if}}
{{/unless}}
</li>
{{/if}}