[ADF-3118] translation support for notification service (snackbars) (#3427)

* translation support for snackbar

* unit tests
This commit is contained in:
Denys Vuika
2018-06-04 09:58:21 +01:00
committed by Eugenio Romano
parent 6909c459a8
commit 2f51b9f2b8
3 changed files with 47 additions and 19 deletions

View File

@@ -15,12 +15,12 @@ Shows a notification message with optional feedback.
- **openSnackMessage**(message: `string` = `null`, millisecondsDuration?: `number` = `null`): `MatSnackBarRef<any>`<br/> - **openSnackMessage**(message: `string` = `null`, millisecondsDuration?: `number` = `null`): `MatSnackBarRef<any>`<br/>
Opens a snackbar notification to show a message. Opens a snackbar notification to show a message.
- _message:_ `string` - The message to show - _message:_ `string` - The message (or resource key) to show.
- _millisecondsDuration:_ `number` - (Optional) Time before notification disappears after being shown - _millisecondsDuration:_ `number` - (Optional) Time before notification disappears after being shown
- **Returns** `MatSnackBarRef<any>` - Information/control object for the snackbar - **Returns** `MatSnackBarRef<any>` - Information/control object for the snackbar
- **openSnackMessageAction**(message: `string` = `null`, action: `string` = `null`, millisecondsDuration?: `number` = `null`): `MatSnackBarRef<any>`<br/> - **openSnackMessageAction**(message: `string` = `null`, action: `string` = `null`, millisecondsDuration?: `number` = `null`): `MatSnackBarRef<any>`<br/>
Opens a snackbar notification with a message and a response button. Opens a snackbar notification with a message and a response button.
- _message:_ `string` - The message to show - _message:_ `string` - The message (or resource key) to show.
- _action:_ `string` - Caption for the response button - _action:_ `string` - Caption for the response button
- _millisecondsDuration:_ `number` - (Optional) Time before the notification disappears (unless the button is clicked) - _millisecondsDuration:_ `number` - (Optional) Time before the notification disappears (unless the button is clicked)
- **Returns** `MatSnackBarRef<any>` - Information/control object for the snackbar - **Returns** `MatSnackBarRef<any>` - Information/control object for the snackbar
@@ -39,9 +39,12 @@ export class MyComponent implements OnInit {
} }
ngOnInit() { ngOnInit() {
this.notificationService.openSnackMessage('test', 200000).afterDismissed().subscribe(() => { this.notificationService
console.log('The snack-bar was dismissed'); .openSnackMessage('test', 200000)
}); .afterDismissed()
.subscribe(() => {
console.log('The snack-bar was dismissed');
});
} }
} }
``` ```
@@ -55,7 +58,10 @@ export class MyComponent implements OnInit {
} }
ngOnInit() { ngOnInit() {
this.notificationService.openSnackMessageAction('Do you want to report this issue?', 'send', 200000).afterDismissed().subscribe(() => { this.notificationService
.openSnackMessageAction('Do you want to report this issue?', 'send', 200000)
.afterDismissed()
.subscribe(() => {
console.log('The snack-bar was dismissed'); console.log('The snack-bar was dismissed');
}); });
} }

View File

@@ -23,6 +23,8 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MatSnackBar, MatSnackBarModule } from '@angular/material'; import { MatSnackBar, MatSnackBarModule } from '@angular/material';
import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { NotificationService } from './notification.service'; import { NotificationService } from './notification.service';
import { TranslationMock } from '../mock/translation.service.mock';
import { TranslationService } from './translation.service';
@Component({ @Component({
template: '', template: '',
@@ -47,6 +49,7 @@ class ProvidesNotificationServiceComponent {
describe('NotificationService', () => { describe('NotificationService', () => {
let fixture: ComponentFixture<ProvidesNotificationServiceComponent>; let fixture: ComponentFixture<ProvidesNotificationServiceComponent>;
let translationService: TranslationService;
beforeEach(async(() => { beforeEach(async(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
@@ -60,11 +63,12 @@ describe('NotificationService', () => {
NotificationService, NotificationService,
MatSnackBar, MatSnackBar,
OVERLAY_PROVIDERS, OVERLAY_PROVIDERS,
LiveAnnouncer LiveAnnouncer,
{ provide: TranslationService, useClass: TranslationMock }
] ]
}); });
TestBed.compileComponents(); translationService = TestBed.get(TranslationService);
})); }));
beforeEach(() => { beforeEach(() => {
@@ -72,6 +76,18 @@ describe('NotificationService', () => {
fixture.detectChanges(); fixture.detectChanges();
}); });
it('should translate messages', (done) => {
spyOn(translationService, 'instant').and.callThrough();
let promise = fixture.componentInstance.sendMessage();
promise.afterDismissed().subscribe(() => {
expect(translationService.instant).toHaveBeenCalled();
done();
});
fixture.detectChanges();
});
it('should open a message notification bar', (done) => { it('should open a message notification bar', (done) => {
let promise = fixture.componentInstance.sendMessage(); let promise = fixture.componentInstance.sendMessage();
promise.afterDismissed().subscribe(() => { promise.afterDismissed().subscribe(() => {

View File

@@ -17,36 +17,42 @@
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import { MatSnackBar, MatSnackBarRef } from '@angular/material'; import { MatSnackBar, MatSnackBarRef } from '@angular/material';
import { TranslationService } from './translation.service';
@Injectable() @Injectable()
export class NotificationService { export class NotificationService {
static DEFAULT_DURATION_MESSAGE: number = 5000; static DEFAULT_DURATION_MESSAGE: number = 5000;
constructor(public snackbar: MatSnackBar) { constructor(private snackBar: MatSnackBar,
private translationService: TranslationService) {
} }
/** /**
* Opens a snackbar notification to show a message. * Opens a SnackBar notification to show a message.
* @param message The message to show * @param message The message (or resource key) to show.
* @param millisecondsDuration Time before notification disappears after being shown * @param millisecondsDuration Time before notification disappears after being shown
* @returns Information/control object for the snackbar * @returns Information/control object for the SnackBar
*/ */
public openSnackMessage(message: string, millisecondsDuration?: number): MatSnackBarRef<any> { openSnackMessage(message: string, millisecondsDuration?: number): MatSnackBarRef<any> {
return this.snackbar.open(message, null, { const translatedMessage = this.translationService.instant(message);
return this.snackBar.open(translatedMessage, null, {
duration: millisecondsDuration || NotificationService.DEFAULT_DURATION_MESSAGE duration: millisecondsDuration || NotificationService.DEFAULT_DURATION_MESSAGE
}); });
} }
/** /**
* Opens a snackbar notification with a message and a response button. * Opens a SnackBar notification with a message and a response button.
* @param message The message to show * @param message The message (or resource key) to show.
* @param action Caption for the response button * @param action Caption for the response button
* @param millisecondsDuration Time before the notification disappears (unless the button is clicked) * @param millisecondsDuration Time before the notification disappears (unless the button is clicked)
* @returns Information/control object for the snackbar * @returns Information/control object for the SnackBar
*/ */
public openSnackMessageAction(message: string, action: string, millisecondsDuration?: number): MatSnackBarRef<any> { openSnackMessageAction(message: string, action: string, millisecondsDuration?: number): MatSnackBarRef<any> {
return this.snackbar.open(message, action, { const translatedMessage = this.translationService.instant(message);
return this.snackBar.open(translatedMessage, action, {
duration: millisecondsDuration || NotificationService.DEFAULT_DURATION_MESSAGE duration: millisecondsDuration || NotificationService.DEFAULT_DURATION_MESSAGE
}); });
} }