From 2a212bfff4f26ab3b5ea89fbb27a6260e2c04a86 Mon Sep 17 00:00:00 2001 From: Sodbileg Gansukh Date: Mon, 26 Aug 2024 17:02:00 +0800 Subject: [PATCH] Publish flow improvements and bug fixes (#20824) ref DES-731 - improved mobile styles for the social buttons in the modal - fixed the flow for publishing/scheduling pages - redirect to post list only when a post doesn't involve any email --- .../editor/modals/publish-flow/confirm.js | 28 ++++++++++++---- .../app/components/modal-post-success.hbs | 30 ++++++++++------- .../app/components/modal-post-success.js | 5 --- ghost/admin/app/components/posts-list/list.js | 8 +++-- .../app/styles/components/publishmenu.css | 33 ++++++++++++++----- 5 files changed, 70 insertions(+), 34 deletions(-) diff --git a/ghost/admin/app/components/editor/modals/publish-flow/confirm.js b/ghost/admin/app/components/editor/modals/publish-flow/confirm.js index 5950b1b949..405e1c197a 100644 --- a/ghost/admin/app/components/editor/modals/publish-flow/confirm.js +++ b/ghost/admin/app/components/editor/modals/publish-flow/confirm.js @@ -95,14 +95,28 @@ export default class PublishFlowOptions extends Component { yield this.args.saveTask.perform(); if (this.feature.publishFlowEndScreen) { if (this.args.publishOptions.isScheduled) { - localStorage.setItem('ghost-last-scheduled-post', this.args.publishOptions.post.id); - this.router.transitionTo('posts'); - } else { - localStorage.setItem('ghost-last-published-post', this.args.publishOptions.post.id); - if (this.args.publishOptions.post.emailOnly) { - this.router.transitionTo('posts.analytics', this.args.publishOptions.post.id); - } else { + localStorage.setItem('ghost-last-scheduled-post', JSON.stringify({ + id: this.args.publishOptions.post.id, + type: this.args.publishOptions.post.displayName + })); + if (this.args.publishOptions.post.displayName !== 'page') { this.router.transitionTo('posts'); + } else { + this.router.transitionTo('pages'); + } + } else { + localStorage.setItem('ghost-last-published-post', JSON.stringify({ + id: this.args.publishOptions.post.id, + type: this.args.publishOptions.post.displayName + })); + if (this.args.publishOptions.post.displayName !== 'page') { + if (this.args.publishOptions.post.hasEmail) { + this.router.transitionTo('posts.analytics', this.args.publishOptions.post.id); + } else { + this.router.transitionTo('posts'); + } + } else { + this.router.transitionTo('pages'); } } } diff --git a/ghost/admin/app/components/modal-post-success.hbs b/ghost/admin/app/components/modal-post-success.hbs index 75ba245fbc..049d9395ff 100644 --- a/ghost/admin/app/components/modal-post-success.hbs +++ b/ghost/admin/app/components/modal-post-success.hbs @@ -12,14 +12,18 @@ {{/if}} - {{#if this.post.emailOnly}} - Your email has been sent. - {{else}} - {{#if this.showPostCount}} - That's {{format-number this.postCount}} {{gh-pluralize this.postCount "post" without-count=true}} published. + {{#if this.post.isPost}} + {{#if this.post.emailOnly}} + Your email has been sent. {{else}} - Spread the word! + {{#if this.showPostCount}} + That's {{format-number this.postCount}} {{gh-pluralize this.postCount "post" without-count=true}} published. + {{else}} + Spread the word! + {{/if}} {{/if}} + {{else}} + Your page is published. {{/if}} {{/if}} @@ -32,7 +36,11 @@ {{#if this.post.isSent}} It {{else}} - {{if this.post.emailOnly "Your email" "Your post"}} + {{#if this.post.emailOnly}} + Your email + {{else}} + Your {{this.post.displayName}} + {{/if}} {{/if}} {{if this.post.isScheduled "will be" "was"}} {{#if this.post.emailOnly}} @@ -105,7 +113,7 @@ {{#if this.post.excerpt}}

{{this.post.excerpt}}

{{/if}} - +
{{#if (get-setting "icon")}}
@@ -116,7 +124,7 @@ {{#if (get-setting "title")}}
{{get-setting "title"}}
{{/if}} -
{{this.authorNames}}
+
{{post-author-names this.post}}
@@ -141,7 +149,7 @@ @idleIcon="link" @buttonText="Copy link" @title="Copy link" - @task={{this.handleCopyLink}} + @task={{this.handleCopyLink}} @successText="Link copied" @class="gh-btn gh-btn-primary gh-btn-icon copy-link" /> {{else}} @@ -173,7 +181,7 @@ Close {{/if}} - + {{/if}} diff --git a/ghost/admin/app/components/modal-post-success.js b/ghost/admin/app/components/modal-post-success.js index 1de8a27ec7..0e58369a29 100644 --- a/ghost/admin/app/components/modal-post-success.js +++ b/ghost/admin/app/components/modal-post-success.js @@ -1,6 +1,5 @@ import Component from '@glimmer/component'; import copyTextToClipboard from 'ghost-admin/utils/copy-text-to-clipboard'; -import {authorNames} from '../helpers/author-names'; import {capitalize} from '@ember/string'; import {inject as service} from '@ember/service'; import {task, timeout} from 'ember-concurrency'; @@ -39,10 +38,6 @@ export default class PostSuccessModal extends Component { return encodeURIComponent(`${this.post.title} ${this.post.url}`); } - get authorNames() { - return authorNames([this.post.authors]); - } - @task *handleCopyLink() { copyTextToClipboard(this.post.url); diff --git a/ghost/admin/app/components/posts-list/list.js b/ghost/admin/app/components/posts-list/list.js index 449e914341..ce99157312 100644 --- a/ghost/admin/app/components/posts-list/list.js +++ b/ghost/admin/app/components/posts-list/list.js @@ -48,13 +48,15 @@ export default class PostsList extends Component { @task *getLatestScheduledPost() { - const result = yield this.store.query('post', {filter: `id:${localStorage.getItem('ghost-last-scheduled-post')}`, limit: 1}); + const post = JSON.parse(localStorage.getItem('ghost-last-scheduled-post')); + const result = yield this.store.query(post.type, {filter: `id:${post.id}`, limit: 1}); this.latestScheduledPost = result.toArray()[0]; } @task *getlatestPublishedPost() { - const result = yield this.store.query('post', {filter: `id:${localStorage.getItem('ghost-last-published-post')}`, limit: 1}); + const post = JSON.parse(localStorage.getItem('ghost-last-published-post')); + const result = yield this.store.query(post.type, {filter: `id:${post.id}`, limit: 1}); this.latestPublishedPost = result.toArray()[0]; } @@ -63,4 +65,4 @@ export default class PostsList extends Component { const result = yield this.store.query('post', {filter: 'status:published', limit: 1, page: 1}); this.postCount = result.meta.pagination.total; } -} \ No newline at end of file +} diff --git a/ghost/admin/app/styles/components/publishmenu.css b/ghost/admin/app/styles/components/publishmenu.css index 73a5465c60..78b824be9d 100644 --- a/ghost/admin/app/styles/components/publishmenu.css +++ b/ghost/admin/app/styles/components/publishmenu.css @@ -950,9 +950,9 @@ .modal-post-success .modal-body p.post-excerpt { -webkit-line-clamp: 2; display: -webkit-box; - -webkit-box-orient: vertical; + -webkit-box-orient: vertical; overflow: hidden; - margin: 0 0 16px 0; + margin: 0 0 16px 0; } .modal-post-success .email { @@ -977,10 +977,13 @@ white-space: nowrap; } +.modal-post-success .modal-body .gh-post-bookmark-authors::before { + margin-left: 4px; +} + .modal-post-success .modal-body .gh-post-bookmark-site-icon { width: 24px; height: 24px; - } .modal-post-success .modal-body strong.nowrap { @@ -1008,8 +1011,8 @@ } .modal-post-success .modal-footer .share-buttons { - display: flex; - justify-content: space-evenly; + display: grid; + grid-template-columns: repeat(4, 1fr); align-items: center; gap: 16px; } @@ -1079,14 +1082,28 @@ .modal-post-success .modal-header h1 { font-size: 2.4rem; } - + .modal-post-success .modal-footer { display: flex; flex-direction: column; } - .modal-post-success .modal-footer .copy-link, + .modal-post-success .modal-footer .share-buttons { + grid-template-columns: repeat(2, 1fr); + } + + .modal-post-success .modal-footer .copy-link, .modal-post-success .modal-footer .copy-preview-link { width: 100%!important; } -} \ No newline at end of file +} + +@media (max-width: 600px) { + .modal-post-success .modal-footer:has(.share-buttons) { + flex-direction: column; + } + + .modal-post-success .modal-footer .gh-btn:is(.twitter, .threads, .facebook, .linkedin) { + width: auto; + } +}