Skip to content

Commit

Permalink
refactor(theme-shared): add new toaster service
Browse files Browse the repository at this point in the history
related issue: #2537
  • Loading branch information
thediaval committed Jan 9, 2020
1 parent dd93bee commit e8ac235
Showing 1 changed file with 90 additions and 9 deletions.
Original file line number Diff line number Diff line change
@@ -1,15 +1,96 @@
import { Injectable } from '@angular/core';
import { AbstractToaster } from '../abstracts/toaster';
import { Message } from 'primeng/components/common/message';
import { MessageService } from 'primeng/components/common/messageservice';
import { Toaster } from '../models';
import { ReplaySubject } from 'rxjs';

@Injectable({ providedIn: 'root' })
export class ToasterService extends AbstractToaster {
constructor(protected messageService: MessageService) {
super(messageService);
@Injectable({
providedIn: 'root',
})
export class ToasterService {
toasts$ = new ReplaySubject<Toaster.Toast[]>(1);

private lastId = -1;

private toasts = [] as Toaster.Toast[];

/**
* Creates an info toast with given parameters.
* @param message Content of the toast
* @param title Title of the toast
* @param options Spesific style or structural options for individual toast
*/
info(message: string, title?: string, options?: Partial<Toaster.ToastOptions>) {
return this.show(message, title, 'info', options);
}

/**
* Creates a success toast with given parameters.
* @param message Content of the toast
* @param title Title of the toast
* @param options Spesific style or structural options for individual toast
*/
success(message: string, title?: string, options?: Partial<Toaster.ToastOptions>) {
return this.show(message, title, 'success', options);
}

/**
* Creates a warning toast with given parameters.
* @param message Content of the toast
* @param title Title of the toast
* @param options Spesific style or structural options for individual toast
*/
warn(message: string, title?: string, options?: Partial<Toaster.ToastOptions>) {
return this.show(message, title, 'warning', options);
}

/**
* Creates an error toast with given parameters.
* @param message Content of the toast
* @param title Title of the toast
* @param options Spesific style or structural options for individual toast
*/
error(message: string, title?: string, options?: Partial<Toaster.ToastOptions>) {
return this.show(message, title, 'error', options);
}

/**
* Creates a toast with given parameters.
* @param message Content of the toast
* @param title Title of the toast
* @param severity Sets color of the toast. "success", "warning" etc.
* @param options Spesific style or structural options for individual toast
*/

show(
message: string,
title: string = null,
severity: Toaster.Severity = 'neutral',
options: Partial<Toaster.ToastOptions> = null,
) {
const id = ++this.lastId;
this.toasts.push({
message,
title,
severity,
options: { closable: true, ...options, id },
});
this.toasts$.next(this.toasts);
return id;
}

/**
* Removes the toast with given id.
* @param id ID of the toast to be removed.
*/
remove(id: number) {
this.toasts = this.toasts.filter(toast => toast.options.id !== id);
this.toasts$.next(this.toasts);
}

addAll(messages: Message[]): void {
this.messageService.addAll(messages.map(message => ({ key: this.key, ...message })));
/**
* Removes all open toasts at once.
*/
removeAll() {
this.toasts = [];
this.toasts$.next(this.toasts);
}
}

3 comments on commit e8ac235

@olicooper
Copy link
Contributor

@olicooper olicooper commented on e8ac235 Jan 14, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have implemented a custom theme and I was able to use the @abp/ng.core package but I couldn't previously use @abp/ng.theme.shared because it used primeng. @thediaval does this mean we no longer rely on primeng in theme-shared?

@thediaval
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@olicooper First of all sorry for my late response.

We're still discussing replacing the primeng components with our components. In the mean time you can use our Toast, Confirmation components instead of primeng.
We also developed a table component but it currently uses primeng table styles.

@olicooper
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is great news! Thanks for your hard work :)

Please sign in to comment.