From f03625ea2132e9a15292e3c40fd2f90edebc22b0 Mon Sep 17 00:00:00 2001
From: jeremy-babylonchain <jeremy.tsang@babylonchain.io>
Date: Thu, 3 Oct 2024 17:27:19 +0700
Subject: [PATCH] use correct height for unbonding model

---
 package-lock.json                             |  4 +--
 package.json                                  |  2 +-
 .../components/Delegations/Delegations.tsx    | 34 ++++++++++++++-----
 .../components/Modals/UnbondWithdrawModal.tsx | 21 +++++++++---
 4 files changed, 45 insertions(+), 16 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f33be58f..b92b1e8a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "simple-staking",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "simple-staking",
-      "version": "0.3.2",
+      "version": "0.3.3",
       "dependencies": {
         "@babylonlabs-io/btc-staking-ts": "0.3.0",
         "@bitcoin-js/tiny-secp256k1-asmjs": "2.2.3",
diff --git a/package.json b/package.json
index 2756104e..61111947 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "simple-staking",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "private": true,
   "scripts": {
     "dev": "next dev",
diff --git a/src/app/components/Delegations/Delegations.tsx b/src/app/components/Delegations/Delegations.tsx
index 17a31e3b..59f2bec0 100644
--- a/src/app/components/Delegations/Delegations.tsx
+++ b/src/app/components/Delegations/Delegations.tsx
@@ -100,6 +100,9 @@ const DelegationsContent: React.FC<DelegationsProps> = ({
   const { showError } = useError();
   const { isApiNormal, isGeoBlocked } = useHealthCheck();
   const [awaitingWalletResponse, setAwaitingWalletResponse] = useState(false);
+  const [selectedDelegationHeight, setSelectedDelegationHeight] = useState<
+    number | undefined
+  >();
 
   const shouldShowPoints =
     isApiNormal && !isGeoBlocked && shouldDisplayPoints();
@@ -171,13 +174,15 @@ const DelegationsContent: React.FC<DelegationsProps> = ({
           message: error.message,
           errorState: ErrorState.UNBONDING,
         },
-        retryAction: () => handleModal(id, MODE_UNBOND),
+        retryAction: () =>
+          handleModal(id, MODE_UNBOND, selectedDelegationHeight!),
       });
     } finally {
       setModalOpen(false);
       setTxID("");
       setModalMode(undefined);
       setAwaitingWalletResponse(false);
+      setSelectedDelegationHeight(undefined);
     }
   };
 
@@ -206,20 +211,23 @@ const DelegationsContent: React.FC<DelegationsProps> = ({
           message: error.message,
           errorState: ErrorState.WITHDRAW,
         },
-        retryAction: () => handleModal(id, MODE_WITHDRAW),
+        retryAction: () =>
+          handleModal(id, MODE_WITHDRAW, selectedDelegationHeight!),
       });
     } finally {
       setModalOpen(false);
       setTxID("");
       setModalMode(undefined);
       setAwaitingWalletResponse(false);
+      setSelectedDelegationHeight(undefined);
     }
   };
 
-  const handleModal = (txID: string, mode: MODE) => {
+  const handleModal = (txID: string, mode: MODE, delegationHeight: number) => {
     setModalOpen(true);
     setTxID(txID);
     setModalMode(mode);
+    setSelectedDelegationHeight(delegationHeight);
   };
 
   useEffect(() => {
@@ -325,9 +333,19 @@ const DelegationsContent: React.FC<DelegationsProps> = ({
                     stakingValueSat={stakingValueSat}
                     stakingTxHash={stakingTxHashHex}
                     state={state}
-                    onUnbond={() => handleModal(stakingTxHashHex, MODE_UNBOND)}
+                    onUnbond={() =>
+                      handleModal(
+                        stakingTxHashHex,
+                        MODE_UNBOND,
+                        stakingTx.startHeight,
+                      )
+                    }
                     onWithdraw={() =>
-                      handleModal(stakingTxHashHex, MODE_WITHDRAW)
+                      handleModal(
+                        stakingTxHashHex,
+                        MODE_WITHDRAW,
+                        stakingTx.startHeight,
+                      )
                     }
                     intermediateState={intermediateDelegation?.state}
                     isOverflow={isOverflow}
@@ -339,11 +357,9 @@ const DelegationsContent: React.FC<DelegationsProps> = ({
           </div>
         </>
       )}
-
-      {modalMode && txID && (
+      {modalMode && txID && selectedDelegationHeight !== undefined && (
         <UnbondWithdrawModal
-          unbondingTimeBlocks={globalParamsVersion.unbondingTime}
-          unbondingFeeSat={globalParamsVersion.unbondingFeeSat}
+          delegationHeight={selectedDelegationHeight}
           open={modalOpen}
           onClose={() => setModalOpen(false)}
           onProceed={() => {
diff --git a/src/app/components/Modals/UnbondWithdrawModal.tsx b/src/app/components/Modals/UnbondWithdrawModal.tsx
index 6fbe90c8..d77cfc64 100644
--- a/src/app/components/Modals/UnbondWithdrawModal.tsx
+++ b/src/app/components/Modals/UnbondWithdrawModal.tsx
@@ -1,8 +1,10 @@
 import { IoMdClose } from "react-icons/io";
 
+import { useGlobalParams } from "@/app/context/api/GlobalParamsProvider";
 import { getNetworkConfig } from "@/config/network.config";
 import { blocksToDisplayTime } from "@/utils/blocksToDisplayTime";
 import { satoshiToBtc } from "@/utils/btcConversions";
+import { getCurrentGlobalParamsVersion } from "@/utils/globalParams";
 import { maxDecimals } from "@/utils/maxDecimals";
 
 import { LoadingView } from "../Loading/Loading";
@@ -14,8 +16,7 @@ export const MODE_WITHDRAW = "withdraw";
 export type MODE = typeof MODE_UNBOND | typeof MODE_WITHDRAW;
 
 interface PreviewModalProps {
-  unbondingTimeBlocks: number;
-  unbondingFeeSat: number;
+  delegationHeight: number;
   open: boolean;
   onClose: (value: boolean) => void;
   onProceed: () => void;
@@ -24,8 +25,7 @@ interface PreviewModalProps {
 }
 
 export const UnbondWithdrawModal: React.FC<PreviewModalProps> = ({
-  unbondingTimeBlocks,
-  unbondingFeeSat,
+  delegationHeight,
   open,
   onClose,
   onProceed,
@@ -33,6 +33,19 @@ export const UnbondWithdrawModal: React.FC<PreviewModalProps> = ({
   awaitingWalletResponse,
 }) => {
   const { coinName, networkName } = getNetworkConfig();
+  const { data: allGlobalParamsVersions } = useGlobalParams();
+
+  const getGlobalParamsForDelegation = (startHeight: number) => {
+    const { currentVersion } = getCurrentGlobalParamsVersion(
+      startHeight,
+      allGlobalParamsVersions || [],
+    );
+    return currentVersion;
+  };
+
+  const globalParams = getGlobalParamsForDelegation(delegationHeight);
+  const unbondingFeeSat = globalParams?.unbondingFeeSat || 0;
+  const unbondingTimeBlocks = globalParams?.unbondingTime || 0;
 
   const unbondTitle = "Unbond";