refetch token balances on each wallet open

Signed-off-by: Uncle Fatso <uncle.fatso@ghostchain.io>

package.json

@@ -1,7 +1,7 @@
 {
   "name": "ghost-dao-interface",
   "private": true,
-  "version": "0.2.4",
+  "version": "0.2.10",
   "type": "module",
   "scripts": {
     "dev": "vite",

src/components/TopBar/Wallet/InitialWalletView.tsx

@@ -12,7 +12,7 @@ import {
 import { styled } from '@mui/material/styles';
 import CloseIcon from '@mui/icons-material/Close';
 import LoopIcon from '@mui/icons-material/Loop';
-import { ReactElement, useState } from "react";
+import { ReactElement, useState, useEffect } from "react";
 import { useNavigate, createSearchParams } from "react-router-dom";
 
 import GhostStyledIcon from "../../Icon/GhostIcon";
@@ -105,7 +105,7 @@ const WalletTotalValue = ({ address, tokens }) => {
     );
 };
 
-function InitialWalletView({ address, chainId, onClose }) {
+function InitialWalletView({ isWalletOpen, address, chainId, onClose }) {
     const theme = useTheme();
     const navigate = useNavigate();
     const tokens = useWallet(chainId, address);
@@ -122,6 +122,12 @@ function InitialWalletView({ address, chainId, onClose }) {
         onClose();
     }
 
+    useEffect(() => {
+        if (isWalletOpen) {
+            Object.values(tokens ?? {}).forEach(token => token.refetch());
+        }
+    }, [isWalletOpen, tokens])
+
     return (
         <Paper>
             <Box sx={{ padding: theme.spacing(0, 3), display: "flex", flexDirection: "column", minHeight: "100vh" }}>

src/components/TopBar/Wallet/Token.tsx

@@ -192,6 +192,7 @@ export const useWallet = (chainId, userAddress) => {
             price: daiPrice,
             icons: ["GDAI"],
             externalUrl: "https://ghostchain.io/wp-content/uploads/2025/03/gDAI.svg",
+            refetch: daiRefetch,
         },
         ftso: {
             symbol: ftsoSymbol,
@@ -200,6 +201,7 @@ export const useWallet = (chainId, userAddress) => {
             price: ftsoPrice,
             icons: ["FTSO"],
             externalUrl: "https://ghostchain.io/wp-content/uploads/2025/03/eGHST.svg",
+            refetch: ftsoRefetch,
         },
         stnk: {
             symbol: stnkSymbol,
@@ -208,6 +210,7 @@ export const useWallet = (chainId, userAddress) => {
             price: stnkPrice,
             icons: ["STNK"],
             externalUrl: "https://ghostchain.io/wp-content/uploads/2025/03/sGHST.svg",
+            refetch: stnkRefetch,
         },
         ghst: {
             symbol: ghstSymbol,
@@ -216,6 +219,7 @@ export const useWallet = (chainId, userAddress) => {
             price: ghstPrice,
             icons: ["GHST"],
             externalUrl: "https://ghostchain.io/wp-content/uploads/2025/03/GHST.svg",
+            refetch: ghstRefetch,
         },
         daiFtso: {
             isPool: true,
@@ -225,6 +229,7 @@ export const useWallet = (chainId, userAddress) => {
             price: lpDaiFtsoPrice,
             icons: ["GDAI", "FTSO"],
             externalUrl: "https://ghostchain.io/wp-content/uploads/2025/03/uni-v2.svg",
+            refetch: lpDaiFtsoRefetch,
         }
     };
 

src/components/TopBar/Wallet/index.tsx

@@ -76,7 +76,7 @@ export function Wallet({ address, chainId, connect }) {
                 onOpen={openWallet}
                 onClose={closeWallet}
             >
-                <InitialWalletView address={address} chainId={chainId} onClose={closeWallet} />
+                <InitialWalletView isWalletOpen={isWalletOpen} address={address} chainId={chainId} onClose={closeWallet} />
             </StyledSwipeableDrawer>
         </>
     );

src/containers/Bond/components/BondConfirmModal.jsx

@@ -34,6 +34,7 @@ const BondConfirmModal = ({
     spendAmountValue,
     spendAmount,
     receiveAmount,
+    sender,
     handleSettingsOpen,
     isOpen,
     handleConfirmClose
@@ -58,6 +59,7 @@ const BondConfirmModal = ({
             spendAmountValue._value.toBigInt(),
             maxPrice,
             recipientAddress,
+            sender,
             referral
         );
 

src/containers/Bond/components/BondInputArea.jsx

@@ -20,7 +20,7 @@ import DataRow from "../../../components/DataRow/DataRow";
 import Paper from "../../../components/Paper/Paper";
 
 import { useCurrentIndex } from "../../../hooks/staking";
-import { useBalance } from "../../../hooks/tokens";
+import { useBalance, useTokenSymbol } from "../../../hooks/tokens";
 
 const BondInputArea = ({
     bond,
@@ -35,7 +35,7 @@ const BondInputArea = ({
     const { pathname } = useLocation();
 
     const { currentIndex } = useCurrentIndex(chainId);
-    const { balance } = useBalance(chainId, bond.quoteToken.quoteTokenAddress, address);
+    const { balance, refetch } = useBalance(chainId, bond.quoteToken.quoteTokenAddress, address);
 
     const { symbol: ftsoSymbol } = useTokenSymbol(chainId, "FTSO");
     const { symbol: ghstSymbol } = useTokenSymbol(chainId, "GHST");
@@ -60,6 +60,7 @@ const BondInputArea = ({
     const handleConfirmClose = () => {
         setAmount("");
         setConfirmOpen(false);
+        refetch();
     }
 
     const setMax = () => {
@@ -220,6 +221,7 @@ const BondInputArea = ({
                     receiveAmount={formatNumber(amountInBaseToken, formatDecimals)}
                     handleSettingsOpen={handleSettingsOpen}
                     isOpen={confirmOpen}
+                    sender={address}
                     handleConfirmClose={() => handleConfirmClose()}
                 />
             </Box>

src/containers/Bond/components/ClaimBonds.jsx

@@ -59,7 +59,7 @@ export const ClaimBonds = ({ chainId, address, secondsTo }) => {
 
     const onSubmit = async (indexes) => {
         const isFundsInWarmup = warmupInfo.deposit._value > 0n;
-        if ((warmupExists && isFundsInWarmup) || !isPreClaimConfirmed) {
+        if (warmupExists && isFundsInWarmup && !isPreClaimConfirmed) {
             setIsWapmup(true);
         } else {
             setIsPending(true);
@@ -69,6 +69,7 @@ export const ClaimBonds = ({ chainId, address, secondsTo }) => {
                 isPayoutGhst,
                 indexes
             );
+            await notesRefetch();
             setIsPending(false);
         }
     }
@@ -117,7 +118,7 @@ export const ClaimBonds = ({ chainId, address, secondsTo }) => {
                             </Box>
 
                             <PrimaryButton
-                                disabled={totalClaimableBalance._value === 0n}
+                                disabled={isPending || totalClaimableBalance._value === 0n}
                                 fullWidth
                                 className=""
                                 onClick={() => onSubmit(notes.filter((note) => secondsTo > note.matured).map(note => note.id))}
@@ -166,7 +167,7 @@ export const ClaimBonds = ({ chainId, address, secondsTo }) => {
                                         <Box mt="16px">
                                             <TertiaryButton
                                                 fullWidth
-                                                disabled={secondsTo < note.matured}
+                                                disabled={isPending || secondsTo < note.matured}
                                                 onClick={() => onSubmit([note.id])}
                                             >
                                                 Claim
@@ -222,7 +223,7 @@ export const ClaimBonds = ({ chainId, address, secondsTo }) => {
                                                 <TableCell style={{ padding: "8px 0" }}>
                                                     <TertiaryButton
                                                         fullWidth
-                                                        disabled={secondsTo < note.matured}
+                                                        disabled={isPending || secondsTo < note.matured}
                                                         onClick={() => onSubmit([note.id])}
                                                     >
                                                         Claim

src/containers/Stake/components/StakeConfirmationModal.jsx

@@ -84,7 +84,7 @@ const StakeConfirmationModal = (props) => {
                 );
                 break;
             case "UNSTAKE":
-                isRebase = props.upperToken === stnkSymbol;
+                isRebase = props.upperToken === props.stnkSymbol;
                 await unstake(
                     props.chainId,
                     props.address,

src/hooks/bonds/index.jsx

@@ -152,13 +152,13 @@ export const useLiveBonds = (chainId) => {
             discount,
             displayName: getBondNameDisplayName(chainId, bondName, quoteTokenAddress),
             baseToken: {
-                name: quoteTokenSymbol,
+                name: baseTokenSymbol,
                 purchaseUrl: getTokenPurchaseLink(chainId, ""),
                 icons: ["FTSO"],
                 tokenAddress: getTokenAddress(chainId, "FTSO")
             },
             quoteToken: {
-                name: quoteTokenName,
+                name: quoteTokenSymbol,
                 purchaseUrl: getTokenPurchaseLink(chainId, quoteTokenAddress),
                 icons: getTokenIcons(chainId, quoteTokenAddress),
                 decimals: quoteTokenDecimals,
@@ -258,10 +258,10 @@ export const useNotes = (chainId, address) => {
         }
     }) : [];
 
-    return { notes };
+    return { notes, refetch };
 }
 
-export const purchaseBond = async (chainId, bondId, amount, maxPrice, user, referral) => {
+export const purchaseBond = async (chainId, bondId, amount, maxPrice, user, sender, referral) => {
     const args = [
         bondId,
         amount,
@@ -278,7 +278,7 @@ export const purchaseBond = async (chainId, bondId, amount, maxPrice, user, refe
         chainId,
         "deposit",
         args,
-        user,
+        sender,
         messages
     );
 }