(wip) create pix-toast service

addon/components/pix-toast.hbs

@@ -13,7 +13,7 @@
       @ariaLabel={{@ariaLabelForCloseButton}}
       @icon="xmark"
       @size="small"
-      @triggerAction={{@onCloseButtonClick}}
+      @triggerAction={{this.removeNotification}}
       class="{{concat 'pix-toast__close-button--' this.type}}"
     />
   </div>

addon/components/pix-toast.js

@@ -1,15 +1,21 @@
 import Component from '@glimmer/component';
-
+import { service } from '@ember/service';
+import { action } from '@ember/object';
 const TYPE_SUCCESS = 'success';
 const TYPE_ERROR = 'error';
 const TYPE_INFORMATION = 'information';
 const TYPE_WARNING = 'warning';
 
 export default class PixToast extends Component {
+  @service toast;
+
   get type() {
-    const error = console.warn('ERROR in PixToast component, you need to provide a type.');
     const correctTypes = [TYPE_SUCCESS, TYPE_ERROR, TYPE_INFORMATION, TYPE_WARNING];
-    return correctTypes.includes(this.args.type) ? this.args.type : error;
+    const isACorrectType = correctTypes.includes(this.args.type);
+    if (!isACorrectType) {
+      throw new Error('ERROR in PixToast component, you need to provide a type.');
+    }
+    return this.args.type;
   }
 
   get iconClass() {
@@ -21,4 +27,11 @@ export default class PixToast extends Component {
     };
     return classes[this.type];
   }
+
+  @action
+  removeNotification(event) {
+    event.preventDefault();
+    event.stopPropagation();
+    this.toast.removeNotification(this.toast);
+  }
 }

addon/services/pix-toast.js

@@ -0,0 +1,63 @@
+import Service from '@ember/service';
+import { A } from '@ember/array';
+import EmberObject from '@ember/object';
+
+export default class ToastService extends Service {
+  content = A();
+  addNotification(options) {
+    if (!options.message) {
+      throw new Error('No notification message provided');
+    }
+
+    const notification = EmberObject.create({
+      message: options.message,
+      type: options.type || 'success',
+      onClick: options.onClick,
+      htmlContent: options.htmlContent || false,
+    });
+
+    this.content.pushObject(notification);
+
+    return notification;
+  }
+
+  sendErrorNotification(message, options) {
+    return this.addNotification({
+      ...options,
+      message,
+      type: 'error',
+    });
+  }
+
+  sendSuccessNotification(message, options) {
+    return this.addNotification({
+      ...options,
+      message,
+      type: 'success',
+    });
+  }
+
+  sendInformationNotification(message, options) {
+    return this.addNotification({
+      ...options,
+      message,
+      type: 'information',
+    });
+  }
+
+  sendWarningNotification(message, options) {
+    return this.addNotification({
+      ...options,
+      message,
+      type: 'warning',
+    });
+  }
+
+  removeNotification(notification) {
+    if (!notification) {
+      return;
+    }
+
+    notification.set('dismiss', true);
+  }
+}

app/services/pix-toast.js

@@ -0,0 +1 @@
+export { default } from '@1024pix/pix-ui/services/pix-toast';

app/stories/pix-toast.stories.js

@@ -7,7 +7,7 @@ export default {
   @type={{this.type}}
   @showToast={{this.showToast}}
   @ariaLabelForCloseButton='Fermer'
-  @onCloseButtonClick={{fn (mut this.showToast) (not this.showToast)}}
+  @onCloseButtonClick={{fn (mut this.showToast)}}
 >
   ed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium,
   totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae