1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-17 00:33:44 +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,6 @@
// FIXME: Update this file to be type safe and remove this and next line
// @ts-strict-ignore
import { Directive, HostListener, Input, OnDestroy, Optional } from "@angular/core";
import { Directive, HostListener, model, OnDestroy, Optional } from "@angular/core";
import { BehaviorSubject, finalize, Subject, takeUntil, tap } from "rxjs";
import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
@@ -38,7 +38,7 @@ export class BitActionDirective implements OnDestroy {
disabled = false;
@Input("bitAction") handler: FunctionReturningAwaitable;
readonly handler = model<FunctionReturningAwaitable>(undefined, { alias: "bitAction" });
constructor(
private buttonComponent: ButtonLikeAbstraction,
@@ -48,12 +48,12 @@ export class BitActionDirective implements OnDestroy {
@HostListener("click")
protected async onClick() {
if (!this.handler || this.loading || this.disabled || this.buttonComponent.disabled()) {
if (!this.handler() || this.loading || this.disabled || this.buttonComponent.disabled()) {
return;
}
this.loading = true;
functionToObservable(this.handler)
functionToObservable(this.handler())
.pipe(
tap({
error: (err: unknown) => {

View File

@@ -1,6 +1,6 @@
// FIXME: Update this file to be type safe and remove this and next line
// @ts-strict-ignore
import { Directive, Input, OnDestroy, OnInit, Optional } from "@angular/core";
import { Directive, OnDestroy, OnInit, Optional, input } from "@angular/core";
import { FormGroupDirective } from "@angular/forms";
import { BehaviorSubject, catchError, filter, of, Subject, switchMap, takeUntil } from "rxjs";
@@ -20,9 +20,9 @@ export class BitSubmitDirective implements OnInit, OnDestroy {
private _loading$ = new BehaviorSubject<boolean>(false);
private _disabled$ = new BehaviorSubject<boolean>(false);
@Input("bitSubmit") handler: FunctionReturningAwaitable;
readonly handler = input<FunctionReturningAwaitable>(undefined, { alias: "bitSubmit" });
@Input() allowDisabledFormSubmit?: boolean = false;
readonly allowDisabledFormSubmit = input<boolean>(false);
readonly loading$ = this._loading$.asObservable();
readonly disabled$ = this._disabled$.asObservable();
@@ -38,7 +38,7 @@ export class BitSubmitDirective implements OnInit, OnDestroy {
switchMap(() => {
// Calling functionToObservable executes the sync part of the handler
// allowing the function to check form validity before it gets disabled.
const awaitable = functionToObservable(this.handler);
const awaitable = functionToObservable(this.handler());
// Disable form
this.loading = true;
@@ -61,7 +61,7 @@ export class BitSubmitDirective implements OnInit, OnDestroy {
ngOnInit(): void {
this.formGroupDirective.statusChanges.pipe(takeUntil(this.destroy$)).subscribe((c) => {
if (this.allowDisabledFormSubmit) {
if (this.allowDisabledFormSubmit()) {
this._disabled$.next(false);
} else {
this._disabled$.next(c === "DISABLED");

View File

@@ -1,6 +1,6 @@
// FIXME: Update this file to be type safe and remove this and next line
// @ts-strict-ignore
import { Directive, Input, OnDestroy, Optional } from "@angular/core";
import { Directive, OnDestroy, Optional, input } from "@angular/core";
import { Subject, takeUntil } from "rxjs";
import { ButtonLikeAbstraction } from "../shared/button-like.abstraction";
@@ -29,8 +29,8 @@ import { BitSubmitDirective } from "./bit-submit.directive";
export class BitFormButtonDirective implements OnDestroy {
private destroy$ = new Subject<void>();
@Input() type: string;
@Input() disabled?: boolean;
readonly type = input<string>();
readonly disabled = input<boolean>();
constructor(
buttonComponent: ButtonLikeAbstraction,
@@ -39,16 +39,17 @@ export class BitFormButtonDirective implements OnDestroy {
) {
if (submitDirective && buttonComponent) {
submitDirective.loading$.pipe(takeUntil(this.destroy$)).subscribe((loading) => {
if (this.type === "submit") {
if (this.type() === "submit") {
buttonComponent.loading.set(loading);
} else {
buttonComponent.disabled.set(this.disabled || loading);
buttonComponent.disabled.set(this.disabled() || loading);
}
});
submitDirective.disabled$.pipe(takeUntil(this.destroy$)).subscribe((disabled) => {
if (this.disabled !== false) {
buttonComponent.disabled.set(this.disabled || disabled);
const disabledValue = this.disabled();
if (disabledValue !== false) {
buttonComponent.disabled.set(disabledValue || disabled);
}
});
}

View File

@@ -22,7 +22,6 @@ const template = /*html*/ `
template,
selector: "app-promise-example",
imports: [AsyncActionsModule, ButtonModule, IconButtonModule],
standalone: true,
})
class PromiseExampleComponent {
statusEmoji = "🟡";