argoproj#75: Filter dropdown at Timeline page (argoproj#76)

* Changing the filter value without re-assignment

* Issue argoproj#40: Added fallback values for form in multiple-service-launch-panel

* Issue argoproj#40: Added the template index for fallback val and changed the prop name to 'revision'

* Issue argoproj#40: Passed in the template itself to provide the fallback val

* axinternal/prod argoproj#444: Content of the filter is changed instead of reassigned upon tab-change

* Removed comments

* Removed white space

* Issue argoproj#75: Changed the name of function and cleared the data array by changing the length to 0

saas/axops/src/ui/src/app/views/+timeline/timeline/timeline.component.ts

@@ -49,8 +49,8 @@ export class TimelineComponent implements HasLayoutSettings, LayoutSettings, OnI
             this.jobFilter = new JobFilter();
             this.layoutDateRange.isAllDates = this.currentView !== 'overview';
 
-            this.toolbarFilters.data = this.getFiltersByView(this.currentView);
 
+            this.updateFiltersByView(this.currentView);
             this.toolbarFilters.model = [];
 
             if (this.showMyOnly ) {
@@ -143,7 +143,7 @@ export class TimelineComponent implements HasLayoutSettings, LayoutSettings, OnI
     };
 
     public toolbarFilters = {
-        data: undefined,
+        data: [],
         model: [],
         onChange: (data) => {
             for (let status of Object.keys(this.jobFilter)) {
@@ -155,7 +155,7 @@ export class TimelineComponent implements HasLayoutSettings, LayoutSettings, OnI
     };
 
     public changeView(view: string) {
-        this.toolbarFilters.data = this.getFiltersByView(view);
+        this.toolbarFilters.data = [];
         this.router.navigate(['/app/timeline', this.getRouteParams({ view })]);
     }
 
@@ -193,12 +193,12 @@ export class TimelineComponent implements HasLayoutSettings, LayoutSettings, OnI
         return ViewUtils.sanitizeRouteParams(params, updatedParams);
     }
 
-    private getFiltersByView(view) {
+    private updateFiltersByView(view) {
         this.currentView = view;
-        let filters = [];
+        this.toolbarFilters.data.length = 0;
 
         if (view !== 'overview') {
-            filters.push({
+            this.toolbarFilters.data.push({
                 value: 'showMyOnly',
                 name: 'My ' + this.currentViewTitle,
                 hasSeparator: true,
@@ -207,7 +207,7 @@ export class TimelineComponent implements HasLayoutSettings, LayoutSettings, OnI
         }
 
         if (view === 'job' || view === 'overview') {
-            filters.push({
+            this.toolbarFilters.data.push({
                 value: 'failed',
                 name: 'Failed',
                 icon: { color: 'fail' },
@@ -218,7 +218,7 @@ export class TimelineComponent implements HasLayoutSettings, LayoutSettings, OnI
             });
         }
         if (view === 'job') {
-            filters.push({
+            this.toolbarFilters.data.push({
                 value: 'running',
                 name: 'In-Progress',
                 icon: { color: 'running' },
@@ -228,8 +228,6 @@ export class TimelineComponent implements HasLayoutSettings, LayoutSettings, OnI
                 icon: { color: 'queued' },
             });
         }
-
-        return filters;
     }
 
     private getCategoryByView(view): string {