OpenSourceArk/Ghost
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🎨 Publish menu wording and saving states improvements (#788)

Browse Source 
closes TryGhost/Ghost#8696

- Changes the `gh-save-button` component to allow a custom `runningText` which would be rendered in the button when the current task is running.
- Adds a `runningText` CP to `gh-publishmenu` component, which will render (depending of post status and desired save type) 'Unpublishing', 'Publishing', 'Scheduling', 'Updating', 'Unpublishing', 'Rescheduling', and 'Unscheduling'.
This commit is contained in:
Aileen Nowak 2017-07-20 17:46:31 +07:00 committed by Kevin Ansfield
parent 2cbb181866
commit c478564513
6 changed files with 59 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ghost/admin/app/components/gh-publishmenu-draft.js
View File

@ -35,7 +35,7 @@ export default Component.extend({
this.get('setSaveType')(type);
// when publish: switch to now to avoid validation errors
// when schedule: switch to last valid or new minimum scheduled date
// when schedule: switch to last valid or new minimum scheduled date
if (type === 'publish') {
if (!hasDateError && !hasTimeError) {
this._publishedAtBlogTZ = this.get('post.publishedAtBlogTZ');

37
ghost/admin/app/components/gh-publishmenu.js
View File

@ -39,9 +39,31 @@ export default Component.extend({
}
}),
buttonText: computed('postState', 'saveType', function() {
let postState = this.get('postState');
_runningText: computed('postState', 'saveType', function() {
let saveType = this.get('saveType');
let postState = this.get('postState');
let runningText;
if (postState === 'draft') {
runningText = saveType === 'publish' ? 'Publishing' : 'Scheduling';
}
if (postState === 'published') {
runningText = saveType === 'publish' ? 'Updating' : 'Unpublishing';
}
if (postState === 'scheduled') {
runningText = saveType === 'schedule' ? 'Rescheduling' : 'Unscheduling';
}
return runningText || 'Publishing';
}),
runningText: null,
buttonText: computed('postState', 'saveType', function() {
let saveType = this.get('saveType');
let postState = this.get('postState');
let buttonText;
if (postState === 'draft') {
@ -49,11 +71,11 @@ export default Component.extend({
}
if (postState === 'published') {
buttonText = saveType === 'publish' ? 'Update' : 'Un-publish';
buttonText = saveType === 'publish' ? 'Update' : 'Unpublish';
}
if (postState === 'scheduled') {
buttonText = saveType === 'schedule' ? 'Re-schedule' : 'Un-schedule';
buttonText = saveType === 'schedule' ? 'Reschedule' : 'Unschedule';
}
return buttonText || 'Publish';
@ -69,17 +91,20 @@ export default Component.extend({
}
if (previousStatus === 'published') {
buttonText = postState === 'draft' ? 'Un-published' : 'Updated';
buttonText = postState === 'draft' ? 'Unpublished' : 'Updated';
}
if (previousStatus === 'scheduled') {
buttonText = postState === 'draft' ? 'Un-scheduled' : 'Re-scheduled';
buttonText = postState === 'draft' ? 'Unscheduled' : 'Rescheduled';
}
return buttonText;
}),
save: task(function* () {
// runningText needs to be declared before the other states change during the
// save action.
this.set('runningText', this.get('_runningText'));
this.set('_previousStatus', this.get('post.status'));
this.get('setSaveType')(this.get('saveType'));

1
ghost/admin/app/templates/components/gh-publishmenu.hbs
View File

@ -34,6 +34,7 @@
{{gh-task-button buttonText
task=save
successText=successText
runningText=runningText
class="gh-btn gh-btn-blue gh-publishmenu-button gh-btn-icon"
data-test-publishmenu-save=true}}
</footer>

4
ghost/admin/app/templates/components/gh-task-button.hbs
View File

@ -7,8 +7,8 @@
)}}
{{else}}
<span>
{{#if isRunning}}{{inline-svg "spinner" class="gh-icon-spinner"}}{{/if}}
{{if (or isIdle isRunning) buttonText}}
{{#if isRunning}}{{inline-svg "spinner" class="gh-icon-spinner"}}{{runningText}}{{/if}}
{{#if isIdle}}{{buttonText}}{{/if}}
{{#if isSuccess}}{{inline-svg "check-circle"}} {{successText}}{{/if}}
{{#if isFailure}}{{inline-svg "retry"}} {{failureText}}{{/if}}
</span>

14
ghost/admin/tests/acceptance/editor-test.js
View File

@ -188,7 +188,7 @@ describe('Acceptance: Editor', function() {
expect(
find(testSelector('publishmenu-save')).text().trim(),
'published post unpublish button text'
).to.equal('Un-publish');
).to.equal('Unpublish');
// post id 2 is a published post, checking for published post behaviour now
await visit('/editor/2');
@ -258,14 +258,14 @@ describe('Acceptance: Editor', function() {
expect(
find(testSelector('publishmenu-save')).text().trim(),
'published post unpublish button text'
).to.equal('Un-publish');
).to.equal('Unpublish');
await click(testSelector('publishmenu-save'));
expect(
find(testSelector('publishmenu-save')).text().trim(),
'publish menu save button updated after published post is unpublished'
).to.equal('Un-published');
).to.equal('Unpublished');
expect(
find(testSelector('publishmenu-draft')),
@ -324,14 +324,14 @@ describe('Acceptance: Editor', function() {
expect(
find(testSelector('publishmenu-save')).text().trim(),
'scheduled post button reschedule text'
).to.equal('Re-schedule');
).to.equal('Reschedule');
await click(testSelector('publishmenu-save'));
expect(
find(testSelector('publishmenu-save')).text().trim(),
'publish menu save button text for a rescheduled post'
).to.equal('Re-scheduled');
).to.equal('Rescheduled');
await click(testSelector('publishmenu-cancel'));
@ -352,14 +352,14 @@ describe('Acceptance: Editor', function() {
expect(
find(testSelector('publishmenu-save')).text().trim(),
'publish menu save button updated after scheduled post is unscheduled'
).to.equal('Un-schedule');
).to.equal('Unschedule');
await click(testSelector('publishmenu-save'));
expect(
find(testSelector('publishmenu-save')).text().trim(),
'publish menu save button updated after scheduled post is unscheduled'
).to.equal('Un-scheduled');
).to.equal('Unscheduled');
await click(testSelector('publishmenu-cancel'));

17
ghost/admin/tests/integration/components/gh-task-button-test.js
View File

@ -55,6 +55,23 @@ describe('Integration: Component: gh-task-button', function() {
wait().then(done);
});
it('shows running text when passed whilst running', function (done) {
this.set('myTask', task(function* () {
yield timeout(50);
}));
this.render(hbs`{{gh-task-button task=myTask runningText="Running"}}`);
this.get('myTask').perform();
run.later(this, function () {
expect(this.$('button')).to.have.descendants('svg');
expect(this.$('button')).to.contain('Running');
}, 20);
wait().then(done);
});
it('appears disabled whilst running', function (done) {
this.set('myTask', task(function* () {
yield timeout(50);