#936 Fix colors of warnings and errors

mild-blue · Jul 20, 2022 · 8f57bc9 · 8f57bc9
1 parent 04aa284
commit 8f57bc9
Show file tree

Hide file tree

Showing 6 changed files with 18 additions and 12 deletions.
diff --git a/txmatching/web/frontend/package.json b/txmatching/web/frontend/package.json
@@ -7,7 +7,7 @@
     "build": "ng build",
     "build-prod": "ng build --configuration production",
     "test": "ng test",
-    "lint": "eslint -c .eslintrc.js --ext .ts src",
+    "lint": "eslint -c .eslintrc.json --ext .ts src",
     "e2e": "ng e2e"
   },
   "private": true,

diff --git a/...ents/parsing-issue-confirmation-warning/parsing-issue-confirmation-warning.component.html b/...ents/parsing-issue-confirmation-warning/parsing-issue-confirmation-warning.component.html
@@ -1,5 +1,5 @@
-<div class="warning-card" [ngClass]="data.confirmedBy === null ? 'warning-card-unconfirmed' : 'warning-card-confirmed'" *ngIf="data">
-  <div class="warning-card-unconfirmed-content" *ngIf="data.confirmedBy === null">
+<div class="warning-card" [ngClass]="data.confirmedBy === undefined ? 'warning-card-unconfirmed' : 'warning-card-confirmed'" *ngIf="data">
+  <div class="warning-card-unconfirmed-content" *ngIf="data.confirmedBy === undefined">
     <div class="warning-card-unconfirmed-heading">
       <mat-icon [inline]="true" [matTooltip]="warningType">{{warningType}}</mat-icon>
       <h2>Unconfirmed warning</h2>
@@ -8,15 +8,15 @@ <h2>Unconfirmed warning</h2>
       <p>{{data.hlaCodeOrGroup}}: {{data.message}}</p>
     </div>
   </div>
-  <div class="warning-card-confirmed-body" *ngIf="data.confirmedBy !== null">
+  <div class="warning-card-confirmed-body" *ngIf="data.confirmedBy !== undefined">
     <mat-icon [inline]="true" [matTooltip]="warningType">{{warningType}}</mat-icon>
     <p>{{data.hlaCodeOrGroup}}: {{data.message}}</p>
   </div>
   <div class="button-wrapper">
-    <app-button variant="confirm" [disabled]="loading" [success]="!loading && success" *ngIf="data.confirmedBy === null" (click)="confirmAction(true)">
+    <app-button variant="confirm" [disabled]="loading" [success]="!loading && success" *ngIf="data.confirmedBy === undefined" (click)="confirmAction(true)">
       <mat-icon>done</mat-icon>
     </app-button>
-    <app-button variant="unconfirm" [disabled]="loading" [success]="!loading && success" *ngIf="data.confirmedBy !== null" (click)="confirmAction(false)">
+    <app-button variant="unconfirm" [disabled]="loading" [success]="!loading && success" *ngIf="data.confirmedBy !== undefined" (click)="confirmAction(false)">
       <mat-icon>undo</mat-icon>
     </app-button>
   </div>

diff --git a/...ntend/src/app/components/patient-recipient-detail/patient-recipient-detail.component.html b/...ntend/src/app/components/patient-recipient-detail/patient-recipient-detail.component.html
@@ -1,8 +1,14 @@
 <div *ngIf="item" class="detail-recipient">
   <ng-container *ngIf="item.allMessages">
-    <app-parsing-issue-confirmation *ngFor="let data of item.allMessages | keyvalue" [data]="data.value" 
-                                                                                 [warningType]="data.key" 
-                                                                                 [defaultTxmEvent]="defaultTxmEvent"></app-parsing-issue-confirmation>
+    <app-parsing-issue-confirmation [data]="item.allMessages.error"
+                                    warningType="error"
+                                    [defaultTxmEvent]="defaultTxmEvent"></app-parsing-issue-confirmation>
+    <app-parsing-issue-confirmation [data]="item.allMessages.warning"
+                                    warningType="warning"
+                                    [defaultTxmEvent]="defaultTxmEvent"></app-parsing-issue-confirmation>
+    <app-parsing-issue-confirmation [data]="item.allMessages.info"
+                                    warningType="info"
+                                    [defaultTxmEvent]="defaultTxmEvent"></app-parsing-issue-confirmation>
   </ng-container>
 
   <div class="detail__header">

diff --git a/...tching/web/frontend/src/app/components/recipient-settings/recipient-settings.component.ts b/...tching/web/frontend/src/app/components/recipient-settings/recipient-settings.component.ts
@@ -4,7 +4,7 @@ import { BloodGroup } from '@app/model';
 import { NgModel } from '@angular/forms';
 import { formatNumberForPatient, formatYearOfBirthForPatient } from '@app/directives/validators/form.directive';
 
-// TODO improve code: change functions to arrow functions, don't use null values, 
+// TODO improve code: change functions to arrow functions, don't use null values,
 // use correct types for variables instead of "any"
 @Component({
   selector: 'app-recipient-settings',

diff --git a/...web/frontend/src/app/components/warning-overview/warning-pill/warning-pill.component.html b/...web/frontend/src/app/components/warning-overview/warning-pill/warning-pill.component.html
@@ -1,4 +1,4 @@
-<div *ngIf="count" class="warning-pill" [ngClass]="allWarningsConfirmed ? 'all-warnings-confirmed' : warningType">
+<div *ngIf="count" class="warning-pill" [ngClass]="(allWarningsConfirmed && warningType === 'warning') ? 'all-warnings-confirmed' : warningType">
   <mat-icon [inline]="true" [matTooltip]="tooltip || warningType">{{warningType}}</mat-icon>
   <p *ngIf="count">{{count}}</p>
 </div>

diff --git a/txmatching/web/frontend/src/app/parsers/parsingIssueConfirmation.parsers.ts b/txmatching/web/frontend/src/app/parsers/parsingIssueConfirmation.parsers.ts
@@ -4,7 +4,7 @@ import { ParsingIssueConfirmation } from '../model';
 export const parseParsingIssueConfirmation = (data: ParsingIssueConfirmationGenerated): ParsingIssueConfirmation => {
   return {
     confirmedAt: data.confirmed_at,
-    confirmedBy: data.confirmed_by,
+    confirmedBy: (data.confirmed_by) ? data.confirmed_by : undefined,
     dbId: data.db_id,
     donorId: data.donor_id,
     hlaCodeOrGroup: data.hla_code_or_group,