Ghost/ghost/admin/app/templates/member.hbs
Kevin Ansfield dd94a10890 Prevented enter key submitting misleading member details save request (#1380)
no issue

- `{{gh-task-button}}` was used inside a form but didn't have a `type="button"` property which meant the browser was treating it as a submit button and triggering the save action and related animation before the field's focus-out was called resulting in a save request before the scratch value is transferred to the model
- removed the submit action from the `<form>` element to prevent any other accidental triggers before scratch values have been transferred into real model values
2019-10-21 16:24:57 +01:00

60 lines
2.3 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.

<section class="gh-canvas">
<form class="mb10 member-basic-info-form">
<GhCanvasHeader class="gh-canvas-header">
<h2 class="gh-canvas-title" data-test-screen-title>
{{#link-to "members" data-test-link="members-back"}}Members{{/link-to}}
<span>{{svg-jar "arrow-right"}}</span>
{{#if member.name}}
{{member.name}}
{{else}}
{{member.email}}
{{/if}}
</h2>
<section class="view-actions">
{{gh-task-button type="button" task=save class="gh-btn gh-btn-blue gh-btn-icon" data-test-button="save"}}
</section>
</GhCanvasHeader>
<div class="flex items-center mb10 bt b--lightgrey-d1 pt8">
<GhMemberAvatar @member={{member}} @sizeClass={{if member.name 'f-subheadline fw4 lh-zero tracked-1' 'f-headline fw4 lh-zero tracked-1'}} class="w18 h18 mr4" />
<div>
<h3 class="f2 fw5 ma0 pa0">
{{or member.name member.email}}
</h3>
<p class="f6 pa0 ma0 midgrey">
{{#if member.name}}
<span class="darkgrey fw5">{{member.email}}</span>
{{/if}}
Created on {{this.subscribedAt}}
</p>
</div>
</div>
{{gh-member-settings-form member=member
setProperty=(action "setProperty")
isLoading=this.isLoading
showDeleteTagModal=(action "toggleDeleteMemberModal")}}
</form>
<button
type="button"
class="gh-btn gh-btn-red gh-btn-icon mt3"
{{action (toggle "showDeleteMemberModal" this)}}
data-test-button="delete-member"
>
<span>Delete member</span>
</button>
</section>
{{#if showUnsavedChangesModal}}
{{gh-fullscreen-modal "leave-settings"
confirm=(action "leaveScreen")
close=(action "toggleUnsavedChangesModal")
modifier="action wide"}}
{{/if}}
{{#if showDeleteMemberModal}}
{{gh-fullscreen-modal "delete-member"
model=(hash member=member onSuccess=(action "finaliseDeletion"))
close=(action (toggle "showDeleteMemberModal" this))
modifier="action wide"}}
{{/if}}