From 6cbf1f29f15f803d49c74c7e6ebea28c98254c91 Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Thu, 6 Jul 2023 15:40:01 +0800
Subject: [PATCH 01/12] Add polling, reset methods to label.service.ts

---
 src/app/core/services/label.service.ts | 43 ++++++++++++++++++++++++--
 1 file changed, 40 insertions(+), 3 deletions(-)

diff --git a/src/app/core/services/label.service.ts b/src/app/core/services/label.service.ts
index 77e107e4..985b20d2 100644
--- a/src/app/core/services/label.service.ts
+++ b/src/app/core/services/label.service.ts
@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
+import { BehaviorSubject, EMPTY, Observable, Subscription, timer } from 'rxjs';
+import { catchError, exhaustMap, map } from 'rxjs/operators';
 import { Label } from '../models/label.model';
 import { GithubService } from './github.service';
 
@@ -22,9 +22,39 @@ const COLOR_WHITE = 'ffffff'; // Light color for text with dark background
  * from the GitHub repository for the WATcher application.
  */
 export class LabelService {
+  static readonly POLL_INTERVAL = 5000; // 5 seconds
+
   labels: Label[];
+  labels$: BehaviorSubject<Label[]>;
+
+  private labelsPollSubscription: Subscription;
+
+  constructor(private githubService: GithubService) {
+    this.labels$ = new BehaviorSubject(new Array<Label>());
+  }
+
+  startPollLabels() {
+    if (this.labelsPollSubscription === undefined) {
+      this.labelsPollSubscription = timer(0, LabelService.POLL_INTERVAL)
+        .pipe(
+          exhaustMap(() => {
+            return this.fetchLabels().pipe(
+              catchError(() => {
+                return EMPTY;
+              })
+            );
+          })
+        )
+        .subscribe();
+    }
+  }
 
-  constructor(private githubService: GithubService) {}
+  stopPollLabels() {
+    if (this.labelsPollSubscription) {
+      this.labelsPollSubscription.unsubscribe();
+      this.labelsPollSubscription = undefined;
+    }
+  }
 
   /**
    * Fetch labels from Github.
@@ -92,4 +122,11 @@ export class LabelService {
 
     return styles;
   }
+
+  reset() {
+    this.labels = undefined;
+    this.labels$.next(new Array<Label>());
+
+    this.stopPollLabels();
+  }
 }

From d5acfce74114c8b674b1628062e2953846d817ef Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 7 Jul 2023 11:09:11 +0800
Subject: [PATCH 02/12] Update labels periodically and on sync button click

---
 src/app/core/services/label.service.ts        | 39 ++++++++++++++-----
 .../label-filter-bar.component.html           |  2 +-
 .../label-filter-bar.component.ts             | 33 +++++++---------
 src/app/shared/layout/header.component.ts     | 10 +++++
 4 files changed, 54 insertions(+), 30 deletions(-)

diff --git a/src/app/core/services/label.service.ts b/src/app/core/services/label.service.ts
index 985b20d2..6df411d5 100644
--- a/src/app/core/services/label.service.ts
+++ b/src/app/core/services/label.service.ts
@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
-import { BehaviorSubject, EMPTY, Observable, Subscription, timer } from 'rxjs';
-import { catchError, exhaustMap, map } from 'rxjs/operators';
+import { BehaviorSubject, EMPTY, Observable, of, Subscription, timer } from 'rxjs';
+import { catchError, exhaustMap, finalize, map } from 'rxjs/operators';
 import { Label } from '../models/label.model';
 import { GithubService } from './github.service';
 
@@ -13,6 +13,11 @@ const COLOR_DARKNESS_THRESHOLD = 0.184;
 const COLOR_BLACK = '000000'; // Dark color for text with light background
 const COLOR_WHITE = 'ffffff'; // Light color for text with dark background
 
+export type simplifiedLabel = {
+  name: string;
+  color: string;
+};
+
 @Injectable({
   providedIn: 'root'
 })
@@ -22,16 +27,15 @@ const COLOR_WHITE = 'ffffff'; // Light color for text with dark background
  * from the GitHub repository for the WATcher application.
  */
 export class LabelService {
-  static readonly POLL_INTERVAL = 5000; // 5 seconds
+  static readonly POLL_INTERVAL = 30000; // 5 seconds
 
   labels: Label[];
-  labels$: BehaviorSubject<Label[]>;
+  simplifiedLabels: simplifiedLabel[];
 
   private labelsPollSubscription: Subscription;
+  private labelsSubject = new BehaviorSubject<simplifiedLabel[]>([]);
 
-  constructor(private githubService: GithubService) {
-    this.labels$ = new BehaviorSubject(new Array<Label>());
-  }
+  constructor(private githubService: GithubService) {}
 
   startPollLabels() {
     if (this.labelsPollSubscription === undefined) {
@@ -45,7 +49,9 @@ export class LabelService {
             );
           })
         )
-        .subscribe();
+        .subscribe(() => {
+          this.labelsSubject.next(this.simplifiedLabels);
+        });
     }
   }
 
@@ -56,6 +62,15 @@ export class LabelService {
     }
   }
 
+  connect(): Observable<simplifiedLabel[]> {
+    return this.labelsSubject.asObservable();
+  }
+
+  disconnect() {
+    this.labelsSubject.complete();
+    this.stopPollLabels();
+  }
+
   /**
    * Fetch labels from Github.
    */
@@ -63,6 +78,13 @@ export class LabelService {
     return this.githubService.fetchAllLabels().pipe(
       map((response) => {
         this.labels = this.parseLabelData(response);
+        this.simplifiedLabels = this.labels.map((label) => {
+          return {
+            name: label.getFormattedName(),
+            color: label.color
+          };
+        });
+        this.labelsSubject.next(this.simplifiedLabels);
         return response;
       })
     );
@@ -125,7 +147,6 @@ export class LabelService {
 
   reset() {
     this.labels = undefined;
-    this.labels$.next(new Array<Label>());
 
     this.stopPollLabels();
   }
diff --git a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
index da7f0d9f..6a865452 100644
--- a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
+++ b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
@@ -17,7 +17,7 @@
       <mat-selection-list [(ngModel)]="selectedLabelNames" (selectionChange)="selectedLabels.next(selectedLabelNames)">
         <mat-list-option
           #option
-          *ngFor="let label of allLabels"
+          *ngFor="let label of this.labels$ | async;"
           [value]="label.name"
           [selected]="selectedLabelNames.includes(label.name)"
           class="list-option"
diff --git a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
index fe7ca58b..fb7e67f9 100644
--- a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
+++ b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
@@ -1,14 +1,9 @@
 import { Component, Input, OnDestroy, OnInit } from '@angular/core';
 import { MatListOption } from '@angular/material/list';
-import { BehaviorSubject, Subscription } from 'rxjs';
-import { LabelService } from '../../../core/services/label.service';
+import { BehaviorSubject, Observable, Subscription } from 'rxjs';
+import { LabelService, simplifiedLabel } from '../../../core/services/label.service';
 import { LoggingService } from '../../../core/services/logging.service';
 
-export type simplifiedLabel = {
-  name: string;
-  color: string;
-};
-
 @Component({
   selector: 'app-label-filter-bar',
   templateUrl: './label-filter-bar.component.html',
@@ -18,7 +13,7 @@ export class LabelFilterBarComponent implements OnInit, OnDestroy {
   @Input() selectedLabels: BehaviorSubject<string[]>;
   @Input() hiddenLabels: BehaviorSubject<Set<string>>;
 
-  allLabels: simplifiedLabel[];
+  labels$: Observable<simplifiedLabel[]>;
   selectedLabelNames: string[] = [];
   hiddenLabelNames: Set<string> = new Set();
   loaded = false;
@@ -29,11 +24,18 @@ export class LabelFilterBarComponent implements OnInit, OnDestroy {
 
   ngOnInit() {
     this.loaded = false;
-    this.load();
+  }
+
+  ngAfterViewInit(): void {
+    setTimeout(() => {
+      this.load();
+      this.labels$ = this.labelService.connect();
+    });
   }
 
   ngOnDestroy(): void {
     this.labelSubscription?.unsubscribe();
+    this.labelService.disconnect();
   }
 
   hide(label: string): void {
@@ -69,27 +71,18 @@ export class LabelFilterBarComponent implements OnInit, OnDestroy {
 
   /** loads in the labels in the repository */
   public load() {
+    this.labelService.startPollLabels();
     this.labelSubscription = this.labelService.fetchLabels().subscribe(
       (response) => {
         this.logger.debug('LabelFilterBarComponent: Fetched labels from Github');
       },
       (err) => {},
       () => {
-        this.initialize();
+        this.loaded = true;
       }
     );
   }
 
-  private initialize() {
-    this.allLabels = this.labelService.labels.map((label) => {
-      return {
-        name: label.getFormattedName(),
-        color: label.color
-      };
-    });
-    this.loaded = true;
-  }
-
   filter(filter: string, target: string): boolean {
     return !target.toLowerCase().includes(filter.toLowerCase());
   }
diff --git a/src/app/shared/layout/header.component.ts b/src/app/shared/layout/header.component.ts
index 1a08d14e..cf474ed1 100644
--- a/src/app/shared/layout/header.component.ts
+++ b/src/app/shared/layout/header.component.ts
@@ -11,9 +11,11 @@ import { ErrorHandlingService } from '../../core/services/error-handling.service
 import { GithubService } from '../../core/services/github.service';
 import { GithubEventService } from '../../core/services/githubevent.service';
 import { IssueService } from '../../core/services/issue.service';
+import { LabelService } from '../..//core/services/label.service';
 import { LoggingService } from '../../core/services/logging.service';
 import { PhaseDescription, PhaseService } from '../../core/services/phase.service';
 import { UserService } from '../../core/services/user.service';
+import { error } from 'console';
 
 const ISSUE_TRACKER_URL = 'https://github.com/CATcher-org/WATcher/issues';
 
@@ -46,6 +48,7 @@ export class HeaderComponent implements OnInit {
     private location: Location,
     private githubEventService: GithubEventService,
     private issueService: IssueService,
+    private labelService: LabelService,
     private errorHandlingService: ErrorHandlingService,
     private githubService: GithubService,
     private dialogService: DialogService
@@ -155,6 +158,13 @@ export class HeaderComponent implements OnInit {
       }
     );
 
+    this.labelService.fetchLabels().subscribe(
+      (success) => success,
+      (error) => {
+        this.errorHandlingService.handleError(error, () => this.labelService.fetchLabels());
+      }
+    )
+
     // Prevent user from spamming the reload button
     setTimeout(() => {
       this.isReloadButtonDisabled = false;

From ec2f24a7befa08e916f7e7290e6cb1babc85c76d Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 7 Jul 2023 14:21:47 +0800
Subject: [PATCH 03/12] Adjust polling interval

---
 src/app/core/services/label.service.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/core/services/label.service.ts b/src/app/core/services/label.service.ts
index 6df411d5..c85fc5e3 100644
--- a/src/app/core/services/label.service.ts
+++ b/src/app/core/services/label.service.ts
@@ -27,7 +27,7 @@ export type simplifiedLabel = {
  * from the GitHub repository for the WATcher application.
  */
 export class LabelService {
-  static readonly POLL_INTERVAL = 30000; // 5 seconds
+  static readonly POLL_INTERVAL = 5000; // 5 seconds
 
   labels: Label[];
   simplifiedLabels: simplifiedLabel[];

From 3df12dd987630d4bd1fd747826aa5ec30787d31b Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 7 Jul 2023 14:22:38 +0800
Subject: [PATCH 04/12] Cleanup LabelService on changing repo, logging out

---
 src/app/app.module.ts                                       | 3 ++-
 src/app/core/services/auth.service.ts                       | 3 +++
 src/app/core/services/factories/factory.auth.service.ts     | 5 ++++-
 src/app/core/services/label.service.ts                      | 2 +-
 src/app/issues-viewer/issues-viewer.component.ts            | 3 +++
 .../label-filter-bar/label-filter-bar.component.ts          | 4 ++--
 src/app/shared/layout/header.component.ts                   | 6 +++---
 7 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 7a330a7a..a01778a9 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -25,6 +25,7 @@ import { IssueServiceFactory } from './core/services/factories/factory.issue.ser
 import { GithubService } from './core/services/github.service';
 import { GithubEventService } from './core/services/githubevent.service';
 import { IssueService } from './core/services/issue.service';
+import { LabelService } from './core/services/label.service';
 import { LoggingService } from './core/services/logging.service';
 import { PhaseService } from './core/services/phase.service';
 import { SessionFixConfirmationComponent } from './core/services/session-fix-confirmation/session-fix-confirmation.component';
@@ -72,7 +73,7 @@ import { SharedModule } from './shared/shared.module';
     {
       provide: AuthService,
       useFactory: AuthServiceFactory,
-      deps: [Router, NgZone, GithubService, UserService, IssueService, PhaseService, GithubEventService, Title, LoggingService]
+      deps: [Router, NgZone, GithubService, UserService, IssueService, LabelService, PhaseService, GithubEventService, Title, LoggingService]
     },
     {
       provide: IssueService,
diff --git a/src/app/core/services/auth.service.ts b/src/app/core/services/auth.service.ts
index 645b8192..8b64537c 100644
--- a/src/app/core/services/auth.service.ts
+++ b/src/app/core/services/auth.service.ts
@@ -9,6 +9,7 @@ import { uuid } from '../../shared/lib/uuid';
 import { GithubService } from './github.service';
 import { GithubEventService } from './githubevent.service';
 import { IssueService } from './issue.service';
+import { LabelService } from './label.service';
 import { LoggingService } from './logging.service';
 import { PhaseService } from './phase.service';
 import { UserService } from './user.service';
@@ -42,6 +43,7 @@ export class AuthService {
     private githubService: GithubService,
     private userService: UserService,
     private issueService: IssueService,
+    private labelService: LabelService,
     private phaseService: PhaseService,
     private githubEventService: GithubEventService,
     private titleService: Title,
@@ -67,6 +69,7 @@ export class AuthService {
     this.githubService.reset();
     this.userService.reset();
     this.issueService.reset(true);
+    this.labelService.reset();
     this.phaseService.reset();
     this.githubEventService.reset();
     this.logger.reset();
diff --git a/src/app/core/services/factories/factory.auth.service.ts b/src/app/core/services/factories/factory.auth.service.ts
index 2e9c762f..d81d185c 100644
--- a/src/app/core/services/factories/factory.auth.service.ts
+++ b/src/app/core/services/factories/factory.auth.service.ts
@@ -6,6 +6,7 @@ import { AuthService } from '../auth.service';
 import { GithubService } from '../github.service';
 import { GithubEventService } from '../githubevent.service';
 import { IssueService } from '../issue.service';
+import { LabelService } from '../label.service';
 import { LoggingService } from '../logging.service';
 // import { MockAuthService } from '../mocks/mock.auth.service';
 import { PhaseService } from '../phase.service';
@@ -17,6 +18,7 @@ export function AuthServiceFactory(
   githubService: GithubService,
   userService: UserService,
   issueService: IssueService,
+  labelService: LabelService,
   phaseService: PhaseService,
   githubEventService: GithubEventService,
   titleService: Title,
@@ -30,6 +32,7 @@ export function AuthServiceFactory(
   //     githubService,
   //     userService,
   //     issueService,
+  //     labelService,
   //     phaseService,
   //     githubEventService,
   //     titleService,
@@ -37,5 +40,5 @@ export function AuthServiceFactory(
   //   );
   // }
   console.log(logger);
-  return new AuthService(router, ngZone, githubService, userService, issueService, phaseService, githubEventService, titleService, logger);
+  return new AuthService(router, ngZone, githubService, userService, issueService, labelService, phaseService, githubEventService, titleService, logger);
 }
diff --git a/src/app/core/services/label.service.ts b/src/app/core/services/label.service.ts
index c85fc5e3..5385cbf2 100644
--- a/src/app/core/services/label.service.ts
+++ b/src/app/core/services/label.service.ts
@@ -147,7 +147,7 @@ export class LabelService {
 
   reset() {
     this.labels = undefined;
-
+    this.simplifiedLabels = undefined;
     this.stopPollLabels();
   }
 }
diff --git a/src/app/issues-viewer/issues-viewer.component.ts b/src/app/issues-viewer/issues-viewer.component.ts
index af4890f9..0e399bcd 100644
--- a/src/app/issues-viewer/issues-viewer.component.ts
+++ b/src/app/issues-viewer/issues-viewer.component.ts
@@ -4,6 +4,7 @@ import { GithubUser } from '../core/models/github-user.model';
 import { Repo } from '../core/models/repo.model';
 import { GithubService } from '../core/services/github.service';
 import { IssueService } from '../core/services/issue.service';
+import { LabelService } from '../core/services/label.service';
 import { MilestoneService } from '../core/services/milestone.service';
 import { PhaseService } from '../core/services/phase.service';
 import { TABLE_COLUMNS } from '../shared/issue-tables/issue-tables-columns';
@@ -34,10 +35,12 @@ export class IssuesViewerComponent implements OnInit, AfterViewInit, OnDestroy {
     public phaseService: PhaseService,
     public githubService: GithubService,
     public issueService: IssueService,
+    public labelService: LabelService,
     public milestoneService: MilestoneService
   ) {
     this.repoChangeSubscription = this.phaseService.repoChanged$.subscribe((newRepo) => {
       this.issueService.reset(false);
+      this.labelService.reset();
       this.initialize();
     });
   }
diff --git a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
index fb7e67f9..e25aff27 100644
--- a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
+++ b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnDestroy, OnInit } from '@angular/core';
+import { AfterViewInit, Component, Input, OnDestroy, OnInit } from '@angular/core';
 import { MatListOption } from '@angular/material/list';
 import { BehaviorSubject, Observable, Subscription } from 'rxjs';
 import { LabelService, simplifiedLabel } from '../../../core/services/label.service';
@@ -9,7 +9,7 @@ import { LoggingService } from '../../../core/services/logging.service';
   templateUrl: './label-filter-bar.component.html',
   styleUrls: ['./label-filter-bar.component.css']
 })
-export class LabelFilterBarComponent implements OnInit, OnDestroy {
+export class LabelFilterBarComponent implements OnInit, AfterViewInit, OnDestroy {
   @Input() selectedLabels: BehaviorSubject<string[]>;
   @Input() hiddenLabels: BehaviorSubject<Set<string>>;
 
diff --git a/src/app/shared/layout/header.component.ts b/src/app/shared/layout/header.component.ts
index cf474ed1..0ccb2107 100644
--- a/src/app/shared/layout/header.component.ts
+++ b/src/app/shared/layout/header.component.ts
@@ -11,11 +11,10 @@ import { ErrorHandlingService } from '../../core/services/error-handling.service
 import { GithubService } from '../../core/services/github.service';
 import { GithubEventService } from '../../core/services/githubevent.service';
 import { IssueService } from '../../core/services/issue.service';
-import { LabelService } from '../..//core/services/label.service';
+import { LabelService } from '../../core/services/label.service';
 import { LoggingService } from '../../core/services/logging.service';
 import { PhaseDescription, PhaseService } from '../../core/services/phase.service';
 import { UserService } from '../../core/services/user.service';
-import { error } from 'console';
 
 const ISSUE_TRACKER_URL = 'https://github.com/CATcher-org/WATcher/issues';
 
@@ -88,6 +87,7 @@ export class HeaderComponent implements OnInit {
     // Remove current phase issues and load selected phase issues.
     this.githubService.reset();
     this.issueService.reset(false);
+    this.labelService.reset();
     this.reload();
 
     // Route app to new phase.
@@ -163,7 +163,7 @@ export class HeaderComponent implements OnInit {
       (error) => {
         this.errorHandlingService.handleError(error, () => this.labelService.fetchLabels());
       }
-    )
+    );
 
     // Prevent user from spamming the reload button
     setTimeout(() => {

From 19aa1f517ad07d007c3b088ce0824296a2ace551 Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 7 Jul 2023 15:31:21 +0800
Subject: [PATCH 05/12] Remove duplicate load

---
 src/app/shared/filter-bar/filter-bar.component.ts | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/app/shared/filter-bar/filter-bar.component.ts b/src/app/shared/filter-bar/filter-bar.component.ts
index 13d00dcd..4d7ec511 100644
--- a/src/app/shared/filter-bar/filter-bar.component.ts
+++ b/src/app/shared/filter-bar/filter-bar.component.ts
@@ -91,9 +91,6 @@ export class FilterBarComponent implements OnInit, AfterViewInit, OnDestroy {
    * Fetch and initialize all information from repository to populate Issue Dashboard.
    */
   private initialize() {
-    // Fetch labels
-    this.labelFilterBar.load();
-
     // Fetch milestones and update dropdown filter
     this.milestoneSubscription = this.milestoneService.fetchMilestones().subscribe(
       (response) => {

From 52f5db88245e0900c8811e15094bd87dfd9344fc Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 7 Jul 2023 15:31:45 +0800
Subject: [PATCH 06/12] Fix labels breaking on change repo

---
 src/app/core/services/label.service.ts                       | 5 -----
 .../label-filter-bar/label-filter-bar.component.ts           | 1 -
 2 files changed, 6 deletions(-)

diff --git a/src/app/core/services/label.service.ts b/src/app/core/services/label.service.ts
index 5385cbf2..28a2fcf7 100644
--- a/src/app/core/services/label.service.ts
+++ b/src/app/core/services/label.service.ts
@@ -66,11 +66,6 @@ export class LabelService {
     return this.labelsSubject.asObservable();
   }
 
-  disconnect() {
-    this.labelsSubject.complete();
-    this.stopPollLabels();
-  }
-
   /**
    * Fetch labels from Github.
    */
diff --git a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
index e25aff27..b9f948ae 100644
--- a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
+++ b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
@@ -35,7 +35,6 @@ export class LabelFilterBarComponent implements OnInit, AfterViewInit, OnDestroy
 
   ngOnDestroy(): void {
     this.labelSubscription?.unsubscribe();
-    this.labelService.disconnect();
   }
 
   hide(label: string): void {

From 45c8ca49f79691f11a913c67bcc7d3284547831b Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 7 Jul 2023 15:40:53 +0800
Subject: [PATCH 07/12] Fix lint errors

---
 src/app/app.module.ts                                | 12 +++++++++++-
 .../core/services/factories/factory.auth.service.ts  | 12 +++++++++++-
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index a01778a9..153817fa 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -73,7 +73,17 @@ import { SharedModule } from './shared/shared.module';
     {
       provide: AuthService,
       useFactory: AuthServiceFactory,
-      deps: [Router, NgZone, GithubService, UserService, IssueService, LabelService, PhaseService, GithubEventService, Title, LoggingService]
+      deps: [
+        Router,
+        NgZone,
+        GithubService,
+        UserService,
+        IssueService,
+        LabelService,
+        PhaseService,
+        GithubEventService,
+        Title,
+        LoggingService]
     },
     {
       provide: IssueService,
diff --git a/src/app/core/services/factories/factory.auth.service.ts b/src/app/core/services/factories/factory.auth.service.ts
index d81d185c..e3cf520d 100644
--- a/src/app/core/services/factories/factory.auth.service.ts
+++ b/src/app/core/services/factories/factory.auth.service.ts
@@ -40,5 +40,15 @@ export function AuthServiceFactory(
   //   );
   // }
   console.log(logger);
-  return new AuthService(router, ngZone, githubService, userService, issueService, labelService, phaseService, githubEventService, titleService, logger);
+  return new AuthService(
+    router,
+    ngZone,
+    githubService,
+    userService,
+    issueService,
+    labelService,
+    phaseService,
+    githubEventService,
+    titleService,
+    logger);
 }

From bf72ff058ea1bbab4d35698f8365cf238d2ea5c7 Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 14 Jul 2023 11:36:44 +0800
Subject: [PATCH 08/12] Move SimplifiedLabel into label.model

---
 src/app/core/models/label.model.ts     |  5 +++++
 src/app/core/services/label.service.ts | 13 ++++---------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/app/core/models/label.model.ts b/src/app/core/models/label.model.ts
index ca02cbc0..b9231769 100644
--- a/src/app/core/models/label.model.ts
+++ b/src/app/core/models/label.model.ts
@@ -27,3 +27,8 @@ export class Label {
     return this.name === label.name && this.category === label.category;
   }
 }
+
+export type SimplifiedLabel = {
+  name: string;
+  color: string;
+};
diff --git a/src/app/core/services/label.service.ts b/src/app/core/services/label.service.ts
index 28a2fcf7..1d3bebfc 100644
--- a/src/app/core/services/label.service.ts
+++ b/src/app/core/services/label.service.ts
@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { BehaviorSubject, EMPTY, Observable, of, Subscription, timer } from 'rxjs';
 import { catchError, exhaustMap, finalize, map } from 'rxjs/operators';
-import { Label } from '../models/label.model';
+import { Label, SimplifiedLabel } from '../models/label.model';
 import { GithubService } from './github.service';
 
 /* The threshold to decide if color is dark or light.
@@ -13,11 +13,6 @@ const COLOR_DARKNESS_THRESHOLD = 0.184;
 const COLOR_BLACK = '000000'; // Dark color for text with light background
 const COLOR_WHITE = 'ffffff'; // Light color for text with dark background
 
-export type simplifiedLabel = {
-  name: string;
-  color: string;
-};
-
 @Injectable({
   providedIn: 'root'
 })
@@ -30,10 +25,10 @@ export class LabelService {
   static readonly POLL_INTERVAL = 5000; // 5 seconds
 
   labels: Label[];
-  simplifiedLabels: simplifiedLabel[];
+  simplifiedLabels: SimplifiedLabel[];
 
   private labelsPollSubscription: Subscription;
-  private labelsSubject = new BehaviorSubject<simplifiedLabel[]>([]);
+  private labelsSubject = new BehaviorSubject<SimplifiedLabel[]>([]);
 
   constructor(private githubService: GithubService) {}
 
@@ -62,7 +57,7 @@ export class LabelService {
     }
   }
 
-  connect(): Observable<simplifiedLabel[]> {
+  connect(): Observable<SimplifiedLabel[]> {
     return this.labelsSubject.asObservable();
   }
 

From d44adcee9f49793500bd96e246b55ae2e089c854 Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 14 Jul 2023 11:42:12 +0800
Subject: [PATCH 09/12] Convert check to a guard clause

---
 src/app/core/services/label.service.ts | 29 +++++++++++++-------------
 1 file changed, 15 insertions(+), 14 deletions(-)

diff --git a/src/app/core/services/label.service.ts b/src/app/core/services/label.service.ts
index 1d3bebfc..d1346855 100644
--- a/src/app/core/services/label.service.ts
+++ b/src/app/core/services/label.service.ts
@@ -33,21 +33,22 @@ export class LabelService {
   constructor(private githubService: GithubService) {}
 
   startPollLabels() {
-    if (this.labelsPollSubscription === undefined) {
-      this.labelsPollSubscription = timer(0, LabelService.POLL_INTERVAL)
-        .pipe(
-          exhaustMap(() => {
-            return this.fetchLabels().pipe(
-              catchError(() => {
-                return EMPTY;
-              })
-            );
-          })
-        )
-        .subscribe(() => {
-          this.labelsSubject.next(this.simplifiedLabels);
-        });
+    if (this.labelsPollSubscription) {
+      return;
     }
+    this.labelsPollSubscription = timer(0, LabelService.POLL_INTERVAL)
+      .pipe(
+        exhaustMap(() => {
+          return this.fetchLabels().pipe(
+            catchError(() => {
+              return EMPTY;
+            })
+          );
+        })
+      )
+      .subscribe(() => {
+        this.labelsSubject.next(this.simplifiedLabels);
+      });
   }
 
   stopPollLabels() {

From 4f38d69b401d55838fdf052f21d28f204120a6ca Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Fri, 14 Jul 2023 12:00:49 +0800
Subject: [PATCH 10/12] Store formattedName as property of Label

---
 src/app/core/models/label.model.ts                 | 14 +++++---------
 src/app/core/services/label.service.ts             |  2 +-
 .../label-filter-bar/label-filter-bar.component.ts |  5 +++--
 3 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/app/core/models/label.model.ts b/src/app/core/models/label.model.ts
index b9231769..a2e6350e 100644
--- a/src/app/core/models/label.model.ts
+++ b/src/app/core/models/label.model.ts
@@ -4,30 +4,26 @@
 export class Label {
   readonly category: string;
   readonly name: string;
+  readonly formattedName: string; // 'category'.'name' (e.g. severity.Low) if a category exists or 'name' if the category does not exist.
   color: string;
   definition?: string;
 
   constructor(label: { name: string; color: string; definition?: string }) {
     const containsDotRegex = /\.\b/g; // contains dot in middle of name
     [this.category, this.name] = containsDotRegex.test(label.name) ? label.name.split('.') : [undefined, label.name];
+    this.formattedName = this.category === undefined || this.category === '' ? this.name : this.category.concat('.', this.name);
     this.color = label.color;
     this.definition = label.definition;
   }
 
-  /**
-   * Returns the name of the label with the format of
-   * 'category'.'name' (e.g. severity.Low) if a category exists or
-   * 'name' if the category does not exist.
-   */
-  public getFormattedName(): string {
-    return this.category === undefined || this.category === '' ? this.name : this.category.concat('.', this.name);
-  }
-
   public equals(label: Label) {
     return this.name === label.name && this.category === label.category;
   }
 }
 
+/**
+ * Represents a simplified label with name and color
+ */
 export type SimplifiedLabel = {
   name: string;
   color: string;
diff --git a/src/app/core/services/label.service.ts b/src/app/core/services/label.service.ts
index d1346855..9bc7cac0 100644
--- a/src/app/core/services/label.service.ts
+++ b/src/app/core/services/label.service.ts
@@ -71,7 +71,7 @@ export class LabelService {
         this.labels = this.parseLabelData(response);
         this.simplifiedLabels = this.labels.map((label) => {
           return {
-            name: label.getFormattedName(),
+            name: label.formattedName,
             color: label.color
           };
         });
diff --git a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
index b9f948ae..ecb0ce8e 100644
--- a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
+++ b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
@@ -1,7 +1,8 @@
 import { AfterViewInit, Component, Input, OnDestroy, OnInit } from '@angular/core';
 import { MatListOption } from '@angular/material/list';
 import { BehaviorSubject, Observable, Subscription } from 'rxjs';
-import { LabelService, simplifiedLabel } from '../../../core/services/label.service';
+import { SimplifiedLabel } from '../../../core/models/label.model';
+import { LabelService } from '../../../core/services/label.service';
 import { LoggingService } from '../../../core/services/logging.service';
 
 @Component({
@@ -13,7 +14,7 @@ export class LabelFilterBarComponent implements OnInit, AfterViewInit, OnDestroy
   @Input() selectedLabels: BehaviorSubject<string[]>;
   @Input() hiddenLabels: BehaviorSubject<Set<string>>;
 
-  labels$: Observable<simplifiedLabel[]>;
+  labels$: Observable<SimplifiedLabel[]>;
   selectedLabelNames: string[] = [];
   hiddenLabelNames: Set<string> = new Set();
   loaded = false;

From e4a22a283cc70d57dfbbc33f46c8c68f2a229ce4 Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Mon, 24 Jul 2023 10:06:42 +0800
Subject: [PATCH 11/12] Format html

---
 .../filter-bar/label-filter-bar/label-filter-bar.component.html  | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
index 5a958a31..758d2521 100644
--- a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
+++ b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
@@ -16,6 +16,7 @@
     <button mat-button (click)="removeAllSelection()">Remove all</button>
 
     <div *ngIf="!hasLabels(input.value)" class="no-labels">No Labels Found!</div>
+
     <div class="scroll-container-wrapper">
       <div class="scroll-container">
         <mat-selection-list [(ngModel)]="selectedLabelNames" (selectionChange)="updateSelection()">

From 3c73261d4ed394bb29a2547b745fca4a6aa92cdb Mon Sep 17 00:00:00 2001
From: chia-yh <0.chiayuhong.0@gmail.com>
Date: Mon, 24 Jul 2023 10:38:39 +0800
Subject: [PATCH 12/12] Rename references from name to formattedName

---
 src/app/core/models/label.model.ts                              | 2 +-
 .../filter-bar/label-filter-bar/label-filter-bar.component.html | 2 +-
 .../filter-bar/label-filter-bar/label-filter-bar.component.ts   | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/core/models/label.model.ts b/src/app/core/models/label.model.ts
index 54c281fd..18799a19 100644
--- a/src/app/core/models/label.model.ts
+++ b/src/app/core/models/label.model.ts
@@ -25,6 +25,6 @@ export class Label implements SimpleLabel {
  * Represents a simplified label with name and color
  */
 export type SimpleLabel = {
-  name: string;
+  formattedName: string;
   color: string;
 };
diff --git a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
index 758d2521..3701bc6b 100644
--- a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
+++ b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.html
@@ -40,7 +40,7 @@
                 [disabled]="hiddenLabelNames.has(label.name)"
                 (click)="simulateClick(option); $event.stopPropagation()"
               >
-                {{ label.name }}
+                {{ label.formattedName }}
               </mat-chip>
             </div>
           </mat-list-option>
diff --git a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
index 9ce86280..991a9d0d 100644
--- a/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
+++ b/src/app/shared/filter-bar/label-filter-bar/label-filter-bar.component.ts
@@ -96,7 +96,7 @@ export class LabelFilterBarComponent implements OnInit, AfterViewInit, OnDestroy
     if (this.allLabels === undefined || this.allLabels.length === 0) {
       return false;
     }
-    return this.allLabels.some((label) => !this.filter(filter, label.name));
+    return this.allLabels.some((label) => !this.filter(filter, label.formattedName));
   }
 
   updateSelection(): void {