fix(#2480): disabled buy button after click

Makefile

@@ -172,7 +172,7 @@ a-stage: build-a
 	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@10.0.3.8:/usr/local/www/ott-staging/a-wwwroot/
 
 b-stage: build-b
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@staging.instat.tv:/usr/local/www/ott-staging/b-wwwroot/
+	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@10.0.3.8:/usr/local/www/ott-staging/b-wwwroot/
 
 c-stage: build-c
 	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@10.0.3.8:/usr/local/www/ott-staging/c-wwwroot/

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

@@ -39,6 +39,7 @@ export const PackageSelectionStep = () => {
 
   const {
     close,
+    disabledBuyBtn,
     goBack,
     hasPreviousStep,
     loader,
@@ -46,6 +47,7 @@ export const PackageSelectionStep = () => {
     onBuyClick,
     selectedPackage,
     selectedSubscription,
+    setDisabledBuyBtn,
   } = useBuyMatchPopupStore()
 
   useEffect(() => {
@@ -59,6 +61,7 @@ export const PackageSelectionStep = () => {
   const isBrasil = user?.profile.country_code === 'BR'
 
   const onHandleClick = (e?: MouseEvent<HTMLButtonElement>) => {
+    setDisabledBuyBtn(true)
     if (isBrasil) {
       setIsOpenBrasilian(true)
     } else {
@@ -100,7 +103,7 @@ export const PackageSelectionStep = () => {
           <ArrowLoader width='204px' disabled />
         ) : (
           <Button
-            disabled={!selectedPackage}
+            disabled={!selectedPackage || disabledBuyBtn}
             onClick={onHandleClick}
           >
             <T9n t='buy_subscription' />

src/features/BuyMatchPopup/store/hooks/index.tsx

@@ -51,6 +51,7 @@ export const useBuyMatchPopup = () => {
   const [match, setMatch] = useState<Match | null>(null)
   const [error, setError] = useState('')
   const [loader, setLoader] = useState(false)
+  const [disabledBuyBtn, setDisabledBuyBtn] = useState(false)
   const { user } = useAuthStore()
 
   const goTo = useCallback(
@@ -188,6 +189,7 @@ export const useBuyMatchPopup = () => {
   return {
     close: closePopup,
     currentStep: last(steps),
+    disabledBuyBtn,
     error,
     goBack,
     goTo,
@@ -205,6 +207,7 @@ export const useBuyMatchPopup = () => {
     selectedPackage,
     selectedPeriod,
     selectedSubscription,
+    setDisabledBuyBtn,
     subscriptions,
   }
 }