110 lines
4.0 KiB
Handlebars
110 lines
4.0 KiB
Handlebars
<section class="gh-canvas">
|
||
<GhCanvasHeader class="gh-canvas-header">
|
||
<h2 class="gh-canvas-title" data-test-screen-title>
|
||
<LinkTo @route="members" data-test-link="members-back">Members</LinkTo>
|
||
<span>{{svg-jar "arrow-right"}}</span>
|
||
{{#if this.member.isNew}}
|
||
New member
|
||
{{else}}
|
||
{{or this.member.name this.member.email}}
|
||
{{/if}}
|
||
</h2>
|
||
|
||
<section class="view-actions">
|
||
{{#if this.session.user.isOwner}}
|
||
{{#unless this.member.isNew}}
|
||
<button
|
||
class="gh-btn gh-btn-white gh-btn-icon mr2"
|
||
{{on "click" this.toggleImpersonateMemberModal}}>
|
||
<span>Impersonate</span>
|
||
</button>
|
||
{{/unless}}
|
||
{{/if}}
|
||
|
||
<GhTaskButton @class="gh-btn gh-btn-blue gh-btn-icon" @type="button" @task={{this.saveTask}} @data-test-button="save" />
|
||
</section>
|
||
</GhCanvasHeader>
|
||
|
||
<form class="mb10 member-basic-info-form">
|
||
<div class="flex items-center mb10 bt b--lightgrey-d1 pt8">
|
||
{{#if (or this.member.name this.member.email)}}
|
||
<GhMemberAvatar
|
||
@member={{this.member}}
|
||
@sizeClass={{if this.member.name 'f-subheadline fw4 lh-zero tracked-1' 'f-headline fw4 lh-zero tracked-1'}}
|
||
@containerClass="w20 h20 mr4 gh-member-detail-avatar"
|
||
/>
|
||
{{else}}
|
||
<div class="flex items-center justify-center br-100 w18 h18 mr4 gh-new-member-avatar">
|
||
<span class="gh-member-avatar-label f-subheadline fw4 lh-zero tracked-1">N</span>
|
||
</div>
|
||
{{/if}}
|
||
<div>
|
||
<h3 class="f2 fw6 ma0 pa0">
|
||
{{or this.member.name this.member.email}}
|
||
</h3>
|
||
<p class="f7 pa0 ma0 midlightgrey-d1">
|
||
{{#if (and this.member.name this.member.email)}}
|
||
<span class="darkgrey fw5">{{this.member.email}}</span>
|
||
{{/if}}
|
||
</p>
|
||
{{#unless this.member.isNew}}
|
||
<p class="f7 pa0 ma0 midgrey-d1 {{if this.member.name "nudge-bottom--2"}}">
|
||
{{#if this.member.geolocation}}
|
||
{{#if (eq this.member.geolocation.country_code "US")}}
|
||
{{this.member.geolocation.region}}, US
|
||
{{else}}
|
||
{{this.member.geolocation.country}}
|
||
{{/if}}
|
||
{{else}}
|
||
Unknown location
|
||
{{/if}}
|
||
– Created on {{this.subscribedAt}}
|
||
</p>
|
||
{{/unless}}
|
||
</div>
|
||
</div>
|
||
|
||
<GhMemberSettingsForm
|
||
@member={{this.member}}
|
||
@scratchMember={{this.scratchMember}}
|
||
@setProperty={{this.setProperty}}
|
||
@isLoading={{this.isLoading}} />
|
||
</form>
|
||
|
||
{{#unless this.member.isNew}}
|
||
<button
|
||
type="button"
|
||
class="gh-btn gh-btn-red gh-btn-icon mt3"
|
||
{{on "click" this.toggleDeleteMemberModal}}
|
||
data-test-button="delete-member"
|
||
>
|
||
<span>Delete member</span>
|
||
</button>
|
||
{{/unless}}
|
||
</section>
|
||
|
||
{{#if this.showUnsavedChangesModal}}
|
||
<GhFullscreenModal
|
||
@modal="leave-settings"
|
||
@confirm={{this.leaveScreen}}
|
||
@close={{this.toggleUnsavedChangesModal}}
|
||
@modifier="action wide" />
|
||
{{/if}}
|
||
|
||
{{#if this.showDeleteMemberModal}}
|
||
<GhFullscreenModal
|
||
@modal="delete-member"
|
||
@model={{this.member}}
|
||
@confirm={{this.deleteMember}}
|
||
@close={{this.toggleDeleteMemberModal}}
|
||
@modifier="action wide" />
|
||
{{/if}}
|
||
|
||
{{#if this.showImpersonateMemberModal}}
|
||
<GhFullscreenModal
|
||
@modal="impersonate-member"
|
||
@model={{this.member}}
|
||
@close={{this.toggleImpersonateMemberModal}}
|
||
@modifier="action wide" />
|
||
{{/if}}
|