Dashboard: Add export endpoint to API

Also create a utility download function that downloads the CSV file as a blob.
City-of-Helsinki · May 24, 2022 · 61c14fc · 61c14fc
1 parent 416fdcc
commit 61c14fc
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 2 deletions.
diff --git a/dashboard/src/api/index.ts b/dashboard/src/api/index.ts
@@ -2,7 +2,8 @@ import * as axios from 'axios';
 import { Moment } from 'moment';
 
 import AuthManager from './auth-manager';
-import { ParkingList, RegionList, RegionStatsList } from './types';
+import { download } from './utils';
+import { ExportFilters, ParkingList, RegionList, RegionStatsList, OperatorList, PaymentZoneList } from './types';
 
 interface SuccessCallback<T> {
     (response: axios.AxiosResponse<T>): void;
@@ -20,6 +21,9 @@ export class Api {
         regions: '/monitoring/v1/region/',
         regionStats: '/monitoring/v1/region_statistics/',
         validParkings: '/monitoring/v1/valid_parking/',
+        exportDownload: '/monitoring/v1/export/download/',
+        operators: '/enforcement/v1/operator/',
+        paymentZones: '/operator/v1/payment_zone/',
     };
 
     public auth: AuthManager;
@@ -62,9 +66,37 @@ export class Api {
                             callback, errorHandler);
     }
 
+    downloadCSV(
+        filters: ExportFilters,
+        callback: SuccessCallback<string>,
+        errorHandler: ErrorHandler,
+    ) : void {
+        this.axios.post(this.endpoints.exportDownload, filters)
+            .then((response) => {
+                callback(response);
+                const fileName = response.headers["x-suggested-filename"]
+                download(response.data, fileName);
+            })
+            .catch(errorHandler);
+    }
+
+    fetchOperators(
+        callback: SuccessCallback<OperatorList>,
+        errorHandler: ErrorHandler
+    ) {
+        this._fetchAllPages(this.endpoints.operators, callback, errorHandler);
+    }
+
+    fetchPaymentZones(
+        callback: SuccessCallback<PaymentZoneList>,
+        errorHandler: ErrorHandler
+    ) {
+        this._fetchAllPages(this.endpoints.paymentZones, callback, errorHandler);
+    }
+
     private _fetchAllPages(
         url: string,
-        callback: SuccessCallback<RegionList> | SuccessCallback<ParkingList> | SuccessCallback<RegionStatsList>,
+        callback: SuccessCallback<RegionList> | SuccessCallback<ParkingList> | SuccessCallback<RegionStatsList> | SuccessCallback<OperatorList> | SuccessCallback<PaymentZoneList>,
         errorHandler: ErrorHandler
     ) {
         this.axios.get(url)

diff --git a/dashboard/src/api/utils.ts b/dashboard/src/api/utils.ts
@@ -0,0 +1,16 @@
+export function download(data: string, fileName: string): void {
+    const blob: Blob = new Blob([data], { type: 'text/csv' });
+    const blobURL: string = window.URL.createObjectURL(blob)
+
+    const downloadLink: HTMLAnchorElement = document.createElement('a');
+    downloadLink.style.display = 'none';
+    downloadLink.href = blobURL;
+    downloadLink.setAttribute('download', fileName);
+
+    document.body.appendChild(downloadLink);
+    downloadLink.click();
+    setTimeout(function() {
+        document.body.removeChild(downloadLink);
+        window.URL.revokeObjectURL(blobURL);
+    }, 200)
+}