1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-12 06:13:38 +00:00

[CL-707] Migrate CL codebase to signals (#15340)

This commit is contained in:
Vicki League
2025-07-16 08:39:37 -04:00
committed by GitHub
parent 97ec9a6339
commit 6811ea4c0b
124 changed files with 944 additions and 809 deletions

View File

@@ -1,6 +1,5 @@
// FIXME: Update this file to be type safe and remove this and next line
// @ts-strict-ignore
import { coerceBooleanProperty } from "@angular/cdk/coercion";
import { hasModifierKey } from "@angular/cdk/keycodes";
import {
Component,
@@ -12,6 +11,9 @@ import {
HostBinding,
Optional,
Self,
input,
model,
booleanAttribute,
} from "@angular/core";
import {
ControlValueAccessor,
@@ -38,6 +40,9 @@ let nextId = 0;
templateUrl: "./multi-select.component.html",
providers: [{ provide: BitFormFieldControl, useExisting: MultiSelectComponent }],
imports: [NgSelectModule, ReactiveFormsModule, FormsModule, BadgeModule, I18nPipe],
host: {
"[id]": "this.id()",
},
})
/**
* This component has been implemented to only support Multi-select list events
@@ -46,12 +51,14 @@ export class MultiSelectComponent implements OnInit, BitFormFieldControl, Contro
@ViewChild(NgSelectComponent) select: NgSelectComponent;
// Parent component should only pass selectable items (complete list - selected items = baseItems)
@Input() baseItems: SelectItemView[];
readonly baseItems = model<SelectItemView[]>();
// Defaults to native ng-select behavior - set to "true" to clear selected items on dropdown close
@Input() removeSelectedItems = false;
@Input() placeholder: string;
@Input() loading = false;
@Input({ transform: coerceBooleanProperty }) disabled?: boolean;
readonly removeSelectedItems = input(false);
readonly placeholder = model<string>();
readonly loading = input(false);
// TODO: Skipped for signal migration because:
// Your application code writes to the input. This prevents migration.
@Input({ transform: booleanAttribute }) disabled?: boolean;
// Internal tracking of selected items
protected selectedItems: SelectItemView[];
@@ -79,7 +86,9 @@ export class MultiSelectComponent implements OnInit, BitFormFieldControl, Contro
ngOnInit(): void {
// Default Text Values
this.placeholder = this.placeholder ?? this.i18nService.t("multiSelectPlaceholder");
this.placeholder.update(
(placeholder) => placeholder ?? this.i18nService.t("multiSelectPlaceholder"),
);
this.loadingText = this.i18nService.t("multiSelectLoading");
}
@@ -119,15 +128,15 @@ export class MultiSelectComponent implements OnInit, BitFormFieldControl, Contro
this.onItemsConfirmed.emit(this.selectedItems);
// Remove selected items from base list based on input property
if (this.removeSelectedItems) {
let updatedBaseItems = this.baseItems;
if (this.removeSelectedItems()) {
let updatedBaseItems = this.baseItems();
this.selectedItems.forEach((selectedItem) => {
updatedBaseItems = updatedBaseItems.filter((item) => selectedItem.id !== item.id);
});
// Reset Lists
this.selectedItems = null;
this.baseItems = updatedBaseItems;
this.baseItems.set(updatedBaseItems);
}
}
@@ -186,9 +195,11 @@ export class MultiSelectComponent implements OnInit, BitFormFieldControl, Contro
}
/**Implemented as part of BitFormFieldControl */
@HostBinding() @Input() id = `bit-multi-select-${nextId++}`;
readonly id = input(`bit-multi-select-${nextId++}`);
/**Implemented as part of BitFormFieldControl */
// TODO: Skipped for signal migration because:
// Accessor inputs cannot be migrated as they are too complex.
@HostBinding("attr.required")
@Input()
get required() {