fix(#ott): fix send request in landing page and catch error in pagbrasil

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

@@ -35,6 +35,7 @@ export const useBrazilPayment = ({
   const { close } = useBuyMatchPopupStore()
 
   const [src, setSrc] = useState('')
+  const [error, setError] = useState('')
   const { translate } = useLexicsStore()
 
   const { id, sportType } = match
@@ -58,6 +59,7 @@ export const useBrazilPayment = ({
   const closePopup = async (e?: MouseEvent) => {
     e?.stopPropagation()
     setIsOpenBrasilian(false)
+    setError('')
 
     const accessMatch = await getMatchInfo(sportType, id)
     if (accessMatch?.access) {
@@ -69,8 +71,12 @@ export const useBrazilPayment = ({
   useEffect(() => {
     if (open) {
       (async () => {
-        const json: ResponsePaymentArray = await getBrazilPaymentUrl({ item: originalObject, product_name: `${pack} ${teams}` })
+        try {
-        setSrc(json?.url || '')
+          const json: ResponsePaymentArray = await getBrazilPaymentUrl({ item: originalObject, product_name: `${pack} ${teams}` })
+          setSrc(json?.url || '')
+        } catch (err) {
+          setError('error_payment_unsuccessful')
+        }
       })()
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -78,6 +84,7 @@ export const useBrazilPayment = ({
 
   return {
     closePopup,
+    error,
     matchLink,
     src,
   }

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

@@ -27,6 +27,7 @@ export const BrazilPayment = ({
 }: Props) => {
   const {
     closePopup,
+    error,
     matchLink,
     src,
   } = useBrazilPayment({
@@ -50,9 +51,15 @@ export const BrazilPayment = ({
           </ScButton>
         </>
       ) : (
-        <LoaderWrapper>
+        <>
-          <Loader color='#515151' />
+          {error ? (
-        </LoaderWrapper>
+            <T9n t={error} />
+          ) : (
+            <LoaderWrapper>
+              <Loader color='#515151' />
+            </LoaderWrapper>
+          )}
+        </>
       )}
     </ScModal>
   )

src/features/JoinMatchPage/hooks.tsx

@@ -28,7 +28,7 @@ export const useUnauthenticatedMatch = () => {
     : ''
 
   useEffect(() => {
-    getUnauthenticatedMatch(sportType, matchId).then(setMatchInfo)
+    if (sportType && matchId) getUnauthenticatedMatch(sportType, matchId).then(setMatchInfo)
 
     return () => setMatchInfo(null)
   }, [sportType, matchId])