PM-5019 Migrate Adjust Payment component (#8383)

* PM-5019 Migrated Adjust Payment component

* PM-5019 Migrated Adjust Payment dialog component

* PM-5019 Removing type any

* PM-5019 Addressed review comments

* PM-5019 Included deleted line space

apps/web/src/app/billing/shared/payment-method.component.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit, ViewChild } from "@angular/core";
 import { FormBuilder, FormControl, Validators } from "@angular/forms";
 import { ActivatedRoute, Router } from "@angular/router";
+import { lastValueFrom } from "rxjs";
 
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { OrganizationApiServiceAbstraction } from "@bitwarden/common/admin-console/abstractions/organization/organization-api.service.abstraction";
@@ -14,6 +15,10 @@ import { LogService } from "@bitwarden/common/platform/abstractions/log.service"
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { DialogService } from "@bitwarden/components";
 
+import {
+  AdjustPaymentDialogResult,
+  openAdjustPaymentDialog,
+} from "./adjust-payment-dialog.component";
 import { TaxInfoComponent } from "./tax-info.component";
 
 @Component({
@@ -25,7 +30,6 @@ export class PaymentMethodComponent implements OnInit {
 
   loading = false;
   firstLoaded = false;
-  showAdjustPayment = false;
   showAddCredit = false;
   billing: BillingPaymentResponse;
   org: OrganizationSubscriptionResponse;
@@ -120,18 +124,18 @@ export class PaymentMethodComponent implements OnInit {
     }
   }
 
-  changePayment() {
-    this.showAdjustPayment = true;
-  }
-
-  closePayment(load: boolean) {
-    this.showAdjustPayment = false;
-    if (load) {
-      // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
-      this.load();
+  changePayment = async () => {
+    const dialogRef = openAdjustPaymentDialog(this.dialogService, {
+      data: {
+        organizationId: this.organizationId,
+        currentType: this.paymentSource !== null ? this.paymentSource.type : null,
+      },
+    });
+    const result = await lastValueFrom(dialogRef.closed);
+    if (result === AdjustPaymentDialogResult.Adjusted) {
+      await this.load();
     }
-  }
+  };
 
   async verifyBank() {
     if (this.loading || !this.forOrganization) {