mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-11-29 15:12:58 +03:00
7ac7e73a05
no issue - passed in the `refreshData` action to the `<GhMembersNoMembers>` component and called it after creating the member - converted `<GhMembersNoMembers>` to a glimmer component
100 lines
4.6 KiB
Handlebars
100 lines
4.6 KiB
Handlebars
<section class="gh-canvas">
|
|
<GhCanvasHeader class="gh-canvas-header members-header">
|
|
<h2 class="gh-canvas-title" data-test-screen-title>Members</h2>
|
|
<section class="view-actions">
|
|
<GhMembersContentfilter
|
|
@selectedLabel={{this.selectedLabel}}
|
|
@availableLabels={{this.availableLabels}}
|
|
@onLabelChange={{this.changeLabel}}
|
|
@onLabelAdd={{this.addLabel}}
|
|
@onLabelEdit={{this.editLabel}}
|
|
/>
|
|
<div class="relative gh-members-header-search">
|
|
{{svg-jar "search" class="gh-input-search-icon"}}
|
|
<GhTextInput
|
|
placeholder="Search members..."
|
|
@value={{this.searchText}}
|
|
@input={{this.search}}
|
|
class="gh-members-list-searchfield {{if this.searchText "active"}}" />
|
|
</div>
|
|
|
|
<span class="dropdown">
|
|
<GhDropdownButton @dropdownName="members-actions-menu"
|
|
@classNames="gh-btn gh-btn-white gh-btn-icon only-has-icon gh-actions-cog" @title="Members Actions"
|
|
@data-test-user-actions="true">
|
|
<span>
|
|
{{svg-jar "settings"}}
|
|
<span class="hidden">Actions</span>
|
|
</span>
|
|
</GhDropdownButton>
|
|
<GhDropdown @name="members-actions-menu" @tagName="ul"
|
|
@classNames="gh-member-actions-menu dropdown-menu dropdown-triangle-top-right">
|
|
<li>
|
|
<LinkTo @route="members.import" class="mr2" data-test-link="import-csv">
|
|
<span>Import members</span>
|
|
</LinkTo>
|
|
</li>
|
|
<li>
|
|
<button class="mr2" {{on "click" this.exportData}}>
|
|
<span>Export all members</span>
|
|
</button>
|
|
</li>
|
|
</GhDropdown>
|
|
</span>
|
|
<LinkTo @route="member.new" class="gh-btn gh-btn-green" data-test-new-member-button="true"><span>New member</span></LinkTo>
|
|
</section>
|
|
</GhCanvasHeader>
|
|
|
|
{{#unless this.members.loading}}
|
|
<section class="view-container">
|
|
{{#if (and this.members this.showingAll)}}
|
|
<section>
|
|
<GhMembersChart nightShift={{this.feature.nightShift}} />
|
|
</section>
|
|
{{/if}}
|
|
|
|
<section class="content-list">
|
|
<ol class="members-list gh-list {{unless this.members "no-posts"}}">
|
|
{{#if this.members}}
|
|
<li class="gh-list-row header">
|
|
<div class="gh-list-header">{{this.listHeader}}</div>
|
|
<div class="gh-list-header gh-members-list-geolocation gh-list-cellwidth-20 nowrap">Location</div>
|
|
<div class="gh-list-header gh-members-list-subscribed-at gh-list-cellwidth-20 nowrap">Created</div>
|
|
<div class="gh-list-header gh-members-list-chevron gh-list-cellwidth-chevron"></div>
|
|
</li>
|
|
<VerticalCollection @items={{this.members}} @key="id" @containerSelector=".gh-main" @estimateHeight={{69}} @staticHeight={{true}} @bufferSize={{20}} as |member|>
|
|
<GhMembersListItem @member={{member}} @data-test-member-id={{member.id}} />
|
|
</VerticalCollection>
|
|
{{else}}
|
|
<li class="no-posts-box">
|
|
<div class="no-posts">
|
|
{{svg-jar "members-placeholder" class="gh-members-placeholder"}}
|
|
{{#if this.showingAll}}
|
|
<h3>No members yet</h3>
|
|
<GhMembersNoMembers @afterCreate={{this.refreshData}} />
|
|
{{else}}
|
|
<h3>No members match the current filter</h3>
|
|
{{/if}}
|
|
</div>
|
|
</li>
|
|
{{/if}}
|
|
</ol>
|
|
</section>
|
|
</section>
|
|
{{else}}
|
|
<div class="gh-content">
|
|
<GhLoadingSpinner />
|
|
</div>
|
|
{{/unless}}
|
|
</section>
|
|
|
|
{{outlet}}
|
|
|
|
{{#if this.showLabelModal}}
|
|
<GhFullscreenModal
|
|
@modal="members-label-form"
|
|
@model={{this.labelModalData}}
|
|
@close={{this.toggleLabelModal}}
|
|
@modifier="action wide"
|
|
/>
|
|
{{/if}} |