Ghost/ghost/admin/app/components/gh-notification.js
Gabriel Csapo 8d01fb5556 Switched majority of files from EmberObject to native class syntax using @classic decorator (#2227)
no issue

- ran [ember-native-class-codemod](https://github.com/ember-codemods/ember-native-class-codemod) to convert the majority of remaining EmberObject based controllers and components to native class syntax using the `@classic` decorator
- skipped older style modal components (`components/modal-*.js`) due to observed incompatibilities in some cases
2022-02-01 09:34:03 +00:00

58 lines
1.5 KiB
JavaScript

import Component from '@ember/component';
import classic from 'ember-classic-decorator';
import {action, computed} from '@ember/object';
import {classNameBindings, classNames, tagName} from '@ember-decorators/component';
import {run} from '@ember/runloop';
import {inject as service} from '@ember/service';
@classic
@tagName('article')
@classNames('gh-notification', 'gh-notification-passive')
@classNameBindings('typeClass')
export default class GhNotification extends Component {
@service
notifications;
message = null;
@computed('message.type')
get typeClass() {
let type = this.get('message.type');
let classes = '';
let typeMapping;
typeMapping = {
error: 'red',
warn: 'yellow'
};
if (typeMapping[type] !== undefined) {
classes += `gh-notification-${typeMapping[type]}`;
}
return classes;
}
didInsertElement() {
super.didInsertElement(...arguments);
this._animationEndHandler = run.bind(this, function () {
if (event.animationName === 'fade-out') {
this.notifications.closeNotification(this.message);
}
});
this.element.addEventListener('animationend', this._animationEndHandler);
}
willDestroyElement() {
super.willDestroyElement(...arguments);
this.element.removeEventListener('animationend', this._animationEndHandler);
}
@action
closeNotification() {
this.notifications.closeNotification(this.message);
}
}