Barra de aperitivos

El servicio de snackbar muestra un mensaje emergente en la esquina superior derecha de la pantalla; sin embargo, la posición puede ser cambiada por cambiando las posiciones horizontal y vertical en el servicio. La duración de cuánto tiempo aparece el popup también puede ser cambiado al modificar la variable 'duration', que es de 3 segundos por defecto.

Hay cuatro mensajes diferentes para elegir: Éxito, Error, Advertencia e Información, cada mensaje se muestra con un ícono diferente que coincide con el message type. El servicio tiene cuatro funciones, cada una para un diferente message type.

Está construido utilizando MatSnackBar from @angular/material/snack-bar biblioteca.

Cada método de mensaje de snackbar recibe un objeto de datos que incluye un título y una descripción. Este es el texto que se mostrará en el popup del snackbar.

Ejemplo de uso:

showSuccessSnackbar

onCellClick(value: string | undefined | null): void {
        if (value) {
            navigator.clipboard.writeText(value).then(() =>
                this.snackbarService.showSuccessSnackbar({
                    title: this.translocoService.translate('common.tableComponent.copyToClipboardTitle'),
                    description: this.translocoService.translate('common.tableComponent.copyToClipboardDescription', {
                        value
                    })
                })
            );
        }
    }

showErrorSnackbar

handleApiError$ = createEffect(
        () =>
            this.actions$.pipe(
                ofType(
                    ProcessingEntitySettingsActions.apiError,
                    ProcessingEntitySettingsActions.processingEntitySearchFailed
                ),
                tap((action) =>
                    this.snackBarService.showErrorSnackbar({
                        title: action.error.name,
                        description: action.error.message
                    })
                )
            ),
        { dispatch: false }
    );