fix(#622): india payment phonePe

src/config/clients/india.tsx

@@ -18,4 +18,5 @@ export const india: ClientConfig = {
   },
   disabledHighlights: true,
   name: ClientNames.India,
+  userAccountCardsHidden: true,
 }

src/config/clients/tunisia.tsx

@@ -60,4 +60,5 @@ export const tunisia: ClientConfig = {
   },
   termsLink: '/terms-and-conditions?client_id=insports-ott-web',
   title: 'Diwan Sport - The home of Tunisian Ligue Professionnelle 1',
+  userAccountCardsHidden: true,
 }

src/config/clients/types.tsx

@@ -64,5 +64,6 @@ export type ClientConfig = {
   },
   termsLink: string,
   title: string,
+  userAccountCardsHidden?: boolean,
   userAccountLinksDisabled?: boolean,
 }

src/config/payments.tsx

@@ -3,7 +3,7 @@ import { ClientNames } from './clients/types'
 export enum PaymentSystem {
   PagBrazil = 'pag_brasil',
   Paymee = 'paymee',
-  Paytm = 'paytm',
+  PhonePe = 'phonePe',
   Stripe = 'stripe'
 }
 
@@ -20,7 +20,7 @@ type PaymentsType = {
 export const payments: PaymentsType = {
   [ClientNames.Tunisia]: PaymentSystem.Paymee,
   [ClientNames.Brasil]: PaymentSystem.PagBrazil,
-  [ClientNames.India]: PaymentSystem.Paytm,
+  [ClientNames.India]: PaymentSystem.PhonePe,
   [ClientNames.Insports]: PaymentSystem.Stripe,
   [ClientNames.Instat]: PaymentSystem.Stripe,
   [ClientNames.Facr]: PaymentSystem.Stripe,

src/features/BuyMatchPopup/components/IframePayment/hooks.tsx

@@ -6,19 +6,23 @@ import {
   useState,
 } from 'react'
 
+import isNumber from 'lodash/isNumber'
+
 import { PAGES, ProfileTypes } from 'config'
 import { ClientNames } from 'config/clients/types'
 import { payments, PaymentSystem } from 'config/payments'
 
-import isNumber from 'lodash/isNumber'
-
 import { useLexicsStore } from 'features/LexicsStore'
 import { useBuyMatchPopupStore } from 'features/BuyMatchPopup/store'
 import { getProfileUrl } from 'features/ProfileLink/helpers'
 import { SubscriptionType } from 'features/BuyMatchPopup/types'
 
-import { getMatchInfo } from 'requests/getMatchInfo'
+import {
-import { SubscriptionAction, getPaymentUrl } from 'requests/getPaymentUrl'
+  getPaymentOTTUrl,
+  getPaymentPayUrl,
+  getMatchInfo,
+  SubscriptionAction,
+} from 'requests'
 
 import { redirectToUrl } from 'helpers'
 
@@ -88,7 +92,7 @@ export const useIframePayment = ({
     }
   }, [close, error, id, matchLink, setIsOpenIframe, sportType])
 
-  const paymentRequest = async () => {
+  const paymentRequestOTT = async () => {
     let url_cancel
     let url_return
     let action: SubscriptionAction
@@ -106,7 +110,7 @@ export const useIframePayment = ({
         break
     }
 
-    const payment: ResponsePaymentArray = await getPaymentUrl({
+    const payment: ResponsePaymentArray = await getPaymentOTTUrl({
       action,
       item: originalObject,
       product_name: `${pack} ${teams}`,
@@ -117,6 +121,19 @@ export const useIframePayment = ({
     setSrc(payment?.url || '')
   }
 
+  // новое апи для оплаты, в будущем все платежки переедут на него
+  // делаем оплату на новой вкладке, а не через iframe
+  const paymentRequestPay = async () => {
+    const payment = await getPaymentPayUrl({
+      item: {
+        ...originalObject,
+      },
+      url_return: `${window.location.origin}${matchLink}`,
+    })
+
+    redirectToUrl(payment.url)
+  }
+
   if (paymentSystem === payments[ClientNames.Brasil]) {
   // eslint-disable-next-line
     window.onmessage = function (event) {
@@ -126,6 +143,7 @@ export const useIframePayment = ({
     }
   }
 
+  // отслеживание оплаты для Paymee
   useEffect(() => {
     let interval: ReturnType<typeof setInterval>
     let timeout: ReturnType<typeof setTimeout>
@@ -164,7 +182,14 @@ export const useIframePayment = ({
     if (open) {
       (async () => {
         try {
-          await paymentRequest()
+          switch (paymentSystem) {
+            case PaymentSystem.PhonePe:
+              await paymentRequestPay()
+              break
+            default:
+              await paymentRequestOTT()
+              break
+          }
         } catch (err) {
           setError('error_payment_unsuccessful')
         }

src/features/BuyMatchPopup/components/PackageSelectionStep/index.tsx

@@ -22,6 +22,7 @@ import { ArrowLoader } from 'features/ArrowLoader'
 import { Arrow } from 'features/HeaderFilters/components/DateFilter/styled'
 import { useAuthStore } from 'features/AuthStore'
 
+import { ClientNames } from 'config/clients/types'
 import { IframePayment } from '../IframePayment'
 
 import { useBuyMatchPopupStore } from '../../store'
@@ -73,20 +74,25 @@ export const PackageSelectionStep = () => {
   }, [cards, fetchCards])
 
   const paymentSystem = useMemo(() => {
-    switch (countryCode?.country_code) {
+    switch (true) {
-      case CountryCode.BR:
+      case countryCode?.country_code === CountryCode.BR:
         return payments.brasil
-      case CountryCode.TN:
+      case countryCode?.country_code === CountryCode.TN:
         return payments.tunisia
+      case countryCode?.country_code === CountryCode.IN:
+      case client.name === ClientNames.India:
+        return payments.india
       default:
         return payments[client.name]
     }
   }, [countryCode])
 
   const isIframePayment = useMemo(() => {
-    switch (countryCode?.country_code) {
+    switch (true) {
-      case CountryCode.BR:
+      case countryCode?.country_code === CountryCode.BR:
-      case CountryCode.TN:
+      case countryCode?.country_code === CountryCode.TN:
+      case countryCode?.country_code === CountryCode.IN:
+      case client.name === ClientNames.India:
         return true
       default:
         return false

src/features/UserAccount/index.tsx

@@ -54,13 +54,15 @@ const UserAccount = () => {
             </StyledLink>
             {!isLffClient && (
               <Fragment>
-                <StyledLink
+                {!client.userAccountCardsHidden && (
-                  disabled={user?.profile?.country_code === 'BR'}
+                  <StyledLink
-                  to={`${PAGES.useraccount}/bank-cards`}
+                    disabled={user?.profile?.country_code === 'BR'}
-                  id='personal_cards'
+                    to={`${PAGES.useraccount}/bank-cards`}
-                >
+                    id='personal_cards'
-                  <T9n t='bank_card' />
+                  >
-                </StyledLink>
+                    <T9n t='bank_card' />
+                  </StyledLink>
+                )}
                 <StyledLink
                   to={`${PAGES.useraccount}/subscriptions`}
                   id='personal_subscriptions'

src/requests/getMatchInfo.tsx

@@ -50,7 +50,7 @@ export enum MatchStatuses {
 }
 
 export type MatchInfo = {
-  access?: boolean,
+  access?: boolean | null,
   c_match_calc_status: MatchStatuses | null,
   calc: boolean,
   country: TournamentType,

src/requests/getPaymentOTTUrl.tsx

@@ -18,7 +18,7 @@ type Props = {
   url_return?: string | null,
 }
 
-export const getPaymentUrl = async ({
+export const getPaymentOTTUrl = async ({
   action,
   item,
   product_name,

src/requests/getPaymentPayUrl.tsx

@@ -0,0 +1,31 @@
+import { PAYMENT_API_URL } from 'config'
+
+import { callApi } from 'helpers'
+
+import type { SubscriptionResponse } from 'requests/getSubscriptions'
+
+type Props = {
+  item: SubscriptionResponse,
+  url_return?: string | null,
+}
+
+type PaymentResponse = {
+  url: string,
+}
+
+export const getPaymentPayUrl = async ({
+  item,
+  url_return,
+}: Props): Promise<PaymentResponse> => {
+  const config = {
+    body: {
+      item,
+      url_return,
+    },
+  }
+
+  return callApi({
+    config,
+    url: `${PAYMENT_API_URL}/api/v2/phonepe/create-payment-link`,
+  })
+}

src/requests/index.tsx

@@ -34,3 +34,5 @@ export * from './getMatchParticipants'
 export * from './getStatsEvents'
 export * from './getTokenVirtualUser'
 export * from './checkDevice'
+export * from './getPaymentOTTUrl'
+export * from './getPaymentPayUrl'