From 2788cf0b2df46a53305f523b5ac0bf1fc2c75350 Mon Sep 17 00:00:00 2001
From: Noy <59097122+noyyyy@users.noreply.github.com>
Date: Thu, 17 Oct 2024 02:13:36 +0800
Subject: [PATCH] refactor: disable refresh when buying is not confirmed

---
 .../client/src/ui/features/shop/HeroCard.tsx   | 18 +++++++++++++-----
 packages/client/src/ui/features/shop/Shop.tsx  |  5 +++++
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/packages/client/src/ui/features/shop/HeroCard.tsx b/packages/client/src/ui/features/shop/HeroCard.tsx
index 40c9b7c..4241c4a 100644
--- a/packages/client/src/ui/features/shop/HeroCard.tsx
+++ b/packages/client/src/ui/features/shop/HeroCard.tsx
@@ -24,9 +24,10 @@ const rarityBgColor: Record<number, string> = {
 interface IHeroCard {
     creatureKey: CreatureKey;
     altarSlot: number;
+    setLoading: React.Dispatch<React.SetStateAction<boolean>>;
 }
 
-export const HeroCard = ({ creatureKey, altarSlot }: IHeroCard) => {
+export const HeroCard = ({ creatureKey, altarSlot, setLoading }: IHeroCard) => {
     const {
         clientComponents: { GameStatus, Player },
         systemCalls: { buyHero, buyAndMerge },
@@ -50,6 +51,7 @@ export const HeroCard = ({ creatureKey, altarSlot }: IHeroCard) => {
             alert("can only buy piece during prepare");
             return;
         }
+        setLoading(true);
         playClick();
 
         if (mergeAble.canMerge) {
@@ -64,11 +66,17 @@ export const HeroCard = ({ creatureKey, altarSlot }: IHeroCard) => {
                 y: mergeAble.onBoardCoord.y,
                 invSlot: mergeAble.invSlot,
                 onBoardIdx: mergeAble.boardIdx,
-            }).then(() => {
-                playUpgrade();
-            });
+            })
+                .then(() => {
+                    playUpgrade();
+                })
+                .finally(() => {
+                    setLoading(false);
+                });
         } else {
-            buyHero(account, altarSlot, firstEmptyInv);
+            buyHero(account, altarSlot, firstEmptyInv).finally(() => {
+                setLoading(false);
+            });
         }
     }, [
         account,
diff --git a/packages/client/src/ui/features/shop/Shop.tsx b/packages/client/src/ui/features/shop/Shop.tsx
index 71e401d..2091951 100644
--- a/packages/client/src/ui/features/shop/Shop.tsx
+++ b/packages/client/src/ui/features/shop/Shop.tsx
@@ -85,6 +85,7 @@ const Shop = () => {
                             level: 1,
                         }}
                         altarSlot={1}
+                        setLoading={setLoading}
                     />
                     <HeroCard
                         creatureKey={{
@@ -92,6 +93,7 @@ const Shop = () => {
                             level: 1,
                         }}
                         altarSlot={2}
+                        setLoading={setLoading}
                     />
                     <HeroCard
                         creatureKey={{
@@ -99,6 +101,7 @@ const Shop = () => {
                             level: 1,
                         }}
                         altarSlot={3}
+                        setLoading={setLoading}
                     />
                     <HeroCard
                         creatureKey={{
@@ -106,6 +109,7 @@ const Shop = () => {
                             level: 1,
                         }}
                         altarSlot={4}
+                        setLoading={setLoading}
                     />
                     <HeroCard
                         creatureKey={{
@@ -113,6 +117,7 @@ const Shop = () => {
                             level: 1,
                         }}
                         altarSlot={5}
+                        setLoading={setLoading}
                     />
                 </div>