Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

markRead and markAllRead in one method

Browse Source
This commit is contained in:
Edi Cziszter 2021-10-27 17:51:40 +03:00
parent 9fcedf7272
commit a9159eda22
2 changed files with 9 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
apps/red-ui/src/app/components/notifications/notifications.component.html
View File

@ -10,16 +10,14 @@
[verticalPadding]="0"
></iqser-empty-state>
<div *ngFor="let group of groups">
<div *ngFor="let group of groups; let first = first">
<div class="all-caps-label flex-align-items-center">
<div>{{ group.date }}</div>
<div class="view-all" [hidden]="(hasUnreadNotifications$ | async) === false" (click)="markAllAsRead($event)">
View all
</div>
<div *ngIf="(hasUnreadNotifications$ | async) && first" class="view-all" (click)="markRead($event)">View all</div>
</div>
<div
(click)="markRead(notification, $event)"
(click)="markRead($event, notification)"
*ngFor="let notification of group.notifications | sortBy: 'desc':'creationDate'"
[class.unread]="!notification.readDate"
class="notification"
@ -31,7 +29,7 @@
<div class="small-label mt-2">{{ notification.time }}</div>
</div>
<div
(click)="markRead(notification, $event, !notification.readDate)"
(click)="markRead($event, notification, !notification.readDate)"
class="dot"
matTooltip="{{ 'notifications.mark-as' | translate: { type: notification.readDate ? 'unread' : 'read' } }}"
matTooltipPosition="before"

20
apps/red-ui/src/app/components/notifications/notifications.component.ts
View File

@ -6,7 +6,7 @@ import { UserService } from '@services/user.service';
import { DossiersService } from '@services/entity-services/dossiers.service';
import { NotificationsService } from '@services/notifications.service';
import { Notification } from '@red/domain';
import { distinctUntilChanged, map, tap } from 'rxjs/operators';
import { distinctUntilChanged, map, shareReplay } from 'rxjs/operators';
import { BehaviorSubject, Observable } from 'rxjs';
interface NotificationsGroup {
@ -39,6 +39,7 @@ export class NotificationsComponent implements OnInit {
this.hasUnreadNotifications$ = this.notifications$.pipe(
map(notifications => notifications.filter(n => !n.readDate).length > 0),
distinctUntilChanged(),
shareReplay(1),
);
}
@ -46,21 +47,10 @@ export class NotificationsComponent implements OnInit {
await this._loadData();
}
async markAllAsRead($event): Promise<void> {
async markRead($event, notification?: Notification, isRead = true): Promise<void> {
$event.stopPropagation();
const notifications = this._notifications$.getValue();
await this._notificationsService
.toggleNotificationRead(
notifications.map(n => n.id),
true,
)
.toPromise();
await this._loadData();
}
async markRead(notification: Notification, $event, isRead = true): Promise<void> {
$event.stopPropagation();
await this._notificationsService.toggleNotificationRead([notification.id], isRead).toPromise();
const body = notification ? [notification.id] : this._notifications$.getValue().map(n => n.id);
await this._notificationsService.toggleNotificationRead(body, isRead).toPromise();
await this._loadData();
}