Add preset views

src/app/core/models/milestone.model.ts

@@ -5,10 +5,12 @@ export class Milestone {
   static DefaultMilestone: Milestone = new Milestone({ title: 'Without a milestone', state: null });
   title: string;
   state: string;
+  deadline?: Date;
 
-  constructor(milestone: { title: string; state: string }) {
+  constructor(milestone: { title: string; state: string; due_on?: string }) {
     this.title = milestone.title;
     this.state = milestone.state;
+    this.deadline = milestone.due_on ? new Date(milestone.due_on) : undefined;
   }
 
   public equals(milestone: Milestone) {

src/app/core/services/filters.service.ts

@@ -3,6 +3,7 @@ import { Sort } from '@angular/material/sort';
 import { BehaviorSubject, pipe } from 'rxjs';
 import { SimpleLabel } from '../models/label.model';
 import { Milestone } from '../models/milestone.model';
+import { MilestoneService } from './milestone.service';
 
 export type Filter = {
   title: string;
@@ -34,13 +35,47 @@ export const DEFAULT_FILTER: Filter = {
  * Filters are subscribed to and emitted from this service
  */
 export class FiltersService {
+  readonly presetViews: {
+    [key: string]: () => Filter;
+  } = {
+    currentlyActive: () => ({
+      title: '',
+      status: ['open pullrequest', 'merged pullrequest', 'open issue', 'closed issue'],
+      type: 'all',
+      sort: { active: 'status', direction: 'asc' },
+      labels: [],
+      milestones: this.getMilestonesForCurrentlyActive().map((milestone) => milestone.title),
+      hiddenLabels: new Set<string>(),
+      deselectedLabels: new Set<string>()
+    }),
+    contributions: () => ({
+      title: '',
+      status: ['open pullrequest', 'merged pullrequest', 'open issue', 'closed issue'],
+      type: 'all',
+      sort: { active: 'id', direction: 'desc' },
+      labels: [],
+      milestones: this.milestoneService.milestones.map((milestone) => milestone.title),
+      hiddenLabels: new Set<string>(),
+      deselectedLabels: new Set<string>()
+    }),
+    custom: () => this.filter$.value
+  };
+
+  // List of keys in the new filter change that causes current filter to not qualify to be a preset view.
+  readonly presetChangingKeys = new Set<string>(['status', 'type', 'milestones']);
+
   public filter$ = new BehaviorSubject<Filter>(DEFAULT_FILTER);
+  // Either 'currentlyActive', 'contributions', or 'custom'.
+  public presetView$ = new BehaviorSubject<String>('custom');
 
   // Helps in determining whether all milestones were selected from previous repo during sanitization of milestones
   private previousMilestonesLength = 0;
 
+  constructor(private milestoneService: MilestoneService) {}
+
   clearFilters(): void {
     this.filter$.next(DEFAULT_FILTER);
+    this.presetView$.next('custom');
     this.previousMilestonesLength = 0;
   }
 
@@ -50,6 +85,25 @@ export class FiltersService {
       ...newFilters
     };
     this.filter$.next(nextDropdownFilter);
+    this.updatePresetViewFromFilters(newFilters);
+  }
+
+  private updatePresetViewFromFilters(newFilter: Partial<Filter>): void {
+    for (const key of Object.keys(newFilter)) {
+      if (this.presetChangingKeys.has(key)) {
+        this.presetView$.next('custom');
+        return;
+      }
+    }
+  }
+
+  /**
+   * Updates the filter based on a preset view.
+   * @param presetViewName The name of the preset view, either 'currentlyActive', 'contributions', or 'custom'.
+   */
+  updatePresetView(presetViewName: string) {
+    this.filter$.next(this.presetViews[presetViewName]());
+    this.presetView$.next(presetViewName);
   }
 
   sanitizeLabels(allLabels: SimpleLabel[]) {
@@ -99,4 +153,18 @@ export class FiltersService {
     this.updateFilters({ milestones: newMilestones });
     this.previousMilestonesLength = allMilestones.length;
   }
+
+  getMilestonesForCurrentlyActive(): Milestone[] {
+    const earliestOpenMilestone = this.milestoneService.getEarliestOpenMilestone();
+    if (earliestOpenMilestone) {
+      return [earliestOpenMilestone];
+    }
+
+    const latestClosedMilestone = this.milestoneService.getLatestClosedMilestone();
+    if (latestClosedMilestone) {
+      return [latestClosedMilestone];
+    }
+
+    return this.milestoneService.milestones;
+  }
 }

src/app/core/services/milestone.service.ts

@@ -47,4 +47,42 @@ export class MilestoneService {
     milestoneData.push(Milestone.DefaultMilestone);
     return milestoneData;
   }
+
+  /**
+   * Gets the open milestone with the earliest deadline.
+   * Returns null if there is no open milestone with deadline.
+   */
+  getEarliestOpenMilestone(): Milestone {
+    let earliestOpenMilestone: Milestone = null;
+    for (const milestone of this.milestones) {
+      if (!milestone.deadline || milestone.state !== 'open') {
+        continue;
+      }
+      if (earliestOpenMilestone === null) {
+        earliestOpenMilestone = milestone;
+      } else if (milestone.deadline < earliestOpenMilestone.deadline) {
+        earliestOpenMilestone = milestone;
+      }
+    }
+    return earliestOpenMilestone;
+  }
+
+  /**
+   * Gets the closed milestone with the latest deadline.
+   * Returns null if there is no closed milestone with deadline.
+   */
+  getLatestClosedMilestone(): Milestone {
+    let latestClosedMilestone: Milestone = null;
+    for (const milestone of this.milestones) {
+      if (!milestone.deadline || milestone.state !== 'closed') {
+        continue;
+      }
+      if (latestClosedMilestone === null) {
+        latestClosedMilestone = milestone;
+      } else if (milestone.deadline > latestClosedMilestone.deadline) {
+        latestClosedMilestone = milestone;
+      }
+    }
+    return latestClosedMilestone;
+  }
 }

src/app/shared/layout/header.component.html

@@ -12,10 +12,10 @@
     >WATcher v{{ this.getVersion() }}</a
   >
   <span id="view-descriptor" *ngIf="auth.isAuthenticated()" style="margin-left: 10px">
-    ({{ this.getViewDescription(viewService.currentView) }})
+    ({{ this.presetViews[this.filtersService.presetView$.value] }})
   </span>
 
-  <div *ngIf="auth.isAuthenticated() && this.viewService.sessionData.sessionRepo.length > 1">
+  <!--div *ngIf="auth.isAuthenticated() && this.viewService.sessionData.sessionRepo.length > 1">
     <button mat-button [matMenuTriggerFor]="menu"><mat-icon style="color: white">expand_more</mat-icon></button>
     <mat-menu #menu="matMenu">
       <button
@@ -31,6 +31,25 @@
         </span>
       </button>
     </mat-menu>
+  </div-->
+
+  <div *ngIf="auth.isAuthenticated()">
+    <button mat-button [matMenuTriggerFor]="menu"><mat-icon style="color: white">expand_more</mat-icon></button>
+    <mat-menu #menu="matMenu">
+      <button
+        mat-menu-item
+        *ngFor="let presetView of this.presetViews | keyvalue"
+        (click)="this.filtersService.updatePresetView(presetView.key)"
+      >
+        <span>
+          <mat-icon
+            [ngStyle]="{ color: 'green', visibility: this.filtersService.presetView$.value === presetView.key ? 'visible' : 'hidden' }"
+            >done</mat-icon
+          >
+          {{ presetView.value }}
+        </span>
+      </button>
+    </mat-menu>
   </div>
 
   <!-- everything else -->

src/app/shared/layout/header.component.ts

@@ -43,6 +43,14 @@ export class HeaderComponent implements OnInit {
   private readonly yesButtonDialogMessage = 'Yes, I wish to log out';
   private readonly noButtonDialogMessage = "No, I don't wish to log out";
 
+  readonly presetViews: {
+    [key: string]: string;
+  } = {
+    currentlyActive: 'Currently active',
+    contributions: 'Contributions',
+    custom: 'Custom'
+  };
+
   /** Model for the displayed repository name */
   currentRepo = '';