Resolve the issue of blank seat and seat limit pm (#10902)

This commit is contained in:
cyprain-okeke 2024-09-05 20:40:27 +01:00 committed by GitHub
parent ef3b3c1cb5
commit 397141b9d9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 25 additions and 23 deletions

View File

@ -1,6 +1,6 @@
import { Component, EventEmitter, Input, Output } from "@angular/core"; import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from "@angular/core";
import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
import { FormBuilder, Validators } from "@angular/forms"; import { FormBuilder, Validators } from "@angular/forms";
import { Subject, takeUntil } from "rxjs";
import { OrganizationApiServiceAbstraction } from "@bitwarden/common/admin-console/abstractions/organization/organization-api.service.abstraction"; import { OrganizationApiServiceAbstraction } from "@bitwarden/common/admin-console/abstractions/organization/organization-api.service.abstraction";
import { OrganizationSubscriptionUpdateRequest } from "@bitwarden/common/billing/models/request/organization-subscription-update.request"; import { OrganizationSubscriptionUpdateRequest } from "@bitwarden/common/billing/models/request/organization-subscription-update.request";
@ -11,7 +11,7 @@ import { ToastService } from "@bitwarden/components";
selector: "app-adjust-subscription", selector: "app-adjust-subscription",
templateUrl: "adjust-subscription.component.html", templateUrl: "adjust-subscription.component.html",
}) })
export class AdjustSubscription { export class AdjustSubscription implements OnInit, OnDestroy {
@Input() organizationId: string; @Input() organizationId: string;
@Input() maxAutoscaleSeats: number; @Input() maxAutoscaleSeats: number;
@Input() currentSeatCount: number; @Input() currentSeatCount: number;
@ -19,6 +19,8 @@ export class AdjustSubscription {
@Input() interval = "year"; @Input() interval = "year";
@Output() onAdjusted = new EventEmitter(); @Output() onAdjusted = new EventEmitter();
private destroy$ = new Subject<void>();
adjustSubscriptionForm = this.formBuilder.group({ adjustSubscriptionForm = this.formBuilder.group({
newSeatCount: [0, [Validators.min(0)]], newSeatCount: [0, [Validators.min(0)]],
limitSubscription: [false], limitSubscription: [false],
@ -30,29 +32,24 @@ export class AdjustSubscription {
private organizationApiService: OrganizationApiServiceAbstraction, private organizationApiService: OrganizationApiServiceAbstraction,
private formBuilder: FormBuilder, private formBuilder: FormBuilder,
private toastService: ToastService, private toastService: ToastService,
) { ) {}
ngOnInit() {
this.adjustSubscriptionForm.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((value) => {
const maxAutoscaleSeatsControl = this.adjustSubscriptionForm.controls.newMaxSeats;
if (value.limitSubscription) {
maxAutoscaleSeatsControl.setValidators([Validators.min(value.newSeatCount)]);
maxAutoscaleSeatsControl.enable({ emitEvent: false });
} else {
maxAutoscaleSeatsControl.disable({ emitEvent: false });
}
});
this.adjustSubscriptionForm.patchValue({ this.adjustSubscriptionForm.patchValue({
newSeatCount: this.currentSeatCount, newSeatCount: this.currentSeatCount,
limitSubscription: this.maxAutoscaleSeats != null,
newMaxSeats: this.maxAutoscaleSeats, newMaxSeats: this.maxAutoscaleSeats,
}); limitSubscription: this.maxAutoscaleSeats != null,
this.adjustSubscriptionForm
.get("limitSubscription")
.valueChanges.pipe(takeUntilDestroyed())
.subscribe((value: boolean) => {
if (value) {
this.adjustSubscriptionForm
.get("newMaxSeats")
.addValidators([
Validators.min(
this.adjustSubscriptionForm.value.newSeatCount == null
? 1
: this.adjustSubscriptionForm.value.newSeatCount,
),
Validators.required,
]);
}
this.adjustSubscriptionForm.get("newMaxSeats").updateValueAndValidity();
}); });
} }
@ -99,4 +96,9 @@ export class AdjustSubscription {
get limitSubscription(): boolean { get limitSubscription(): boolean {
return this.adjustSubscriptionForm.value.limitSubscription; return this.adjustSubscriptionForm.value.limitSubscription;
} }
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
} }