feature: TRACEFOSS-1179 Show sender and receiver bpn number + name in… (#81)

ds-ext-dskrzypczak · web-flow · commit 18a4f7ef3a45 · 2023-03-20T12:56:06.000+01:00
* feature: TRACEFOSS-1179 Show sender and receiver bpn number + name in notification list

* feature: TRACEFOSS-1179 Changes after the review
diff --git a/frontend/src/app/mocks/services/investigations-mock/investigations.model.ts b/frontend/src/app/mocks/services/investigations-mock/investigations.model.ts
@@ -58,8 +58,10 @@ export const buildMockInvestigations = (
       status,
       severity,
       channel,
-      createdBy: 'OEM A',
-      sendTo: 'OEM B',
+      createdBy: 'BPN10000000OEM0A',
+      createdByName: 'OEM xxxxxxxxxxxxxxx A',
+      sendTo: 'BPN20000000OEM0B',
+      sendToName: 'OEM xxxxxxxxxxxxxxx B',
       reason: { close, decline, accept },
       createdDate: `2022-05-${(index + 1).toString().padStart(2, '0')}T12:34:12`,
       targetDate: `2022-05-${(index + 2).toString().padStart(2, '0')}T11:34:12Z`,
@@ -72,8 +74,10 @@ const MockEmptyInvestigation: NotificationResponse = {
   description: `Investigation No 000`,
   status: NotificationStatus.CREATED,
   severity: Severity.MINOR,
-  createdBy: 'OEM A',
-  sendTo: 'OEM B',
+  createdBy: 'BPN10000000OEM0A',
+  createdByName: 'OEM xxxxxxxxxxxxxxx A',
+  sendTo: 'BPN20000000OEM0B',
+  sendToName: 'OEM xxxxxxxxxxxxxxx B',
   reason: { close: '', decline: '', accept: '' },
   createdDate: `2022-05-01T12:34:12`,
   targetDate: `2022-02-01T12:34:12`,
diff --git a/frontend/src/app/mocks/services/investigations-mock/investigations.test.model.ts b/frontend/src/app/mocks/services/investigations-mock/investigations.test.model.ts
@@ -42,8 +42,10 @@ export const buildMockInvestigations = (
       status,
       severity,
       channel,
-      createdBy: 'OEAM A',
-      sendTo: 'OEM B',
+      createdBy: 'BPN10000000OEM0A',
+      createdByName: 'OEM xxxxxxxxxxxxxxx A',
+      sendTo: 'BPN20000000OEM0B',
+      sendToName: 'OEM xxxxxxxxxxxxxxx B',
       reason: { close: '', accept: '', decline: '' },
       createdDate: `2022-05-${(index + 1).toString().padStart(2, '0')}T12:34:12`,
       assetIds: [MOCK_part_1.id, getRandomAsset().id, getRandomAsset().id, getRandomAsset().id],
@@ -55,8 +57,10 @@ const MockEmptyInvestigation: NotificationResponse = {
   description: `Investigation No 000`,
   status: NotificationStatus.CREATED,
   severity: Severity.MINOR,
-  createdBy: 'OEM A',
-  sendTo: 'OEAM B',
+  createdBy: 'BPN10000000OEM0A',
+  createdByName: 'OEM xxxxxxxxxxxxxxx A',
+  sendTo: 'BPN20000000OEM0B',
+  sendToName: 'OEM xxxxxxxxxxxxxxx B',
   reason: { close: '', accept: '', decline: '' },
   createdDate: `2022-05-01T12:34:12`,
   assetIds: [getRandomAsset().id],
diff --git a/frontend/src/app/modules/page/dashboard/presentation/dashboard.component.html b/frontend/src/app/modules/page/dashboard/presentation/dashboard.component.html
@@ -88,7 +88,7 @@ <h3 class="mb-4 flex items-center">
           [translationContext]="'commonInvestigation'"
           [labelId]="'dashboard-investigations'"
           [hasPagination]="false"
-          [optionalColumns]="['targetDate', 'severity']"
+          [optionalColumns]="['targetDate', 'severity', 'createdBy']"
           (selected)="onNotificationSelected($event)"
         ></app-notifications-tab>
       </mat-card-content>
diff --git a/frontend/src/app/modules/page/investigations/presentation/investigations.component.html b/frontend/src/app/modules/page/investigations/presentation/investigations.component.html
@@ -51,7 +51,8 @@
   [queuedAndRequestedNotifications$]="investigationsQueuedAndRequested$"
   [receivedNotifications$]="investigationsReceived$"
   [translationContext]="'commonInvestigation'"
-  [optionalColumns]="['targetDate', 'severity']"
+  [receivedOptionalColumns]="['targetDate', 'severity', 'createdBy']"
+  [queuedAndRequestedOptionalColumns]="['targetDate', 'severity', 'sendTo']"
   (onReceivedPagination)="onReceivedPagination($event)"
   (onQueuedAndRequestedPagination)="onQueuedAndRequestedPagination($event)"
   (selected)="openDetailPage($event)"
diff --git a/frontend/src/app/modules/shared/assembler/investigations.assembler.spec.ts b/frontend/src/app/modules/shared/assembler/investigations.assembler.spec.ts
@@ -81,8 +81,8 @@ describe('InvestigationsAssembler', () => {
             severity: Severity.MINOR,
             createdDate: new CalendarDateModel('2022-07-26T15:09:39.419Z'),
             targetDate: new CalendarDateModel('2022-06-26T15:09:39.419Z'),
-            createdBy: '',
-            sendTo: '',
+            createdBy: { bpn: '', name: '' },
+            sendTo: { bpn: '', name: '' },
             reason: { close: '', accept: '', decline: '' },
             isFromSender: true,
             assetIds: [],
@@ -94,8 +94,8 @@ describe('InvestigationsAssembler', () => {
             severity: Severity.MAJOR,
             createdDate: new CalendarDateModel('2022-07-26T15:09:39.419Z'),
             targetDate: new CalendarDateModel('2022-06-26T15:09:39.419Z'),
-            createdBy: '',
-            sendTo: '',
+            createdBy: { bpn: '', name: '' },
+            sendTo: { bpn: '', name: '' },
             reason: { close: '', accept: '', decline: '' },
             isFromSender: true,
             assetIds: [],
diff --git a/frontend/src/app/modules/shared/assembler/investigations.assembler.ts b/frontend/src/app/modules/shared/assembler/investigations.assembler.ts
@@ -40,14 +40,16 @@ export class InvestigationsAssembler {
       id,
       assetIds,
       channel,
-      sendTo,
 
       reason = { accept: '', close: '', decline: '' },
       description = '',
       status: _status,
       severity: _severity,
       createdDate: _createdDate = '',
-      createdBy = '',
+      createdBy: _createdBy = '',
+      createdByName: _createdByName = '',
+      sendTo: _sendTo = '',
+      sendToName: _sendToName = '',
       targetDate: _targetDate = '',
     } = response;
 
@@ -56,6 +58,8 @@ export class InvestigationsAssembler {
     const severity = Object.values(Severity).find(element => element == _severity);
     const createdDate = new CalendarDateModel(_createdDate);
     const targetDate = new CalendarDateModel(_targetDate);
+    const createdBy = { bpn: _createdBy, name: _createdByName };
+    const sendTo = { bpn: _sendTo, name: _sendToName };
 
     return {
       id,
diff --git a/frontend/src/app/modules/shared/components/notification-overview/notification-overview.component.html b/frontend/src/app/modules/shared/components/notification-overview/notification-overview.component.html
@@ -40,11 +40,15 @@
   </div>
   <div>
     <span class="detail--text detail--text__bold">{{ 'table.column.createdBy' | i18n }}</span>
-    <span class="detail--text">{{ notification?.createdBy }}</span>
+    <span class="detail--text">
+      <app-notification-user [user]="notification.createdBy"></app-notification-user>
+    </span>
   </div>
   <div>
     <span class="detail--text detail--text__bold">{{ 'table.column.sendTo' | i18n }}</span>
-    <span class="detail--text">{{ notification?.sendTo }}</span>
+    <span class="detail--text">
+      <app-notification-user [user]="notification.sendTo"></app-notification-user>
+    </span>
   </div>
 
   <div *ngIf="notification?.targetDate">
diff --git a/frontend/src/app/modules/shared/components/notification-reason/notification-reason.component.html b/frontend/src/app/modules/shared/components/notification-reason/notification-reason.component.html
@@ -27,7 +27,7 @@
 <ng-template #chatBubble let-message="message">
   <ng-container *ngIf="message.reason">
     <div class="message--separator"></div>
-    <p class="message--username__{{ message.direction }}">{{ message.user }}</p>
+    <p class="message--username__{{ message.direction }}">{{ message.user.bpn }}</p>
     <div class="message--text message--text__{{ message.direction }} message--text-arrow__{{ message.direction }}">
       <p>{{ message.reason }}</p>
       <div class="message--status">
diff --git a/frontend/src/app/modules/shared/components/notification-reason/notification-reason.component.spec.ts b/frontend/src/app/modules/shared/components/notification-reason/notification-reason.component.spec.ts
@@ -47,12 +47,12 @@ describe('NotificationReasonComponent', () => {
     expect(screen.getByText(reason.accept)).toBeInTheDocument();
     expect(screen.getByText('commonInvestigation.status.SENT')).toBeInTheDocument();
 
-    expect(screen.getByText(defaultNotification.createdBy)).toBeInTheDocument();
-    expect(screen.getByText(defaultNotification.sendTo)).toBeInTheDocument();
+    expect(screen.getByText(defaultNotification.createdBy.bpn)).toBeInTheDocument();
+    expect(screen.getByText(defaultNotification.sendTo.bpn)).toBeInTheDocument();
   });
 
   it('should render username from sender', async () => {
     await renderReason();
-    expect(screen.getByText(defaultNotification.createdBy)).toBeInTheDocument();
+    expect(screen.getByText(defaultNotification.createdBy.bpn)).toBeInTheDocument();
   });
 });
diff --git a/frontend/src/app/modules/shared/components/notification-reason/notification-reason.component.ts b/frontend/src/app/modules/shared/components/notification-reason/notification-reason.component.ts
@@ -21,13 +21,13 @@
 
 import { Component, Input } from '@angular/core';
 import { CalendarDateModel } from '@core/model/calendar-date.model';
-import { Notification, NotificationStatus } from '@shared/model/notification.model';
+import { Notification, NotificationUser, NotificationStatus } from '@shared/model/notification.model';
 
 type TextMessageDirection = 'left' | 'right';
 interface TextMessage {
   reason: string;
   direction: TextMessageDirection;
-  user: string;
+  user: NotificationUser;
   status: NotificationStatus;
   date?: CalendarDateModel;
 }
diff --git a/frontend/src/app/modules/shared/components/notification-user/notification-user.component.html b/frontend/src/app/modules/shared/components/notification-user/notification-user.component.html
@@ -0,0 +1,23 @@
+<!--
+Copyright (c) 2022, 2023 Bayerische Motoren Werke Aktiengesellschaft (BMW AG)
+Copyright (c) 2022, 2023 ZF Friedrichshafen AG
+Copyright (c) 2022, 2023 Contributors to the Eclipse Foundation
+
+See the NOTICE file(s) distributed with this work for additional
+information regarding copyright ownership.
+
+This program and the accompanying materials are made available under the
+terms of the Apache License, Version 2.0 which is available at
+https://www.apache.org/licenses/LICENSE-2.0.
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+License for the specific language governing permissions and limitations
+under the License.
+
+SPDX-License-Identifier: Apache-2.0
+-->
+
+<strong style="font-weight: bold">{{ user.bpn }}</strong> <br />
+{{ user.name }}
diff --git a/frontend/src/app/modules/shared/components/notification-user/notification-user.component.spec.ts b/frontend/src/app/modules/shared/components/notification-user/notification-user.component.spec.ts
@@ -0,0 +1,50 @@
+/********************************************************************************
+ * Copyright (c) 2022, 2023 Bayerische Motoren Werke Aktiengesellschaft (BMW AG)
+ * Copyright (c) 2022, 2023 ZF Friedrichshafen AG
+ * Copyright (c) 2022, 2023 Contributors to the Eclipse Foundation
+ *
+ * See the NOTICE file(s) distributed with this work for additional
+ * information regarding copyright ownership.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Apache License, Version 2.0 which is available at
+ * https://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ ********************************************************************************/
+
+import { NotificationUser } from '@shared/model/notification.model';
+import { notificationTemplate } from '@shared/modules/notification/modal/modalTestHelper.spec';
+import { SharedModule } from '@shared/shared.module';
+import { screen } from '@testing-library/angular';
+import { renderComponent } from '@tests/test-render.utils';
+
+import { NotificationUserComponent } from './notification-user.component';
+
+describe('NotificationUserComponent', () => {
+  const defaultNotification = Object.assign({ ...notificationTemplate });
+  const renderUser = (user: NotificationUser = defaultNotification.createdBy) => {
+    return renderComponent(`<app-notification-user [user]='user'></app-notification-user>`, {
+      imports: [SharedModule],
+      componentProperties: { user: user },
+    });
+  };
+
+  it('should render user name and number from createdBy', async () => {
+    await renderUser();
+    expect(screen.getByText(defaultNotification.createdBy.name)).toBeInTheDocument();
+    expect(screen.getByText(defaultNotification.createdBy.bpn)).toBeInTheDocument();
+  });
+
+  it('should render user name and number from sendTo', async () => {
+    await renderUser(defaultNotification.sendTo);
+    expect(screen.getByText(defaultNotification.sendTo.name)).toBeInTheDocument();
+    expect(screen.getByText(defaultNotification.sendTo.bpn)).toBeInTheDocument();
+  });
+});
diff --git a/frontend/src/app/modules/shared/components/notification-user/notification-user.component.ts b/frontend/src/app/modules/shared/components/notification-user/notification-user.component.ts
@@ -0,0 +1,32 @@
+/********************************************************************************
+ * Copyright (c) 2022, 2023 Bayerische Motoren Werke Aktiengesellschaft (BMW AG)
+ * Copyright (c) 2022, 2023 ZF Friedrichshafen AG
+ * Copyright (c) 2022, 2023 Contributors to the Eclipse Foundation
+ *
+ * See the NOTICE file(s) distributed with this work for additional
+ * information regarding copyright ownership.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Apache License, Version 2.0 which is available at
+ * https://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ ********************************************************************************/
+
+import { Component, Input } from '@angular/core';
+import { NotificationUser } from '@shared/model/notification.model';
+
+@Component({
+  selector: 'app-notification-user',
+  templateUrl: './notification-user.component.html',
+})
+export class NotificationUserComponent {
+  @Input()
+  user: NotificationUser;
+}
diff --git a/frontend/src/app/modules/shared/model/notification.model.ts b/frontend/src/app/modules/shared/model/notification.model.ts
@@ -50,6 +50,11 @@ export interface NotificationReason {
   decline: string | null;
 }
 
+export interface NotificationUser {
+  bpn?: string;
+  name?: string;
+}
+
 export interface NotificationResponse {
   id: string;
   description: string;
@@ -58,7 +63,9 @@ export interface NotificationResponse {
 
   createdDate: string;
   createdBy: string;
+  createdByName?: string;
   sendTo: string;
+  sendToName?: string;
   reason: NotificationReason;
   assetIds: string[];
   channel: 'SENDER' | 'RECEIVER';
@@ -72,8 +79,8 @@ export interface Notification {
   severity: Severity | null;
 
   createdDate: CalendarDateModel;
-  createdBy: string;
-  sendTo: string;
+  createdBy: NotificationUser;
+  sendTo: NotificationUser;
   reason: NotificationReason;
   assetIds: string[];
   isFromSender: boolean;
diff --git a/frontend/src/app/modules/shared/modules/notification/modal/modalTestHelper.spec.ts b/frontend/src/app/modules/shared/modules/notification/modal/modalTestHelper.spec.ts
@@ -122,8 +122,8 @@ class CloseModalComponent implements AfterViewInit {
 export const notificationTemplate: Notification = {
   id: 'id-1',
   description: 'Investigation No 1',
-  createdBy: 'OEM A',
-  sendTo: 'OEM B',
+  createdBy: { name: 'OEM xxxxxxxxxxxxxxx A', bpn: 'BPN10000000OEM0A' },
+  sendTo: { name: 'OEM xxxxxxxxxxxxxxx B', bpn: 'BPN20000000OEM0B' },
   reason: { close: '', accept: '', decline: '' },
   isFromSender: false,
   assetIds: ['MOCK_part_1'],
diff --git a/frontend/src/app/modules/shared/modules/notification/notification-tab/notification-tab.component.html b/frontend/src/app/modules/shared/modules/notification/notification-tab/notification-tab.component.html
@@ -59,3 +59,9 @@
 <ng-template #targetDateTmp let-text="value">
   <p class="notification--table__description">{{ text | formatDate : { dateStyle: 'short', timeStyle: 'short' } }}</p>
 </ng-template>
+
+<ng-template #userTmp let-text="value">
+  <p class="notification--table__description">
+    <app-notification-user [user]="text"></app-notification-user>
+  </p>
+</ng-template>
diff --git a/frontend/src/app/modules/shared/modules/notification/notification-tab/notification-tab.component.ts b/frontend/src/app/modules/shared/modules/notification/notification-tab/notification-tab.component.ts
@@ -42,7 +42,7 @@ export class NotificationTabComponent implements AfterViewInit {
   @Input() hasPagination = true;
   @Input() translationContext: 'commonInvestigation' | 'pageAlerts';
   @Input() menuActionsConfig: MenuActionConfig<Notification>[];
-  @Input() optionalColumns: Array<'targetDate' | 'severity'> = [];
+  @Input() optionalColumns: Array<'targetDate' | 'severity' | 'createdBy' | 'sendTo'> = [];
 
   @Output() pagination = new EventEmitter<TablePaginationEventConfig>();
   @Output() selected = new EventEmitter<Notification>();
@@ -51,6 +51,7 @@ export class NotificationTabComponent implements AfterViewInit {
   @ViewChild('severityTmp') severityTemplate: TemplateRef<unknown>;
   @ViewChild('descriptionTmp') descriptionTemplate: TemplateRef<unknown>;
   @ViewChild('targetDateTmp') targetDateTemplate: TemplateRef<unknown>;
+  @ViewChild('userTmp') userTemplate: TemplateRef<unknown>;
 
   public tableConfig: TableConfig<keyof Notification>;
 
@@ -68,6 +69,8 @@ export class NotificationTabComponent implements AfterViewInit {
         severity: this.severityTemplate,
         description: this.descriptionTemplate,
         targetDate: this.targetDateTemplate,
+        createdBy: this.userTemplate,
+        sendTo: this.userTemplate,
       },
     };
   }
diff --git a/frontend/src/app/modules/shared/modules/notification/presentation/notification.component.html b/frontend/src/app/modules/shared/modules/notification/presentation/notification.component.html
@@ -37,7 +37,7 @@
       [labelId]="receivedTabLabelId"
       [translationContext]="'commonInvestigation'"
       [menuActionsConfig]="menuActionsConfig"
-      [optionalColumns]="optionalColumns"
+      [optionalColumns]="receivedOptionalColumns"
       (pagination)="onReceivedPagination.emit($event)"
       (selected)="selected.emit($event)"
     ></app-notifications-tab>
@@ -54,7 +54,7 @@
       [labelId]="queuedAndRequestedTabLabelId"
       [translationContext]="'commonInvestigation'"
       [menuActionsConfig]="menuActionsConfig"
-      [optionalColumns]="optionalColumns"
+      [optionalColumns]="queuedAndRequestedOptionalColumns"
       (pagination)="onQueuedAndRequestedPagination.emit($event)"
       (selected)="selected.emit($event)"
     ></app-notifications-tab>
diff --git a/frontend/src/app/modules/shared/modules/notification/presentation/notification.component.spec.ts b/frontend/src/app/modules/shared/modules/notification/presentation/notification.component.spec.ts
@@ -45,9 +45,11 @@ describe('NotificationsInboxComponent', () => {
     const isFromSender = data.channel === 'SENDER';
     const createdDate = new CalendarDateModel(data.createdDate);
     const targetDate = new CalendarDateModel(data.targetDate);
+    const createdBy = { bpn: data.createdBy, name: data.createdByName };
+    const sendTo = { bpn: data.createdBy, name: data.createdByName };
     delete data.channel;
 
-    return { ...data, createdDate, targetDate, isFromSender };
+    return { ...data, createdDate, targetDate, isFromSender, createdBy, sendTo };
   };
 
   const renderNotificationsInbox = () => {
diff --git a/frontend/src/app/modules/shared/modules/notification/presentation/notification.component.ts b/frontend/src/app/modules/shared/modules/notification/presentation/notification.component.ts
diff --git a/frontend/src/app/modules/shared/shared.module.ts b/frontend/src/app/modules/shared/shared.module.ts
