diff --git a/apps/web/src/app/admin-console/organizations/collections/group-badge/group-name-badge.component.html b/apps/web/src/app/admin-console/organizations/collections/group-badge/group-name-badge.component.html
index 9ddc9897a31..a8021e82c39 100644
--- a/apps/web/src/app/admin-console/organizations/collections/group-badge/group-name-badge.component.html
+++ b/apps/web/src/app/admin-console/organizations/collections/group-badge/group-name-badge.component.html
@@ -1 +1 @@
-
+
diff --git a/apps/web/src/app/admin-console/organizations/collections/group-badge/group-name-badge.component.ts b/apps/web/src/app/admin-console/organizations/collections/group-badge/group-name-badge.component.ts
index 8a58f5b92d7..3c1d0d2b691 100644
--- a/apps/web/src/app/admin-console/organizations/collections/group-badge/group-name-badge.component.ts
+++ b/apps/web/src/app/admin-console/organizations/collections/group-badge/group-name-badge.component.ts
@@ -1,36 +1,33 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
-import { Component, Input, OnChanges } from "@angular/core";
+import { ChangeDetectionStrategy, Component, computed, input } from "@angular/core";
import { SelectionReadOnlyRequest } from "@bitwarden/common/admin-console/models/request/selection-read-only.request";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
import { GroupView } from "../../core";
-// FIXME(https://bitwarden.atlassian.net/browse/CL-764): Migrate to OnPush
-// eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection
@Component({
selector: "app-group-badge",
templateUrl: "group-name-badge.component.html",
standalone: false,
+ changeDetection: ChangeDetectionStrategy.OnPush,
})
-export class GroupNameBadgeComponent implements OnChanges {
- // FIXME(https://bitwarden.atlassian.net/browse/CL-903): Migrate to Signals
- // eslint-disable-next-line @angular-eslint/prefer-signals
- @Input() selectedGroups: SelectionReadOnlyRequest[];
- // FIXME(https://bitwarden.atlassian.net/browse/CL-903): Migrate to Signals
- // eslint-disable-next-line @angular-eslint/prefer-signals
- @Input() allGroups: GroupView[];
+export class GroupNameBadgeComponent {
+ readonly selectedGroups = input([]);
+ readonly allGroups = input([]);
- protected groupNames: string[] = [];
+ protected readonly groupNames = computed(() => {
+ const allGroups = this.allGroups();
+ if (!allGroups) {
+ return [];
+ }
+
+ return this.selectedGroups()
+ .map((g) => {
+ return allGroups.find((o) => o.id === g.id)?.name;
+ })
+ .filter((name): name is string => name !== undefined)
+ .sort(this.i18nService.collator.compare);
+ });
constructor(private i18nService: I18nService) {}
-
- ngOnChanges() {
- this.groupNames = this.selectedGroups
- .map((g) => {
- return this.allGroups.find((o) => o.id === g.id)?.name;
- })
- .sort(this.i18nService.collator.compare);
- }
}