diff --git a/src/app/main/component/user/services/user-notification.service.ts b/src/app/main/component/user/services/user-notification.service.ts index ddcc9e7639..f2ed18b3e5 100644 --- a/src/app/main/component/user/services/user-notification.service.ts +++ b/src/app/main/component/user/services/user-notification.service.ts @@ -12,7 +12,7 @@ export class UserNotificationService { url: string = environment.backendLink; pickUpUrl: string = environment.backendUbsLink + '/'; - constructor(private http: HttpClient) {} + constructor(private readonly http: HttpClient) {} getAllNotifications(params: HttpParams): Observable { return this.http.get(`${this.url}notifications`, { params }); @@ -23,13 +23,17 @@ export class UserNotificationService { } readNotification(id: number, isPickUp: boolean): Observable { - const url = isPickUp ? this.pickUpUrl : this.url; - return this.http.post(`${url}notifications/${id}/viewNotification`, {}); + if (isPickUp) { + return this.http.patch(`${this.pickUpUrl}notifications/${id}/viewNotification`, {}); + } + return this.http.post(`${this.url}notifications/${id}/viewNotification`, {}); } unReadNotification(id: number, isPickUp: boolean): Observable { - const url = isPickUp ? this.pickUpUrl : this.url; - return this.http.post(`${url}notifications/${id}/unreadNotification`, {}); + if (isPickUp) { + return this.http.patch(`${this.pickUpUrl}notifications/${id}/unreadNotification`, {}); + } + return this.http.post(`${this.url}notifications/${id}/unreadNotification`, {}); } deleteNotification(id: number, isPickUp: boolean): Observable { diff --git a/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.html b/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.html index 46bb06c473..6a21ec7eb6 100644 --- a/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.html +++ b/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.html @@ -39,11 +39,11 @@ {{ listItem.name | translate }} icon {{ listItem.name | translate }} - ({{ serviceUserMessages.countOfNoReadeMessages }}) + ({{ serviceUserMessages.countOfNoReadMessages }}) diff --git a/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.spec.ts b/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.spec.ts index c5653ea38a..ce93f6c3cc 100644 --- a/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.spec.ts +++ b/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.spec.ts @@ -62,7 +62,7 @@ describe('UbsBaseSidebarComponent', () => { fixture = TestBed.createComponent(UbsBaseSidebarComponent); component = fixture.componentInstance; spyOn(global, 'setTimeout'); - userMessagesService.countOfNoReadeMessages = 0; + userMessagesService.countOfNoReadMessages = 0; fixture.detectChanges(); }); @@ -76,7 +76,7 @@ describe('UbsBaseSidebarComponent', () => { }); it('should return default icon link', () => { - userMessagesService.countOfNoReadeMessages = 1; + userMessagesService.countOfNoReadMessages = 1; listItem.link = component.bellsNoneNotification; expect(component.getIcon(listItem)).toBe(component.bellsNotification); }); diff --git a/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.ts b/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.ts index d767dd4fb8..31df400680 100644 --- a/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.ts +++ b/src/app/shared/ubs-base-sidebar/ubs-base-sidebar.component.ts @@ -69,8 +69,8 @@ export class UbsBaseSidebarComponent implements AfterViewInit, AfterViewChecked, } } - getIcon(listItem): string { - return listItem.link === this.bellsNoneNotification && this.serviceUserMessages.countOfNoReadeMessages + getIcon(listItem: listElements): string { + return listItem.link === this.bellsNoneNotification && this.serviceUserMessages.countOfNoReadMessages ? this.bellsNotification : listItem.link; } @@ -93,7 +93,7 @@ export class UbsBaseSidebarComponent implements AfterViewInit, AfterViewChecked, .getCountUnreadNotification() .pipe(takeUntil(this.destroy)) .subscribe((response) => { - this.serviceUserMessages.countOfNoReadeMessages = response; + this.serviceUserMessages.countOfNoReadMessages = response; }); } else { this.isAdmin = true; diff --git a/src/app/ubs/ubs-user/services/user-messages-service.spec.ts b/src/app/ubs/ubs-user/services/user-messages-service.spec.ts deleted file mode 100644 index 9431ce3183..0000000000 --- a/src/app/ubs/ubs-user/services/user-messages-service.spec.ts +++ /dev/null @@ -1,88 +0,0 @@ -import { UserMessagesService } from './user-messages.service'; -import { TestBed } from '@angular/core/testing'; -import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing'; -import { Notifications } from '../../../ubs/ubs-admin/models/ubs-user.model'; -import { environment } from '@environment/environment'; - -const url = environment.backendUbsLink; -const expectNotification: Notifications = { - page: [ - { - id: 1, - notificationTime: '2021-10-16T18:01:52.091747', - orderId: 2111, - read: false, - title: 'Неоплачене замовлення' - }, - { - id: 2, - orderId: 2111, - read: false, - title: 'Неоплачене замовлення', - notificationTime: '2021-10-16T18:01:52.091747' - } - ], - totalElements: 2, - currentPage: 0, - totalPages: 1 -}; -const expectBodyNotification = { - body: 'WWWWW', - title: 'Unpaid order' -}; -const appServiceNotificationSpy = jasmine.createSpyObj('UserMessagesService', { - getNotification: expectNotification, - getCountUnreadNotification: 100, - setReadNotification: expectBodyNotification -}); -describe('UserMessagesService', () => { - const lang = 'ua'; - let serviceNotification: UserMessagesService; - let httpMock: HttpTestingController; - let httpClientSpy: { get: jasmine.Spy }; - beforeEach(() => { - TestBed.configureTestingModule({ - imports: [HttpClientTestingModule], - providers: [UserMessagesService] - }); - httpClientSpy = jasmine.createSpyObj('HttpClient', ['get']); - serviceNotification = TestBed.inject(UserMessagesService); - httpMock = TestBed.inject(HttpTestingController); - }); - - it('should create', () => { - expect(serviceNotification).toBeDefined(); - }); - - it('should return expected Notifications (HttpClient called once)', () => { - serviceNotification.getNotification(0, 2).subscribe((notifications) => { - expect(notifications).toEqual(expectNotification); - }); - const req = httpMock.expectOne(`${url}/notifications?lang=${serviceNotification.language}&page=0&size=2`); - expect(req.request.method).toBe('GET'); - req.flush(expectNotification); - }); - - it('should return count of unread notifications ', () => { - const expectCountUnreadNotification = 100; - serviceNotification.getCountUnreadNotification().subscribe((response) => { - expect(response).toEqual(expectCountUnreadNotification); - }); - const req = httpMock.expectOne(`${url}/notifications/quantityUnreadenNotifications`); - expect(req.request.method).toBe('GET'); - req.flush(expectCountUnreadNotification); - }); - - it('should change status notification unread or read and should return body', () => { - serviceNotification.setReadNotification(1).subscribe((response) => { - expect(response).toEqual(expectBodyNotification); - }); - const req = httpMock.expectOne(`${url}/notifications/1?lang=${serviceNotification.language}`); - expect(req.request.method).toBe('POST'); - req.flush(expectBodyNotification); - }); - - afterEach(() => { - httpMock.verify(); - }); -}); diff --git a/src/app/ubs/ubs-user/services/user-messages.service.spec.ts b/src/app/ubs/ubs-user/services/user-messages.service.spec.ts index 8dd0f00c8a..42e2a10dee 100644 --- a/src/app/ubs/ubs-user/services/user-messages.service.spec.ts +++ b/src/app/ubs/ubs-user/services/user-messages.service.spec.ts @@ -10,7 +10,6 @@ describe('UserMessagesService', () => { let httpMock: HttpTestingController; let service: UserMessagesService; let langMock = null; - const IDMock = 3900; const localStorageServiceMock: LocalStorageService = jasmine.createSpyObj('LocalStorageService', ['languageBehaviourSubject']); localStorageServiceMock.languageBehaviourSubject = new BehaviorSubject('en'); @@ -40,7 +39,7 @@ describe('UserMessagesService', () => { }); it('should return 10 notifications', () => { - service.getNotification(0, 10).subscribe((data) => { + service.getNotification(0, 10, 'en').subscribe((data) => { expect(data).toBeDefined(); expect(data.page.length).toBe(10); }); @@ -56,17 +55,19 @@ describe('UserMessagesService', () => { expect(req.request.method).toBe('GET'); }); - it('should return current notification', () => { - service.setReadNotification(IDMock).subscribe((data) => { - expect(data).toBeDefined(); - }); - const req = httpMock.expectOne(`${mainUbsLink}/notifications/${IDMock}?lang=en`); - expect(req.request.method).toBe('POST'); + it('should call the correct URL and method for setReadNotification', () => { + const notificationId = 1; + + service.markNotificationAsRead(notificationId).subscribe(); + const req = httpMock.expectOne(`${service.url}/notifications/${notificationId}/viewNotification`); + expect(req.request.method).toBe('PATCH'); }); - it('onDestroy should be called', () => { - const spy = spyOn(service, 'ngOnDestroy'); - service.ngOnDestroy(); - expect(spy).toHaveBeenCalledTimes(1); + it('should call the correct URL and method for deleteNotification', () => { + const notificationId = 1; + + service.deleteNotification(notificationId).subscribe(); + const req = httpMock.expectOne(`${service.url}/notifications/${notificationId}`); + expect(req.request.method).toBe('DELETE'); }); }); diff --git a/src/app/ubs/ubs-user/services/user-messages.service.ts b/src/app/ubs/ubs-user/services/user-messages.service.ts index 6d3df8e115..8709c5c60e 100644 --- a/src/app/ubs/ubs-user/services/user-messages.service.ts +++ b/src/app/ubs/ubs-user/services/user-messages.service.ts @@ -3,35 +3,32 @@ import { Observable, ReplaySubject } from 'rxjs'; import { HttpClient } from '@angular/common/http'; import { environment } from '@environment/environment'; import { Notifications } from '../../../ubs/ubs-admin/models/ubs-user.model'; -import { LocalStorageService } from '@global-service/localstorage/local-storage.service'; -import { takeUntil } from 'rxjs/operators'; @Injectable({ providedIn: 'root' }) export class UserMessagesService implements OnDestroy { url = environment.backendUbsLink; - private destroyed$: ReplaySubject = new ReplaySubject(1); - countOfNoReadeMessages: any; + private readonly destroyed$: ReplaySubject = new ReplaySubject(1); + countOfNoReadMessages: any; language: string; - constructor( - private http: HttpClient, - private localStorageService: LocalStorageService - ) { - localStorageService.languageBehaviourSubject.pipe(takeUntil(this.destroyed$)).subscribe((language) => (this.language = language)); - } + constructor(private readonly http: HttpClient) {} - getNotification(currentPage: number, size: number): Observable { - return this.http.get(`${this.url}/notifications?lang=${this.language}&page=${currentPage}&size=${size}`); + getNotification(currentPage: number, size: number, language: string): Observable { + return this.http.get(`${this.url}/notifications?lang=${language}&page=${currentPage}&size=${size}`); } getCountUnreadNotification(): Observable { return this.http.get(`${this.url}/notifications/quantityUnreadenNotifications`); } - setReadNotification(id: number): Observable { - return this.http.post(`${this.url}/notifications/${id}?lang=${this.language}`, {}); + markNotificationAsRead(id: number): Observable { + return this.http.patch(`${this.url}/notifications/${id}/viewNotification`, {}); + } + + deleteNotification(id: number): Observable { + return this.http.delete(`${this.url}/notifications/${id}`); } ngOnDestroy() { diff --git a/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.html b/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.html index 0f33edb6e5..88bf60e947 100644 --- a/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.html +++ b/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.html @@ -2,9 +2,9 @@
{{ localization.title | translate }}
-
{{ localization.id | translate }}
-
{{ localization.themeMessages | translate }}
-
{{ localization.time | translate }}
+
{{ localization.id | translate }}
+
{{ localization.themeMessages | translate }}
+
{{ localization.time | translate }}
@@ -27,7 +27,7 @@ totalItems: count } " - (click)="setRead(notification.id, notification.read)" + (click)="setRead(notification)" (opened)="panelOpenState = true" (closed)="panelOpenState = false" > @@ -38,14 +38,21 @@ {{ notification.title }} - + {{ notification.notificationTime | date: 'HH:mm dd.MM.yyyy' }} + + + -
- -
-
+
diff --git a/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.scss b/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.scss index 9e211877d7..99f53cd0d7 100644 --- a/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.scss +++ b/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.scss @@ -32,9 +32,12 @@ } .header-list { - display: flex; - margin: -32px 0 5px; - padding-left: 35px; + display: grid; + grid-template-columns: 2fr 4fr 4fr 3fr; + align-items: center; + width: 100%; + gap: 40px; + padding: 0 95px 0 32px; div { color: var(--ubs-primary-grey); @@ -139,10 +142,6 @@ text-align: left; } -.time { - margin-left: -32px; -} - .my-pagination::ng-deep .ngx-pagination { font-family: var(--primary-font); font-size: 16px; @@ -217,6 +216,12 @@ margin-top: 0; } +.delete-icon mat-icon { + font-size: 18px; + width: 18px; + height: 18px; +} + :host ::ng-deep .custom-spinner circle { stroke: #e2e2e2; } diff --git a/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.spec.ts b/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.spec.ts index 929deeca6d..0ad92ffefc 100644 --- a/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.spec.ts +++ b/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.spec.ts @@ -3,9 +3,9 @@ import { ComponentFixture, fakeAsync, TestBed, tick, waitForAsync } from '@angul import { TranslateModule } from '@ngx-translate/core'; import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; import { MatDialogModule } from '@angular/material/dialog'; -// import { HttpClientTestingModule } from '@angular/common/http/testing'; -import { of } from 'rxjs'; -import { NotificationBody, Notifications } from '../../ubs-admin/models/ubs-user.model'; +import { MatSnackBarComponent } from '@global-errors/mat-snack-bar/mat-snack-bar.component'; +import { of, throwError } from 'rxjs'; +import { NotificationBody, Notifications } from '@ubs/ubs-admin/models/ubs-user.model'; import { UserMessagesService } from '../services/user-messages.service'; import { RouterTestingModule } from '@angular/router/testing'; import { NgxPaginationModule, PaginatePipe } from 'ngx-pagination'; @@ -25,6 +25,7 @@ describe('UbsUserMessagesComponent', () => { read: false, isOpen: false }; + const fakeNotification: Notifications = { page: [fakeNotificationBody], totalElements: 1, @@ -36,15 +37,23 @@ describe('UbsUserMessagesComponent', () => { const localStorageServiceFake = jasmine.createSpyObj('LocalStorageService', ['']); localStorageServiceFake.languageBehaviourSubject = () => of('en'); - const userMessageServiceMock = jasmine.createSpyObj('UserMessagesService', ['getNotification']); - userMessageServiceMock.getNotification = () => of(fakeNotification); + const userMessageServiceMock = jasmine.createSpyObj('UserMessagesService', [ + 'getNotification', + 'markNotificationAsRead', + 'deleteNotification', + 'fetchNotification' + ]); + userMessageServiceMock.getNotification.and.returnValue(of(fakeNotification)); beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ declarations: [UbsUserMessagesComponent, PaginatePipe], imports: [MatDialogModule, TranslateModule.forRoot(), RouterTestingModule, NgxPaginationModule], schemas: [CUSTOM_ELEMENTS_SCHEMA], - providers: [{ provide: UserMessagesService, useValue: userMessageServiceMock }] + providers: [ + { provide: UserMessagesService, useValue: userMessageServiceMock }, + { provide: MatSnackBarComponent, useValue: { openSnackBar: () => {} } } + ] }).compileComponents(); route = TestBed.inject(ActivatedRoute); @@ -53,10 +62,18 @@ describe('UbsUserMessagesComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(UbsUserMessagesComponent); component = fixture.componentInstance; + component.notifications = fakeNotification.page; fixture.detectChanges(); }); - it('can load instance', () => { + afterEach(() => { + userMessageServiceMock.markNotificationAsRead.calls.reset(); + userMessageServiceMock.deleteNotification.calls.reset(); + userMessageServiceMock.countOfNoReadMessages = 1; + component.notifications = [{ ...fakeNotificationBody, read: false }]; + }); + + it('should create', () => { expect(component).toBeTruthy(); }); @@ -68,7 +85,7 @@ describe('UbsUserMessagesComponent', () => { }); it(`should initialize the notification body`, () => { - component.fetchNotification(); + component.fetchNotification('en'); expect(component.notifications).toEqual([fakeNotificationBody]); }); @@ -79,4 +96,90 @@ describe('UbsUserMessagesComponent', () => { tick(); expect(spy).toHaveBeenCalled(); })); + + describe('markAsRead', () => { + beforeEach(() => { + userMessageServiceMock.countOfNoReadMessages = 1; + }); + + it('should set notification as read and decrease unread message count', () => { + const notification = component.notifications[0]; + userMessageServiceMock.markNotificationAsRead.and.returnValue(of(undefined)); + + component.setRead(notification); + + expect(userMessageServiceMock.markNotificationAsRead).toHaveBeenCalledWith(notification.id); + expect(notification.read).toBeTrue(); + expect(userMessageServiceMock.countOfNoReadMessages).toBe(0); + }); + + it('should not call markNotificationAsRead if notification is already read', () => { + const notification = component.notifications[1]; + + component.setRead(notification); + + expect(userMessageServiceMock.markNotificationAsRead).not.toHaveBeenCalled(); + }); + }); + describe('deleteNotification', () => { + it('should delete a notification and update notifications list', () => { + component.notifications = [ + { + id: 1, + images: ['https://csb10032000a548f571.blob.core.windows.net/allfiles/90370622-3311-4ff1-9462-20cc98a64d1ddefault_image.jpg'], + body: 'fakeBody', + notificationTime: '04.06.2020', + orderId: 1, + title: 'Недотримання правил УБС', + read: false, + isOpen: false + }, + { + id: 2, + images: ['https://csb10032000a548f571.blob.core.windows.net/allfiles/90370622-3311-4ff1-9462-20cc98a64d1ddefault_image.jpg'], + body: 'fakeBody', + notificationTime: '04.06.2020', + orderId: 1, + title: 'Недотримання правил УБС', + read: false, + isOpen: false + } + ]; + + const notificationToDelete = component.notifications[1]; + const mockEvent = new MouseEvent('click'); + userMessageServiceMock.deleteNotification.and.returnValue(of(null)); + + component.deleteNotification(mockEvent, notificationToDelete); + + expect(userMessageServiceMock.deleteNotification).toHaveBeenCalledWith(notificationToDelete.id); + expect(component.notifications).toEqual([component.notifications[0]]); + }); + + it('should fetch more notifications if there are less than pageSize and hasNextPage', () => { + const mockEvent = new MouseEvent('click'); + + userMessageServiceMock.deleteNotification.and.returnValue(of(null)); + spyOn(component, 'fetchNotification'); + component.deleteNotification(mockEvent, fakeNotificationBody); + expect(component.fetchNotification).toHaveBeenCalled(); + }); + + it('should decrease the page and fetch notifications if the list is empty', () => { + const mockEvent = new MouseEvent('click'); + + userMessageServiceMock.deleteNotification.and.returnValue(of(null)); + spyOn(component, 'fetchNotification'); + component.deleteNotification(mockEvent, fakeNotificationBody); + expect(component.page).toBe(0); + expect(component.fetchNotification).toHaveBeenCalled(); + }); + + it('should not proceed if event is neither MouseEvent nor Enter key', () => { + const mockEvent = new KeyboardEvent('keydown', { key: 'Escape' }); + component.deleteNotification(mockEvent, fakeNotificationBody); + + expect(userMessageServiceMock.deleteNotification).not.toHaveBeenCalled(); + }); + }); }); diff --git a/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.ts b/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.ts index d8183f36be..821b48e582 100644 --- a/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.ts +++ b/src/app/ubs/ubs-user/ubs-user-messages/ubs-user-messages.component.ts @@ -1,7 +1,8 @@ import { Component, OnDestroy, OnInit } from '@angular/core'; import { UserMessagesService } from '../services/user-messages.service'; import { LocalStorageService } from '@global-service/localstorage/local-storage.service'; -import { NotificationBody } from '../../ubs-admin/models/ubs-user.model'; +import { MatSnackBarComponent } from '@global-errors/mat-snack-bar/mat-snack-bar.component'; +import { NotificationBody } from '@ubs/ubs-admin/models/ubs-user.model'; import { ActivatedRoute, Router } from '@angular/router'; import { ReplaySubject, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; @@ -19,13 +20,13 @@ export class UbsUserMessagesComponent implements OnInit, OnDestroy { panelOpenState = false; page = 1; count = 0; - pageSize = 10; + pageSize = 1; isLoadSpinner: boolean; - isLoadSmallSpinner: boolean; isLoadBar: boolean; + hasNextPage: boolean; images = []; - countOfMessages: number; - private destroyed$: ReplaySubject = new ReplaySubject(1); + currLang: string; + private readonly destroyed$: ReplaySubject = new ReplaySubject(1); destroy: Subject = new Subject(); localization = { title: 'ubs-user-notification.title', @@ -35,11 +36,12 @@ export class UbsUserMessagesComponent implements OnInit, OnDestroy { }; constructor( - private userMessagesService: UserMessagesService, - private localStorageService: LocalStorageService, - private router: Router, - private route: ActivatedRoute, - private dialog: MatDialog + private readonly userMessagesService: UserMessagesService, + private readonly localStorageService: LocalStorageService, + private readonly matSnackBar: MatSnackBarComponent, + private readonly router: Router, + private readonly route: ActivatedRoute, + private readonly dialog: MatDialog ) {} ngOnInit() { @@ -50,55 +52,64 @@ export class UbsUserMessagesComponent implements OnInit, OnDestroy { } private subscribeToLangChange() { - this.localStorageService.languageBehaviourSubject.pipe(takeUntil(this.destroyed$)).subscribe(() => this.fetchNotification()); + this.localStorageService.languageBehaviourSubject.pipe(takeUntil(this.destroyed$)).subscribe((language) => { + this.currLang = language; + this.fetchNotification(language); + }); } - fetchNotification(): void { + fetchNotification(lang: string): void { this.isLoadBar = true; this.userMessagesService - .getNotification(this.page - 1, this.pageSize) + .getNotification(this.page - 1, this.pageSize, lang) .pipe(takeUntil(this.destroy)) - .subscribe( - (response) => { + .subscribe({ + next: (response) => { this.notifications = response.page; this.count = response.totalElements; this.isAnyMessages = this.notifications.length > 0; this.isLoadSpinner = this.isLoadBar = false; + + this.hasNextPage = response.currentPage !== response.totalPages - 1; }, - (error) => { + error: (error) => { console.log(error); } - ); + }); } - setRead(notificationId: number, isRead: boolean) { - let isGetNotificationBody = true; - const notificationItem: NotificationBody = this.notifications.find((item) => item.id === notificationId); - if (notificationItem.body) { - isGetNotificationBody = false; - } - if (!notificationItem.read) { - this.userMessagesService.countOfNoReadeMessages--; + setRead(notification: NotificationBody) { + if (notification && !notification.read) { + this.userMessagesService.countOfNoReadMessages >= 0 && this.userMessagesService.countOfNoReadMessages--; + this.userMessagesService + .markNotificationAsRead(notification.id) + .pipe(takeUntil(this.destroy)) + .subscribe(() => { + this.notifications.find((el) => el.id === notification.id).read = true; + }); } - if (isGetNotificationBody) { - this.notifications.forEach((item) => { - if (item.id === notificationId) { - item.read = true; - } - }); - this.isLoadSmallSpinner = true; + } + + deleteNotification(event: Event, notification: NotificationBody): void { + if (event instanceof MouseEvent || (event instanceof KeyboardEvent && event.key === 'Enter')) { + event.stopPropagation(); this.userMessagesService - .setReadNotification(notificationId) + .deleteNotification(notification.id) .pipe(takeUntil(this.destroy)) - .subscribe((response) => { - const findNotification = this.notifications.find((item) => item.id === notificationId); - findNotification.body = response.body; - findNotification.images = response.images; - findNotification.isOpen = true; - this.isLoadSmallSpinner = false; - if (findNotification.images) { - const images = response.images.map((url) => ({ src: url, label: null, name: null })); - this.images.splice(0, response.images.length, ...images); + .subscribe({ + next: () => { + this.notifications = this.notifications.filter((el) => el.id !== notification.id); + !notification.read && this.userMessagesService.countOfNoReadMessages--; + if (this.notifications.length < this.pageSize && this.hasNextPage) { + this.fetchNotification(this.currLang); + } else if (this.notifications.length === 0 && this.page > 1) { + this.page--; + this.fetchNotification(this.currLang); + } + this.matSnackBar.openSnackBar('deletedNotification'); + }, + error: () => { + this.matSnackBar.openSnackBar('error'); } }); }