Audit error message

src/app/dars/audit/audit.component.html

 <mat-card id="audit" *ngIf="audit">
   <header id="audit-header" class="no-horizontal-padding">
+    <div class="error-message" *ngIf="audit.errorText.length">
+      <mat-icon color="warn">error</mat-icon>
+      <div>
+        <div *ngFor="let error of audit.errorText">{{ error }}</div>
+      </div>
+    </div>
     <div class="audit-metadata">
       <div>
         <p>{{audit.header.preparedLabel}}: {{audit.header.preparedDate}}</p>
@@ -27,7 +33,7 @@
   </header>
 
   <section class="audit-section" class="audit-top-section">
-    <div *ngIf="audit.topSection.academicPlansSection && audit.topSection.academicPlansSection.planList.length > 0">
+    <div *ngIf="audit.topSection.academicPlansSection && audit.topSection.academicPlansSection.planList">
       <h2>Academic Plans:</h2>
       <ng-contrainer *ngFor="let plan of audit.topSection.academicPlansSection.planList">
         <p class="audit-academic-plan">{{plan.planTypeLabel}}: {{plan.declareDate}} {{plan.planCodeNumber}} {{plan.planCodeDescription}}</p>
@@ -42,7 +48,7 @@
       </ng-container>
     </div>
 
-    <div *ngIf="audit.topSection.degreesSection && audit.topSection.degreesSection.degrees.length > 0">
+    <div *ngIf="audit.topSection.degreesSection && audit.topSection.degreesSection.degrees">
       <h2>{{audit.topSection.degreesSection.label}}:</h2>
       <div *ngFor="let degree of audit.topSection.degreesSection.degrees" class="audit-degree">
         <p class="audit-degree-awarded">Awarded: {{degree.awardedDate}}</p>
@@ -53,7 +59,7 @@
 
   <section class="audit-section audit-credit-tables">
     <!-- TODO Figure out how to get this to look like a matTable -->
-    <div class="hs-units" *ngIf="audit.topSection.highSchoolUnitsSection?.units.length > 0">
+    <div class="hs-units" *ngIf="audit.topSection.highSchoolUnitsSection?.units">
       <table mat-table [dataSource]="formatHighSchoolUnitData(audit.topSection.highSchoolUnitsSection.units)">
         <caption>HS Units</caption>
 

src/app/dars/audit/audit.component.scss

@@ -11,6 +11,15 @@ $black: #000000;
       font-weight: 500;
       font-size: 1.2rem;
     }
+    .error-message {
+      display: flex;
+      justify-content: center;
+      mat-icon {
+        margin-top: auto;
+        margin-bottom: auto;
+        margin-right: 20px;
+      }
+    }
   }
   .material-icons {
     line-height: 0.5;

src/app/dars/metadata-table/metadata-table.component.html

@@ -52,7 +52,7 @@
     <ng-container matColumnDef="status">
       <th mat-header-cell *matHeaderCellDef scope="col">Status</th>
       <td mat-cell *matCellDef="let audit">
-        <div *ngIf="audit.darsStatusOfDegreeAuditRequest == 'Done' || audit.darsStatusOfDegreeAuditRequest.indexOf('Failed') > -1; else loading">
+        <div *ngIf="audit.darsStatusOfDegreeAuditRequest == 'Done' || audit.darsStatusOfDegreeAuditRequest === 'Error'; else loading">
           <div *ngIf="audit.darsStatusOfDegreeAuditRequest == 'Done'">Ready</div>
           <div *ngIf="audit.darsStatusOfDegreeAuditRequest != 'Done'">{{audit.darsStatusOfDegreeAuditRequest}}</div>
           <div>Ran {{audit.darsAuditRunDate | date:'short'}}</div>