From 18045fc2feb1439874f8ac806fa3bbe8a4316cfe Mon Sep 17 00:00:00 2001
From: Hisham'sLocal <hrs8606663468@gmail.com>
Date: Wed, 25 Mar 2026 23:46:40 +0530
Subject: [PATCH 1/2] feat: allow customizable UI terminology for Team and
 Group (#513)

---
 .../activity-description.component.html       |  6 +--
 .../activity-description.component.ts         |  6 ++-
 .../report-config-modal.component.html        |  2 +-
 .../report-config-modal.component.ts          |  4 +-
 .../team-selector.component.html              |  8 ++--
 .../team-selector/team-selector.component.ts  |  3 ++
 .../teams-groups-editor.component.html        |  4 +-
 .../teams-groups-editor.component.ts          |  7 +++-
 .../circular-heatmap.component.html           |  8 ++--
 .../circular-heatmap.component.ts             |  2 +-
 src/app/pages/report/report.component.html    |  2 +-
 src/app/pages/report/report.component.ts      |  2 +-
 .../pages/settings/settings.component.html    | 13 ++++++
 .../pages/settings/settings.component.spec.ts |  4 ++
 src/app/pages/settings/settings.component.ts  | 13 ++++++
 src/app/pages/teams/teams.component.html      |  8 ++--
 src/app/pages/teams/teams.component.ts        |  7 +++-
 src/app/service/settings/settings.service.ts  | 42 +++++++++++++++++++
 18 files changed, 114 insertions(+), 27 deletions(-)

diff --git a/src/app/component/activity-description/activity-description.component.html b/src/app/component/activity-description/activity-description.component.html
index 28fcc422..f29cfca2 100644
--- a/src/app/component/activity-description/activity-description.component.html
+++ b/src/app/component/activity-description/activity-description.component.html
@@ -288,7 +288,7 @@ <h3><b>Usefulness</b></h3>
     <!-- <mat-expansion-panel>
       <mat-expansion-panel-header>
         <mat-panel-title>
-          <b>Teams Evidence</b>
+          <b>{{ settings.getTeamLabelPlural() }} Evidence</b>
         </mat-panel-title>
       </mat-expansion-panel-header>
       <mat-accordion multi="true">
@@ -349,7 +349,7 @@ <h4 class="tool-name" [innerHTML]="implement['name']"></h4>
               </span>
             </span>
             <span class="ref-section" *ngIf="teamsImplemented.size === 0">
-              <span class="ref-values">No teams have started this activity yet</span>
+              <span class="ref-values">No {{ settings.getTeamLabelPlural() | lowercase }} have started this activity yet</span>
             </span>
           </div>
         </mat-panel-title>
@@ -367,7 +367,7 @@ <h4 class="tool-name" [innerHTML]="implement['name']"></h4>
         </div>
       </div>
       <ng-template #noTeamsBlock>
-        <p>No teams have started implementing this activity yet.</p>
+        <p>No {{ settings.getTeamLabelPlural() | lowercase }} have started implementing this activity yet.</p>
       </ng-template>
     </mat-expansion-panel>
   </mat-accordion>
diff --git a/src/app/component/activity-description/activity-description.component.ts b/src/app/component/activity-description/activity-description.component.ts
index 2a583a7b..b49322ba 100644
--- a/src/app/component/activity-description/activity-description.component.ts
+++ b/src/app/component/activity-description/activity-description.component.ts
@@ -14,6 +14,7 @@ import { MatAccordion } from '@angular/material/expansion';
 import { Activity } from '../../model/activity-store';
 import { LoaderService } from '../../service/loader/data-loader.service';
 import { TeamName, ProgressTitle } from '../../model/types';
+import { SettingsService } from 'src/app/service/settings/settings.service';
 
 @Component({
   selector: 'app-activity-description',
@@ -43,7 +44,10 @@ export class ActivityDescriptionComponent implements OnInit, OnChanges {
 
   @ViewChildren(MatAccordion) accordion!: QueryList<MatAccordion>;
 
-  constructor(private loader: LoaderService) {}
+  constructor(
+    private loader: LoaderService,
+    public settings: SettingsService
+  ) {}
 
   ngOnInit() {
     // Set activity data if provided
diff --git a/src/app/component/report-config-modal/report-config-modal.component.html b/src/app/component/report-config-modal/report-config-modal.component.html
index e2fc14c3..0890ca49 100644
--- a/src/app/component/report-config-modal/report-config-modal.component.html
+++ b/src/app/component/report-config-modal/report-config-modal.component.html
@@ -12,7 +12,7 @@ <h3>Display Configuration</h3>
         [value]="config.columnGrouping"
         (change)="setColumnGrouping($event.value)">
         <mat-button-toggle value="byProgress">By Progress Stage</mat-button-toggle>
-        <mat-button-toggle value="byTeam">By Team</mat-button-toggle>
+        <mat-button-toggle value="byTeam">By {{ settings.getTeamLabel() }}</mat-button-toggle>
       </mat-button-toggle-group>
     </div>
   </div>
diff --git a/src/app/component/report-config-modal/report-config-modal.component.ts b/src/app/component/report-config-modal/report-config-modal.component.ts
index 43a85f30..fa63d11d 100644
--- a/src/app/component/report-config-modal/report-config-modal.component.ts
+++ b/src/app/component/report-config-modal/report-config-modal.component.ts
@@ -8,6 +8,7 @@ import {
 } from '../../model/report-config';
 import { Activity } from '../../model/activity-store';
 import { ProgressTitle, TeamGroups } from '../../model/types';
+import { SettingsService } from 'src/app/service/settings/settings.service';
 
 export interface ReportConfigModalData {
   config: ReportConfig;
@@ -37,7 +38,8 @@ export class ReportConfigModalComponent {
 
   constructor(
     public dialogRef: MatDialogRef<ReportConfigModalComponent>,
-    @Inject(MAT_DIALOG_DATA) public data: ReportConfigModalData
+    @Inject(MAT_DIALOG_DATA) public data: ReportConfigModalData,
+    public settings: SettingsService
   ) {
     // Deep copy config to avoid mutating the original until save
     this.config = JSON.parse(JSON.stringify(data.config));
diff --git a/src/app/component/team-selector/team-selector.component.html b/src/app/component/team-selector/team-selector.component.html
index be96913b..c4d17958 100644
--- a/src/app/component/team-selector/team-selector.component.html
+++ b/src/app/component/team-selector/team-selector.component.html
@@ -1,14 +1,14 @@
 <div class="config-section">
-  <h3>Teams</h3>
-  <p class="config-hint">Select which teams to include in the report.</p>
+  <h3>{{ settings.getTeamLabelPlural() }}</h3>
+  <p class="config-hint">Select which {{ settings.getTeamLabelPlural() | lowercase }} to include in the report.</p>
   <div class="select-all-actions">
     <button mat-button color="primary" (click)="selectAllTeams()">Select All</button>
     <button mat-button (click)="deselectAllTeams()">Deselect All</button>
     <span *ngIf="groupNames.length > 0" class="group-section">
-      <span class="group-label">Group:</span>
+      <span class="group-label">{{ settings.getGroupLabel() }}:</span>
       <button mat-stroked-button [matMenuTriggerFor]="groupMenu" class="group-dropdown-btn">
         <mat-icon>group</mat-icon>
-        {{ selectedGroupName || 'Select Group' }}
+        {{ selectedGroupName || 'Select ' + settings.getGroupLabel() }}
         <mat-icon>arrow_drop_down</mat-icon>
       </button>
     </span>
diff --git a/src/app/component/team-selector/team-selector.component.ts b/src/app/component/team-selector/team-selector.component.ts
index 52eef4a3..951ea00d 100644
--- a/src/app/component/team-selector/team-selector.component.ts
+++ b/src/app/component/team-selector/team-selector.component.ts
@@ -1,5 +1,6 @@
 import { Component, Input, Output, EventEmitter } from '@angular/core';
 import { TeamGroups } from '../../model/types';
+import { SettingsService } from 'src/app/service/settings/settings.service';
 
 @Component({
   selector: 'app-team-selector',
@@ -15,6 +16,8 @@ export class TeamSelectorComponent {
 
   selectedGroupName: string = '';
 
+  constructor(public settings: SettingsService) {}
+
   isTeamSelected(team: string): boolean {
     return this.selectedTeams.includes(team);
   }
diff --git a/src/app/component/teams-groups-editor/teams-groups-editor.component.html b/src/app/component/teams-groups-editor/teams-groups-editor.component.html
index cc1614ed..1e6df9c0 100644
--- a/src/app/component/teams-groups-editor/teams-groups-editor.component.html
+++ b/src/app/component/teams-groups-editor/teams-groups-editor.component.html
@@ -2,7 +2,7 @@
 <div class="editor-container">
   <div class="editor-list-panel">
     <app-selectable-list
-      title="Groups"
+      [title]="settings.getGroupLabelPlural()"
       [items]="keys(localCopyTeamGroups)"
       [selectedItem]="selectedGroup"
       [highlightedItems]="highlightedGroups"
@@ -20,7 +20,7 @@
   </div>
   <div class="editor-list-panel">
     <app-selectable-list
-      title="Teams"
+      [title]="settings.getTeamLabelPlural()"
       [items]="localCopyTeams"
       [selectedItem]="selectedTeam"
       [highlightedItems]="highlightedTeams"
diff --git a/src/app/component/teams-groups-editor/teams-groups-editor.component.ts b/src/app/component/teams-groups-editor/teams-groups-editor.component.ts
index 8b2c5266..c80dbc69 100644
--- a/src/app/component/teams-groups-editor/teams-groups-editor.component.ts
+++ b/src/app/component/teams-groups-editor/teams-groups-editor.component.ts
@@ -2,6 +2,7 @@
 import { Component, Input, Output, EventEmitter, OnChanges } from '@angular/core';
 import { GroupName, TeamGroups, TeamName, TeamNames } from 'src/app/model/types';
 import { perfNow, renameArrayElement } from 'src/app/util/util';
+import { SettingsService } from 'src/app/service/settings/settings.service';
 
 enum EditMode {
   NONE,
@@ -49,6 +50,8 @@ export class TeamsGroupsEditorComponent implements OnChanges {
   localCopyTeamsRenamed: Record<TeamName, TeamName> = {};
   localCopyTeamGroups: TeamGroups = {};
 
+  constructor(public settings: SettingsService) {}
+
   ngOnChanges() {
     this.makeLocalCopy();
 
@@ -159,7 +162,7 @@ export class TeamsGroupsEditorComponent implements OnChanges {
   }
 
   onAddTeam() {
-    let newName: string = this.findNextName(this.localCopyTeams, 'Team');
+    let newName: string = this.findNextName(this.localCopyTeams, this.settings.getTeamLabel());
     this.localCopyTeams.push(newName);
     this.onTeamSelected(newName);
   }
@@ -194,7 +197,7 @@ export class TeamsGroupsEditorComponent implements OnChanges {
   }
 
   onAddGroup() {
-    let newName: string = this.findNextName(this.keys(this.localCopyTeamGroups), 'Group');
+    let newName: string = this.findNextName(this.keys(this.localCopyTeamGroups), this.settings.getGroupLabel());
     this.localCopyTeamGroups[newName] = [];
     this.onGroupSelected(newName);
   }
diff --git a/src/app/pages/circular-heatmap/circular-heatmap.component.html b/src/app/pages/circular-heatmap/circular-heatmap.component.html
index 6e970187..91e609eb 100644
--- a/src/app/pages/circular-heatmap/circular-heatmap.component.html
+++ b/src/app/pages/circular-heatmap/circular-heatmap.component.html
@@ -35,7 +35,7 @@ <h2>Nothing to show</h2>
           </button>
           <div class="team-filter" [class.hidden]="!showFilters">
             <mat-form-field class="team-chip-list">
-              <mat-label>Team Group Filter</mat-label>
+              <mat-label>{{ settings.getTeamLabel() }} {{ settings.getGroupLabel() }} Filter</mat-label>
               <mat-chip-list selectable>
                 <mat-chip
                   #chip="matChip"
@@ -47,7 +47,7 @@ <h2>Nothing to show</h2>
               </mat-chip-list>
             </mat-form-field>
             <mat-form-field>
-              <mat-label>Team Filter</mat-label>
+              <mat-label>{{ settings.getTeamLabel() }} Filter</mat-label>
               <mat-chip-list selectable multiple>
                 <mat-chip
                   #chip="matChip"
@@ -116,14 +116,14 @@ <h2>Nothing to show</h2>
             mat-raised-button
             class="downloadButtonClass"
             (click)="exportTeamProgress()">
-            Download team progress
+            Download {{ settings.getTeamLabel() | lowercase }} progress
           </button>
           <button
             class="normal-button"
             mat-raised-button
             class="resetButtonClass"
             (click)="deleteLocalTeamsProgress()">
-            Delete team progress
+            Delete {{ settings.getTeamLabel() | lowercase }} progress
           </button>
         </div>
       </div>
diff --git a/src/app/pages/circular-heatmap/circular-heatmap.component.ts b/src/app/pages/circular-heatmap/circular-heatmap.component.ts
index f871f449..1c6897dd 100644
--- a/src/app/pages/circular-heatmap/circular-heatmap.component.ts
+++ b/src/app/pages/circular-heatmap/circular-heatmap.component.ts
@@ -64,7 +64,7 @@ export class CircularHeatmapComponent implements OnInit, OnDestroy {
   constructor(
     private loader: LoaderService,
     private sectorService: SectorService,
-    private settings: SettingsService,
+    public settings: SettingsService,
     private themeService: ThemeService,
     private titleService: TitleService,
     private router: Router,
diff --git a/src/app/pages/report/report.component.html b/src/app/pages/report/report.component.html
index d5eb4529..0fec8bba 100644
--- a/src/app/pages/report/report.component.html
+++ b/src/app/pages/report/report.component.html
@@ -13,7 +13,7 @@
     <span class="activity-count" *ngIf="!isLoading">
       {{ totalFilteredActivities }} activities
       <span *ngIf="reportConfig.selectedTeams.length > 0">
-        · {{ reportConfig.selectedTeams.length }} teams
+        · {{ reportConfig.selectedTeams.length }} {{ settings.getTeamLabelPlural() | lowercase }}
       </span>
     </span>
   </div>
diff --git a/src/app/pages/report/report.component.ts b/src/app/pages/report/report.component.ts
index 51d9c147..40cb2407 100644
--- a/src/app/pages/report/report.component.ts
+++ b/src/app/pages/report/report.component.ts
@@ -62,7 +62,7 @@ export class ReportComponent implements OnInit {
 
   constructor(
     private loader: LoaderService,
-    private settings: SettingsService,
+    public settings: SettingsService,
     private dialog: MatDialog
   ) {
     this.reportConfig = getReportConfig();
diff --git a/src/app/pages/settings/settings.component.html b/src/app/pages/settings/settings.component.html
index 6eb5eb38..f8f6b172 100644
--- a/src/app/pages/settings/settings.component.html
+++ b/src/app/pages/settings/settings.component.html
@@ -34,6 +34,19 @@
         <span class="caption">{{ selectedMaxLevelCaption }}</span>
       </div>
     </mat-card-content>
+
+    <mat-card-content>
+      <div class="terminology-container" style="display: flex; gap: 16px; flex-wrap: wrap; margin-top: 16px;">
+        <mat-form-field appearance="fill">
+          <mat-label>Custom Team Terminology</mat-label>
+          <input matInput placeholder="e.g. App" name="customTeamLabel" [(ngModel)]="customTeamLabel" (ngModelChange)="onTeamLabelChange()">
+        </mat-form-field>
+        <mat-form-field appearance="fill">
+          <mat-label>Custom Group Terminology</mat-label>
+          <input matInput placeholder="e.g. Portfolio" name="customGroupLabel" [(ngModel)]="customGroupLabel" (ngModelChange)="onGroupLabelChange()">
+        </mat-form-field>
+      </div>
+    </mat-card-content>
   </mat-card>
 
   <mat-card class="progress-definitions-section">
diff --git a/src/app/pages/settings/settings.component.spec.ts b/src/app/pages/settings/settings.component.spec.ts
index 599bcfca..085878a7 100644
--- a/src/app/pages/settings/settings.component.spec.ts
+++ b/src/app/pages/settings/settings.component.spec.ts
@@ -43,7 +43,11 @@ describe('SettingsComponent', () => {
       'setMaxLevel',
       'getDateFormat',
       'setDateFormat',
+      'getTeamLabel',
+      'getGroupLabel',
     ]);
+    settingsService.getTeamLabel.and.returnValue('Team');
+    settingsService.getGroupLabel.and.returnValue('Group');
     modalComponent = jasmine.createSpyObj('ModalMessageComponent', ['openDialog']);
 
     await TestBed.configureTestingModule({
diff --git a/src/app/pages/settings/settings.component.ts b/src/app/pages/settings/settings.component.ts
index f11c66b1..cdb1014a 100644
--- a/src/app/pages/settings/settings.component.ts
+++ b/src/app/pages/settings/settings.component.ts
@@ -61,6 +61,9 @@ export class SettingsComponent implements OnInit {
   ];
   selectedDateFormat: string = this.BROWSER_LOCALE;
 
+  customTeamLabel: string = 'Team';
+  customGroupLabel: string = 'Group';
+
   // GitHub release check state
   checkingLatest: boolean = false;
   latestReleaseInfo: GithubReleaseInfo | null = null;
@@ -145,6 +148,8 @@ export class SettingsComponent implements OnInit {
 
   initialize(): void {
     this.selectedDateFormat = this.settings.getDateFormat() || this.BROWSER_LOCALE;
+    this.customTeamLabel = this.settings.getTeamLabel();
+    this.customGroupLabel = this.settings.getGroupLabel();
 
     // Init dates
     let date: Date = new Date();
@@ -179,6 +184,14 @@ export class SettingsComponent implements OnInit {
     this.settings.setDateFormat(value);
   }
 
+  onTeamLabelChange(): void {
+    this.settings.setTeamLabel(this.customTeamLabel);
+  }
+
+  onGroupLabelChange(): void {
+    this.settings.setGroupLabel(this.customGroupLabel);
+  }
+
   onMaxLevelChange(value: number | null): void {
     if (value == null) value = this.dataStoreMaxLevel;
     if (value == this.dataStoreMaxLevel) {
diff --git a/src/app/pages/teams/teams.component.html b/src/app/pages/teams/teams.component.html
index 9dce214e..ac8a2e99 100644
--- a/src/app/pages/teams/teams.component.html
+++ b/src/app/pages/teams/teams.component.html
@@ -1,4 +1,4 @@
-<app-top-header section="Teams &amp; Groups"></app-top-header>
+<app-top-header [section]="settings.getTeamLabelPlural() + ' & ' + settings.getGroupLabelPlural()"></app-top-header>
 <div class="team-section">
   <app-teams-groups-editor
     [teams]="teams"
@@ -8,8 +8,8 @@
     (namesChanged)="onTeamsChanged($event)"
     (click)="$event.stopPropagation()"></app-teams-groups-editor>
   <div class="button-container" *ngIf="dataStore?.meta?.hasLocalStorage">
-    <button mat-raised-button (click)="onExportTeamGroups()">Download team setup</button>
-    <button mat-raised-button (click)="onResetTeamGroups()">Reset team setup</button>
+    <button mat-raised-button (click)="onExportTeamGroups()">Download {{ settings.getTeamLabel() | lowercase }} setup</button>
+    <button mat-raised-button (click)="onResetTeamGroups()">Reset {{ settings.getTeamLabel() | lowercase }} setup</button>
   </div>
 
   <div class="team-info">
@@ -37,7 +37,7 @@ <h2>{{ infoTitle }}</h2>
     <h3>Activities in progress</h3>
     <table mat-table matSort [dataSource]="dataSource || []" class="mat-elevation-z8 teams-table">
       <ng-container matColumnDef="Team">
-        <th mat-header-cell mat-sort-header *matHeaderCellDef class="table-small-width">Team</th>
+        <th mat-header-cell mat-sort-header *matHeaderCellDef class="table-small-width">{{ settings.getTeamLabel() }}</th>
         <td mat-cell *matCellDef="let element" class="table-small-width">
           {{ element?.team }}
         </td>
diff --git a/src/app/pages/teams/teams.component.ts b/src/app/pages/teams/teams.component.ts
index c16b10b6..8098d858 100644
--- a/src/app/pages/teams/teams.component.ts
+++ b/src/app/pages/teams/teams.component.ts
@@ -161,7 +161,10 @@ export class TeamsComponent implements OnInit, AfterViewInit {
 
     if (!yamlStr) {
       this.displayMessage(
-        new DialogInfo('No team and groups names stored locally in the browser', 'Export Error')
+        new DialogInfo(
+          `No ${this.settings.getTeamLabel().toLowerCase()} and ${this.settings.getGroupLabelPlural().toLowerCase()} names stored locally in the browser`,
+          'Export Error'
+        )
       );
       return;
     }
@@ -182,7 +185,7 @@ export class TeamsComponent implements OnInit, AfterViewInit {
     return new Promise((resolve, reject) => {
       let title: string = 'Delete local browser data';
       let message: string =
-        'Do you want to reset all team and group names?' +
+        `Do you want to reset all ${this.settings.getTeamLabel().toLowerCase()} and ${this.settings.getGroupLabel().toLowerCase()} names?` +
         '\n\nThis will revert the names to the names stored in the yaml file on the server.';
       let buttons: string[] = ['Cancel', 'Delete'];
       this.modal
diff --git a/src/app/service/settings/settings.service.ts b/src/app/service/settings/settings.service.ts
index 89fe9bce..c17883ff 100644
--- a/src/app/service/settings/settings.service.ts
+++ b/src/app/service/settings/settings.service.ts
@@ -6,9 +6,13 @@ import { Injectable } from '@angular/core';
 export class SettingsService {
   private readonly KEY_DATEFORMAT = 'settings.dateformat';
   private readonly KEY_MAX_LEVEL = 'settings.maxlevel';
+  private readonly KEY_TEAM_LABEL = 'settings.teamLabel';
+  private readonly KEY_GROUP_LABEL = 'settings.groupLabel';
 
   private dateformat: string | null = null;
   private maxLevel: number | null = null;
+  private _teamLabel: string | null = null;
+  private _groupLabel: string | null = null;
 
   getDateFormat(): string | null {
     if (this.dateformat == null) {
@@ -34,6 +38,44 @@ export class SettingsService {
     this.saveSettings(this.KEY_MAX_LEVEL, maxLevel);
   }
 
+  getTeamLabel(): string {
+    if (this._teamLabel == null) {
+      this._teamLabel = this.getSettings(this.KEY_TEAM_LABEL) || 'Team';
+    }
+    return this._teamLabel || 'Team';
+  }
+
+  getTeamLabelPlural(): string {
+    const label = this.getTeamLabel();
+    if (label.toLowerCase() === 'team') return label === 'Team' ? 'Teams' : 'teams';
+    return label.endsWith('s') ? label : label + 's';
+  }
+
+  setTeamLabel(label: string | null): void {
+    const val = label?.trim() || 'Team';
+    this._teamLabel = val;
+    this.saveSettings(this.KEY_TEAM_LABEL, val === 'Team' ? null : val);
+  }
+
+  getGroupLabel(): string {
+    if (this._groupLabel == null) {
+      this._groupLabel = this.getSettings(this.KEY_GROUP_LABEL) || 'Group';
+    }
+    return this._groupLabel || 'Group';
+  }
+
+  getGroupLabelPlural(): string {
+    const label = this.getGroupLabel();
+    if (label.toLowerCase() === 'group') return label === 'Group' ? 'Groups' : 'groups';
+    return label.endsWith('s') ? label : label + 's';
+  }
+
+  setGroupLabel(label: string | null): void {
+    const val = label?.trim() || 'Group';
+    this._groupLabel = val;
+    this.saveSettings(this.KEY_GROUP_LABEL, val === 'Group' ? null : val);
+  }
+
   getSettingsNumber(key: string): number | null {
     let setting: string | null = localStorage.getItem(key);
     if (setting == null) {

From 6d800a997ca0620e85fc735e0dd4201db88ffaf2 Mon Sep 17 00:00:00 2001
From: Hisham'sLocal <hrs8606663468@gmail.com>
Date: Wed, 25 Mar 2026 23:57:29 +0530
Subject: [PATCH 2/2] fix:test and lint fix

---
 .../activity-description.component.html        | 10 ++++++++--
 .../activity-description.component.ts          |  5 +----
 .../team-selector/team-selector.component.html |  4 +++-
 .../teams-groups-editor.component.ts           |  5 ++++-
 .../circular-heatmap.component.html            |  4 +++-
 src/app/pages/settings/settings.component.html | 18 +++++++++++++++---
 src/app/pages/teams/teams.component.html       | 17 +++++++++++++----
 src/app/pages/teams/teams.component.ts         |  8 ++++++--
 8 files changed, 53 insertions(+), 18 deletions(-)

diff --git a/src/app/component/activity-description/activity-description.component.html b/src/app/component/activity-description/activity-description.component.html
index f29cfca2..d141e833 100644
--- a/src/app/component/activity-description/activity-description.component.html
+++ b/src/app/component/activity-description/activity-description.component.html
@@ -349,7 +349,10 @@ <h4 class="tool-name" [innerHTML]="implement['name']"></h4>
               </span>
             </span>
             <span class="ref-section" *ngIf="teamsImplemented.size === 0">
-              <span class="ref-values">No {{ settings.getTeamLabelPlural() | lowercase }} have started this activity yet</span>
+              <span class="ref-values"
+                >No {{ settings.getTeamLabelPlural() | lowercase }} have started this activity
+                yet</span
+              >
             </span>
           </div>
         </mat-panel-title>
@@ -367,7 +370,10 @@ <h4 class="tool-name" [innerHTML]="implement['name']"></h4>
         </div>
       </div>
       <ng-template #noTeamsBlock>
-        <p>No {{ settings.getTeamLabelPlural() | lowercase }} have started implementing this activity yet.</p>
+        <p>
+          No {{ settings.getTeamLabelPlural() | lowercase }} have started implementing this activity
+          yet.
+        </p>
       </ng-template>
     </mat-expansion-panel>
   </mat-accordion>
diff --git a/src/app/component/activity-description/activity-description.component.ts b/src/app/component/activity-description/activity-description.component.ts
index b49322ba..77a1aa9b 100644
--- a/src/app/component/activity-description/activity-description.component.ts
+++ b/src/app/component/activity-description/activity-description.component.ts
@@ -44,10 +44,7 @@ export class ActivityDescriptionComponent implements OnInit, OnChanges {
 
   @ViewChildren(MatAccordion) accordion!: QueryList<MatAccordion>;
 
-  constructor(
-    private loader: LoaderService,
-    public settings: SettingsService
-  ) {}
+  constructor(private loader: LoaderService, public settings: SettingsService) {}
 
   ngOnInit() {
     // Set activity data if provided
diff --git a/src/app/component/team-selector/team-selector.component.html b/src/app/component/team-selector/team-selector.component.html
index c4d17958..39efbae4 100644
--- a/src/app/component/team-selector/team-selector.component.html
+++ b/src/app/component/team-selector/team-selector.component.html
@@ -1,6 +1,8 @@
 <div class="config-section">
   <h3>{{ settings.getTeamLabelPlural() }}</h3>
-  <p class="config-hint">Select which {{ settings.getTeamLabelPlural() | lowercase }} to include in the report.</p>
+  <p class="config-hint">
+    Select which {{ settings.getTeamLabelPlural() | lowercase }} to include in the report.
+  </p>
   <div class="select-all-actions">
     <button mat-button color="primary" (click)="selectAllTeams()">Select All</button>
     <button mat-button (click)="deselectAllTeams()">Deselect All</button>
diff --git a/src/app/component/teams-groups-editor/teams-groups-editor.component.ts b/src/app/component/teams-groups-editor/teams-groups-editor.component.ts
index c80dbc69..3324932b 100644
--- a/src/app/component/teams-groups-editor/teams-groups-editor.component.ts
+++ b/src/app/component/teams-groups-editor/teams-groups-editor.component.ts
@@ -197,7 +197,10 @@ export class TeamsGroupsEditorComponent implements OnChanges {
   }
 
   onAddGroup() {
-    let newName: string = this.findNextName(this.keys(this.localCopyTeamGroups), this.settings.getGroupLabel());
+    let newName: string = this.findNextName(
+      this.keys(this.localCopyTeamGroups),
+      this.settings.getGroupLabel()
+    );
     this.localCopyTeamGroups[newName] = [];
     this.onGroupSelected(newName);
   }
diff --git a/src/app/pages/circular-heatmap/circular-heatmap.component.html b/src/app/pages/circular-heatmap/circular-heatmap.component.html
index 91e609eb..8d713e4e 100644
--- a/src/app/pages/circular-heatmap/circular-heatmap.component.html
+++ b/src/app/pages/circular-heatmap/circular-heatmap.component.html
@@ -35,7 +35,9 @@ <h2>Nothing to show</h2>
           </button>
           <div class="team-filter" [class.hidden]="!showFilters">
             <mat-form-field class="team-chip-list">
-              <mat-label>{{ settings.getTeamLabel() }} {{ settings.getGroupLabel() }} Filter</mat-label>
+              <mat-label
+                >{{ settings.getTeamLabel() }} {{ settings.getGroupLabel() }} Filter</mat-label
+              >
               <mat-chip-list selectable>
                 <mat-chip
                   #chip="matChip"
diff --git a/src/app/pages/settings/settings.component.html b/src/app/pages/settings/settings.component.html
index f8f6b172..260e9756 100644
--- a/src/app/pages/settings/settings.component.html
+++ b/src/app/pages/settings/settings.component.html
@@ -36,14 +36,26 @@
     </mat-card-content>
 
     <mat-card-content>
-      <div class="terminology-container" style="display: flex; gap: 16px; flex-wrap: wrap; margin-top: 16px;">
+      <div
+        class="terminology-container"
+        style="display: flex; gap: 16px; flex-wrap: wrap; margin-top: 16px">
         <mat-form-field appearance="fill">
           <mat-label>Custom Team Terminology</mat-label>
-          <input matInput placeholder="e.g. App" name="customTeamLabel" [(ngModel)]="customTeamLabel" (ngModelChange)="onTeamLabelChange()">
+          <input
+            matInput
+            placeholder="e.g. App"
+            name="customTeamLabel"
+            [(ngModel)]="customTeamLabel"
+            (ngModelChange)="onTeamLabelChange()" />
         </mat-form-field>
         <mat-form-field appearance="fill">
           <mat-label>Custom Group Terminology</mat-label>
-          <input matInput placeholder="e.g. Portfolio" name="customGroupLabel" [(ngModel)]="customGroupLabel" (ngModelChange)="onGroupLabelChange()">
+          <input
+            matInput
+            placeholder="e.g. Portfolio"
+            name="customGroupLabel"
+            [(ngModel)]="customGroupLabel"
+            (ngModelChange)="onGroupLabelChange()" />
         </mat-form-field>
       </div>
     </mat-card-content>
diff --git a/src/app/pages/teams/teams.component.html b/src/app/pages/teams/teams.component.html
index ac8a2e99..60d8f8a2 100644
--- a/src/app/pages/teams/teams.component.html
+++ b/src/app/pages/teams/teams.component.html
@@ -1,4 +1,7 @@
-<app-top-header [section]="settings.getTeamLabelPlural() + ' & ' + settings.getGroupLabelPlural()"></app-top-header>
+<app-top-header
+  [section]="
+    settings.getTeamLabelPlural() + ' & ' + settings.getGroupLabelPlural()
+  "></app-top-header>
 <div class="team-section">
   <app-teams-groups-editor
     [teams]="teams"
@@ -8,8 +11,12 @@
     (namesChanged)="onTeamsChanged($event)"
     (click)="$event.stopPropagation()"></app-teams-groups-editor>
   <div class="button-container" *ngIf="dataStore?.meta?.hasLocalStorage">
-    <button mat-raised-button (click)="onExportTeamGroups()">Download {{ settings.getTeamLabel() | lowercase }} setup</button>
-    <button mat-raised-button (click)="onResetTeamGroups()">Reset {{ settings.getTeamLabel() | lowercase }} setup</button>
+    <button mat-raised-button (click)="onExportTeamGroups()">
+      Download {{ settings.getTeamLabel() | lowercase }} setup
+    </button>
+    <button mat-raised-button (click)="onResetTeamGroups()">
+      Reset {{ settings.getTeamLabel() | lowercase }} setup
+    </button>
   </div>
 
   <div class="team-info">
@@ -37,7 +44,9 @@ <h2>{{ infoTitle }}</h2>
     <h3>Activities in progress</h3>
     <table mat-table matSort [dataSource]="dataSource || []" class="mat-elevation-z8 teams-table">
       <ng-container matColumnDef="Team">
-        <th mat-header-cell mat-sort-header *matHeaderCellDef class="table-small-width">{{ settings.getTeamLabel() }}</th>
+        <th mat-header-cell mat-sort-header *matHeaderCellDef class="table-small-width">
+          {{ settings.getTeamLabel() }}
+        </th>
         <td mat-cell *matCellDef="let element" class="table-small-width">
           {{ element?.team }}
         </td>
diff --git a/src/app/pages/teams/teams.component.ts b/src/app/pages/teams/teams.component.ts
index 8098d858..5f238c8f 100644
--- a/src/app/pages/teams/teams.component.ts
+++ b/src/app/pages/teams/teams.component.ts
@@ -162,7 +162,9 @@ export class TeamsComponent implements OnInit, AfterViewInit {
     if (!yamlStr) {
       this.displayMessage(
         new DialogInfo(
-          `No ${this.settings.getTeamLabel().toLowerCase()} and ${this.settings.getGroupLabelPlural().toLowerCase()} names stored locally in the browser`,
+          `No ${this.settings.getTeamLabel().toLowerCase()} and ${this.settings
+            .getGroupLabelPlural()
+            .toLowerCase()} names stored locally in the browser`,
           'Export Error'
         )
       );
@@ -185,7 +187,9 @@ export class TeamsComponent implements OnInit, AfterViewInit {
     return new Promise((resolve, reject) => {
       let title: string = 'Delete local browser data';
       let message: string =
-        `Do you want to reset all ${this.settings.getTeamLabel().toLowerCase()} and ${this.settings.getGroupLabel().toLowerCase()} names?` +
+        `Do you want to reset all ${this.settings.getTeamLabel().toLowerCase()} and ${this.settings
+          .getGroupLabel()
+          .toLowerCase()} names?` +
         '\n\nThis will revert the names to the names stored in the yaml file on the server.';
       let buttons: string[] = ['Cancel', 'Delete'];
       this.modal