From d2cce5b997be70a70c0cbc691902a808bf50d8a7 Mon Sep 17 00:00:00 2001
From: Alex Morask <144709477+amorask-bitwarden@users.noreply.github.com>
Date: Fri, 16 May 2025 14:47:42 -0400
Subject: [PATCH] Fix input errors on provider setup (#14799)

---
 .../shared/payment/payment.component.ts       |  9 ++++++++
 apps/web/src/locales/en/messages.json         |  3 +++
 .../providers/setup/setup.component.ts        | 22 ++++++++++++++++---
 .../manage-tax-information.component.ts       |  8 ++-----
 4 files changed, 33 insertions(+), 9 deletions(-)

diff --git a/apps/web/src/app/billing/shared/payment/payment.component.ts b/apps/web/src/app/billing/shared/payment/payment.component.ts
index 5911e377869..75db7779a04 100644
--- a/apps/web/src/app/billing/shared/payment/payment.component.ts
+++ b/apps/web/src/app/billing/shared/payment/payment.component.ts
@@ -101,6 +101,15 @@ export class PaymentComponent implements OnInit, OnDestroy {
     this.submitted.emit(type);
   };
 
+  validate = () => {
+    if (!this.usingBankAccount) {
+      return true;
+    }
+
+    this.formGroup.controls.bankInformation.markAllAsTouched();
+    return this.formGroup.controls.bankInformation.valid;
+  };
+
   /**
    * Tokenize the payment method information entered by the user against one of our payment providers.
    *
diff --git a/apps/web/src/locales/en/messages.json b/apps/web/src/locales/en/messages.json
index d526b2b76ff..38019b96dd7 100644
--- a/apps/web/src/locales/en/messages.json
+++ b/apps/web/src/locales/en/messages.json
@@ -10611,5 +10611,8 @@
   },
   "verifyProviderBankAccountWithStatementDescriptorWarning": {
     "message": "Payment with a bank account is only available to customers in the United States. You will be required to verify your bank account. We will make a micro-deposit within the next 1-2 business days. Enter the statement descriptor code from this deposit on the provider's subscription page to verify the bank account. Failure to verify the bank account will result in a missed payment and your subscription being suspended."
+  },
+  "clickPayWithPayPal": {
+    "message": "Please click the Pay with PayPal button to add your payment method."
   }
 }
diff --git a/bitwarden_license/bit-web/src/app/admin-console/providers/setup/setup.component.ts b/bitwarden_license/bit-web/src/app/admin-console/providers/setup/setup.component.ts
index cb47b3fe28f..695c57d1fe8 100644
--- a/bitwarden_license/bit-web/src/app/admin-console/providers/setup/setup.component.ts
+++ b/bitwarden_license/bit-web/src/app/admin-console/providers/setup/setup.component.ts
@@ -9,6 +9,7 @@ import { first, takeUntil } from "rxjs/operators";
 import { ManageTaxInformationComponent } from "@bitwarden/angular/billing/components";
 import { ProviderApiServiceAbstraction } from "@bitwarden/common/admin-console/abstractions/provider/provider-api.service.abstraction";
 import { ProviderSetupRequest } from "@bitwarden/common/admin-console/models/request/provider/provider-setup.request";
+import { PaymentMethodType } from "@bitwarden/common/billing/enums";
 import { ExpandedTaxInfoUpdateRequest } from "@bitwarden/common/billing/models/request/expanded-tax-info-update.request";
 import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
 import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
@@ -118,7 +119,10 @@ export class SetupComponent implements OnInit, OnDestroy {
     try {
       this.formGroup.markAllAsTouched();
 
-      if (!this.taxInformationComponent.validate() || !this.formGroup.valid) {
+      const paymentValid = this.paymentComponent.validate();
+      const taxInformationValid = this.taxInformationComponent.validate();
+
+      if (!paymentValid || !taxInformationValid || !this.formGroup.valid) {
         return;
       }
 
@@ -162,8 +166,20 @@ export class SetupComponent implements OnInit, OnDestroy {
 
       await this.router.navigate(["/providers", provider.id]);
     } catch (e) {
-      e.message = this.i18nService.translate(e.message) || e.message;
-      this.validationService.showError(e);
+      if (
+        this.paymentComponent.selected === PaymentMethodType.PayPal &&
+        typeof e === "string" &&
+        e === "No payment method is available."
+      ) {
+        this.toastService.showToast({
+          variant: "error",
+          title: null,
+          message: this.i18nService.t("clickPayWithPayPal"),
+        });
+      } else {
+        e.message = this.i18nService.translate(e.message) || e.message;
+        this.validationService.showError(e);
+      }
     }
   };
 }
diff --git a/libs/angular/src/billing/components/manage-tax-information/manage-tax-information.component.ts b/libs/angular/src/billing/components/manage-tax-information/manage-tax-information.component.ts
index 7088d8edfcc..57306d66b4b 100644
--- a/libs/angular/src/billing/components/manage-tax-information/manage-tax-information.component.ts
+++ b/libs/angular/src/billing/components/manage-tax-information/manage-tax-information.component.ts
@@ -65,12 +65,8 @@ export class ManageTaxInformationComponent implements OnInit, OnDestroy {
   };
 
   validate(): boolean {
-    if (this.formGroup.dirty) {
-      this.formGroup.markAllAsTouched();
-      return this.formGroup.valid;
-    } else {
-      return this.formGroup.valid;
-    }
+    this.formGroup.markAllAsTouched();
+    return this.formGroup.valid;
   }
 
   markAllAsTouched() {