Web: PortalSettings: Payments: Added updating tariff dates.

packages/client/src/pages/PortalSettings/categories/payments/PaymentContainer.js

@@ -353,19 +353,16 @@ export default inject(({ auth, payments }) => {
     isGracePeriod,
     customerId,
     portalTariffStatus,
+    paymentDate,
+    gracePeriodEndDate,
+    delayDaysCount,
   } = currentTariffStatusStore;
 
   const { planCost, tariffPlanTitle, portalPaymentQuotas } = paymentQuotasStore;
 
   const { theme } = auth.settingsStore;
 
-  const {
-    gracePeriodEndDate,
-    delayDaysCount,
-
-    isAlreadyPaid,
-    paymentDate,
-  } = payments;
+  const { isAlreadyPaid } = payments;
 
   const { user } = userStore;
 

packages/client/src/store/PaymentStore.js

@@ -7,10 +7,7 @@ import { makeAutoObservable } from "mobx";
 import api from "@docspace/common/api";
 import toastr from "@docspace/components/toast/toastr";
 import authStore from "@docspace/common/store/AuthStore";
-import moment from "moment";
-import { getUserByEmail } from "@docspace/common/api/people";
 import { getPaymentLink } from "@docspace/common/api/portal";
-import { getDaysRemaining } from "../helpers/filesUtils";
 import axios from "axios";
 
 class PaymentStore {
@@ -38,13 +35,6 @@ class PaymentStore {
 
   isInitPaymentPage = false;
 
-  paymentDate = "";
-
-  gracePeriodEndDate = "";
-  delayDaysCount = "";
-
-  payerInfo = null;
-
   constructor() {
     makeAutoObservable(this);
   }
@@ -57,28 +47,6 @@ class PaymentStore {
     return customerId?.length !== 0 || !isFreeTariff;
   }
 
-  setTariffDates = () => {
-    const { currentTariffStatusStore } = authStore;
-    const {
-      isGracePeriod,
-      isNotPaidPeriod,
-      delayDueDate,
-      dueDate,
-    } = currentTariffStatusStore;
-
-    const setGracePeriodDays = () => {
-      const delayDueDateByMoment = moment(delayDueDate);
-
-      this.gracePeriodEndDate = delayDueDateByMoment.format("LL");
-
-      this.delayDaysCount = getDaysRemaining(delayDueDateByMoment);
-    };
-
-    this.paymentDate = moment(dueDate).format("LL");
-
-    (isGracePeriod || isNotPaidPeriod) && setGracePeriodDays();
-  };
-
   setIsUpdatingBasicSettings = (isUpdatingBasicSettings) => {
     this.isUpdatingBasicSettings = isUpdatingBasicSettings;
   };
@@ -97,7 +65,6 @@ class PaymentStore {
 
     try {
       await Promise.all(requests);
-      this.setTariffDates();
       this.setBasicTariffContainer();
     } catch (error) {
       toastr.error(t("Common:UnexpectedError"));
@@ -134,7 +101,6 @@ class PaymentStore {
     try {
       await Promise.all(requests);
       this.setRangeStepByQuota();
-      this.setTariffDates();
       this.setBasicTariffContainer();
 
       if (!this.isAlreadyPaid) this.isInitPaymentPage = true;

packages/common/store/CurrentTariffStatusStore.js

@@ -2,12 +2,17 @@ import { makeAutoObservable, runInAction } from "mobx";
 import api from "../api";
 import { TariffState } from "../constants";
 import { getUserByEmail } from "../api/people";
-
+import moment from "moment";
+import { getDaysRemaining } from "@docspace/common/utils";
 class CurrentTariffStatusStore {
   portalTariffStatus = {};
   isLoaded = false;
   payerInfo = null;
 
+  paymentDate = "";
+  gracePeriodEndDate = "";
+  delayDaysCount = "";
+
   constructor() {
     makeAutoObservable(this);
   }
@@ -44,10 +49,6 @@ class CurrentTariffStatusStore {
     return this.portalTariffStatus.delayDueDate;
   }
 
-  get delayDueDate() {
-    return this.portalTariffStatus.delayDueDate;
-  }
-
   get customerId() {
     return this.portalTariffStatus.customerId;
   }
@@ -66,6 +67,20 @@ class CurrentTariffStatusStore {
       console.error(e);
     }
   };
+  setTariffDates = () => {
+    const setGracePeriodDays = () => {
+      const delayDueDateByMoment = moment(this.delayDueDate);
+
+      this.gracePeriodEndDate = delayDueDateByMoment.format("LL");
+
+      this.delayDaysCount = getDaysRemaining(delayDueDateByMoment);
+    };
+
+    this.paymentDate = moment(this.dueDate).format("LL");
+
+    (this.isGracePeriod || this.isNotPaidPeriod) && setGracePeriodDays();
+  };
+
   setPortalTariff = async () => {
     const res = await api.portal.getPortalTariff();
 
@@ -73,6 +88,8 @@ class CurrentTariffStatusStore {
 
     runInAction(() => {
       this.portalTariffStatus = res;
+
+      this.setTariffDates();
     });
   };
 }