Merge branch 'dmp-refactoring' of code-repo.d4science.org:MaDgiK-CITE/argos into dmp-refactoring

dmp-backend/notification-service/notification-web/src/main/java/gr/cite/notification/web/controllers/NotificationController.java

@@ -2,6 +2,7 @@ package gr.cite.notification.web.controllers;
 
 import gr.cite.notification.audit.AuditableAction;
 import gr.cite.notification.authorization.AuthorizationFlags;
+import gr.cite.notification.common.enums.IsActive;
 import gr.cite.notification.data.NotificationEntity;
 import gr.cite.notification.model.Notification;
 import gr.cite.notification.model.SendNotificationResult;
@@ -34,7 +35,7 @@ import javax.transaction.Transactional;
 import java.util.*;
 
 @RestController
-@RequestMapping(path = "api/notification/notification")
+@RequestMapping(path = "api/notification")
 public class NotificationController {
 	private static final LoggerService logger = new LoggerService(LoggerFactory.getLogger(NotificationController.class));
 

dmp-backend/notification-service/notification/src/main/java/gr/cite/notification/model/Notification.java

@@ -1,8 +1,12 @@
 package gr.cite.notification.model;
 
-import gr.cite.notification.common.enums.IsActive;
+import gr.cite.notification.common.enums.*;
-import gr.cite.notification.common.enums.NotificationContactType;
+import gr.cite.notification.data.conventers.IsActiveConverter;
+import gr.cite.notification.data.conventers.NotificationTrackingProcessConverter;
+import gr.cite.notification.data.conventers.NotificationTrackingStateConverter;
 
+import javax.persistence.Column;
+import javax.persistence.Convert;
 import java.time.Instant;
 import java.util.UUID;
 
@@ -29,6 +33,21 @@ public class Notification {
     private Instant notifiedAt;
     public final static String _notifiedAt = "notifiedAt";
 
+    private NotificationNotifyState notifyState;
+    public final static String _notifyState = "notifyState";
+
+    private NotificationContactType notifiedWith;
+    public final static String _notifiedWith = "notifiedWith";
+
+    private Integer retryCount;
+    public final static String _retryCount = "retryCount";
+
+    private NotificationTrackingState trackingState;
+    public final static String _trackingState = "trackingState";
+
+    private NotificationTrackingProcess trackingProcess;
+    public final static String _trackingProcess = "trackingProcess";
+
     private String hash;
     public final static String _hash = "hash";
 
@@ -97,6 +116,46 @@ public class Notification {
         this.notifiedAt = notifiedAt;
     }
 
+    public NotificationNotifyState getNotifyState() {
+        return notifyState;
+    }
+
+    public void setNotifyState(NotificationNotifyState notifyState) {
+        this.notifyState = notifyState;
+    }
+
+    public NotificationContactType getNotifiedWith() {
+        return notifiedWith;
+    }
+
+    public void setNotifiedWith(NotificationContactType notifiedWith) {
+        this.notifiedWith = notifiedWith;
+    }
+
+    public Integer getRetryCount() {
+        return retryCount;
+    }
+
+    public void setRetryCount(Integer retryCount) {
+        this.retryCount = retryCount;
+    }
+
+    public NotificationTrackingState getTrackingState() {
+        return trackingState;
+    }
+
+    public void setTrackingState(NotificationTrackingState trackingState) {
+        this.trackingState = trackingState;
+    }
+
+    public NotificationTrackingProcess getTrackingProcess() {
+        return trackingProcess;
+    }
+
+    public void setTrackingProcess(NotificationTrackingProcess trackingProcess) {
+        this.trackingProcess = trackingProcess;
+    }
+
     public String getHash() {
         return hash;
     }

dmp-backend/notification-service/notification/src/main/java/gr/cite/notification/model/builder/NotificationBuilder.java

@@ -70,6 +70,11 @@ public class NotificationBuilder extends BaseBuilder<Notification, NotificationE
             if (fields.hasField(this.asIndexer(Notification._contactTypeHint))) m.setContactTypeHint(d.getContactTypeHint());
             if (fields.hasField(this.asIndexer(Notification._notifiedAt))) m.setNotifiedAt(d.getNotifiedAt());
             if (fields.hasField(this.asIndexer(Notification._type))) m.setType(d.getType());
+            if (fields.hasField(this.asIndexer(Notification._notifyState))) m.setNotifyState(d.getNotifyState());
+            if (fields.hasField(this.asIndexer(Notification._notifiedWith))) m.setNotifiedWith(d.getNotifiedWith());
+            if (fields.hasField(this.asIndexer(Notification._trackingState))) m.setTrackingState(d.getTrackingState());
+            if (fields.hasField(this.asIndexer(Notification._trackingProcess))) m.setTrackingProcess(d.getTrackingProcess());
+            if (fields.hasField(this.asIndexer(Notification._retryCount))) m.setRetryCount(d.getRetryCount());
             if (fields.hasField(this.asIndexer(Notification._isActive))) m.setIsActive(d.getIsActive());
             if (fields.hasField(this.asIndexer(Notification._createdAt))) m.setCreatedAt(d.getCreatedAt());
             if (fields.hasField(this.asIndexer(Notification._updatedAt))) m.setUpdatedAt(d.getUpdatedAt());

dmp-backend/notification-service/notification/src/main/java/gr/cite/notification/query/NotificationQuery.java

@@ -264,9 +264,15 @@ public class NotificationQuery extends QueryBase<NotificationEntity> {
 		else if (item.match(Notification._contactTypeHint)) return NotificationEntity.Field._contactTypeHint;
 		else if (item.match(Notification._updatedAt)) return NotificationEntity.Field._updatedAt;
 		else if (item.match(Notification._notifiedAt)) return NotificationEntity.Field._notifiedAt;
-		else if (item.match(Notification._tenant)) return NotificationEntity.Field._tenantId;
+		else if (item.prefix(Notification._tenant)) return NotificationEntity.Field._tenantId;
-		else if (item.match(Notification._user)) return NotificationEntity.Field._userId;
+		else if (item.prefix(Notification._user)) return NotificationEntity.Field._userId;
 		else if (item.match(Notification._type)) return NotificationEntity.Field._type;
+		else if (item.match(Notification._notifyState)) return NotificationEntity.Field._notifyState;
+		else if (item.match(Notification._notifiedWith)) return NotificationEntity.Field._notifiedWith;
+		else if (item.match(Notification._trackingState)) return NotificationEntity.Field._trackingState;
+		else if (item.match(Notification._trackingProcess)) return NotificationEntity.Field._trackingProcess;
+		else if (item.match(Notification._retryCount)) return NotificationEntity.Field._retryCount;
+
 		else return null;
 	}
 
@@ -283,6 +289,12 @@ public class NotificationQuery extends QueryBase<NotificationEntity> {
 		item.setCreatedAt(QueryBase.convertSafe(tuple, columns, NotificationEntity.Field._createdAt, Instant.class));
 		item.setUpdatedAt(QueryBase.convertSafe(tuple, columns, NotificationEntity.Field._updatedAt, Instant.class));
 		item.setIsActive(QueryBase.convertSafe(tuple, columns, NotificationEntity.Field._isActive, IsActive.class));
+		item.setNotifyState(QueryBase.convertSafe(tuple, columns, NotificationEntity.Field._notifyState, NotificationNotifyState.class));
+		item.setNotifiedWith(QueryBase.convertSafe(tuple, columns, NotificationEntity.Field._notifiedWith, NotificationContactType.class));
+		item.setTrackingState(QueryBase.convertSafe(tuple, columns, NotificationEntity.Field._trackingState, NotificationTrackingState.class));
+		item.setTrackingProcess(QueryBase.convertSafe(tuple, columns, NotificationEntity.Field._trackingProcess, NotificationTrackingProcess.class));
+		item.setRetryCount(QueryBase.convertSafe(tuple, columns, NotificationEntity.Field._retryCount, Integer.class));
+
 		return item;
 	}
 }

dmp-backend/notification-service/notification/src/main/java/gr/cite/notification/query/lookup/NotificationLookup.java

@@ -1,8 +1,6 @@
 package gr.cite.notification.query.lookup;
 
-import gr.cite.notification.common.enums.IsActive;
+import gr.cite.notification.common.enums.*;
-import gr.cite.notification.common.enums.NotificationContactType;
-import gr.cite.notification.common.enums.NotificationNotifyState;
 import gr.cite.notification.query.NotificationQuery;
 import gr.cite.notification.query.TenantQuery;
 import gr.cite.tools.data.query.Lookup;
@@ -16,14 +14,16 @@ import java.util.UUID;
 public class NotificationLookup extends Lookup {
     private List<IsActive> isActive;
     private List<UUID> ids;
-    private List<NotificationNotifyState> notifyState = new ArrayList<>();
+    private List<NotificationNotifyState> notifyState;
-    private List<NotificationContactType> notifiedWith = new ArrayList<>();
+    private List<NotificationContactType> notifiedWith;
     private Boolean notifiedWithHasValue;
     private Boolean notifiedAtHasValue;
-    private List<UUID> type = new ArrayList<>();
+    private List<UUID> type;
-    private List<NotificationContactType> contactType = new ArrayList<>();
+    private List<NotificationContactType> contactType;
     private Integer retryThreshold;
     private Instant createdAfter;
+    private List<NotificationTrackingState> trackingState;
+    private List<NotificationTrackingProcess> trackingProcess;
 
 
     public List<IsActive> getIsActive() {
@@ -106,6 +106,22 @@ public class NotificationLookup extends Lookup {
         this.createdAfter = createdAfter;
     }
 
+    public List<NotificationTrackingState> getTrackingState() {
+        return trackingState;
+    }
+
+    public void setTrackingState(List<NotificationTrackingState> trackingState) {
+        this.trackingState = trackingState;
+    }
+
+    public List<NotificationTrackingProcess> getTrackingProcess() {
+        return trackingProcess;
+    }
+
+    public void setTrackingProcess(List<NotificationTrackingProcess> trackingProcess) {
+        this.trackingProcess = trackingProcess;
+    }
+
     public NotificationQuery enrich(QueryFactory queryFactory) {
         NotificationQuery query = queryFactory.query(NotificationQuery.class);
         if (this.isActive != null) query.isActive(this.isActive);
@@ -118,6 +134,8 @@ public class NotificationLookup extends Lookup {
         if (this.notifiedWith != null) query.notifiedWith(this.notifiedWith);
         if (this.retryThreshold != null) query.retryThreshold(this.retryThreshold);
         if (this.type != null) query.type(this.type);
+        if (this.trackingProcess != null) query.trackingProgress(this.trackingProcess);
+        if (this.trackingState != null) query.trackingState(this.trackingState);
 
         this.enrichCommon(query);
 

dmp-backend/notification-service/notification/src/main/java/gr/cite/notification/query/lookup/NotificationTemplateLookup.java

@@ -14,6 +14,8 @@ public class NotificationTemplateLookup extends Lookup {
 
     private List<IsActive> isActive;
 
+    private List<UUID> notificationTypes;
+
     private List<NotificationTemplateChannel> channels;
 
     private List<NotificationTemplateKind> kinds;
@@ -26,6 +28,14 @@ public class NotificationTemplateLookup extends Lookup {
         return isActive;
     }
 
+    public List<UUID> getNotificationTypes() {
+        return notificationTypes;
+    }
+
+    public void setNotificationTypes(List<UUID> notificationTypes) {
+        this.notificationTypes = notificationTypes;
+    }
+
     public void setIsActive(List<IsActive> isActive) {
         this.isActive = isActive;
     }
@@ -66,6 +76,7 @@ public class NotificationTemplateLookup extends Lookup {
         NotificationTemplateQuery query = queryFactory.query(NotificationTemplateQuery.class);
         if (this.ids != null) query.ids(this.ids);
         if (this.excludedIds != null) query.excludedIds(this.excludedIds);
+        if (this.notificationTypes != null) query.notificationTypes(this.notificationTypes);
         if (this.isActive != null) query.isActive(this.isActive);
         if (this.channels != null) query.channels(this.channels);
         if (this.kinds != null) query.kinds(this.kinds);

dmp-frontend/src/app/app-routing.module.ts

@@ -270,6 +270,18 @@ const appRoutes: Routes = [
 			})
 		},
 	},
+	{
+		path: 'notifications',
+		loadChildren: () => import('./ui/admin/notification/notification.module').then(m => m.NotificationModule),
+		data: {
+			authContext: {
+				permissions: [AppPermission.ViewNotificationPage]
+			},
+			...BreadcrumbService.generateRouteDataConfiguration({
+				title: 'BREADCRUMBS.NOTIFICATIONS'
+			})
+		},
+	},
 	{
 		path: 'notification-templates',
 		loadChildren: () => import('./ui/admin/notification-template/notification-template.module').then(m => m.NotificationTemplateModule),

dmp-frontend/src/app/core/common/enum/notification-contact-type.ts

@@ -0,0 +1,4 @@
+export enum NotificationContactType {
+	EMAIL = 0,
+    IN_APP = 3,
+}

dmp-frontend/src/app/core/common/enum/notification-notify-state.ts

@@ -0,0 +1,7 @@
+export enum NotificationNotifyState {
+	PENDING = 0,
+	PROCESSING = 1,
+    SUCCESSFUL = 2,
+    ERROR = 3,
+    OMITTED = 4
+}

dmp-frontend/src/app/core/common/enum/notification-tracking-process.ts

@@ -0,0 +1,7 @@
+export enum NotificationTrackingProcess {
+	PENDING = 0,
+	PROCESSING = 1,
+    SUCCESSFUL = 2,
+    ERROR = 3,
+    OMITTED = 4
+}

dmp-frontend/src/app/core/common/enum/notification-tracking-state.ts

@@ -0,0 +1,10 @@
+export enum NotificationTrackingState {
+	UNDEFINED = 0,
+	NA = 1,
+    QUEUED = 2,
+    SENT = 3,
+    DELIVERED = 4,
+    UNDELIVERED = 5,
+    FAILED = 6,
+    UNSENT = 7
+}

dmp-frontend/src/app/core/common/enum/permission.enum.ts

@@ -35,6 +35,7 @@ export enum AppPermission {
 	ViewLanguagePage = "ViewLanguagePage",
 	ViewNotificationTemplatePage = "ViewNotificationTemplatePage",
 	ViewMineInAppNotificationPage = "ViewMineInAppNotificationPage",
+	ViewNotificationPage = "ViewNotificationPage",
 
 	//ReferenceType
 	BrowseReferenceType = "BrowseReferenceType",

dmp-frontend/src/app/core/core-service.module.ts

@@ -45,6 +45,7 @@ import { FileUtils } from './services/utilities/file-utils.service';
 import { QueryParamsService } from './services/utilities/query-params.service';
 import { FileTransformerHttpService } from './services/file-transformer/file-transformer.http.service';
 import { InAppNotificationService } from './services/inapp-notification/inapp-notification.service';
+import { NotificationService } from './services/notification/notification-service';
 //
 //
 // This is shared module that provides all the services. Its imported only once on the AppModule.
@@ -108,7 +109,8 @@ export class CoreServiceModule {
 				CanDeactivateGuard,
 				FileTransformerService,
 				FileTransformerHttpService,
-				InAppNotificationService
+				InAppNotificationService,
+				NotificationService
 			],
 		};
 	}

dmp-frontend/src/app/core/model/notification/notification.model.ts

@@ -0,0 +1,22 @@
+import { NotificationContactType } from '@app/core/common/enum/notification-contact-type';
+import { User } from '../user/user';
+import { NotificationType } from '@app/core/common/enum/notification-type';
+import { BaseEntity } from '@common/base/base-entity.model';
+import { NotificationNotifyState } from '@app/core/common/enum/notification-notify-state';
+import { NotificationTrackingProcess } from '@app/core/common/enum/notification-tracking-process';
+import { NotificationTrackingState } from '@app/core/common/enum/notification-tracking-state';
+
+export interface Notification extends BaseEntity{
+	user: User;
+	type: NotificationType;
+	contactTypeHint: NotificationContactType;
+	contactHint: string;
+	data: string;
+	notifyState: NotificationNotifyState;
+	notifiedWith: NotificationContactType;
+	notifiedAt: Date;
+	retryCount: number;
+	trackingState: NotificationTrackingState;
+	trackingProcess: NotificationTrackingProcess;
+	trackingData: string;
+}

dmp-frontend/src/app/core/query/notification-template.lookup.ts

@@ -3,6 +3,7 @@ import { Guid } from "@common/types/guid";
 import { IsActive } from "../common/enum/is-active.enum";
 import { NotificationTemplateKind } from "../common/enum/notification-template-kind";
 import { NotificationTemplateChannel } from "../common/enum/notification-template-channel";
+import { NotificationType } from "../common/enum/notification-type";
 
 export class NotificationTemplateLookup extends Lookup implements NotificationTemplateFilter {
 	ids: Guid[];
@@ -10,6 +11,7 @@ export class NotificationTemplateLookup extends Lookup implements NotificationTe
 	isActive: IsActive[];
 	kinds: NotificationTemplateKind[];
 	channels: NotificationTemplateChannel[];
+	notificationTypes: NotificationType[];
 
 	constructor() {
 		super();
@@ -22,4 +24,5 @@ export interface NotificationTemplateFilter {
 	isActive: IsActive[];
 	kinds: NotificationTemplateKind[];
 	channels: NotificationTemplateChannel[];
+	notificationTypes: NotificationType[];
 }

dmp-frontend/src/app/core/query/notification.lookup.ts

@@ -0,0 +1,36 @@
+import { Lookup } from "@common/model/lookup";
+import { Guid } from "@common/types/guid";
+import { IsActive } from "../common/enum/is-active.enum";
+import { NotificationType } from "../common/enum/notification-type";
+import { NotificationNotifyState } from "../common/enum/notification-notify-state";
+import { NotificationContactType } from "../common/enum/notification-contact-type";
+import { NotificationTrackingState } from "../common/enum/notification-tracking-state";
+import { NotificationTrackingProcess } from "../common/enum/notification-tracking-process";
+
+export class NotificationLookup extends Lookup implements NotificationFilter {
+	ids: Guid[];
+	excludedIds: Guid[];
+	isActive: IsActive[];
+	type: NotificationType[];
+	notifyState: NotificationNotifyState[];
+	notifiedWith: NotificationContactType[];
+	contactType: NotificationContactType[];
+	trackingState: NotificationTrackingState[];
+	trackingProcess: NotificationTrackingProcess[];
+
+	constructor() {
+		super();
+	}
+}
+
+export interface NotificationFilter {
+	ids: Guid[];
+	excludedIds: Guid[];
+	isActive: IsActive[];
+	type: NotificationType[];
+	notifyState: NotificationNotifyState[];
+	notifiedWith: NotificationContactType[];
+	contactType: NotificationContactType[];
+	trackingState: NotificationTrackingState[];
+	trackingProcess: NotificationTrackingProcess[];
+}

dmp-frontend/src/app/core/services/notification/notification-service.ts

@@ -0,0 +1,34 @@
+import { Injectable } from '@angular/core';
+import { QueryResult } from '@common/model/query-result';
+import { Guid } from '@common/types/guid';
+import { NotificationLookup } from '@app/core/query/notification.lookup';
+import { Observable, throwError } from 'rxjs';
+import { catchError } from 'rxjs/operators';
+import { Notification } from '@app/core/model/notification/notification.model';
+import { BaseHttpV2Service } from '../http/base-http-v2.service';
+import { ConfigurationService } from '../configuration/configuration.service';
+
+@Injectable()
+export class NotificationService {
+
+	constructor(private http: BaseHttpV2Service, private configurationService: ConfigurationService) { 
+    }
+
+    private get apiBase(): string { return `${this.configurationService.notificationServiceAddress}notification`; }
+
+	query(q: NotificationLookup): Observable<QueryResult<Notification>> {
+		const url = `${this.apiBase}/query`;
+
+		return this.http
+			.post<QueryResult<Notification>>(url, q).pipe(
+				catchError((error: any) => throwError(error)));
+	}
+
+	delete(id: Guid): Observable<Notification> {
+		const url = `${this.apiBase}/${id}`;
+
+		return this.http
+			.delete<Notification>(url).pipe(
+				catchError((error: any) => throwError(error)));
+	}
+}

dmp-frontend/src/app/core/services/utilities/enum-utils.service.ts

@@ -28,6 +28,10 @@ import { ValidationType } from '../../common/enum/validation-type';
 import { RecentActivityOrder } from '@app/core/common/enum/recent-activity-order';
 import { NotificationType } from '@app/core/common/enum/notification-type';
 import { NotificationInAppTracking } from '@app/core/common/enum/notification-inapp-tracking.enum';
+import { NotificationContactType } from '@app/core/common/enum/notification-contact-type';
+import { NotificationNotifyState } from '@app/core/common/enum/notification-notify-state';
+import { NotificationTrackingState } from '@app/core/common/enum/notification-tracking-state';
+import { NotificationTrackingProcess } from '@app/core/common/enum/notification-tracking-process';
 
 @Injectable()
 export class EnumUtils {
@@ -342,4 +346,44 @@ export class EnumUtils {
 			case NotificationInAppTracking.Stored: return this.language.instant('TYPES.NOTIFICATION-INAPP-TRACKING.STORED');
 		}
 	}
+
+	public toNotificationContactTypeString(value: NotificationContactType): string {
+		switch (value) {
+			case NotificationContactType.EMAIL: return this.language.instant('TYPES.NOTIFICATION-CONTACT-TYPE.EMAIL');
+			case NotificationContactType.IN_APP: return this.language.instant('TYPES.NOTIFICATION-CONTACT-TYPE.INAPP');
+		}
+	}
+
+	public toNotificationNotifyStateString(value: NotificationNotifyState): string {
+		switch (value) {
+			case NotificationNotifyState.PENDING: return this.language.instant('TYPES.NOTIFICATION-NOTIFY-STATE.PENDING');
+			case NotificationNotifyState.PROCESSING: return this.language.instant('TYPES.NOTIFICATION-NOTIFY-STATE.PROCESSING');
+			case NotificationNotifyState.SUCCESSFUL: return this.language.instant('TYPES.NOTIFICATION-NOTIFY-STATE.SUCCESSFUL');
+			case NotificationNotifyState.ERROR: return this.language.instant('TYPES.NOTIFICATION-NOTIFY-STATE.ERROR');
+			case NotificationNotifyState.OMITTED: return this.language.instant('TYPES.NOTIFICATION-NOTIFY-STATE.OMITTED');
+		}
+	}
+
+	public toNotificationTrackingStateString(value: NotificationTrackingState): string {
+		switch (value) {
+			case NotificationTrackingState.UNDEFINED: return this.language.instant('TYPES.NOTIFICATION-TRACKING-STATE.UNDEFINED');
+			case NotificationTrackingState.NA: return this.language.instant('TYPES.NOTIFICATION-TRACKING-STATE.NA');
+			case NotificationTrackingState.QUEUED: return this.language.instant('TYPES.NOTIFICATION-TRACKING-STATE.QUEUED');
+			case NotificationTrackingState.SENT: return this.language.instant('TYPES.NOTIFICATION-TRACKING-STATE.SENT');
+			case NotificationTrackingState.DELIVERED: return this.language.instant('TYPES.NOTIFICATION-TRACKING-STATE.DELIVERED');
+			case NotificationTrackingState.UNDELIVERED: return this.language.instant('TYPES.NOTIFICATION-TRACKING-STATE.UNDELIVERED');
+			case NotificationTrackingState.FAILED: return this.language.instant('TYPES.NOTIFICATION-TRACKING-STATE.FAILED');
+			case NotificationTrackingState.UNSENT: return this.language.instant('TYPES.NOTIFICATION-TRACKING-STATE.UNSENT');
+		}
+	}
+
+	public toNotificationTrackingProcessString(value: NotificationTrackingProcess): string {
+		switch (value) {
+			case NotificationTrackingProcess.PENDING: return this.language.instant('TYPES.NOTIFICATION-TRACKING-PROCESS.PENDING');
+			case NotificationTrackingProcess.PROCESSING: return this.language.instant('TYPES.NOTIFICATION-TRACKING-PROCESS.PROCESSING');
+			case NotificationTrackingProcess.SUCCESSFUL: return this.language.instant('TYPES.NOTIFICATION-TRACKING-PROCESS.SUCCESSFUL');
+			case NotificationTrackingProcess.ERROR: return this.language.instant('TYPES.NOTIFICATION-TRACKING-PROCESS.ERROR');
+			case NotificationTrackingProcess.OMITTED: return this.language.instant('TYPES.NOTIFICATION-TRACKING-PROCESS.OMITTED');
+		}
+	}
 }

dmp-frontend/src/app/ui/admin/notification-template/listing/filters/notification-template-listing-filters.component.html

@@ -10,18 +10,26 @@
 		<div class="p-3" (click)="$event?.stopPropagation?.()">
 			<div class="search-listing-filters-container">
 				<div class="d-flex align-items-center justify-content-between">
-					<h4>{{'NOTIFICATION-TEMPLATE-LISTING.FILTER.TITLE' | translate}}</h4>
+					<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.TITLE' | translate}}</h4>
 					<button color="accent" mat-button (click)="clearFilters()">
 						{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
 					</button>
 				</div>
 
 				<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
-					{{'NOTIFICATION-TEMPLATE-LISTING.FILTER.IS-ACTIVE' | translate}}
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.IS-ACTIVE' | translate}}
 				</mat-slide-toggle>
 
 				<div>
-					<mat-label>{{'NOTIFICATION-TEMPLATE-LISTING.FILTER.KIND' | translate}}
+					<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}
+						<mat-select multiple [(ngModel)]="internalFilters.notificationTypes">
+							<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
+						</mat-select>
+					</mat-label>
+				</div>
+
+				<div>
+					<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.KIND' | translate}}
 						<mat-select multiple [(ngModel)]="internalFilters.kinds">
 							<mat-option *ngFor="let kind of notificationTemplateKindEnumValues" [value]="kind">{{enumUtils.toNotificationTemplateKindString(kind)}}</mat-option>
 						</mat-select>
@@ -29,7 +37,7 @@
 				</div>
 
 				<div>
-					<mat-label>{{'NOTIFICATION-TEMPLATE-LISTING.FILTER.CHANNEL' | translate}}
+					<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.CHANNEL' | translate}}
 						<mat-select multiple [(ngModel)]="internalFilters.channels">
 							<mat-option *ngFor="let channel of notificationTemplateChannelEnumValues" [value]="channel">{{enumUtils.toNotificationTemplateChannelString(channel)}}</mat-option>
 						</mat-select>
@@ -38,10 +46,10 @@
 
 				<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
 					<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
-						{{'NOTIFICATION-TEMPLATE-LISTING.FILTER.CANCEL' | translate}}
+						{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.CANCEL' | translate}}
 					</button>
 					<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
-						{{'NOTIFICATION-TEMPLATE-LISTING.FILTER.APPLY-FILTERS' | translate}}
+						{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.APPLY-FILTERS' | translate}}
 					</button>
 				</div>
 			</div>

dmp-frontend/src/app/ui/admin/notification-template/listing/filters/notification-template-listing-filters.component.ts

@@ -2,6 +2,7 @@ import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChange
 import { IsActive } from '@app/core/common/enum/is-active.enum';
 import { NotificationTemplateChannel } from '@app/core/common/enum/notification-template-channel';
 import { NotificationTemplateKind } from '@app/core/common/enum/notification-template-kind';
+import { NotificationType } from '@app/core/common/enum/notification-type';
 import { NotificationTemplateFilter } from '@app/core/query/notification-template.lookup';
 import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
 import { BaseComponent } from '@common/base/base.component';
@@ -18,6 +19,7 @@ export class NotificationTemplateListingFiltersComponent extends BaseComponent i
 	@Output() filterChange = new EventEmitter<NotificationTemplateFilter>();
 	notificationTemplateKindEnumValues = this.enumUtils.getEnumValues<NotificationTemplateKind>(NotificationTemplateKind)
 	notificationTemplateChannelEnumValues = this.enumUtils.getEnumValues<NotificationTemplateChannel>(NotificationTemplateChannel);
+	notificationTypeEnumValues = this.enumUtils.getEnumValues<NotificationType>(NotificationType);
 
 	// * State
 	internalFilters: NotificationTemplateListingFilters = this._getEmptyFilters();
@@ -49,13 +51,14 @@ export class NotificationTemplateListingFiltersComponent extends BaseComponent i
 	}
 
 	protected applyFilters(): void {
-		const { isActive, kinds, channels } = this.internalFilters ?? {}
+		const { isActive, kinds, channels, notificationTypes } = this.internalFilters ?? {}
 		this.filterChange.emit({
 			...this.filter,
 			// like,
 			isActive: isActive ? [IsActive.Active] : [IsActive.Inactive],
 			kinds,
-			channels
+			channels,
+			notificationTypes
 		})
 	}
 
@@ -65,12 +68,13 @@ export class NotificationTemplateListingFiltersComponent extends BaseComponent i
 			return this._getEmptyFilters();
 		}
 
-		let { isActive, kinds, channels } = inputFilter;
+		let { isActive, kinds, channels, notificationTypes } = inputFilter;
 
 		return {
 			isActive: (isActive ?? [])?.includes(IsActive.Active) || !isActive?.length,
 			kinds: kinds,
-			channels: channels
+			channels: channels,
+			notificationTypes: notificationTypes
 		}
 
 	}
@@ -79,7 +83,8 @@ export class NotificationTemplateListingFiltersComponent extends BaseComponent i
 		return {
 			isActive: true,
 			kinds: null,
-			channels: null
+			channels: null,
+			notificationTypes: null
 		}
 	}
 
@@ -100,4 +105,5 @@ interface NotificationTemplateListingFilters {
 	isActive: boolean;
 	kinds: NotificationTemplateKind[];
 	channels: NotificationTemplateChannel[];
+	notificationTypes: NotificationType[];
 }

dmp-frontend/src/app/ui/admin/notification-template/listing/notification-template-listing.component.html

@@ -1,9 +1,9 @@
-<div class="row  tenant-listing">
+<div class="row  notification-template-listing">
 	<div class="col-md-8 offset-md-2">
 
 		<div class="row mb-4 mt-3">
 			<div class="col">
-				<h4>{{'NOTIFICATION-TEMPLATE-LISTING.TITLE' | translate}}</h4>
+				<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.TITLE' | translate}}</h4>
 				<app-navigation-breadcrumb />
 
 			</div>
@@ -12,7 +12,7 @@
 					*ngIf="authService.hasPermission(authService.permissionEnum.EditNotificationTemplate)"
 					[routerLink]="['/notification-templates/new']">
 					<mat-icon>add</mat-icon>
-					{{'NOTIFICATION-TEMPLATE-LISTING.CREATE' | translate}}
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.CREATE' | translate}}
 				</button>
 			</div>
 		</div>
@@ -44,28 +44,36 @@
 					(click)="$event.stopPropagation()">{{item?.name | nullifyValue}}</a>
 				<br />
 			</ng-container>
-
+			<ng-container *ngIf="isColumnSelected('notificationType')">
-			<ng-container *ngIf="isColumnSelected('status')">
-				<div class="col-auto">
-					<div class="status-chip"
-						[ngClass]="{'status-chip-finalized': item.status === descriptionTemplateTypeStatuses.Finalized, 'status-chip-draft' : item.status === descriptionTemplateTypeStatuses.Draft}">
-						{{enumUtils.toDescriptionTemplateTypeStatusString(item.status) | nullifyValue}}
-					</div>
-				</div>
-			</ng-container>
-
-			<ng-container *ngIf="isColumnSelected('createdAt')">
 				<span class="col-12">
-					{{'NOTIFICATION-TEMPLATE-LISTING.FIELDS.CREATED-AT' | translate}}:
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.NOTIFICATION-TYPE' | translate}}:
 					<small>
-						{{item?.createdAt | dateTimeFormatter : 'short' | nullifyValue}}
+						{{enumUtils.toNotificationTypeString(item.notificationType) | nullifyValue}}
+					</small>
+				</span>
+				<br>
+			</ng-container>
+			<ng-container *ngIf="isColumnSelected('kind')">
+				<span class="col-12">
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.KIND' | translate}}:
+					<small>
+						{{enumUtils.toNotificationTemplateKindString(item.kind) | nullifyValue}}
+					</small>
+				</span>
+				<br>
+			</ng-container>
+			<ng-container *ngIf="isColumnSelected('channel')">
+				<span class="col-12">
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.CHANNEL' | translate}}:
+					<small>
+						{{enumUtils.toNotificationTemplateChannelString(item.channel) | nullifyValue}}
 					</small>
 				</span>
 				<br>
 			</ng-container>
 			<ng-container *ngIf="isColumnSelected('updatedAt')">
 				<span class="col-12">
-					{{'NOTIFICATION-TEMPLATE-LISTING.FIELDS.UPDATED-AT' | translate}}:
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.UPDATED-AT' | translate}}:
 					<small>
 						{{item?.updatedAt | dateTimeFormatter : 'short' | nullifyValue}}
 					</small>
@@ -83,11 +91,11 @@
 			</button>
 			<mat-menu #actionsMenu="matMenu">
 				<button mat-menu-item [routerLink]="['/notification-templates/' + row.id]">
-					<mat-icon>edit</mat-icon>{{'NOTIFICATION-TEMPLATE-LISTING.ACTIONS.EDIT' | translate}}
+					<mat-icon>edit</mat-icon>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.ACTIONS.EDIT' | translate}}
 				</button>
 				<button mat-menu-item (click)="deleteType(row.id)">
 					<mat-icon>delete</mat-icon>
-					{{'NOTIFICATION-TEMPLATE-LISTING.ACTIONS.DELETE' | translate}}
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.ACTIONS.DELETE' | translate}}
 				</button>
 			</mat-menu>
 		</div>

dmp-frontend/src/app/ui/admin/notification-template/listing/notification-template-listing.component.scss

@@ -1,4 +1,4 @@
-.description-template-type-listing {
+.notification-template-listing {
   margin-top: 1.3rem;
   margin-left: 1rem;
   margin-right: 2rem;

dmp-frontend/src/app/ui/admin/notification-template/listing/notification-template-listing.component.ts

@@ -25,10 +25,11 @@ import { NotificationTemplateService } from '@app/core/services/notification-tem
 import { NotificationTemplateChannelPipe } from '@common/formatting/pipes/notification-template-channel.pipe';
 import { NotificationTemplateKindPipe } from '@common/formatting/pipes/notification-template-kind.pipe';
 import { Language } from '@app/core/model/language/language';
+import { NotificationTypePipe } from '@common/formatting/pipes/notification-type.pipe';
 
 @Component({
-	templateUrl: './NOTIFICATION-TEMPLATE-LISTING.component.html',
+	templateUrl: './notification-template-listing.component.html',
-	styleUrls: ['./NOTIFICATION-TEMPLATE-LISTING.component.scss']
+	styleUrls: ['./notification-template-listing.component.scss']
 })
 export class NotificationTemplateListingComponent extends BaseListingComponent<NotificationTemplate, NotificationTemplateLookup> implements OnInit {
 	publish = false;
@@ -40,6 +41,7 @@ export class NotificationTemplateListingComponent extends BaseListingComponent<N
 
 	private readonly lookupFields: string[] = [
 		nameof<NotificationTemplate>(x => x.id),
+		nameof<NotificationTemplate>(x => x.notificationType),
 		nameof<NotificationTemplate>(x => x.kind),
 		nameof<NotificationTemplate>(x => x.channel),
 		nameof<NotificationTemplate>(x => x.updatedAt),
@@ -90,33 +92,39 @@ export class NotificationTemplateListingComponent extends BaseListingComponent<N
 
 	protected setupColumns() {
 		this.gridColumns.push(...[{
+			prop: nameof<NotificationTemplate>(x => x.notificationType),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.NOTIFICATION-TYPE',
+			pipe: this.pipeService.getPipe<NotificationTypePipe>(NotificationTypePipe)
+		},
+		{
 			prop: nameof<NotificationTemplate>(x => x.kind),
 			sortable: true,
-			languageName: 'NOTIFICATION-TEMPLATE-LISTING.FIELDS.KIND',
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.KIND',
 			pipe: this.pipeService.getPipe<NotificationTemplateKindPipe>(NotificationTemplateKindPipe)
 		}, 
 		{
 			prop: nameof<NotificationTemplate>(x => x.channel),
 			sortable: true,
-			languageName: 'NOTIFICATION-TEMPLATE-LISTING.FIELDS.CHANNEL',
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.CHANNEL',
 			pipe: this.pipeService.getPipe<NotificationTemplateChannelPipe>(NotificationTemplateChannelPipe)
 		},
 		{
 			prop: nameof<NotificationTemplate>(x => x.createdAt),
 			sortable: true,
-			languageName: 'NOTIFICATION-TEMPLATE-LISTING.FIELDS.CREATED-AT',
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.CREATED-AT',
 			pipe: this.pipeService.getPipe<DataTableDateTimeFormatPipe>(DataTableDateTimeFormatPipe).withFormat('short')
 		},
 		{
 			prop: nameof<NotificationTemplate>(x => x.updatedAt),
 			sortable: true,
-			languageName: 'NOTIFICATION-TEMPLATE-LISTING.FIELDS.UPDATED-AT',
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.UPDATED-AT',
 			pipe: this.pipeService.getPipe<DataTableDateTimeFormatPipe>(DataTableDateTimeFormatPipe).withFormat('short')
 		},
 		{
 			prop: nameof<NotificationTemplate>(x => x.isActive),
 			sortable: true,
-			languageName: 'NOTIFICATION-TEMPLATE-LISTING.FIELDS.IS-ACTIVE',
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FIELDS.IS-ACTIVE',
 			pipe: this.pipeService.getPipe<IsActiveTypePipe>(IsActiveTypePipe)
 		},
 		{

dmp-frontend/src/app/ui/admin/notification/filters/notification-listing-filters.component.html

@@ -0,0 +1,76 @@
+<div class="d-flex align-items-center gap-1-rem">
+
+	<button mat-flat-button [matMenuTriggerFor]="filterMenu" #filterMenuTrigger="matMenuTrigger" (click)="updateFilters()" class="filter-button">
+		<mat-icon aria-hidden="false" [matBadgeHidden]="!appliedFilterCount" [matBadge]="appliedFilterCount" matBadgeColor="warn" matBadgeSize="small">filter_alt</mat-icon>
+		{{'COMMONS.LISTING-COMPONENT.SEARCH-FILTER-BTN' | translate}}
+	</button>
+
+
+	<mat-menu #filterMenu>
+		<div class="p-3" (click)="$event?.stopPropagation?.()">
+			<div class="search-listing-filters-container">
+				<div class="d-flex align-items-center justify-content-between">
+					<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TITLE' | translate}}</h4>
+					<button color="accent" mat-button (click)="clearFilters()">
+						{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
+					</button>
+				</div>
+
+				<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.IS-ACTIVE' | translate}}
+				</mat-slide-toggle>
+
+				<div>
+					<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}
+						<mat-select multiple [(ngModel)]="internalFilters.type">
+							<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
+						</mat-select>
+					</mat-label>
+				</div>
+
+				<div>
+					<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CONTACT-TYPE' | translate}}
+						<mat-select multiple [(ngModel)]="internalFilters.contactType">
+							<mat-option *ngFor="let contactType of notificationContactTypeEnumValues" [value]="contactType">{{enumUtils.toNotificationContactTypeString(contactType)}}</mat-option>
+						</mat-select>
+					</mat-label>
+				</div>
+
+				<div>
+					<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.NOTIFY-STATE' | translate}}
+						<mat-select multiple [(ngModel)]="internalFilters.notifyState">
+							<mat-option *ngFor="let notifyState of notificationNotifyStateEnumValues" [value]="notifyState">{{enumUtils.toNotificationNotifyStateString(notifyState)}}</mat-option>
+						</mat-select>
+					</mat-label>
+				</div>
+
+				<div>
+					<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TRACKING-STATE' | translate}}
+						<mat-select multiple [(ngModel)]="internalFilters.trackingState">
+							<mat-option *ngFor="let trackingState of notificationTrackingStateEnumValues" [value]="trackingState">{{enumUtils.toNotificationTrackingStateString(trackingState)}}</mat-option>
+						</mat-select>
+					</mat-label>
+				</div>
+
+				<div>
+					<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TRACKING-PROCESS' | translate}}
+						<mat-select multiple [(ngModel)]="internalFilters.trackingProcess">
+							<mat-option *ngFor="let trackingProcess of notificationTrackingProcessEnumValues" [value]="trackingProcess">{{enumUtils.toNotificationTrackingProcessString(trackingProcess)}}</mat-option>
+						</mat-select>
+					</mat-label>
+				</div>
+
+				<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
+					<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
+						{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CANCEL' | translate}}
+					</button>
+					<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
+						{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.APPLY-FILTERS' | translate}}
+					</button>
+				</div>
+			</div>
+		</div>
+	</mat-menu>
+
+	<!-- <app-expandable-search-field [(value)]=internalFilters.like (valueChange)="onSearchTermChange($event)" /> -->
+</div>

dmp-frontend/src/app/ui/admin/notification/filters/notification-listing-filters.component.scss

@@ -0,0 +1,21 @@
+::ng-deep.mat-mdc-menu-panel {
+	max-width: 100% !important;
+	height: 100% !important;
+}
+
+:host::ng-deep.mat-mdc-menu-content:not(:empty) {
+	padding-top: 0 !important;
+}
+
+
+.filter-button{
+	padding-top: .6rem;
+	padding-bottom: .6rem;
+	// .mat-icon{
+	// 	font-size: 1.5em;
+	// 	width: 1.2em;
+	// 	height: 1.2em;
+	// }
+}
+
+

dmp-frontend/src/app/ui/admin/notification/filters/notification-listing-filters.component.ts

@@ -0,0 +1,124 @@
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
+import { IsActive } from '@app/core/common/enum/is-active.enum';
+import { NotificationContactType } from '@app/core/common/enum/notification-contact-type';
+import { NotificationNotifyState } from '@app/core/common/enum/notification-notify-state';
+import { NotificationTrackingProcess } from '@app/core/common/enum/notification-tracking-process';
+import { NotificationTrackingState } from '@app/core/common/enum/notification-tracking-state';
+import { NotificationType } from '@app/core/common/enum/notification-type';
+import { NotificationFilter } from '@app/core/query/notification.lookup';
+import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
+import { BaseComponent } from '@common/base/base.component';
+import { nameof } from 'ts-simple-nameof';
+
+@Component({
+	selector: 'app-notification-listing-filters',
+	templateUrl: './notification-listing-filters.component.html',
+	styleUrls: ['./notification-listing-filters.component.scss']
+})
+export class NotificationListingFiltersComponent extends BaseComponent implements OnInit, OnChanges {
+
+	@Input() readonly filter: NotificationFilter;
+	@Output() filterChange = new EventEmitter<NotificationFilter>();
+	notificationContactTypeEnumValues = this.enumUtils.getEnumValues<NotificationContactType>(NotificationContactType)
+	notificationNotifyStateEnumValues = this.enumUtils.getEnumValues<NotificationNotifyState>(NotificationNotifyState);
+	notificationTrackingStateEnumValues = this.enumUtils.getEnumValues<NotificationTrackingState>(NotificationTrackingState);
+	notificationTrackingProcessEnumValues = this.enumUtils.getEnumValues<NotificationTrackingProcess>(NotificationTrackingProcess);
+	notificationTypeEnumValues = this.enumUtils.getEnumValues<NotificationType>(NotificationType);
+
+	// * State
+	internalFilters: NotificationListingFilters = this._getEmptyFilters();
+
+	protected appliedFilterCount: number = 0;
+	constructor(
+		public enumUtils: EnumUtils,
+	) { super(); }
+
+	ngOnInit() {
+	}
+
+	ngOnChanges(changes: SimpleChanges): void {
+		const filterChange = changes[nameof<NotificationListingFiltersComponent>(x => x.filter)]?.currentValue as NotificationFilter;
+		if (filterChange) {
+			this.updateFilters()
+		}
+	}
+
+
+	onSearchTermChange(searchTerm: string): void {
+		this.applyFilters()
+	}
+
+
+	protected updateFilters(): void {
+		this.internalFilters = this._parseToInternalFilters(this.filter);
+		this.appliedFilterCount = this._computeAppliedFilters(this.internalFilters);
+	}
+
+	protected applyFilters(): void {
+		const { isActive, type, notifyState, notifiedWith, contactType, trackingState, trackingProcess } = this.internalFilters ?? {}
+		this.filterChange.emit({
+			...this.filter,
+			isActive: isActive ? [IsActive.Active] : [IsActive.Inactive],
+			type,
+			notifyState,
+			notifiedWith,
+			contactType,
+			trackingState,
+			trackingProcess
+		})
+	}
+
+
+	private _parseToInternalFilters(inputFilter: NotificationFilter): NotificationListingFilters {
+		if (!inputFilter) {
+			return this._getEmptyFilters();
+		}
+
+		let { isActive, type, notifyState, notifiedWith, contactType, trackingState, trackingProcess } = inputFilter;
+
+		return {
+			isActive: (isActive ?? [])?.includes(IsActive.Active) || !isActive?.length,
+			type: type,
+			notifyState: notifyState,
+			notifiedWith: notifiedWith,
+			contactType: contactType,
+			trackingState: trackingState,
+			trackingProcess: trackingProcess
+		}
+
+	}
+
+	private _getEmptyFilters(): NotificationListingFilters {
+		return {
+			isActive: true,
+			type: null,
+			notifyState: null,
+			notifiedWith: null,
+			contactType: null,
+			trackingState: null,
+			trackingProcess: null
+		}
+	}
+
+	private _computeAppliedFilters(filters: NotificationListingFilters): number {
+		let count = 0;
+		if (filters?.isActive) {
+			count++
+		}
+		return count;
+	}
+
+	clearFilters() {
+		this.internalFilters = this._getEmptyFilters();
+	}
+}
+
+interface NotificationListingFilters {
+	isActive: boolean;
+	type: NotificationType[];
+	notifyState: NotificationNotifyState[];
+	notifiedWith: NotificationContactType[];
+	contactType: NotificationContactType[];
+	trackingState: NotificationTrackingState[];
+	trackingProcess: NotificationTrackingProcess[];
+}

dmp-frontend/src/app/ui/admin/notification/notification-listing.component.html

@@ -0,0 +1,92 @@
+<div>
+	<div class="col-md-13 offset-md-0">
+
+		<div class="row mb-6 mt-3">
+			<div class="col">
+				<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.TITLE' | translate}}</h4>
+				<app-navigation-breadcrumb />
+
+			</div>
+		</div>
+
+		<app-hybrid-listing [rows]="gridRows" [columns]="gridColumns" [visibleColumns]="visibleColumns"
+			[count]="totalElements" [offset]="currentPageNumber" [limit]="lookup.page.size"
+			[defaultSort]="lookup.order?.items" [externalSorting]="true" (rowActivated)="onRowActivated($event)"
+			(pageLoad)="alterPage($event)" (columnSort)="onColumnSort($event)"
+			(columnsChanged)="onColumnsChanged($event)" [listItemTemplate]="listItemTemplate">
+
+			<app-notification-listing-filters hybrid-listing-filters [(filter)]="lookup"
+				(filterChange)="filterChanged($event)" />
+
+			<app-user-settings-picker [key]="userSettingsKey" [userPreference]="lookup"
+				(onSettingSelected)="changeSetting($event)" [autoSelectUserSettings]="autoSelectUserSettings"
+				user-preference-settings />
+		</app-hybrid-listing>
+
+	</div>
+</div>
+
+<ng-template #listItemTemplate let-item="item" let-isColumnSelected="isColumnSelected">
+
+
+	<div class="d-flex align-items-center p-3 gap-1-rem">
+		<div class="row">
+			<ng-container *ngIf="isColumnSelected('name')">
+				<a class="buttonLinkClass" [routerLink]="'./' + item?.id" class="col-12"
+					(click)="$event.stopPropagation()">{{item?.name | nullifyValue}}</a>
+				<br />
+			</ng-container>
+			<ng-container *ngIf="isColumnSelected('notificationType')">
+				<span class="col-12">
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.NOTIFICATION-TYPE' | translate}}:
+					<small>
+						{{enumUtils.toNotificationTypeString(item.notificationType) | nullifyValue}}
+					</small>
+				</span>
+				<br>
+			</ng-container>
+			<ng-container *ngIf="isColumnSelected('kind')">
+				<span class="col-12">
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.KIND' | translate}}:
+					<small>
+						{{enumUtils.toNotificationTemplateKindString(item.kind) | nullifyValue}}
+					</small>
+				</span>
+				<br>
+			</ng-container>
+			<ng-container *ngIf="isColumnSelected('channel')">
+				<span class="col-12">
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.CHANNEL' | translate}}:
+					<small>
+						{{enumUtils.toNotificationTemplateChannelString(item.channel) | nullifyValue}}
+					</small>
+				</span>
+				<br>
+			</ng-container>
+			<ng-container *ngIf="isColumnSelected('updatedAt')">
+				<span class="col-12">
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.UPDATED-AT' | translate}}:
+					<small>
+						{{item?.updatedAt | dateTimeFormatter : 'short' | nullifyValue}}
+					</small>
+				</span>
+			</ng-container>
+		</div>
+	</div>
+</ng-template>
+
+<ng-template #actions let-row="row" let-item>
+	<div class="row" (click)="$event.stopPropagation()">
+		<div class="col-auto">
+			<button mat-icon-button [matMenuTriggerFor]="actionsMenu">
+				<mat-icon>more_horiz</mat-icon>
+			</button>
+			<mat-menu #actionsMenu="matMenu">
+				<button mat-menu-item (click)="deleteType(row.id)">
+					<mat-icon>delete</mat-icon>
+					{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.ACTIONS.DELETE' | translate}}
+				</button>
+			</mat-menu>
+		</div>
+	</div>
+</ng-template>

dmp-frontend/src/app/ui/admin/notification/notification-listing.component.scss

@@ -0,0 +1,27 @@
+.notification-listing {
+  margin-top: 1.3rem;
+  margin-left: 1rem;
+  margin-right: 2rem;
+
+  .mat-header-row{
+    background: #f3f5f8;
+  }
+  .mat-card {
+    margin: 16px 0;
+    padding: 0px;
+  }
+  
+  .mat-row {
+    cursor: pointer;
+    min-height: 4.5em;
+  }
+  
+  mat-row:hover {
+    background-color: #eef5f6;
+  }
+  .mat-fab-bottom-right {
+    float: right;
+    z-index: 5;
+  }
+}
+

dmp-frontend/src/app/ui/admin/notification/notification-listing.component.ts

@@ -0,0 +1,224 @@
+import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
+import { MatDialog } from '@angular/material/dialog';
+import { ActivatedRoute, Router } from '@angular/router';
+import { IsActive } from '@app/core/common/enum/is-active.enum';
+import { AuthService } from '@app/core/services/auth/auth.service';
+import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
+import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
+import { QueryParamsService } from '@app/core/services/utilities/query-params.service';
+import { BaseListingComponent } from '@common/base/base-listing-component';
+import { PipeService } from '@common/formatting/pipe.service';
+import { DataTableDateTimeFormatPipe } from '@common/formatting/pipes/date-time-format.pipe';
+import { QueryResult } from '@common/model/query-result';
+import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
+import { HttpErrorHandlingService } from '@common/modules/errors/error-handling/http-error-handling.service';
+import { ColumnDefinition, ColumnsChangedEvent, HybridListingComponent, PageLoadEvent } from '@common/modules/hybrid-listing/hybrid-listing.component';
+import { Guid } from '@common/types/guid';
+import { TranslateService } from '@ngx-translate/core';
+import { Observable } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { nameof } from 'ts-simple-nameof';
+import { IsActiveTypePipe } from '@common/formatting/pipes/is-active-type.pipe';
+import { Notification } from '@app/core/model/notification/notification.model';
+import { NotificationLookup } from '@app/core/query/notification.lookup';
+import { NotificationService } from '@app/core/services/notification/notification-service';
+import { NotificationTypePipe } from '@common/formatting/pipes/notification-type.pipe';
+import { NotificationContactTypePipe } from '@common/formatting/pipes/notification-contact-type.pipe';
+import { NotificationNotifyStatePipe } from '@common/formatting/pipes/notification-notify-state.pipe';
+import { NotificationTrackingStatePipe } from '@common/formatting/pipes/notification-tracking-state.pipe';
+import { NotificationTrackingProcessPipe } from '@common/formatting/pipes/notification-tracking-process.pipe';
+
+@Component({
+	templateUrl: './notification-listing.component.html',
+	styleUrls: ['./notification-listing.component.scss']
+})
+export class NotificationListingComponent extends BaseListingComponent<Notification, NotificationLookup> implements OnInit {
+	publish = false;
+	userSettingsKey = { key: 'NotificationListingUserSettings' };
+	propertiesAvailableForOrder: ColumnDefinition[];
+
+	@ViewChild('actions', { static: true }) actions?: TemplateRef<any>;
+	@ViewChild(HybridListingComponent, { static: true }) hybridListingComponent: HybridListingComponent;
+
+	private readonly lookupFields: string[] = [
+		nameof<Notification>(x => x.id),
+		nameof<Notification>(x => x.type),
+		nameof<Notification>(x => x.retryCount),
+		nameof<Notification>(x => x.trackingState),
+		nameof<Notification>(x => x.trackingProcess),
+		nameof<Notification>(x => x.contactTypeHint),
+		nameof<Notification>(x => x.notifyState),
+		nameof<Notification>(x => x.notifiedWith),
+		nameof<Notification>(x => x.notifiedAt),
+		nameof<Notification>(x => x.createdAt),
+		nameof<Notification>(x => x.updatedAt),
+		nameof<Notification>(x => x.hash),
+		nameof<Notification>(x => x.isActive)
+	];
+
+	rowIdentity = x => x.id;
+
+	constructor(
+		protected router: Router,
+		protected route: ActivatedRoute,
+		protected uiNotificationService: UiNotificationService,
+		protected httpErrorHandlingService: HttpErrorHandlingService,
+		protected queryParamsService: QueryParamsService,
+		private notificationService: NotificationService,
+		public authService: AuthService,
+		private pipeService: PipeService,
+		public enumUtils: EnumUtils,
+		private language: TranslateService,
+		private dialog: MatDialog
+	) {
+		super(router, route, uiNotificationService, httpErrorHandlingService, queryParamsService);
+		// Lookup setup
+		// Default lookup values are defined in the user settings class.
+		this.lookup = this.initializeLookup();
+	}
+
+	ngOnInit() {
+		super.ngOnInit();
+	}
+
+	protected initializeLookup(): NotificationLookup {
+		const lookup = new NotificationLookup();
+		lookup.metadata = { countAll: true };
+		lookup.page = { offset: 0, size: this.ITEMS_PER_PAGE };
+		lookup.isActive = [IsActive.Active];
+		lookup.order = { items: [this.toDescSortField(nameof<Notification>(x => x.createdAt))] };
+		this.updateOrderUiFields(lookup.order);
+
+		lookup.project = {
+			fields: this.lookupFields
+		};
+
+		return lookup;
+	}
+
+	protected setupColumns() {
+		this.gridColumns.push(...[{
+			prop: nameof<Notification>(x => x.type),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.NOTIFICATION-TYPE',
+			pipe: this.pipeService.getPipe<NotificationTypePipe>(NotificationTypePipe)
+		},
+		{
+			prop: nameof<Notification>(x => x.contactTypeHint),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.CONTACT-TYPE',
+			pipe: this.pipeService.getPipe<NotificationContactTypePipe>(NotificationContactTypePipe)
+		}, 
+		{
+			prop: nameof<Notification>(x => x.notifyState),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.NOTIFY-STATE',
+			pipe: this.pipeService.getPipe<NotificationNotifyStatePipe>(NotificationNotifyStatePipe)
+		},
+		{
+			prop: nameof<Notification>(x => x.notifiedWith),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.NOTIFIED-WITH',
+			pipe: this.pipeService.getPipe<NotificationContactTypePipe>(NotificationContactTypePipe)
+		},
+		{
+			prop: nameof<Notification>(x => x.notifiedAt),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.NOTIFIED-AT',
+			// pipe: this.pipeService.getPipe<NotificationContactTypePipe>(NotificationContactTypePipe)
+		},
+		{
+			prop: nameof<Notification>(x => x.trackingState),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.TRACKING-STATE',
+			pipe: this.pipeService.getPipe<NotificationTrackingStatePipe>(NotificationTrackingStatePipe)
+		},
+		{
+			prop: nameof<Notification>(x => x.trackingProcess),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.TRACKING-PROCESS',
+			pipe: this.pipeService.getPipe<NotificationTrackingProcessPipe>(NotificationTrackingProcessPipe)
+		},
+		{
+			prop: nameof<Notification>(x => x.retryCount),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.RETRY-COUNT',
+		},
+		{
+			prop: nameof<Notification>(x => x.createdAt),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.CREATED-AT',
+			pipe: this.pipeService.getPipe<DataTableDateTimeFormatPipe>(DataTableDateTimeFormatPipe).withFormat('short')
+		},
+		{
+			prop: nameof<Notification>(x => x.updatedAt),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.UPDATED-AT',
+			pipe: this.pipeService.getPipe<DataTableDateTimeFormatPipe>(DataTableDateTimeFormatPipe).withFormat('short')
+		},
+		{
+			prop: nameof<Notification>(x => x.isActive),
+			sortable: true,
+			languageName: 'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FIELDS.IS-ACTIVE',
+			pipe: this.pipeService.getPipe<IsActiveTypePipe>(IsActiveTypePipe)
+		},
+		{
+			alwaysShown: true,
+			cellTemplate: this.actions,
+			maxWidth: 120
+		}
+		]);
+		this.propertiesAvailableForOrder = this.gridColumns.filter(x => x.sortable);
+	}
+
+	//
+	// Listing Component functions
+	//
+	onColumnsChanged(event: ColumnsChangedEvent) {
+		super.onColumnsChanged(event);
+		this.onColumnsChangedInternal(event.properties.map(x => x.toString()));
+	}
+
+	private onColumnsChangedInternal(columns: string[]) {
+		// Here are defined the projection fields that always requested from the api.
+		const fields = new Set(this.lookupFields);
+		this.gridColumns.map(x => x.prop)
+			.filter(x => !columns?.includes(x as string))
+			.forEach(item => {
+				fields.delete(item as string)
+			});
+		this.lookup.project = { fields: [...fields] };
+		this.onPageLoad({ offset: 0 } as PageLoadEvent);
+	}
+
+	protected loadListing(): Observable<QueryResult<Notification>> {
+		return this.notificationService.query(this.lookup);
+	}
+
+	public deleteType(id: Guid) {
+		if (id) {
+			const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
+				data: {
+					isDeleteConfirmation: true,
+					message: this.language.instant('GENERAL.CONFIRMATION-DIALOG.DELETE-ITEM'),
+					confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CONFIRM'),
+					cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL')
+				}
+			});
+			dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
+				if (result) {
+					this.notificationService.delete(id).pipe(takeUntil(this._destroyed))
+						.subscribe(
+							complete => this.onCallbackSuccess(),
+							error => this.onCallbackError(error)
+						);
+				}
+			});
+		}
+	}
+
+	onCallbackSuccess(): void {
+		this.uiNotificationService.snackBarNotification(this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-DELETE'), SnackBarNotificationLevel.Success);
+		this.ngOnInit();
+	}
+}

dmp-frontend/src/app/ui/admin/notification/notification.module.ts

@@ -0,0 +1,41 @@
+import { DragDropModule } from '@angular/cdk/drag-drop';
+import { NgModule } from "@angular/core";
+import { AutoCompleteModule } from "@app/library/auto-complete/auto-complete.module";
+import { CommonFormattingModule } from '@common/formatting/common-formatting.module';
+import { CommonFormsModule } from '@common/forms/common-forms.module';
+import { ConfirmationDialogModule } from '@common/modules/confirmation-dialog/confirmation-dialog.module';
+import { HybridListingModule } from "@common/modules/hybrid-listing/hybrid-listing.module";
+import { TextFilterModule } from "@common/modules/text-filter/text-filter.module";
+import { UserSettingsModule } from "@common/modules/user-settings/user-settings.module";
+import { CommonUiModule } from '@common/ui/common-ui.module';
+import { NgxDropzoneModule } from "ngx-dropzone";
+import { NotificationListingComponent } from './notification-listing.component';
+import { RichTextEditorModule } from '@app/library/rich-text-editor/rich-text-editor.module';
+import { NotificationRoutingModule } from './notification.routing';
+import { NotificationListingFiltersComponent } from './filters/notification-listing-filters.component';
+import { MatIconModule } from '@angular/material/icon';
+import { EditorModule } from '@tinymce/tinymce-angular';
+
+@NgModule({
+	imports: [
+		CommonUiModule,
+		CommonFormsModule,
+		ConfirmationDialogModule,
+		NotificationRoutingModule,
+		NgxDropzoneModule,
+		DragDropModule,
+		AutoCompleteModule,
+		HybridListingModule,
+		TextFilterModule,
+		UserSettingsModule,
+		CommonFormattingModule,
+		RichTextEditorModule,
+		MatIconModule,
+		EditorModule
+	],
+	declarations: [
+		NotificationListingComponent,
+		NotificationListingFiltersComponent
+	]
+})
+export class NotificationModule { }

dmp-frontend/src/app/ui/admin/notification/notification.routing.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { AuthGuard } from '@app/core/auth-guard.service';
+import { NotificationListingComponent } from './notification-listing.component';
+
+const routes: Routes = [
+	{
+		path: '',
+		component: NotificationListingComponent,
+		canActivate: [AuthGuard]
+	},
+	{ path: '**', loadChildren: () => import('@common/modules/page-not-found/page-not-found.module').then(m => m.PageNotFoundModule) },
+];
+
+@NgModule({
+	imports: [RouterModule.forChild(routes)],
+	exports: [RouterModule],
+	providers: []
+})
+export class NotificationRoutingModule { }

dmp-frontend/src/app/ui/sidebar/sidebar.component.ts

@@ -58,6 +58,7 @@ export const ADMIN_ROUTES: RouteInfo[] = [
 	{ path: '/languages', title: 'SIDE-BAR.LANGUAGES', icon: 'language' },
 	{ path: '/supportive-material', title: 'SIDE-BAR.SUPPORTIVE-MATERIAL', icon: 'dataset_linked' },
 	{ path: '/notification-templates', title: 'SIDE-BAR.NOTIFICATION-TEMPLATES', icon: 'build'},
+	{ path: '/notifications', title: 'SIDE-BAR.NOTIFICATIONS', icon: 'build'},
 	{ path: '/index-managment', title: 'SIDE-BAR.MAINTENANCE', icon: 'build'}
 ];
 

dmp-frontend/src/assets/i18n/en.json

@@ -255,7 +255,8 @@
 		"NEW-LANGUAGE": "New",
 		"EDIT-LANGUAGE": "Edit",
 		"NOTIFICATION-TEMPLATES": "Notification Templates",
-		"INAPP-NOTIFICATIONS":"Notifications"
+		"INAPP-NOTIFICATIONS":"Notifications",
+		"NOTIFICATIONS": "Notifications"
 	},
 	"COOKIE": {
 		"MESSAGE": "This website uses cookies to enhance the user experience.",
@@ -357,7 +358,8 @@
 		"REFERENCES": "References",
 		"LANGUAGES": "Languages",
 		"MAINTENANCE": "Maintenance",
-		"NOTIFICATION-TEMPLATES": "Notification Templates"
+		"NOTIFICATION-TEMPLATES": "Notification Templates",
+		"NOTIFICATIONS":"Notifications"
 	},
 	"DESCRIPTION-TEMPLATE-EDITOR": {
 		"TITLE": {
@@ -1252,37 +1254,6 @@
 		"SUCCESSFUL-DELETE": "Successful Delete",
 		"UNSUCCESSFUL-DELETE": "This item could not be deleted."
 	},
-	"NOTIFICATION-TEMPLATE-LISTING": {
-		"TITLE": "Notification Templates",
-		"CREATE": "Create Notification Template",
-		"FIELDS": {
-			"LANGUAGE": "Language",
-			"KIND": "Kind",
-			"CHANNEL": "Channel",
-			"UPDATED-AT": "Updated",
-			"CREATED-AT": "Created",
-			"IS-ACTIVE": "Is Active"
-		},
-		"FILTER": {
-			"TITLE": "Filters",
-			"IS-ACTIVE": "Is Active",
-			"KIND": "Kind",
-			"CHANNEL": "Channel",
-			"CANCEL": "Cancel",
-			"APPLY-FILTERS": "Apply filters"
-		},
-		"CONFIRM-DELETE-DIALOG": {
-			"MESSAGE": "Would you like to delete this Notification Template?",
-			"CONFIRM-BUTTON": "Yes, delete",
-			"CANCEL-BUTTON": "No"
-		},
-		"ACTIONS": {
-			"DELETE": "Delete",
-			"EDIT": "Edit"
-		},
-		"SUCCESSFUL-DELETE": "Successful Delete",
-		"UNSUCCESSFUL-DELETE": "This item could not be deleted."
-	},
 	"SUPPORTIVE-MATERIAL-EDITOR": {
 		"TITLE": "Supportive Material",
 		"FIELDS": {
@@ -1368,6 +1339,39 @@
 				"DELETE": "Delete"
 			}
 		},
+		"NOTIFICATION-TEMPLATE-LISTING": {
+			"TITLE": "Notification Templates",
+			"CREATE": "Create Notification Template",
+			"FIELDS": {
+				"NOTIFICATION-TYPE": "Type",
+				"LANGUAGE": "Language",
+				"KIND": "Kind",
+				"CHANNEL": "Channel",
+				"UPDATED-AT": "Updated",
+				"CREATED-AT": "Created",
+				"IS-ACTIVE": "Is Active"
+			},
+			"FILTER": {
+				"TITLE": "Filters",
+				"NOTIFICATION-TYPE": "Type",
+				"IS-ACTIVE": "Is Active",
+				"KIND": "Kind",
+				"CHANNEL": "Channel",
+				"CANCEL": "Cancel",
+				"APPLY-FILTERS": "Apply filters"
+			},
+			"CONFIRM-DELETE-DIALOG": {
+				"MESSAGE": "Would you like to delete this Notification Template?",
+				"CONFIRM-BUTTON": "Yes, delete",
+				"CANCEL-BUTTON": "No"
+			},
+			"ACTIONS": {
+				"DELETE": "Delete",
+				"EDIT": "Edit"
+			},
+			"SUCCESSFUL-DELETE": "Successful Delete",
+			"UNSUCCESSFUL-DELETE": "This item could not be deleted."
+		},
 		"NOTIFICATION-TEMPLATE-EDITOR": {
 			"NEW": "New Notification Template",
 			"FIELDS": {
@@ -1405,6 +1409,44 @@
 				"CANCEL": "Cancel",
 				"DELETE": "Delete"
 			}
+		},
+		"NOTIFICATION-LISTING": {
+			"TITLE": "Notifications",
+			"FIELDS": {
+				"NOTIFICATION-TYPE": "Type",
+				"NOTIFY-STATE": "Notify State",
+				"NOTIFIED-WITH": "Notified With",
+				"CONTACT-TYPE": "Contact Type",
+				"TRACKING-STATE": "Tracking State",
+				"TRACKING-PROCESS": "Tracking Process",
+				"RETRY-COUNT": "Retry Count",
+				"NOTIFIED-AT": "Notified At",
+				"UPDATED-AT": "Updated",
+				"CREATED-AT": "Created",
+				"IS-ACTIVE": "Is Active"
+			},
+			"FILTER": {
+				"TITLE": "Filters",
+				"NOTIFICATION-TYPE": "Type",
+				"IS-ACTIVE": "Is Active",
+				"NOTIFY-STATE": "Notify State",
+				"CONTACT-TYPE": "Contact Type",
+				"TRACKING-STATE": "Tracking State",
+				"TRACKING-PROCESS": "Tracking Process",
+				"CANCEL": "Cancel",
+				"APPLY-FILTERS": "Apply filters"
+			},
+			"CONFIRM-DELETE-DIALOG": {
+				"MESSAGE": "Would you like to delete this Notification?",
+				"CONFIRM-BUTTON": "Yes, delete",
+				"CANCEL-BUTTON": "No"
+			},
+			"ACTIONS": {
+				"DELETE": "Delete",
+				"EDIT": "Edit"
+			},
+			"SUCCESSFUL-DELETE": "Successful Delete",
+			"UNSUCCESSFUL-DELETE": "This item could not be deleted."
 		}
 	},
 	"DESCRIPTION-TEMPLATE-TYPE-EDITOR": {
@@ -2319,6 +2361,34 @@
 		"NOTIFICATION-INAPP-TRACKING": {
 			"STORED": "Unread",
 			"DELIVERED": "Read"
+		},
+		"NOTIFICATION-CONTACT-TYPE": {
+			"EMAIL": "Email",
+			"INAPP": "In App"
+		},
+		"NOTIFICATION-NOTIFY-STATE": {
+			"PENDING": "Pending",
+			"PROCESSING": "Processing",
+			"SUCCESSFUL": "Successful",
+			"ERROR":"Error",
+			"OMITTED": "Omitted"
+		},
+		"NOTIFICATION-TRACKING-STATE": {
+			"UNDEFINED": "Undefined",
+			"NA": "NA",
+			"QUEUED": "Queued",
+			"SENT":"Sent",
+			"DELIVERED": "Delivered",
+			"UNDELIVERED": "Undelivered",
+			"FAILED": "Failed",
+			"UNSENT": "Unsent"
+		},
+		"NOTIFICATION-TRACKING-PROCESS": {
+			"PENDING": "Pending",
+			"PROCESSING": "Processing",
+			"SUCCESSFUL": "Successful",
+			"ERROR":"Error",
+			"OMITTED": "Omitted"
 		}
 	},
 	"ADDRESEARCHERS-EDITOR": {

dmp-frontend/src/common/formatting/common-formatting.module.ts

@@ -10,6 +10,10 @@ import { ReferenceSourceTypePipe } from './pipes/reference-source-type.pipe';
 import { NotificationTemplateChannelPipe } from './pipes/notification-template-channel.pipe';
 import { NotificationTemplateKindPipe } from './pipes/notification-template-kind.pipe';
 import { NotificationTypePipe } from './pipes/notification-type.pipe';
+import { NotificationContactTypePipe } from './pipes/notification-contact-type.pipe';
+import { NotificationNotifyStatePipe } from './pipes/notification-notify-state.pipe';
+import { NotificationTrackingProcessPipe } from './pipes/notification-tracking-process.pipe';
+import { NotificationTrackingStatePipe } from './pipes/notification-tracking-state.pipe';
 
 //
 //
@@ -31,7 +35,11 @@ import { NotificationTypePipe } from './pipes/notification-type.pipe';
 		ReferenceSourceTypePipe,
 		NotificationTemplateChannelPipe,
 		NotificationTemplateKindPipe,
-		NotificationTypePipe
+		NotificationTypePipe,
+		NotificationContactTypePipe,
+		NotificationNotifyStatePipe,
+		NotificationTrackingProcessPipe,
+		NotificationTrackingStatePipe
 	],
 	exports: [
 		DateFormatPipe,
@@ -47,7 +55,11 @@ import { NotificationTypePipe } from './pipes/notification-type.pipe';
 		ReferenceSourceTypePipe,
 		NotificationTemplateChannelPipe,
 		NotificationTemplateKindPipe,
-		NotificationTypePipe
+		NotificationTypePipe,
+		NotificationContactTypePipe,
+		NotificationNotifyStatePipe,
+		NotificationTrackingProcessPipe,
+		NotificationTrackingStatePipe
 	],
 	providers: [
 		DateFormatPipe,
@@ -63,7 +75,11 @@ import { NotificationTypePipe } from './pipes/notification-type.pipe';
 		ReferenceSourceTypePipe,
 		NotificationTemplateChannelPipe,
 		NotificationTemplateKindPipe,
-		NotificationTypePipe
+		NotificationTypePipe,
+		NotificationContactTypePipe,
+		NotificationNotifyStatePipe,
+		NotificationTrackingProcessPipe,
+		NotificationTrackingStatePipe
 	]
 })
 export class CommonFormattingModule { }

dmp-frontend/src/common/formatting/pipes/notification-contact-type.pipe.ts

@@ -0,0 +1,11 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
+
+@Pipe({ name: 'NotificationContactTypeFormat' })
+export class NotificationContactTypePipe implements PipeTransform {
+	constructor(private enumUtils: EnumUtils) { }
+
+	public transform(value): any {
+		return this.enumUtils.toNotificationContactTypeString(value);
+	}
+}

dmp-frontend/src/common/formatting/pipes/notification-notify-state.pipe.ts

@@ -0,0 +1,11 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
+
+@Pipe({ name: 'NotificationNotifyStateFormat' })
+export class NotificationNotifyStatePipe implements PipeTransform {
+	constructor(private enumUtils: EnumUtils) { }
+
+	public transform(value): any {
+		return this.enumUtils.toNotificationNotifyStateString(value);
+	}
+}

dmp-frontend/src/common/formatting/pipes/notification-tracking-process.pipe.ts

@@ -0,0 +1,11 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
+
+@Pipe({ name: 'NotificationTrackingProcessFormat' })
+export class NotificationTrackingProcessPipe implements PipeTransform {
+	constructor(private enumUtils: EnumUtils) { }
+
+	public transform(value): any {
+		return this.enumUtils.toNotificationTrackingProcessString(value);
+	}
+}

dmp-frontend/src/common/formatting/pipes/notification-tracking-state.pipe.ts

@@ -0,0 +1,11 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
+
+@Pipe({ name: 'NotificationTrackingStateFormat' })
+export class NotificationTrackingStatePipe implements PipeTransform {
+	constructor(private enumUtils: EnumUtils) { }
+
+	public transform(value): any {
+		return this.enumUtils.toNotificationTrackingStateString(value);
+	}
+}