Web: Information from the new api was used.

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

@@ -65,10 +65,12 @@ const BenefitsContainer = ({ t, features }) => {
   );
 };
 
-export default inject(({ payments }) => {
-  const { paymentTariff } = payments;
+export default inject(({ auth }) => {
+  const { portalPaymentQuotas } = auth;
+
+  const { features } = portalPaymentQuotas;
 
   return {
-    features: paymentTariff[0]?.features,
+    features: features,
   };
 })(observer(BenefitsContainer));

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

@@ -28,11 +28,11 @@ const StyledCurrentTariffContainer = styled.div`
   }
 `;
 
-const CurrentTariffContainer = ({ quota, portalQuota, style }) => {
+const CurrentTariffContainer = ({ quota, portalPaymentQuotas, style }) => {
   const { t } = useTranslation("Payments");
 
   const { usedSize } = quota;
-  const { maxTotalSize, countRoom } = portalQuota;
+  const { maxTotalSize, countRoom } = portalPaymentQuotas;
 
   const addedRooms = 1;
   const maxManagers = 50;
@@ -88,7 +88,7 @@ const CurrentTariffContainer = ({ quota, portalQuota, style }) => {
 };
 
 export default inject(({ auth }) => {
-  const { quota, portalQuota } = auth;
+  const { quota, portalPaymentQuotas } = auth;
 
-  return { quota, portalQuota };
+  return { quota, portalPaymentQuotas };
 })(observer(CurrentTariffContainer));

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

@@ -104,14 +104,13 @@ const PayerInformationContainer = ({ style, theme, user, accountLink }) => {
 };
 
 export default inject(({ auth, payments }) => {
-  const { quota, portalQuota, userStore } = auth;
+  const { quota, userStore } = auth;
   const { accountLink } = payments;
 
   const { user } = userStore;
 
   return {
     quota,
-    portalQuota,
     theme: auth.settingsStore.theme,
     user,
     accountLink,

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

@@ -37,7 +37,6 @@ const PriceCalculation = ({
   user,
   theme,
   setPaymentLink,
-  portalQuota,
   setIsLoading,
   setTotalPrice,
   pricePerManager,
@@ -45,6 +44,7 @@ const PriceCalculation = ({
   setManagersCount,
   maxAvailableManagersCount,
   isFreeTariff,
+  portalQuota,
 }) => {
   const { countAdmin, price } = portalQuota;
 
@@ -65,6 +65,7 @@ const PriceCalculation = ({
     setTotalPrice(
       isAlreadyPaid ? price : minAvailableManagersCount * pricePerManager
     );
+
     setManagersCount(initialUsersCount);
     return () => {
       timeout && clearTimeout(timeout);
@@ -115,7 +116,7 @@ const PriceCalculation = ({
     }, 1000);
   };
 
-  const payer = false;
+  const payer = true;
   const isDisabled = isFreeTariff
     ? false
     : (!user.isOwner && !user.isAdmin) || !payer;
@@ -153,8 +154,14 @@ export default inject(({ auth, payments }) => {
     maxAvailableManagersCount,
   } = payments;
   const { theme } = auth.settingsStore;
-  const { userStore, portalQuota, pricePerManager, isFreeTariff } = auth;
+  const {
+    priceInfoPerManager,
+    isFreeTariff,
+    userStore,
+    portalQuota,
+  } = auth;
   const { user } = userStore;
+  const { value } = priceInfoPerManager;
 
   return {
     isFreeTariff,
@@ -162,12 +169,12 @@ export default inject(({ auth, payments }) => {
     tariffsInfo,
     theme,
     setPaymentLink,
-    portalQuota,
     setIsLoading,
-    pricePerManager,
+    pricePerManager: value,
     setTotalPrice,
     minAvailableManagersCount,
     maxAvailableManagersCount,
     user,
+    portalQuota,
   };
 })(observer(PriceCalculation));

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

@@ -55,23 +55,23 @@ const StyledBody = styled.div`
 
 let dueDate, fromDate, byDate;
 const PaymentsPage = ({
-  setPaymentTariff,
-  getPaymentPrices,
   pricePerManager,
-  setPortalQuota,
+  setPortalPaymentsQuotas,
   setPortalTariff,
   language,
   portalTariff,
-  portalQuota,
+  portalPaymentQuotas,
   isFreeTariff,
   isGracePeriod,
   theme,
   setPaymentAccount,
   currencies,
   setCurrencies,
-  isoCurrencySymbol,
+  currencySymbol,
   isNotPaid,
   setSalesEmail,
+  setRangeBound,
+  range,
 }) => {
   const { t, ready } = useTranslation(["Payments", "Settings"]);
 
@@ -102,12 +102,13 @@ const PaymentsPage = ({
     (async () => {
       const requests = [];
 
-      requests.push(setPaymentTariff(), setSalesEmail());
+      requests.push(
+        setSalesEmail(),
+        setRangeBound(range.value, range.min, range.max)
+      );
 
-      if (Object.keys(portalQuota).length === 0)
-        requests.push(setPortalQuota());
-
-      if (!pricePerManager) requests.push(getPaymentPrices());
+      if (Object.keys(portalPaymentQuotas).length === 0)
+        requests.push(setPortalPaymentsQuotas());
 
       if (Object.keys(portalTariff).length === 0) {
         requests.push(setPortalTariff(), setPaymentAccount());
@@ -151,7 +152,7 @@ const PaymentsPage = ({
     );
   };
 
-  const convertedPrice = `${isoCurrencySymbol}${pricePerManager}`;
+  const convertedPrice = `${currencySymbol}${pricePerManager}`;
 
   return isInitialLoading ? (
     <Loaders.PaymentsLoader />
@@ -252,13 +253,12 @@ PaymentsPage.propTypes = {
 
 export default inject(({ auth, payments }) => {
   const {
-    setPortalQuota,
+    setPortalPaymentsQuotas,
     setPortalTariff,
     language,
     portalTariff,
-    getPaymentPrices,
-    pricePerManager,
-    portalQuota,
+    priceInfoPerManager,
+    portalPaymentQuotas,
     isFreeTariff,
     isGracePeriod,
     currencies,
@@ -271,30 +271,32 @@ export default inject(({ auth, payments }) => {
     setTariffsInfo,
     tariffsInfo,
     setPaymentAccount,
-    setPaymentTariff,
     setSalesEmail,
+    setRangeBound,
   } = payments;
 
+  const { currencySymbol, value, range } = priceInfoPerManager;
+
   return {
-    setPaymentTariff,
     isFreeTariff,
-    setPortalQuota,
+    setPortalPaymentsQuotas,
     setPortalTariff,
     portalTariff,
-    getPaymentPrices,
     language,
     organizationName,
     setTariffsInfo,
     tariffsInfo,
     isGracePeriod,
-    pricePerManager,
-    portalQuota,
+    pricePerManager: value,
+    portalPaymentQuotas,
     theme,
     setPaymentAccount,
     currencies,
     setCurrencies,
-    isoCurrencySymbol: currencies[0]?.isoCurrencySymbol,
+    currencySymbol: currencySymbol,
     isNotPaid,
     setSalesEmail,
+    setRangeBound,
+    range,
   };
 })(withRouter(observer(PaymentsPage)));

packages/client/src/pages/PortalSettings/categories/payments/sub-components/ButtonContainer.js

@@ -22,7 +22,7 @@ const ButtonContainer = ({
   isDisabled,
   isLoading,
   maxTariffManagers,
-  setPortalQuota,
+  setPortalPaymentsQuotas,
   isLessCountThanAcceptable,
   t,
   isNotPaid,
@@ -38,7 +38,7 @@ const ButtonContainer = ({
       }, 500);
 
       await updatePayment(managersCount);
-      await setPortalQuota();
+      await setPortalPaymentsQuotas();
     } catch (e) {
       toastr.error(e);
     }
@@ -114,8 +114,13 @@ const ButtonContainer = ({
 };
 
 export default inject(({ auth, payments }) => {
-  const { portalQuota, setPortalQuota, isNotPaid, isGracePeriod } = auth;
-  const { countAdmin: maxTariffManagers } = portalQuota;
+  const {
+    portalPaymentQuotas,
+    setPortalPaymentsQuotas,
+    isNotPaid,
+    isGracePeriod,
+  } = auth;
+  const { countAdmin: maxTariffManagers } = portalPaymentQuotas;
   const {
     updatePayment,
     setIsLoading,
@@ -135,7 +140,7 @@ export default inject(({ auth, payments }) => {
     isLoading,
     managersCount,
     maxTariffManagers,
-    setPortalQuota,
+    setPortalPaymentsQuotas,
     isLessCountThanAcceptable,
     isNotPaid,
     isGracePeriod,

packages/client/src/pages/PortalSettings/categories/payments/sub-components/SelectUsersCountContainer.js

@@ -240,7 +240,8 @@ const SelectUsersCountContainer = ({
 };
 
 export default inject(({ auth, payments }) => {
-  const { pricePerManager } = auth;
+  const { priceInfoPerManager } = auth;
+  const { value } = priceInfoPerManager;
   const { theme } = auth.settingsStore;
   const {
     isLoading,
@@ -249,7 +250,6 @@ export default inject(({ auth, payments }) => {
     maxAvailableManagersCount,
     setManagersCount,
     setTotalPrice,
-
     isLessCountThanAcceptable,
   } = payments;
 
@@ -261,8 +261,7 @@ export default inject(({ auth, payments }) => {
     maxAvailableManagersCount,
     setManagersCount,
     setTotalPrice,
-    pricePerManager,
-
+    pricePerManager: value,
     isLessCountThanAcceptable,
   };
 })(observer(SelectUsersCountContainer));

packages/client/src/pages/PortalSettings/categories/payments/sub-components/TotalTariffContainer.js

@@ -62,7 +62,7 @@ const TotalTariffContainer = ({
   theme,
   totalPrice,
   isNeedRequest,
-  isoCurrencySymbol,
+  currencySymbol,
 }) => {
   const color = isDisabled ? { color: theme.text.disableColor } : {};
 
@@ -70,7 +70,7 @@ const TotalTariffContainer = ({
     <StyledBody>
       <div className="payment_price_user">
         <Text fontSize="16px" textAlign="center" isBold noSelect {...color}>
-          {`${isoCurrencySymbol}${pricePerManager}`}
+          {`${currencySymbol}${pricePerManager}`}
         </Text>
         <Text
           fontSize="11px"
@@ -105,7 +105,7 @@ const TotalTariffContainer = ({
               noSelect
               {...color}
             >
-              {`${isoCurrencySymbol}${totalPrice}`}
+              {`${currencySymbol}${totalPrice}`}
             </Text>
             <Text
               fontSize="16px"
@@ -125,7 +125,7 @@ const TotalTariffContainer = ({
 };
 
 export default inject(({ auth, payments }) => {
-  const { pricePerManager, currencies } = auth;
+  const { priceInfoPerManager, currencies } = auth;
   const { theme } = auth.settingsStore;
   const {
     isLoading,
@@ -134,13 +134,14 @@ export default inject(({ auth, payments }) => {
     maxAvailableManagersCount,
   } = payments;
 
+  const { value, currencySymbol } = priceInfoPerManager;
   return {
     theme,
-    pricePerManager,
+    pricePerManager: value,
     totalPrice,
     isLoading,
     isNeedRequest,
     maxAvailableManagersCount,
-    isoCurrencySymbol: currencies[0]?.isoCurrencySymbol,
+    currencySymbol: currencySymbol,
   };
 })(observer(TotalTariffContainer));

packages/client/src/store/PaymentStore.js

@@ -21,7 +21,7 @@ class PaymentStore {
   paymentLink = null;
   accountLink = null;
   isLoading = false;
-  totalPrice = null;
+  totalPrice = 30;
   managersCount = 1;
   maxAvailableManagersCount = 999;
   minAvailableManagersCount = 1;
@@ -132,14 +132,20 @@ class PaymentStore {
   get isLessCountThanAcceptable() {
     return this.managersCount < this.minAvailableManagersCount;
   }
-  setPaymentTariff = async () => {
-    try {
-      const res = await api.portal.getPaymentTariff();
-      if (res) {
-        this.paymentTariff = res;
-      }
-    } catch (e) {}
+
+  setRangeBound = (managerStep, min, max) => {
+    this.minAvailableManagersCount = 6;
+    this.maxAvailableManagersCount = max;
   };
+
+  // setPaymentTariff = async () => {
+  //   try {
+  //     const res = await api.portal.getPaymentTariff();
+  //     if (res) {
+  //       this.paymentTariff = res;
+  //     }
+  //   } catch (e) {}
+  // };
 }
 
 export default PaymentStore;

packages/common/api/portal/index.js

@@ -166,8 +166,8 @@ export function setPortalRename(alias) {
   });
 }
 
-export function getPaymentPrices() {
-  return request({ method: "get", url: "/portal/payment/prices" });
+export function getPortalPaymentQuotas() {
+  return request({ method: "get", url: "/portal/payment/quotas" });
 }
 
 export function getPortalQuota() {
@@ -207,5 +207,5 @@ export function getCurrencies() {
 }
 
 export function getPaymentTariff() {
-  return request({ method: "get", url: "/portal/payment/quotas" });
+  return request({ method: "get", url: "/portal/payment/tariff" });
 }

packages/common/components/Article/sub-components/article-payment-alert.js

@@ -24,8 +24,7 @@ const ArticlePaymentAlert = ({
   pricePerManager,
   isFreeTariff,
   theme,
-  isGracePeriod,
-  isoCurrencySymbol,
+  currencySymbol,
 }) => {
   const { t, ready } = useTranslation("Payments");
 
@@ -37,7 +36,7 @@ const ArticlePaymentAlert = ({
     history.push(paymentPageUrl);
   };
 
-  const convertedPrice = `${isoCurrencySymbol}${pricePerManager}`;
+  const convertedPrice = `${currencySymbol}${pricePerManager}`;
 
   return !ready ? (
     <Loaders.Rectangle width="210px" height="88px" />
@@ -72,13 +71,14 @@ const ArticlePaymentAlert = ({
 
 export default withRouter(
   inject(({ auth }) => {
-    const { pricePerManager, currencies } = auth;
+    const { priceInfoPerManager } = auth;
     const { theme } = auth.settingsStore;
 
+    const { value, currencySymbol } = priceInfoPerManager;
     return {
-      pricePerManager,
+      pricePerManager: value,
       theme,
-      isoCurrencySymbol: currencies[0]?.isoCurrencySymbol,
+      currencySymbol: currencySymbol,
     };
   })(observer(ArticlePaymentAlert))
 );

packages/common/store/AuthStore.js

@@ -30,7 +30,7 @@ class AuthStore {
   isInit = false;
 
   quota = {};
-  portalQuota = {};
+  portalPaymentQuotas = {};
   portalTariff = {};
   pricePerManager = null;
   currencies = [];
@@ -60,10 +60,10 @@ class AuthStore {
 
     if (this.isAuthenticated) {
       requests.push(
-        this.setPortalQuota(),
+        this.setPortalPaymentsQuotas(),
         this.setPortalTariff(),
-        this.getPaymentPrices(),
-        this.setCurrencies()
+        this.setPortalQuota()
+        //this.setCurrencies()
       );
 
       !this.settingsStore.passwordSettings &&
@@ -322,20 +322,25 @@ class AuthStore {
     if (res) this.quota = res;
   };
 
-  setPortalQuota = async () => {
-    const res = await api.portal.getPortalQuota();
-    if (res) this.portalQuota = res;
+  setPortalPaymentsQuotas = async () => {
+    const res = await api.portal.getPortalPaymentQuotas();
+    if (res) {
+      this.portalPaymentQuotas = res[0];
+      this.priceInfoPerManager = res[0].features.find(
+        (obj) => obj.id === "admin"
+      ).price;
+    }
   };
 
-  getPaymentPrices = async () => {
-    const res = await api.portal.getPaymentPrices();
+  setPortalQuota = async () => {
+    const res = await api.portal.getPortalQuota();
     if (res) {
-      this.pricePerManager = res.admin;
+      this.portalQuota = res;
     }
   };
 
   get isFreeTariff() {
-    return this.portalQuota.trial || this.portalQuota.free;
+    return this.portalPaymentQuotas.trial || this.portalPaymentQuotas.free;
   }
 
   get isGracePeriod() {