Show file names in header

src/app/app.component.html

@@ -3,6 +3,10 @@
     <img class="mr-3" src="assets/logo.png" height="36px" width="auto">
     <span>ETF Demo</span>
     <span class="mx-auto"><!-- Spacer --></span>
+    <mat-chip-list class="mr-2">
+        <mat-chip *ngFor="let file of files" color="primary">{{file}}</mat-chip>
+    </mat-chip-list>
+
     <button mat-button (click)="fileUploader.click()">
         <mat-icon>add</mat-icon>
         Upload

src/app/app.component.ts

@@ -6,7 +6,8 @@ import {Component} from '@angular/core';
 })
 export class AppComponent {
     chartResults; // This is where the chart reads the data from
-    chartHeight = '100%';
+    chartHeight = '100%'; // Dynamic height for chart
+    files: string[] = [];
 
     // ngx-charts requires a different data structure than the hash map we built so I will use a setter to handle converting it when we go to save the processed data.
     private _data;
@@ -23,6 +24,8 @@ export class AppComponent {
         // Because we enabled uploading multiple files at once we need to process each one individually
         const files: File[] = Array.from(fileList);
         files.forEach(file => {
+            this.files.push(file.name);
+
             // Process CSV
             const reader = new FileReader();
             reader.onload = (e: ProgressEvent) => {

src/app/app.module.ts

@@ -1,7 +1,7 @@
 import {BrowserModule} from '@angular/platform-browser';
 import {NgModule} from '@angular/core';
 import {AppComponent} from './app.component';
-import {MatButtonModule, MatIconModule, MatToolbarModule} from '@angular/material';
+import {MatButtonModule, MatChipsModule, MatIconModule, MatToolbarModule} from '@angular/material';
 import {NgxChartsModule} from '@swimlane/ngx-charts';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
 
@@ -13,6 +13,7 @@ import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
         BrowserAnimationsModule,
         BrowserModule,
         MatButtonModule,
+        MatChipsModule,
         MatIconModule,
         MatToolbarModule,
         NgxChartsModule,