From fae117cf213b3a7d24be6819bbcbd4dd99bccdd2 Mon Sep 17 00:00:00 2001
From: nknguyenhc <87511888+nknguyenhc@users.noreply.github.com>
Date: Sun, 11 Feb 2024 17:08:22 +0800
Subject: [PATCH 1/2] Refactor label model

Usage of `label.name` is removed from:
* Label filter bar component, search
---
 src/app/core/models/label.model.ts                   | 12 ++----------
 .../label-filter-bar/label-filter-bar.component.html |  2 +-
 .../issue-pr-card-labels.component.ts                |  6 +++---
 3 files changed, 6 insertions(+), 14 deletions(-)

diff --git a/src/app/core/models/label.model.ts b/src/app/core/models/label.model.ts
index 18799a193..1e44fab6d 100644
--- a/src/app/core/models/label.model.ts
+++ b/src/app/core/models/label.model.ts
@@ -2,23 +2,15 @@
  * Represents a label and its attributes.
  */
 export class Label implements SimpleLabel {
-  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.
+  readonly formattedName: string;
   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.formattedName = label.name;
     this.color = label.color;
     this.definition = label.definition;
   }
-
-  public equals(label: Label) {
-    return this.name === label.name && this.category === label.category;
-  }
 }
 
 /**
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 7f2438f42..1f4c7ce6c 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
@@ -26,7 +26,7 @@
             [value]="label.formattedName"
             [selected]="selectedLabelNames.includes(label.formattedName)"
             class="list-option"
-            [class.hidden]="filter(input.value, label.name)"
+            [class.hidden]="filter(input.value, label.formattedName)"
           >
             <div class="flexbox-container">
               <button
diff --git a/src/app/shared/issue-pr-card/issue-pr-card-labels/issue-pr-card-labels.component.ts b/src/app/shared/issue-pr-card/issue-pr-card-labels/issue-pr-card-labels.component.ts
index 8fb551ebe..719af0b28 100644
--- a/src/app/shared/issue-pr-card/issue-pr-card-labels/issue-pr-card-labels.component.ts
+++ b/src/app/shared/issue-pr-card/issue-pr-card-labels/issue-pr-card-labels.component.ts
@@ -1,5 +1,5 @@
 import { Component, Input } from '@angular/core';
-import { Label } from '../../../core/models/label.model';
+import { GithubLabel } from '../../../core/models/github/github-label.model';
 import { LabelService } from '../../../core/services/label.service';
 
 @Component({
@@ -8,7 +8,7 @@ import { LabelService } from '../../../core/services/label.service';
   styleUrls: ['./issue-pr-card-labels.component.css']
 })
 export class IssuePrCardLabelsComponent {
-  @Input() labels: Label[];
-  @Input() labelSet: Set<Label>;
+  @Input() labels: GithubLabel[];
+  @Input() labelSet: Set<string>;
   constructor(public labelService: LabelService) {}
 }

From 62541f6e96dbac50803ba5a384ea41e589f34879 Mon Sep 17 00:00:00 2001
From: nknguyenhc <87511888+nknguyenhc@users.noreply.github.com>
Date: Thu, 15 Feb 2024 18:46:32 +0800
Subject: [PATCH 2/2] Change `formattedName` to `name`

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

diff --git a/src/app/core/models/label.model.ts b/src/app/core/models/label.model.ts
index 1e44fab6d..3983c72e3 100644
--- a/src/app/core/models/label.model.ts
+++ b/src/app/core/models/label.model.ts
@@ -2,12 +2,12 @@
  * Represents a label and its attributes.
  */
 export class Label implements SimpleLabel {
-  readonly formattedName: string;
+  readonly name: string;
   color: string;
   definition?: string;
 
   constructor(label: { name: string; color: string; definition?: string }) {
-    this.formattedName = label.name;
+    this.name = label.name;
     this.color = label.color;
     this.definition = label.definition;
   }
@@ -17,6 +17,6 @@ export class Label implements SimpleLabel {
  * Represents a simplified label with name and color
  */
 export type SimpleLabel = {
-  formattedName: string;
+  name: 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 1f4c7ce6c..937414836 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
@@ -23,32 +23,24 @@
           <mat-list-option
             #option
             *ngFor="let label of this.labels$ | async"
-            [value]="label.formattedName"
-            [selected]="selectedLabelNames.includes(label.formattedName)"
+            [value]="label.name"
+            [selected]="selectedLabelNames.includes(label.name)"
             class="list-option"
-            [class.hidden]="filter(input.value, label.formattedName)"
+            [class.hidden]="filter(input.value, label.name)"
           >
             <div class="flexbox-container">
-              <button
-                mat-icon-button
-                *ngIf="!hiddenLabelNames.has(label.formattedName)"
-                (click)="hide(label.formattedName); $event.stopPropagation()"
-              >
+              <button mat-icon-button *ngIf="!hiddenLabelNames.has(label.name)" (click)="hide(label.name); $event.stopPropagation()">
                 <mat-icon>visibility</mat-icon>
               </button>
-              <button
-                mat-icon-button
-                *ngIf="hiddenLabelNames.has(label.formattedName)"
-                (click)="show(label.formattedName); $event.stopPropagation()"
-              >
+              <button mat-icon-button *ngIf="hiddenLabelNames.has(label.name)" (click)="show(label.name); $event.stopPropagation()">
                 <mat-icon>visibility_off</mat-icon>
               </button>
               <mat-chip
                 [ngStyle]="labelService.setLabelStyle(label.color)"
-                [disabled]="hiddenLabelNames.has(label.formattedName)"
+                [disabled]="hiddenLabelNames.has(label.name)"
                 (click)="simulateClick(option); $event.stopPropagation()"
               >
-                {{ label.formattedName }}
+                {{ label.name }}
               </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 991a9d0d3..9ce86280e 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.formattedName));
+    return this.allLabels.some((label) => !this.filter(filter, label.name));
   }
 
   updateSelection(): void {