From b6a31a743acce5ac154eeefbe9689e8143af9ee5 Mon Sep 17 00:00:00 2001
From: ievavold <ievavold@wisc.edu>
Date: Wed, 5 Jun 2019 09:59:44 -0500
Subject: [PATCH] add error handling to metadata API call
---
.../dars/dars-view/dars-view.component.html | 20 ++++++++++---------
src/app/dars/store/actions.ts | 12 +++++++++++
src/app/dars/store/effects.ts | 15 +++++++++++---
src/app/dars/store/reducer.ts | 10 ++++++++++
src/app/dars/store/state.ts | 2 ++
5 files changed, 47 insertions(+), 12 deletions(-)
diff --git a/src/app/dars/dars-view/dars-view.component.html b/src/app/dars/dars-view/dars-view.component.html
index 8de331c..8f67efe 100644
--- a/src/app/dars/dars-view/dars-view.component.html
+++ b/src/app/dars/dars-view/dars-view.component.html
@@ -32,14 +32,16 @@
</div>
</div>
- <div *ngIf="(metadataStatus$ | async) == 'Loaded'; then loadedMetadata else loadingMetadata"></div>
-
- <ng-template #loadedMetadata>
- <cse-dars-metadata-table></cse-dars-metadata-table>
- </ng-template>
-
- <ng-template #loadingMetadata>
- <h2>loading metadata</h2>
- </ng-template>
+ <ng-container [ngSwitch]="metadataStatus$ | async">
+ <ng-container *ngSwitchCase="'Error'">
+ <h2 style="color:red">error loading metadata</h2>
+ </ng-container>
+ <ng-container *ngSwitchCase="'Loading'">
+ <h2>loading metadata</h2>
+ </ng-container>
+ <ng-container *ngSwitchCase="'Loaded'">
+ <cse-dars-metadata-table></cse-dars-metadata-table>
+ </ng-container>
+ </ng-container>
</div>
</mat-sidenav-container>
diff --git a/src/app/dars/store/actions.ts b/src/app/dars/store/actions.ts
index 2be78bf..6124756 100644
--- a/src/app/dars/store/actions.ts
+++ b/src/app/dars/store/actions.ts
@@ -3,17 +3,29 @@ import { AuditMetadata } from '../models/audit-metadata';
import { Audit } from '../models/audit';
export enum DarsActionTypes {
+ ErrorLoadingMetadata = '[DARS] Error Loading Metadata',
StartLoadingMetadata = '[DARS] Start Loading Metadata',
+ ErrorLoadingAudit = '[DARS] Error Loading Audit',
AddAuditMetadata = '[DARS] Add Audit Metadata',
StartLoadingAudit = '[DARS] Start Loading Audit',
DoneLoadingAudit = '[DARS] Done Loading Audit',
CloseAudit = '[DARS] Close Audit',
}
+export class ErrorLoadingMetadata implements Action {
+ public readonly type = DarsActionTypes.ErrorLoadingMetadata;
+ constructor(public payload: { message: string }) {}
+}
+
export class StartLoadingMetadata implements Action {
public readonly type = DarsActionTypes.StartLoadingMetadata;
}
+export class ErrorLoadingAudit implements Action {
+ public readonly type = DarsActionTypes.ErrorLoadingAudit;
+ constructor(public payload: { message: string }) {}
+}
+
export class AddAuditMetadata implements Action {
public readonly type = DarsActionTypes.AddAuditMetadata;
constructor(public payload: { metadata: AuditMetadata[] }) {}
diff --git a/src/app/dars/store/effects.ts b/src/app/dars/store/effects.ts
index 4c0a3aa..150fe2a 100644
--- a/src/app/dars/store/effects.ts
+++ b/src/app/dars/store/effects.ts
@@ -1,8 +1,10 @@
import { Injectable } from '@angular/core';
import { Actions, Effect, ofType } from '@ngrx/effects';
-import { DarsActionTypes, AddAuditMetadata } from '@app/dars/store/actions';
-import { flatMap, map } from 'rxjs/operators';
+import { DarsActionTypes } from '@app/dars/store/actions';
+import * as darsActions from '@app/dars/store/actions';
+import { flatMap, map, catchError } from 'rxjs/operators';
import { DarsApiService } from '../services/api.service';
+import { of } from 'rxjs';
@Injectable()
export class DARSEffects {
@@ -12,6 +14,13 @@ export class DARSEffects {
load$ = this.actions$.pipe(
ofType(DarsActionTypes.StartLoadingMetadata),
flatMap(() => this.api.getAudits()),
- map(metadata => new AddAuditMetadata({ metadata })),
+ map(metadata => new darsActions.AddAuditMetadata({ metadata })),
+ catchError(() => {
+ return of(
+ new darsActions.ErrorLoadingMetadata({
+ message: 'Unable to load audit metadata. Please try again',
+ }),
+ );
+ }),
);
}
diff --git a/src/app/dars/store/reducer.ts b/src/app/dars/store/reducer.ts
index 702d31a..bbb811d 100644
--- a/src/app/dars/store/reducer.ts
+++ b/src/app/dars/store/reducer.ts
@@ -3,6 +3,7 @@ import { DarsActionTypes } from './actions';
import * as darsActions from './actions';
type SupportedActions =
+ | darsActions.ErrorLoadingMetadata
| darsActions.AddAuditMetadata
| darsActions.StartLoadingAudit
| darsActions.DoneLoadingAudit
@@ -13,6 +14,15 @@ export function darsReducer(
action: SupportedActions,
): DARSState {
switch (action.type) {
+ case DarsActionTypes.ErrorLoadingMetadata: {
+ return {
+ ...state,
+ metadata: {
+ status: 'Error',
+ message: action.payload.message,
+ },
+ };
+ }
case DarsActionTypes.AddAuditMetadata: {
if (state.metadata.status === 'Loaded') {
return {
diff --git a/src/app/dars/store/state.ts b/src/app/dars/store/state.ts
index 7a1632e..8986599 100644
--- a/src/app/dars/store/state.ts
+++ b/src/app/dars/store/state.ts
@@ -3,9 +3,11 @@ import { Audit } from '../models/audit';
export interface DARSState {
metadata:
+ | { status: 'Error'; message: string }
| { status: 'Loading' }
| { status: 'Loaded'; metadata: AuditMetadata[] };
visibleAudit:
+ | { status: 'Error'; message: string }
| { status: 'NotLoaded' }
| { status: 'Loading'; metadata: AuditMetadata }
| { status: 'Loaded'; metadata: AuditMetadata; audit: Audit };
--
GitLab