Handle empty response when status 204

apps/mina-sidor-fa/src/app/pages/exports/pages/deltagare-export/deltagare-export.component.html

@@ -53,6 +53,14 @@
             <p>Kunde inte hämta exportfilen för deltagare. Ladda om sidan och försök igen.</p>
             <p class="msfa__small-text" *ngIf="error.message">{{error.message}}</p>
           </digi-notification-alert>
+          <digi-notification-alert
+            *ngIf="exportIsEmpty$ | async"
+            class="deltagare-export__alert"
+            af-variation="warning"
+            af-heading="Ingenting att exportera"
+          >
+            <p>Det finns inga deltagare att exportera. Försök att ändra filtreringen och försök igen.</p>
+          </digi-notification-alert>
           <div class="deltagare-export__cta-wrapper">
             <digi-button af-type="submit" af-size="m">Exportera deltagare</digi-button>
           </div>

apps/mina-sidor-fa/src/app/pages/exports/pages/deltagare-export/deltagare-export.component.ts

@@ -2,6 +2,7 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { FormControl, FormGroup } from '@angular/forms';
 import { DeltagareExportRequest } from '@msfa-models/api/deltagare-export.request.model';
 import { CustomError } from '@msfa-models/error/custom-error';
+import { Export } from '@msfa-models/export.model';
 import { formatDate } from '@msfa-shared/utils/format-to-date.util';
 import { saveAs } from 'file-saver';
 import { BehaviorSubject } from 'rxjs';
@@ -21,6 +22,7 @@ export class DeltagareExportComponent {
   shouldValidate$ = new BehaviorSubject<boolean>(false);
   fetchIsLoading$ = new BehaviorSubject<boolean>(false);
   fetchError$ = new BehaviorSubject<CustomError>(null);
+  exportIsEmpty$ = new BehaviorSubject<boolean>(false);
   formGroup = new FormGroup(
     {
       startDate: new FormControl(null),
@@ -30,7 +32,11 @@ export class DeltagareExportComponent {
     },
     [DeltagareExportValidator.isDeltagareExportValid()]
   );
-  constructor(private deltagareExportService: DeltagareExportService) {}
+  constructor(private deltagareExportService: DeltagareExportService) {
+    this.formGroup.valueChanges.subscribe(() => {
+      this._removeAlerts();
+    });
+  }
 
   get startDateFormControl(): FormControl {
     return this.formGroup.get('startDate') as FormControl;
@@ -57,8 +63,13 @@ export class DeltagareExportComponent {
     return this.formErrors?.datesMismatch && this.shouldValidate$.getValue();
   }
 
-  fetchExportFile(): void {
+  private _removeAlerts(): void {
     this.fetchError$.next(null);
+    this.exportIsEmpty$.next(false);
+  }
+
+  fetchExportFile(): void {
+    this._removeAlerts();
     if (this.formGroup.invalid) {
       this.shouldValidate$.next(true);
       return;
@@ -69,12 +80,15 @@ export class DeltagareExportComponent {
       .fetchExportFile$(this._formDataToRequestData)
       .pipe(take(1))
       .subscribe({
-        next: response => {
+        next: ({ empty, blob }: Export) => {
+          if (empty) {
+            this.exportIsEmpty$.next(true);
+          } else {
             const isExcel = this._formDataToRequestData.exportToExcel;
-          const blob = new Blob([response], { type: this._getFileType(isExcel) });
             saveAs(blob, this._getFileName(isExcel));
-          this.fetchIsLoading$.next(false);
             this.formGroup.reset();
+          }
+          this.fetchIsLoading$.next(false);
         },
         error: (customError: CustomError) => {
           this.fetchError$.next({ ...customError, message: customError.error.message });

apps/mina-sidor-fa/src/app/pages/exports/pages/deltagare-export/deltagare-export.service.ts

@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import { DeltagareExportRequest } from '@msfa-models/api/deltagare-export.request.model';
+import { Export } from '@msfa-models/export.model';
 import { ExportApiService } from '@msfa-services/api/export.api.service';
 import { Observable } from 'rxjs';
 
@@ -7,7 +8,7 @@ import { Observable } from 'rxjs';
 export class DeltagareExportService {
   constructor(private exportApiService: ExportApiService) {}
 
-  public fetchExportFile$(requestData: DeltagareExportRequest): Observable<Blob> {
+  public fetchExportFile$(requestData: DeltagareExportRequest): Observable<Export> {
     return this.exportApiService.fetchDeltagareExportFile$(requestData);
   }
 }

apps/mina-sidor-fa/src/app/shared/models/export.model.ts

@@ -0,0 +1,4 @@
+export interface Export {
+  blob?: Blob;
+  empty: boolean;
+}

apps/mina-sidor-fa/src/app/shared/services/api/export.api.service.ts

@@ -1,12 +1,13 @@
-import { HttpClient } from '@angular/common/http';
+import { HttpClient, HttpResponse } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Params } from '@angular/router';
 import { ErrorType } from '@msfa-enums/error-type.enum';
 import { environment } from '@msfa-environment';
 import { DeltagareExportRequest } from '@msfa-models/api/deltagare-export.request.model';
 import { CustomError } from '@msfa-models/error/custom-error';
+import { Export } from '@msfa-models/export.model';
 import { Observable } from 'rxjs';
-import { catchError } from 'rxjs/operators';
+import { catchError, map } from 'rxjs/operators';
 
 @Injectable({
   providedIn: 'root',
@@ -16,15 +17,22 @@ export class ExportApiService {
 
   constructor(private httpClient: HttpClient) {}
 
-  public fetchDeltagareExportFile$(requestData: DeltagareExportRequest): Observable<Blob> {
+  public fetchDeltagareExportFile$(requestData: DeltagareExportRequest): Observable<Export> {
     const params: Params = {
       ...requestData,
       includeExportedDeltagare: requestData.includeExportedDeltagare.toString(),
     };
 
     return this.httpClient
-      .get<Blob>(`${this._apiBaseUrl}/deltagare`, { params, responseType: 'blob' as 'json' })
+      .get(`${this._apiBaseUrl}/deltagare`, {
+        params,
+        observe: 'response',
+        responseType: 'blob' as 'json',
+      })
       .pipe(
+        map((response: HttpResponse<Blob>) => {
+          return response.status === 204 ? { empty: true } : { empty: false, blob: response.body };
+        }),
         catchError((error: Error) => {
           throw new CustomError({
             error,