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:
@@ -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) => {
|
||||
|
||||
@@ -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");
|
||||
|
||||
@@ -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);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@@ -22,7 +22,6 @@ const template = /*html*/ `
|
||||
template,
|
||||
selector: "app-promise-example",
|
||||
imports: [AsyncActionsModule, ButtonModule, IconButtonModule],
|
||||
standalone: true,
|
||||
})
|
||||
class PromiseExampleComponent {
|
||||
statusEmoji = "🟡";
|
||||
|
||||
Reference in New Issue
Block a user