mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-01 05:50:35 +03:00
3d9d552271
ref https://linear.app/tryghost/issue/ONC-111 - changed posts fetching/display behavior to be client-side instead of server-side - admin will issue (potentially multiple) requests based on the desired status(es) - updated admin acceptance test for missing coverage I've pulled the sort from the database query as this triple sort performs very poorly at scale (taking ~4s+ past ~20k posts sometimes). Instead, we now split up the fetch to grab only one status at a time and use the front-end logic to handle displaying scheduled, then drafts, then published. This should result in a much more responsive view. We will separately change the default sort on the Admin API as that was the ultimate intent for this change.
77 lines
3.5 KiB
Handlebars
77 lines
3.5 KiB
Handlebars
<section class="gh-canvas gh-canvas-sticky">
|
|
<GhCanvasHeader class="gh-canvas-header sticky break tablet post-header">
|
|
<GhCustomViewTitle @title={{if this.session.user.isContributor (concat this.config.blogTitle " posts") "Posts"}} @query={{reset-query-params "posts"}} />
|
|
|
|
<section class="view-actions">
|
|
<PostsList::ContentFilter
|
|
@currentUser={{this.session.user}}
|
|
@selectedType={{this.selectedType}}
|
|
@availableTypes={{this.availableTypes}}
|
|
@onTypeChange={{this.changeType}}
|
|
@selectedVisibility={{this.selectedVisibility}}
|
|
@availableVisibilities={{this.availableVisibilities}}
|
|
@onVisibilityChange={{this.changeVisibility}}
|
|
@selectedAuthor={{this.selectedAuthor}}
|
|
@availableAuthors={{this.availableAuthors}}
|
|
@onAuthorChange={{this.changeAuthor}}
|
|
@selectedTag={{this.selectedTag}}
|
|
@availableTags={{this.availableTags}}
|
|
@onTagChange={{this.changeTag}}
|
|
@selectedOrder={{this.selectedOrder}}
|
|
@availableOrders={{this.availableOrders}}
|
|
@onOrderChange={{this.changeOrder}}
|
|
/>
|
|
|
|
<div class="view-actions-top-row">
|
|
<LinkTo @route="lexical-editor.new" @model="post" class="gh-btn gh-btn-primary" data-test-new-post-button={{true}}><span>New post</span></LinkTo>
|
|
</div>
|
|
</section>
|
|
</GhCanvasHeader>
|
|
|
|
<section class="view-container content-list">
|
|
<PostsList::List
|
|
@model={{@model}}
|
|
@list={{this.selectionList}}
|
|
>
|
|
<li class="no-posts-box" data-test-no-posts-box>
|
|
<div class="no-posts">
|
|
{{#if this.showingAll}}
|
|
{{svg-jar "posts-placeholder" class="gh-posts-placeholder"}}
|
|
<h4>Start creating content.</h4>
|
|
<LinkTo @route="lexical-editor.new" @model="post" class="gh-btn gh-btn-green" data-test-link="write-a-new-post">
|
|
<span>Write a new post</span>
|
|
</LinkTo>
|
|
{{else}}
|
|
<h4>No posts match the current filter</h4>
|
|
<LinkTo @route="posts" @query={{hash type=null author=null tag=null}} class="gh-btn" data-test-link="show-all">
|
|
<span>Show all posts</span>
|
|
</LinkTo>
|
|
{{/if}}
|
|
</div>
|
|
</li>
|
|
</PostsList::List>
|
|
|
|
{{!-- only show one infinity loader wheel at a time - always order as scheduled, draft, remainder --}}
|
|
{{#if @model.scheduledPosts}}
|
|
<GhInfinityLoader
|
|
@infinityModel={{@model.scheduledPosts}}
|
|
@scrollable=".gh-main"
|
|
@triggerOffset={{1000}} />
|
|
{{/if}}
|
|
{{#if (and @model.draftPosts (or (not @model.scheduledPosts) (and @model.scheduledPosts @model.scheduledPosts.reachedInfinity)))}}
|
|
<GhInfinityLoader
|
|
@infinityModel={{@model.draftPosts}}
|
|
@scrollable=".gh-main"
|
|
@triggerOffset={{1000}} />
|
|
{{/if}}
|
|
{{#if (and @model.publishedAndSentPosts (and (or (not @model.scheduledPosts) @model.scheduledPosts.reachedInfinity) (or (not @model.draftPosts) @model.draftPosts.reachedInfinity)))}}
|
|
<GhInfinityLoader
|
|
@infinityModel={{@model.publishedAndSentPosts}}
|
|
@scrollable=".gh-main"
|
|
@triggerOffset={{1000}} />
|
|
{{/if}}
|
|
|
|
</section>
|
|
{{outlet}}
|
|
</section>
|