Ghost/ghost/admin/app/components/gh-launch-wizard/set-pricing.hbs
Kevin Ansfield 58759b3069 Added option to disable member subscriptions (#1925)
refs https://github.com/TryGhost/Team/issues/579

- new Access settings screen that moves subscription access and default post visibility from the Payments settings screen
- expanded "Free signup" toggle into three signup access options
  - "anyone" - same as previous "allow free member signup" option set to `true`
  - "invite only" -  same as previous "allow free member signup" option set to `false`
  - "nobody" - completely disables member signup and login. Removes injected portal and stripe scripts on the front-end and hides member related sections on the admin dashboard

(this commit moves the above changes out from behind the developer experiments flag and cleans up now-unused code)
2021-04-21 12:09:40 +01:00

132 lines
6.1 KiB
Handlebars

<div class="gh-launch-wizard-settings-container">
<div class="gh-stack overflow-y-auto flex-grow-1">
<div class="gh-stack-item flex-column">
<div class="w-100">
<GhFormGroup @class="for-select">
<div class="gh-setting-title" for="currency">Plan currency</div>
<span class="gh-select mt2">
<OneWaySelect
@value={{this.selectedCurrency}}
id="currency"
name="currency"
@options={{this.currencies}}
@optionValuePath="value"
@optionLabelPath="label"
@update={{this.setStripePlansCurrency}}
/>
{{svg-jar "arrow-down-small"}}
</span>
</GhFormGroup>
</div>
<div class="w-100 flex flex-column flex-row-ns">
<div class="w-100 w-50-ns mr3-ns">
<GhFormGroup @errors={{this.settings.errors}} @hasValidated={{this.settings.hasValidated}} @property="stripePlans">
<div class="gh-setting-title">Monthly price</div>
<div class="flex items-center justify-center mt2 gh-input-group gh-labs-price-label">
<GhTextInput
@value={{readonly this.stripePlans.monthly.amount}}
@type="number"
@input={{action (mut this.stripeMonthlyAmount) value="target.value"}}
{{on "blur" this.validateStripePlans}}
/>
<span class="gh-input-append"><span class="ttu">{{this.stripePlans.monthly.currency}}</span>/month</span>
</div>
</GhFormGroup>
</div>
<div class="w-100 w-50-ns ml2-ns">
<GhFormGroup @errors={{this.settings.errors}} @hasValidated={{this.settings.hasValidated}} @property="stripePlans">
<div class="gh-setting-title">Yearly price</div>
<div class="flex items-center justify-center mt2 gh-input-group gh-labs-price-label">
<GhTextInput
@value={{readonly this.stripePlans.yearly.amount}}
@type="number"
@input={{action (mut this.stripeYearlyAmount) value="target.value"}}
{{on "blur" this.validateStripePlans}}
/>
<span class="gh-input-append"><span class="ttu">{{this.stripePlans.yearly.currency}}</span>/year</span>
</div>
</GhFormGroup>
</div>
</div>
</div>
<div class="w-100 w-50-l flex flex-column flex-row-ns">
<GhErrorMessage @errors={{this.settings.errors}} @property="stripePlans" class="w-100 red"/>
</div>
<div class="gh-stack-item gh-setting flex-column">
<div class="gh-setting-title">Plans available at signup</div>
<div class="form-group mt2 mb0 for-checkbox">
<label
class="checkbox"
for="free-plan"
>
<input
type="checkbox"
checked={{this.isFreeChecked}}
id="free-plan"
name="free-plan"
disabled={{not (eq this.settings.membersSignupAccess "all")}}
class="gh-input post-settings-featured"
{{on "click" this.toggleFreePlan}}
data-test-checkbox="featured"
>
<span class="input-toggle-component"></span>
<p>Free</p>
</label>
</div>
<div class="form-group mb0 for-checkbox">
<label
class="checkbox"
for="monthly-plan"
>
<input
type="checkbox"
id="monthly-plan"
name="monthly-plan"
checked={{this.isMonthlyChecked}}
disabled={{not this.membersUtils.isStripeEnabled}}
class="gh-input post-settings-featured"
{{on "click" this.toggleMonthlyPlan}}
data-test-checkbox="featured"
>
<span class="input-toggle-component"></span>
<p>Monthly</p>
</label>
</div>
<div class="form-group mb0 for-checkbox">
<label
class="checkbox"
for="yearly-plan"
>
<input
type="checkbox"
id="yearly-plan"
name="yearly-plan"
checked={{this.isYearlyChecked}}
disabled={{not this.membersUtils.isStripeEnabled}}
class="gh-input post-settings-featured"
{{on "click" this.toggleYearlyPlan}}
data-test-checkbox="featured"
>
<span class="input-toggle-component"></span>
<p>Yearly</p>
</label>
</div>
</div>
</div>
<div class="gh-launch-wizard-nav-buttons">
<button type="button" class="gh-btn gh-btn-outline gh-btn-icon-dark gh-btn-large w-30" {{on "click" @backStep}}><span>{{svg-jar "arrow-left-tail"}}</span></button>
{{!-- TODO: reset "failed" state automatically --}}
<GhTaskButton
@task={{this.saveAndContinue}}
@runningText="Saving"
@class="w-70 ml4 right gh-btn gh-btn-black gh-btn-large gh-btn-icon-right"
data-test-button="wizard-next"
>
<span>Save and continue{{svg-jar "arrow-right-tail"}}</span>
</GhTaskButton>
</div>
</div>