Ghost/ghost/admin/app/components/gh-benefit-item.js
Rishabh 9a74c59630 Refined enter behavior in Admin benefits modal
refs https://github.com/TryGhost/Team/issues/874

- when hit with focus on last non-empty benefit field, previously the new benefit automatically showed error for empty field. This change refines behavior to only show error when user tries to click "Enter" again when already on last empty benefit
- also cleans up the duplicate add benefit call
2021-09-02 15:10:58 +05:30

59 lines
1.6 KiB
JavaScript

import Component from '@ember/component';
import ValidationState from 'ghost-admin/mixins/validation-state';
import boundOneWay from 'ghost-admin/utils/bound-one-way';
import {computed} from '@ember/object';
import {readOnly} from '@ember/object/computed';
import {run} from '@ember/runloop';
export default Component.extend(ValidationState, {
classNames: 'gh-blognav-item',
classNameBindings: ['errorClass', 'benefitItem.isNew::gh-blognav-item--sortable'],
new: false,
// closure actions
addItem() {},
deleteItem() {},
updateLabel() {},
name: boundOneWay('benefitItem.name'),
errors: readOnly('benefitItem.errors'),
errorClass: computed('hasError', function () {
return this.hasError ? 'gh-blognav-item--error' : '';
}),
actions: {
addItem(item) {
this.addItem(item);
},
deleteItem(item) {
this.deleteItem(item);
},
updateLabel(value) {
this.set('name', value);
return this.updateLabel(value, this.benefitItem);
},
clearLabelErrors() {
if (this.get('benefitItem.errors')) {
this.get('benefitItem.errors').remove('name');
}
}
},
keyPress(event) {
// enter key
if (event.keyCode === 13) {
event.preventDefault();
if (this.get('benefitItem.isNew')) {
run.scheduleOnce('actions', this, this.send, 'addItem', this.benefitItem);
} else {
run.scheduleOnce('actions', this, this.send, 'focusItem', this.benefitItem);
}
}
}
});