Ghost/ghost/admin/app/components/settings/newsletters.hbs
Kevin Ansfield 99f05e14b2 🐛 Fixed default publish type being "Publish and email" when default recipients set to "Usually nobody"
no issue

The default recipients setting "Usually nobody" was being respected with the email recipient list defaulting to no members selected. However the UI for that state was confusing because the default publish options ended up being "Publish and email" and "Not sent as a newsletter" but it was expected to be "Publish" with the newsletter option being disabled.

- updated the `PublishOptions` setup to reflect the desired outcome for "Usually nobody"
  - default publish type is set to "Publish"
  - default email recipients are set to match post visibility - this means there are fewer clicks required when switching from "Publish" to "Publish and send"
- updated mirage data setup so any members created are automatically assigned to any newsletter instance with `subscribeOnSignup` set
  - ensures we get proper member counts in the publish flow
2022-05-30 20:04:04 +01:00

168 lines
9.6 KiB
Handlebars

<section class="gh-main-section">
<div class="gh-expandable">
<div class="gh-expandable-block">
<div class="gh-expandable-header">
<div>
<h4 class="gh-expandable-title">Enable newsletter sending</h4>
<p class="gh-expandable-description">Newsletter features are active, posts can be sent by email</p>
</div>
<div class="for-switch">
<label class="switch">
<input
type="checkbox"
checked={{this.emailNewsletterEnabled}}
class="gh-input"
{{on "change" this.toggleEmailNewsletterEnabled}}
name="email-newsletter-enabled"
data-test-checkbox="email-newsletter-enabled"
>
<span class="input-toggle-component mt1"></span>
</label>
</div>
</div>
</div>
</div>
</section>
{{#if this.emailNewsletterEnabled}}
<Settings::Newsletters::NewsletterManagement />
<section class="gh-main-section">
<h4 class="gh-main-section-header small bn">General settings</h4>
<div class="gh-expandable">
<div class="gh-expandable-block">
<div class="gh-expandable-header">
<div>
<h4 class="gh-expandable-title">Default newsletter recipients</h4>
<p class="gh-expandable-description">When you publish new content, who do you usually want to send it to?</p>
</div>
<button type="button" class="gh-btn" {{on "click" (toggle-action "defaultRecipientsOpen" this)}} data-test-toggle-membersemail>
<span>{{if this.defaultRecipientsOpen "Close" "Expand"}}</span>
</button>
</div>
<div class="gh-expandable-content">
{{#liquid-if this.defaultRecipientsOpen}}
{{#if (gt this.activeNewsletterCount 1)}}
<div class="form-group">
<label class="fw6 f8">Default newsletter</label>
<div class="gh-input"></div>
</div>
<div class="form-group">
<label class="fw6 f8">Default member selection</label>
<div class="gh-setting-richdd-container gh-setting-rich-dropdown">
<Settings::MembersEmail::DefaultRecipientsSelect
@recipients={{this.recipientsSelectValue}}
@segment={{this.settings.editorDefaultEmailRecipientsFilter}}
@onRecipientsChange={{this.setDefaultEmailRecipients}}
@onSegmentChange={{this.setDefaultEmailRecipientsFilter}}
/>
</div>
</div>
{{else}}
<div class="gh-setting-richdd-container gh-setting-rich-dropdown form-group" data-test-select="default-recipients">
<Settings::MembersEmail::DefaultRecipientsSelect
@recipients={{this.recipientsSelectValue}}
@segment={{this.settings.editorDefaultEmailRecipientsFilter}}
@onRecipientsChange={{this.setDefaultEmailRecipients}}
@onSegmentChange={{this.setDefaultEmailRecipientsFilter}}
/>
</div>
{{/if}}
{{/liquid-if}}
</div>
</div>
{{#unless this.config.mailgunIsConfigured}}
<div class="gh-expandable-block">
<div class="gh-expandable-header">
<div>
<h4 class="gh-expandable-title">Mailgun configuration</h4>
<p class="gh-expandable-description">The Mailgun API is used for bulk email newsletter delivery. <a href="https://ghost.org/docs/faq/mailgun-newsletters/" target="_blank" rel="noopener noreferrer">Why is this required?</a></p>
</div>
<button type="button" class="gh-btn" {{on "click" (toggle-action "membersEmailOpen" this)}} data-test-toggle-membersemail>
<span>{{if this.membersEmailOpen "Close" "Expand"}}</span>
</button>
</div>
<div class="gh-expandable-content">
{{#liquid-if this.membersEmailOpen}}
<div class="flex flex-column flex">
<GhFormGroup>
<div class="flex items-center">
<GhFormGroup @class="gh-mailgun-region no-margin">
<label class="fw6 f8">Mailgun region</label>
<div class="mt1">
<PowerSelect
@options={{this.mailgunRegions}}
@selected={{this.mailgunRegion}}
@onChange={{this.setMailgunRegion}}
@class="gh-select"
@searchEnabled={{false}}
@triggerComponent="gh-power-select/trigger"
as |region|
>
{{region.flag}} {{region.name}}
</PowerSelect>
</div>
</GhFormGroup>
<GhFormGroup @class="no-margin">
<label class="fw6 f8" for="mailgun-domain">Mailgun domain</label>
<input
id="mailgun-domain"
type="text"
class="gh-input mt1"
value={{this.mailgunSettings.domain}}
{{on "input" this.setMailgunDomain}}
data-test-mailgun-domain-input
/>
</GhFormGroup>
</div>
<p>Find your Mailgun region and domain
<a href="https://app.mailgun.com/app/sending/domains" target="_blank" class="fw5" rel="noopener noreferrer">here</a>
</p>
</GhFormGroup>
<GhFormGroup>
<label class="fw6 f8" for="mailgun-private-api">Mailgun Private API key</label>
<input
id="mailgun-private-api"
type="password"
value={{this.mailgunSettings.apiKey}}
{{on "input" this.setMailgunApiKey}}
class="gh-input mt1 password"
autocomplete="new-password"
data-test-mailgun-api-key-input
/>
<p>Find your Mailgun API keys
<a href="https://app.mailgun.com/app/account/security/api_keys" target="_blank" class="fw5" rel="noopener noreferrer">here</a>
</p>
</GhFormGroup>
</div>
{{/liquid-if}}
</div>
</div>
{{/unless}}
<div class="gh-expandable-block">
<div class="gh-expandable-header">
<div>
<h4 class="gh-expandable-title">Enable newsletter open-rate</h4>
<p class="gh-expandable-description">Track how many members are reading your emails</p>
</div>
<div class="for-switch">
<label class="switch" data-test-label="email-track-opens">
<input
id="email-track-opens"
type="checkbox"
checked={{this.settings.emailTrackOpens}}
class="gh-input"
{{on "change" this.toggleEmailTrackOpens}}
data-test-checkbox="email-track-opens"
>
<span class="input-toggle-component mt1"></span>
</label>
</div>
</div>
</div>
</div>
</section>
{{/if}}