Ghost/ghost/admin/app/components/modal-portal-settings.hbs
Peter Zimon 24022e3932 Re-enabled Stripe disconnect for Administrators
Refs.
7394df6137
e52bdf88f9

We have temporarily disabled Stripe disconnect for Administrators to avoid hitting an API endpoint.
Now that the API is updated, disconnect is re-enabled for Owner and Admins.
2021-09-09 13:01:07 +02:00

330 lines
21 KiB
Handlebars

<div class="modal-body gh-ps-modal-body">
<div class="flex pa0 flex-grow-1 gh-portal-settings" {{did-insert (fn this.finishPreloading)}}>
{{#if this.isPreloading}}
<GhLoadingSpinner />
{{else}}
<div class="gh-portal-settings-sidebar">
<h2 class="gh-portal-settings-title">Portal settings</h2>
<div class="gh-portal-form-wrapper">
<fieldset class="gh-portal-settings-form">
<div class="gh-portal-setting-section {{if (not-eq this.settings.membersSignupAccess "all") "disabled-overlay"}}" onclick={{action "switchToSignupPage"}}>
<h3 class="gh-portal-setting-sectionheading">Signup options</h3>
<GhFormGroup @classNames="gh-members-subscribed-checkbox gh-portal-setting-first pb5 mb0">
<div class="flex justify-between items-center">
<div class="mr3">
<h4 class="gh-portal-setting-title">Display name in signup form</h4>
</div>
<div class="for-switch small">
<label
class="switch"
for="signup-name-checkbox"
>
<input
type="checkbox"
checked={{this.settings.portalName}}
id="signup-name-checkbox"
name="signup-name-checkbox"
disabled={{not-eq this.settings.membersSignupAccess "all"}}
{{on "click" (action "togglePortalName" value="target.checked")}}
>
<span class="input-toggle-component"></span>
</label>
</div>
</div>
</GhFormGroup>
{{#if this.membersUtils.isStripeEnabled}}
<div {{did-insert this.refreshAfterStripeConnected}}>
{{#if this.showPortalTiers}}
<div class="mb3">
<h4 class="gh-portal-setting-title">Tiers available at signup</h4>
</div>
<div class="form-group mb0 for-checkbox">
<label
class="checkbox"
for="free-plan"
>
<input
type="checkbox"
checked={{this.membersUtils.isFreeChecked}}
id="free-plan"
name="free-plan"
disabled={{or
(not this.membersUtils.isStripeEnabled)
(not-eq this.settings.membersSignupAccess "all")
}}
class="gh-input post-settings-featured"
{{on "click" (action "togglePlan" "free")}}
>
<span class="input-toggle-component"></span>
<p>Free</p>
</label>
</div>
{{#each this.products as |product|}}
<div class="form-group mb0 for-checkbox">
<label
class="checkbox"
for={{product.id}}
>
<input
type="checkbox"
id={{product.id}}
name={{product.id}}
checked={{product.checked}}
disabled={{or
(not this.membersUtils.isStripeEnabled)
(not-eq this.settings.membersSignupAccess "all")
}}
class="gh-input post-settings-featured"
{{on "click" (action "toggleProduct" product.id)}}
>
<span class="input-toggle-component"></span>
<p>{{product.name}}</p>
</label>
</div>
{{/each}}
{{/if}}
<div class="mb3 {{if (feature "multipleProducts") "mt5" ""}}">
<h4 class="gh-portal-setting-title">Prices available at signup</h4>
</div>
{{#unless this.showPortalTiers}}
<div class="form-group mb0 for-checkbox">
<label
class="checkbox"
for="free-plan"
>
<input
type="checkbox"
checked={{this.membersUtils.isFreeChecked}}
id="free-plan"
name="free-plan"
disabled={{or
(not this.membersUtils.isStripeEnabled)
(not-eq this.settings.membersSignupAccess "all")
}}
class="gh-input post-settings-featured"
{{on "click" (action "togglePlan" "free")}}
>
<span class="input-toggle-component"></span>
<p>Free</p>
</label>
</div>
{{/unless}}
<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={{or
(not this.membersUtils.isStripeEnabled)
(not-eq this.settings.membersSignupAccess "all")
}}
class="gh-input post-settings-featured"
{{on "click" (action "togglePlan" "monthly")}}
>
<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={{or
(not this.membersUtils.isStripeEnabled)
(not-eq this.settings.membersSignupAccess "all")
}}
class="gh-input post-settings-featured"
{{on "click" (action "togglePlan" "yearly")}}
>
<span class="input-toggle-component"></span>
<p>Yearly</p>
</label>
</div>
</div>
{{else}}
<div class="gh-portal-setting-no-stripe">
You need to <button class="gh-btn gh-btn-link black {{if (not this.session.user.isAdmin) "disabled"}}" {{on "click" (action "openStripeSettings")}}>connect to Stripe</button> to take payments
</div>
{{/if}}
</div>
<div class="gh-portal-setting-section" onclick={{action "switchToSignupPage"}}>
<h3 class="gh-portal-setting-sectionheading">Look & feel</h3>
<GhFormGroup @classNames="gh-members-subscribed-checkbox gh-portal-setting-first mb0 b--whitegrey">
<div class="flex justify-between items-center">
<h4 class="gh-portal-setting-title">Show Portal button</h4>
<div class="for-switch small">
<label
class="switch"
for="portal-button-checkbox"
>
<input
type="checkbox"
checked={{this.settings.portalButton}}
id="portal-button-checkbox"
name="portal-button-checkbox"
onclick={{action "togglePortalButton" value="target.checked"}}
>
<span class="input-toggle-component"></span>
</label>
</div>
</div>
</GhFormGroup>
{{#if this.settings.portalButton}}
<div class="mt5">
<GhFormGroup @classNames="space-l">
<h4 class="gh-portal-setting-title mb1">Portal button style</h4>
<span
class="gh-select mt2"
data-select-text="test"
tabindex="0"
>
<OneWaySelect
@id="portal-button-style"
@name="portal[button-style]"
@options={{this.buttonStyleOptions}}
@optionValuePath="name"
@optionLabelPath="label"
@value={{this.selectedButtonStyle}}
@update={{action "setButtonStyle"}}
/>
{{svg-jar "arrow-down-small"}}
</span>
</GhFormGroup>
{{#if showIconSetting}}
<GhFormGroup @classNames="space-l">
<h4 class="gh-portal-setting-title">Icon</h4>
<GhUploader
@extensions={{this.iconExtensions}}
@paramsHash={{hash purpose="image"}}
@onComplete={{action "imageUploaded" "buttonIcon"}}
as
|uploader|
>
<div class="flex items-center justify-between mt2 br3 ba b--whitegrey bg-white">
<div class="gh-portal-settings-icons">
{{#each this.membersUtils.defaultButtonIcons as |imgIcon| }}
<span class="gh-portal-button-icon {{if (eq this.membersUtils.buttonIcon imgIcon.value) "selected-icon"}}" onclick={{action "selectDefaultIcon" imgIcon.value}}>
{{svg-jar imgIcon.icon}}
</span>
{{/each}}
</div>
<div class="flex gh-setting-action gh-portal-custom-icon">
{{#if uploader.isUploading}}
<div class="gh-portal-button-icon">
<div class="gh-loading-spinner"></div>
</div>
{{else if this.customIcon}}
<img
class="gh-portal-button-icon gh-portal-button-custom {{if (eq this.membersUtils.buttonIcon this.customIcon) "selected-icon"}}"
src="{{this.customIcon}}"
onclick={{action "selectDefaultIcon" this.customIcon}}
alt="icon"
data-test-icon-img
>
{{#if (eq this.membersUtils.buttonIcon this.customIcon)}}
<button type="button" class="gh-btn gh-btn-hover-red gh-portal-button-deleteicon" {{action "deleteCustomIcon"}}>
<span> {{svg-jar "trash" class="w5 h5"}} </span>
</button>
{{/if}}
{{else}}
<button type="button" class="gh-btn gh-portal-button-uploadicon" onclick={{action "triggerFileDialog"}} data-test-image-upload-btn="icon" data-tooltip="Upload icon">
<span>{{svg-jar "upload-fill" class="w5 h5"}}</span>
</button>
<div style="display:none">
<GhFileInput
@multiple={{false}}
@action={{uploader.setFiles}}
@accept={{this.iconMimeTypes}}
data-test-file-input="icon"
/>
</div>
{{/if}}
</div>
</div>
</GhUploader>
</GhFormGroup>
{{/if}}
</div>
{{#if showButtonTextSetting}}
<GhFormGroup @classNames="space-l">
<h4 class="gh-portal-setting-title">Signup button text</h4>
<div class="flex items-center mt2">
<GhTextInput
@value={{readonly this.settings.portalButtonSignupText}}
@type="text"
@input={{action "setSignupButtonText"}}
/>
</div>
</GhFormGroup>
{{/if}}
{{/if}}
</div>
</fieldset>
</div>
</div>
<div class="gh-portal-settings-main">
<div class="gh-portal-settings-previewheader">
<div class="gh-btn-group">
<a class="gh-btn {{if (eq this.page "signup") "gh-btn-group-selected"}}" href="#" {{action "switchPreviewPage" "signup"}} data-test-link="switch-portal-preview-page"><span>Signup</span></a>
<a class="gh-btn {{if (eq this.page "accountHome") "gh-btn-group-selected"}}" href="#" {{action "switchPreviewPage" "accountHome"}} data-test-link="switch-portal-preview-page"><span>Account</span></a>
<a class="gh-btn {{if this.showLinksPage "gh-btn-group-selected"}}" href="#" {{action "switchPreviewPage" "links"}} data-test-link="switch-portal-preview-page"><span>Links</span></a>
</div>
<div class="gh-portal-settings-actions">
<button
class="gh-btn mr3"
{{action "closeModal"}}
{{!-- disable mouseDown so it doesn't trigger focus-out validations --}}
{{on "mousedown" (optional this.noop)}}
data-test-button="cancel-custom-view-form"
>
<span>Cancel</span>
</button>
<GhTaskButton
@buttonText="Save and close"
@successText="Saved"
@task={{this.saveTask}}
@idleClass="gh-btn-primary"
@class="gh-btn gh-btn-icon"
data-test-button="save-members-modal-setting"
/>
</div>
</div>
{{#if this.showLinksPage}}
<div class="gh-portal-preview-wrapper">
<div class="gh-portal-preview-container">
<GhPortalLinks />
</div>
</div>
{{/if}}
<div class="gh-portal-preview-container {{if this.showLinksPage "hide"}}">
<div class="gh-portal-site-frame-cover"> </div>
<GhSiteIframe
class="gh-portal-siteiframe {{if (feature "multipleProducts") "gh-portal-siteiframe-enabled"}}"
@src={{this.portalPreviewUrl}}
@guid={{this.portalPreviewGuid}}
@invisibleUntilLoaded="portal-ready" />
</div>
</div>
{{/if}}
</div>
</div>