mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-01 22:02:11 +03:00
95c3759282
refs https://github.com/TryGhost/Team/issues/732 This fix is part of the broader design change we want in Admin, moving away from showing errors on focus out in fields with feels a little aggressive and instead change it to the default behaviour of showing errors when submitting the form. This change updates this behaviour for invite staff modal.
58 lines
2.3 KiB
Handlebars
58 lines
2.3 KiB
Handlebars
<header class="modal-header" data-test-modal="invite-staff-user">
|
||
<h1>Invite a new staff user</h1>
|
||
<p>Send an invitation for a new person to create a staff account on your site, and select a role that matches what you’d like them to be able to do.</p>
|
||
</header>
|
||
{{!-- disable mouseDown so it doesn't trigger focus-out validations --}}
|
||
<a class="close" href role="button" title="Close" {{action "closeModal"}} {{action (optional this.noop) on="mouseDown"}}>
|
||
{{svg-jar "close"}}<span class="hidden">Close</span>
|
||
</a>
|
||
|
||
<div class="modal-body">
|
||
<fieldset>
|
||
<GhFormGroup @errors={{this.errors}} @hasValidated={{this.hasValidated}} @property="email">
|
||
<label for="new-user-email">Email address</label>
|
||
<GhTextInput
|
||
@class="email"
|
||
@id="new-user-email"
|
||
@type="email"
|
||
@placeholder="youremail@example.com"
|
||
@name="email"
|
||
@shouldFocus={{true}}
|
||
@autocapitalize="off"
|
||
@autocorrect="off"
|
||
@value={{readonly email}}
|
||
@input={{action (mut email) value="target.value"}}
|
||
@keyEvents={{hash
|
||
Enter=(action "confirm")
|
||
}}
|
||
/>
|
||
<GhErrorMessage @errors={{this.errors}} @property="email" />
|
||
</GhFormGroup>
|
||
|
||
<GhRoleSelection
|
||
@selected={{this.role}}
|
||
@setRole={{this.setRole}}
|
||
@onValidationSuccess={{action "roleValidationSucceeded"}}
|
||
@onValidationFailure={{action "roleValidationFailed"}}
|
||
/>
|
||
</fieldset>
|
||
</div>
|
||
|
||
<div class="modal-footer">
|
||
{{#if this.limitErrorMessage}}
|
||
<GhTaskButton @buttonText="Upgrade my plan →"
|
||
@task={{this.transitionToBilling}}
|
||
@class="gh-btn gh-btn-green gh-btn-icon"
|
||
@disableMouseDown="true"
|
||
data-test-button="upgrade-my-plan" />
|
||
{{else}}
|
||
<GhTaskButton @buttonText="Send invitation now →"
|
||
@successText="Sent"
|
||
@task={{this.sendInvitation}}
|
||
@class="gh-btn gh-btn-black gh-btn-icon"
|
||
@disabled={{this.fetchRoles.isRunning}}
|
||
@disableMouseDown="true"
|
||
data-test-button="send-user-invite" />
|
||
{{/if}}
|
||
</div>
|