Ghost/ghost/admin/app/components/gh-publishmenu.js
Kevin Ansfield cb59388c5b 💄🐷 sort-imports eslint rule (#712)
no issue

- adds `eslint-plugin-sort-imports-es6-autofix` dependency
  - implements ESLint's base `sort-imports` rule but has a distinction in that `import {foo} from 'bar';` is considered `multiple` rather than `single`
  - fixes ESLint's autofix behaviour so `eslint --fix` will actually fix the sort order
- updates all unordered import rules by using `eslint --fix`

With the increased number of `import` statements since Ember+ecosystem started moving towards es6 modules I've found it frustrating at times trying to search through randomly ordered import statements. Recently I've been sorting imports manually when I've added new code or touched old code so I thought I'd add an ESLint rule to codify it.
2017-05-29 20:50:03 +02:00

126 lines
3.5 KiB
JavaScript

import $ from 'jquery';
import Component from 'ember-component';
import computed, {reads} from 'ember-computed';
import injectService from 'ember-service/inject';
import {task} from 'ember-concurrency';
export default Component.extend({
clock: injectService(),
classNames: 'gh-publishmenu',
post: null,
saveTask: null,
_publishedAtBlogTZ: null,
isClosing: null,
forcePublishedMenu: reads('post.pastScheduledTime'),
postState: computed('post.{isPublished,isScheduled}', 'forcePublishedMenu', function () {
if (this.get('forcePublishedMenu') || this.get('post.isPublished')) {
return 'published';
} else if (this.get('post.isScheduled')) {
return 'scheduled';
} else {
return 'draft';
}
}),
triggerText: computed('postState', function () {
let state = this.get('postState');
if (state === 'published') {
return 'Update';
} else if (state === 'scheduled') {
return 'Scheduled';
} else {
return 'Publish';
}
}),
buttonText: computed('postState', function () {
let state = this.get('postState');
return state === 'draft' ? 'Publish' : 'Update';
}),
save: task(function* () {
this.get('setSaveType')(this.get('saveType'));
try {
// validate publishedAtBlog first to avoid an alert for displayed errors
yield this.get('post').validate({property: 'publishedAtBlog'});
// actual save will show alert for other failed validations
let post = yield this.get('saveTask').perform();
this._cachePublishedAtBlogTZ();
return post;
} catch (error) {
// re-throw if we don't have a validation error
if (error) {
throw error;
}
}
}),
_cachePublishedAtBlogTZ() {
this._publishedAtBlogTZ = this.get('post.publishedAtBlogTZ');
},
// when closing the menu we reset the publishedAtBlogTZ date so that the
// unsaved changes made to the scheduled date aren't reflected in the PSM
_resetPublishedAtBlogTZ() {
this.get('post').set('publishedAtBlogTZ', this._publishedAtBlogTZ);
},
actions: {
setSaveType(saveType) {
let post = this.get('post');
this.set('saveType', saveType);
if (saveType === 'draft') {
post.set('statusScratch', 'draft');
} else if (saveType === 'schedule') {
post.set('statusScratch', 'scheduled');
} else if (saveType === 'publish') {
post.set('statusScratch', 'published');
}
},
open() {
this._cachePublishedAtBlogTZ();
this.set('isClosing', false);
this.get('post.errors').clear();
if (this.get('onOpen')) {
this.get('onOpen')();
}
},
close(dropdown, e) {
let post = this.get('post');
// don't close the menu if the datepicker popup is clicked
if (e && $(e.target).closest('.ember-power-datepicker-content').length) {
return false;
}
// cleanup
this._resetPublishedAtBlogTZ();
post.set('statusScratch', null);
post.validate();
if (this.get('onClose')) {
this.get('onClose')();
}
this.set('isClosing', true);
return true;
}
}
});