From f5198e86fd8a2187e3c9e528ba788edf2595fa2d Mon Sep 17 00:00:00 2001
From: KiruthigaManivannan
<162679756+KiruthigaManivannan@users.noreply.github.com>
Date: Wed, 17 Apr 2024 01:08:19 +0530
Subject: [PATCH] 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
---
.../adjust-payment-dialog.component.html | 25 ++++
.../shared/adjust-payment-dialog.component.ts | 110 ++++++++++++++++++
.../shared/adjust-payment.component.html | 19 ---
.../shared/adjust-payment.component.ts | 90 --------------
.../billing/shared/billing-shared.module.ts | 4 +-
.../shared/payment-method.component.html | 18 +--
.../shared/payment-method.component.ts | 28 +++--
7 files changed, 155 insertions(+), 139 deletions(-)
create mode 100644 apps/web/src/app/billing/shared/adjust-payment-dialog.component.html
create mode 100644 apps/web/src/app/billing/shared/adjust-payment-dialog.component.ts
delete mode 100644 apps/web/src/app/billing/shared/adjust-payment.component.html
delete mode 100644 apps/web/src/app/billing/shared/adjust-payment.component.ts
diff --git a/apps/web/src/app/billing/shared/adjust-payment-dialog.component.html b/apps/web/src/app/billing/shared/adjust-payment-dialog.component.html
new file mode 100644
index 0000000000..0f92b023b1
--- /dev/null
+++ b/apps/web/src/app/billing/shared/adjust-payment-dialog.component.html
@@ -0,0 +1,25 @@
+
diff --git a/apps/web/src/app/billing/shared/adjust-payment-dialog.component.ts b/apps/web/src/app/billing/shared/adjust-payment-dialog.component.ts
new file mode 100644
index 0000000000..41d0ad7e7a
--- /dev/null
+++ b/apps/web/src/app/billing/shared/adjust-payment-dialog.component.ts
@@ -0,0 +1,110 @@
+import { DIALOG_DATA, DialogConfig, DialogRef } from "@angular/cdk/dialog";
+import { Component, Inject, ViewChild } from "@angular/core";
+import { FormGroup } from "@angular/forms";
+
+import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { OrganizationApiServiceAbstraction } from "@bitwarden/common/admin-console/abstractions/organization/organization-api.service.abstraction";
+import { PaymentMethodWarningsServiceAbstraction as PaymentMethodWarningService } from "@bitwarden/common/billing/abstractions/payment-method-warnings-service.abstraction";
+import { PaymentMethodType } from "@bitwarden/common/billing/enums";
+import { PaymentRequest } from "@bitwarden/common/billing/models/request/payment.request";
+import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+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 { PaymentComponent } from "./payment.component";
+import { TaxInfoComponent } from "./tax-info.component";
+
+export interface AdjustPaymentDialogData {
+ organizationId: string;
+ currentType: PaymentMethodType;
+}
+
+export enum AdjustPaymentDialogResult {
+ Adjusted = "adjusted",
+ Cancelled = "cancelled",
+}
+
+@Component({
+ templateUrl: "adjust-payment-dialog.component.html",
+})
+export class AdjustPaymentDialogComponent {
+ @ViewChild(PaymentComponent, { static: true }) paymentComponent: PaymentComponent;
+ @ViewChild(TaxInfoComponent, { static: true }) taxInfoComponent: TaxInfoComponent;
+
+ organizationId: string;
+ currentType: PaymentMethodType;
+ paymentMethodType = PaymentMethodType;
+
+ protected DialogResult = AdjustPaymentDialogResult;
+ protected formGroup = new FormGroup({});
+
+ constructor(
+ private dialogRef: DialogRef,
+ @Inject(DIALOG_DATA) protected data: AdjustPaymentDialogData,
+ private apiService: ApiService,
+ private i18nService: I18nService,
+ private platformUtilsService: PlatformUtilsService,
+ private logService: LogService,
+ private organizationApiService: OrganizationApiServiceAbstraction,
+ private paymentMethodWarningService: PaymentMethodWarningService,
+ ) {
+ this.organizationId = data.organizationId;
+ this.currentType = data.currentType;
+ }
+
+ submit = async () => {
+ const request = new PaymentRequest();
+ const response = this.paymentComponent.createPaymentToken().then((result) => {
+ request.paymentToken = result[0];
+ request.paymentMethodType = result[1];
+ request.postalCode = this.taxInfoComponent.taxInfo.postalCode;
+ request.country = this.taxInfoComponent.taxInfo.country;
+ if (this.organizationId == null) {
+ return this.apiService.postAccountPayment(request);
+ } else {
+ request.taxId = this.taxInfoComponent.taxInfo.taxId;
+ request.state = this.taxInfoComponent.taxInfo.state;
+ request.line1 = this.taxInfoComponent.taxInfo.line1;
+ request.line2 = this.taxInfoComponent.taxInfo.line2;
+ request.city = this.taxInfoComponent.taxInfo.city;
+ request.state = this.taxInfoComponent.taxInfo.state;
+ return this.organizationApiService.updatePayment(this.organizationId, request);
+ }
+ });
+ await response;
+ if (this.organizationId) {
+ await this.paymentMethodWarningService.removeSubscriptionRisk(this.organizationId);
+ }
+ this.platformUtilsService.showToast(
+ "success",
+ null,
+ this.i18nService.t("updatedPaymentMethod"),
+ );
+ this.dialogRef.close(AdjustPaymentDialogResult.Adjusted);
+ };
+
+ changeCountry() {
+ if (this.taxInfoComponent.taxInfo.country === "US") {
+ this.paymentComponent.hideBank = !this.organizationId;
+ } else {
+ this.paymentComponent.hideBank = true;
+ if (this.paymentComponent.method === PaymentMethodType.BankAccount) {
+ this.paymentComponent.method = PaymentMethodType.Card;
+ this.paymentComponent.changeMethod();
+ }
+ }
+ }
+}
+
+/**
+ * Strongly typed helper to open a AdjustPaymentDialog
+ * @param dialogService Instance of the dialog service that will be used to open the dialog
+ * @param config Configuration for the dialog
+ */
+export function openAdjustPaymentDialog(
+ dialogService: DialogService,
+ config: DialogConfig,
+) {
+ return dialogService.open(AdjustPaymentDialogComponent, config);
+}
diff --git a/apps/web/src/app/billing/shared/adjust-payment.component.html b/apps/web/src/app/billing/shared/adjust-payment.component.html
deleted file mode 100644
index 724e7a44c2..0000000000
--- a/apps/web/src/app/billing/shared/adjust-payment.component.html
+++ /dev/null
@@ -1,19 +0,0 @@
-
diff --git a/apps/web/src/app/billing/shared/adjust-payment.component.ts b/apps/web/src/app/billing/shared/adjust-payment.component.ts
deleted file mode 100644
index 7452344141..0000000000
--- a/apps/web/src/app/billing/shared/adjust-payment.component.ts
+++ /dev/null
@@ -1,90 +0,0 @@
-import { Component, EventEmitter, Input, Output, ViewChild } from "@angular/core";
-
-import { ApiService } from "@bitwarden/common/abstractions/api.service";
-import { OrganizationApiServiceAbstraction } from "@bitwarden/common/admin-console/abstractions/organization/organization-api.service.abstraction";
-import { PaymentMethodWarningsServiceAbstraction as PaymentMethodWarningService } from "@bitwarden/common/billing/abstractions/payment-method-warnings-service.abstraction";
-import { PaymentMethodType } from "@bitwarden/common/billing/enums";
-import { PaymentRequest } from "@bitwarden/common/billing/models/request/payment.request";
-import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
-import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
-import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
-
-import { PaymentComponent } from "./payment.component";
-import { TaxInfoComponent } from "./tax-info.component";
-
-@Component({
- selector: "app-adjust-payment",
- templateUrl: "adjust-payment.component.html",
-})
-export class AdjustPaymentComponent {
- @ViewChild(PaymentComponent, { static: true }) paymentComponent: PaymentComponent;
- @ViewChild(TaxInfoComponent, { static: true }) taxInfoComponent: TaxInfoComponent;
-
- @Input() currentType?: PaymentMethodType;
- @Input() organizationId: string;
- @Output() onAdjusted = new EventEmitter();
- @Output() onCanceled = new EventEmitter();
-
- paymentMethodType = PaymentMethodType;
- formPromise: Promise;
-
- constructor(
- private apiService: ApiService,
- private i18nService: I18nService,
- private platformUtilsService: PlatformUtilsService,
- private logService: LogService,
- private organizationApiService: OrganizationApiServiceAbstraction,
- private paymentMethodWarningService: PaymentMethodWarningService,
- ) {}
-
- async submit() {
- try {
- const request = new PaymentRequest();
- this.formPromise = this.paymentComponent.createPaymentToken().then((result) => {
- request.paymentToken = result[0];
- request.paymentMethodType = result[1];
- request.postalCode = this.taxInfoComponent.taxInfo.postalCode;
- request.country = this.taxInfoComponent.taxInfo.country;
- if (this.organizationId == null) {
- return this.apiService.postAccountPayment(request);
- } else {
- request.taxId = this.taxInfoComponent.taxInfo.taxId;
- request.state = this.taxInfoComponent.taxInfo.state;
- request.line1 = this.taxInfoComponent.taxInfo.line1;
- request.line2 = this.taxInfoComponent.taxInfo.line2;
- request.city = this.taxInfoComponent.taxInfo.city;
- request.state = this.taxInfoComponent.taxInfo.state;
- return this.organizationApiService.updatePayment(this.organizationId, request);
- }
- });
- await this.formPromise;
- if (this.organizationId) {
- await this.paymentMethodWarningService.removeSubscriptionRisk(this.organizationId);
- }
- this.platformUtilsService.showToast(
- "success",
- null,
- this.i18nService.t("updatedPaymentMethod"),
- );
- this.onAdjusted.emit();
- } catch (e) {
- this.logService.error(e);
- }
- }
-
- cancel() {
- this.onCanceled.emit();
- }
-
- changeCountry() {
- if (this.taxInfoComponent.taxInfo.country === "US") {
- this.paymentComponent.hideBank = !this.organizationId;
- } else {
- this.paymentComponent.hideBank = true;
- if (this.paymentComponent.method === PaymentMethodType.BankAccount) {
- this.paymentComponent.method = PaymentMethodType.Card;
- this.paymentComponent.changeMethod();
- }
- }
- }
-}
diff --git a/apps/web/src/app/billing/shared/billing-shared.module.ts b/apps/web/src/app/billing/shared/billing-shared.module.ts
index 2f773870aa..65a651b73d 100644
--- a/apps/web/src/app/billing/shared/billing-shared.module.ts
+++ b/apps/web/src/app/billing/shared/billing-shared.module.ts
@@ -4,7 +4,7 @@ import { HeaderModule } from "../../layouts/header/header.module";
import { SharedModule } from "../../shared";
import { AddCreditComponent } from "./add-credit.component";
-import { AdjustPaymentComponent } from "./adjust-payment.component";
+import { AdjustPaymentDialogComponent } from "./adjust-payment-dialog.component";
import { AdjustStorageComponent } from "./adjust-storage.component";
import { BillingHistoryComponent } from "./billing-history.component";
import { OffboardingSurveyComponent } from "./offboarding-survey.component";
@@ -18,7 +18,7 @@ import { UpdateLicenseComponent } from "./update-license.component";
imports: [SharedModule, PaymentComponent, TaxInfoComponent, HeaderModule],
declarations: [
AddCreditComponent,
- AdjustPaymentComponent,
+ AdjustPaymentDialogComponent,
AdjustStorageComponent,
BillingHistoryComponent,
PaymentMethodComponent,
diff --git a/apps/web/src/app/billing/shared/payment-method.component.html b/apps/web/src/app/billing/shared/payment-method.component.html
index cfe98178b0..5f78294fa6 100644
--- a/apps/web/src/app/billing/shared/payment-method.component.html
+++ b/apps/web/src/app/billing/shared/payment-method.component.html
@@ -15,7 +15,7 @@
@@ -102,23 +102,9 @@
{{ paymentSource.description }}
-