Ghost-Admin/app/components/modals/newsletters/new.hbs

78 lines
3.8 KiB
Handlebars
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<div class="modal-content" data-test-modal="create-newsletter">
<header class="modal-header">
<h1>Create newsletter</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">
<fieldset>
<GhFormGroup @errors={{@data.newsletter.errors}} @hasValidated={{@data.newsletter.hasValidated}} @property="name">
<label for="newsletter-title" class="modal-fullsettings-title">Name</label>
<input
id="newsletter-title"
type="text"
class="gh-input miw-100 form-text"
value={{@data.newsletter.name}}
placeholder="Weekly Roundup"
{{on "input" (fn this.onInput "name")}}
/>
<GhErrorMessage @errors={{@data.newsletter.errors}} @property="name" />
</GhFormGroup>
<GhFormGroup @errors={{@data.newsletter.errors}} @hasValidated={{@data.newsletter.hasValidated}} @property="description">
<label for="newsletter-description" class="modal-fullsettings-title">Description</label>
<textarea
id="newsletter-description"
class="gh-input miw-100 form-text"
{{on "input" (fn this.onInput "description")}}
>{{@data.newsletter.description}}</textarea>
<GhErrorMessage @errors={{@data.newsletter.errors}} @property="description" />
</GhFormGroup>
<GhFormGroup @classNames="flex justify-between items-start mb2">
<div class="mr3">
<label for="opt-in-existing" class="modal-fullsettings-title">Opt-in existing subscribers</label>
<p>
{{#if this.optInExisting}}
{{#let (members-count-fetcher query=(hash filter="newsletters.status:active")) as |countFetcher|}}
This newsletter will be available to <strong>all members</strong>. Your {{#if countFetcher.count}}<strong>{{countFetcher.count}}</strong>{{/if}} existing subscriber{{#if (gt countFetcher.count 1)}}s{{/if}} will also be opted-in to receive it.
{{/let}}
{{else}}
The newsletter will be available to <strong>all new members</strong>. Existing members wont be subscribed, but may visit their account area to opt-in to future emails.
{{/if}}
</p>
</div>
<div class="for-switch small">
<div class="container">
<input
type="checkbox"
id="opt-in-existing"
checked={{this.optInExisting}}
{{on "check" this.setOptInExisting}}
>
<button type="button" class="input-toggle-component" {{on "click" this.toggleOptInExisting}}></button>
</div>
</div>
</GhFormGroup>
</fieldset>
</div>
<div class="modal-footer">
<button class="gh-btn" type="button" {{on "click" @close}}>
<span>Cancel</span>
</button>
<GhTaskButton
@buttonText="Create"
@runningText="Creating"
@successText="Created"
@task={{this.saveTask}}
@idleClass="gh-btn-primary"
@class="gh-btn gh-btn-icon"
{{on-key "cmd+s" this.saveViaKeyboard priority=1}}
{{on-key "Enter" this.saveViaKeyboard priority=1}}
data-test-button="save-newsletter"
/>
</div>
</div>