diff --git a/app/components/toast.hbs b/app/components/toast.hbs index b33c041..c54621e 100644 --- a/app/components/toast.hbs +++ b/app/components/toast.hbs @@ -1,22 +1,27 @@ - +
+ +
+ +
+ {{@text}} +
+ + + +{{/in-element}} diff --git a/app/components/toast.js b/app/components/toast.js index 375ab55..d6c10ba 100644 --- a/app/components/toast.js +++ b/app/components/toast.js @@ -6,14 +6,17 @@ import { action } from '@ember/object'; export default class ToastComponent extends Component { @service toasts; - constructor(owner, args) { - super(owner, args); - - // registerDestructor(this, this.destroy); + @action + triggerOnClose() { + this.args.onClose?.(); } @action - destroyFromPlate() { - this.args?.willDestroy(); + registerInPlate() { + this.toasts.add(this); + + registerDestructor(this, () => { + this.toasts.remove(this); + }); } } diff --git a/app/components/toasts-container.hbs b/app/components/toasts-container.hbs index 50c7cc6..0b8f949 100644 --- a/app/components/toasts-container.hbs +++ b/app/components/toasts-container.hbs @@ -1,7 +1,5 @@ -{{#in-element this.toasts.destinationElement}} -
- {{#each this.toasts.plate as |Item|}} - - {{/each}} -
-{{/in-element}} +
+ {{#each this.toasts.container as |Item|}} + + {{/each}} +
diff --git a/app/services/toasts.js b/app/services/toasts.js index 0499ba9..02ddae5 100644 --- a/app/services/toasts.js +++ b/app/services/toasts.js @@ -4,51 +4,8 @@ import Toast from '../components/toast'; import { hbs } from 'ember-template-imports'; import { fn } from '@ember/helper'; -// const toast = hbs` -// {{component Toast text="hel"}} -// `; - -// import { RenderingTestCase, moduleFor, strip } from 'internal-test-helpers'; - -// import { precompileJSON } from '@glimmer/compiler'; -// import { getTemplateLocals } from '@glimmer/syntax'; -// import { createTemplateFactory } from '@ember/template-factory'; - -// // import { Helper } from '../../index'; -// import { setComponentTemplate } from '@glimmer/manager'; -// import { templateOnlyComponent } from '@glimmer/runtime'; - -// function precompileTemplate(source, { moduleName, scope = {} }) { -// let locals = getTemplateLocals(source); - -// let options = { -// strictMode: true, -// moduleName, -// locals, -// isProduction: false, -// meta: { moduleName }, -// }; - -// // Copied from @glimmer/compiler/lib/compiler#precompile -// let [block, usedLocals] = precompileJSON(source, options); -// let usedScope = usedLocals.map((key) => scope[key]); - -// let blockJSON = JSON.stringify(block); -// let templateJSONObject = { -// id: moduleName, -// block: blockJSON, -// moduleName: moduleName ?? '(unknown template module)', -// scope: () => usedScope, -// isStrictMode: true, -// }; - -// let factory = createTemplateFactory(templateJSONObject); - -// return factory; -// } - -// console.log(toast); export default class ToastsService extends Service { + @tracked container = []; @tracked plate = []; constructor() { @@ -60,16 +17,20 @@ export default class ToastsService extends Service { } successToast({ text }) { - const removeFromPlate = (toast) => { - this.plate = this.plate.filter((item) => item !== toast); + const onClose = () => { + this.container = this.container.filter((item) => item !== wrapper); }; - const toast = hbs``; - console.log('successToast', toast); - this.addToPlate(toast); + const wrapper = hbs``; + + this.container = this.container.concat([wrapper]); } - addToPlate(toast) { - this.plate = this.plate.concat(toast); + add(toast) { + this.queue = this.queue.concat(toast); + } + + remove(toast) { + this.queue = this.queue.filter((item) => item !== toast); } } diff --git a/app/templates/admin/indexes/item/edit.hbs b/app/templates/admin/indexes/item/edit.hbs index 4588e83..e2707cb 100644 --- a/app/templates/admin/indexes/item/edit.hbs +++ b/app/templates/admin/indexes/item/edit.hbs @@ -18,4 +18,6 @@