ToCsvService to escape the fields during exportCsv.

Auth Interceptor to check for logged out user.

overlord/src/app/closing-stock/closing-stock.component.ts

@@ -5,6 +5,7 @@ import {ClosingStock} from './closing-stock';
 import {ActivatedRoute, Router} from '@angular/router';
 import * as moment from 'moment';
 import {FormBuilder, FormGroup} from '@angular/forms';
+import {ToCsvService} from '../shared/to-csv.service';
 
 @Component({
   selector: 'app-closing-stock',
@@ -20,7 +21,7 @@ export class ClosingStockComponent implements OnInit {
   /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
   displayedColumns = ['product', 'group', 'quantity', 'amount'];
 
-  constructor(private route: ActivatedRoute, private router: Router, private fb: FormBuilder) {
+  constructor(private route: ActivatedRoute, private router: Router, private fb: FormBuilder, private toCsv: ToCsvService) {
     this.createForm();
   }
 
@@ -53,13 +54,16 @@ export class ClosingStockComponent implements OnInit {
       date: moment(formModel.date).format('DD-MMM-YYYY')
     };
   }
-  exportCsv() {
-    const data: string[] = ['Product, Group, Quantity, Amount'];
-    data.push(
-      ...this.dataSource.data.map(x => '' + x.product + ', ' + x.group + ', ' + x.quantity + ', ' + x.amount)
-    );
 
-    const csvData = new Blob([data.join('\n')], {type: 'text/csv;charset=utf-8;'});
+  exportCsv() {
+    const headers = {
+      Product: 'product',
+      Group: 'group',
+      Quantity: 'quantity',
+      Amount: 'amount'
+    };
+
+    const csvData = new Blob([this.toCsv.toCsv(headers, this.dataSource.data)], {type: 'text/csv;charset=utf-8;'});
     const link = document.createElement('a');
     link.href = window.URL.createObjectURL(csvData);
     link.setAttribute('download', 'closing-stock.csv');