Fix/bugs (#145)

Deland-Labs · Aug 22, 2024 · 5f74058 · 5f74058
1 parent 8daed2a
commit 5f74058
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 28 deletions.
diff --git a/apps/wallet/src/apis/react-query/token.ts b/apps/wallet/src/apis/react-query/token.ts
@@ -78,6 +78,6 @@ export const useTokenBalanceQuery = (token?: RootAssetInfo) => {
       return (await hibitIdSession.walletPool.balanceOf(address, token))?.dp(SYSTEM_MAX_DECIMALS, BigNumber.ROUND_FLOOR)
     },
     enabled: !!token,
-    staleTime: 10000,
+    refetchInterval: 10000,
   })
 }
diff --git a/apps/wallet/src/components/TokenList.tsx b/apps/wallet/src/components/TokenList.tsx
@@ -18,7 +18,7 @@ const TokenListItem: FC<{ token: RootAssetInfo }> = ({ token }) => {
     >
       <TokenIcon token={token} />
       <div className="flex-1 flex flex-col items-end">
-        {balanceQuery.isLoading ? (
+        {balanceQuery.isFetching ? (
           <span className="loading loading-spinner loading-sm"></span>
         ) : (
           <span className="text-sm">{balanceQuery.data?.toString() ?? '0'}</span>

diff --git a/apps/wallet/src/pages/send-token/confirm-page.tsx b/apps/wallet/src/pages/send-token/confirm-page.tsx
@@ -5,7 +5,7 @@ import { useNavigate } from "react-router-dom";
 import SvgLoading from '../../assets/transfer-loading.svg?react';
 import SvgSuccess from '../../assets/transfer-success.svg?react';
 import SvgExternal from '../../assets/external.svg?react';
-import { useTokenBalanceQuery, useTokenQuery } from "../../apis/react-query/token";
+import { useTokenBalanceQuery, useTokenListQuery } from "../../apis/react-query/token";
 import BigNumber from "bignumber.js";
 import toaster from "../../components/Toaster";
 import { useMutation, useQuery } from "@tanstack/react-query";
@@ -18,17 +18,18 @@ import PageHeader from "../../components/PageHeader";
 
 const SendTokenConfirmPage: FC = observer(() => {
   const [errMsg, setErrMsg] = useState<string>('')
-  const [transferResult, setTransferResult] = useState<{
-    state: 'pending' | 'done',
-    txId: string
-  }>({
-    state: 'pending',
-    txId: ''
-  })
+  const [resultTxId, setResultTxId] = useState('')
   const navigate = useNavigate()
 
   const { state } = sendTokenStore
-  const nativeTokenQuery = useTokenQuery(hibitIdSession.chainInfo.nativeAssetSymbol)
+  const tokenListQuery = useTokenListQuery(hibitIdSession.chainInfo)
+  const nativeTokenQuery = useQuery({
+    queryKey: ['nativeToken', hibitIdSession.chainInfo],
+    queryFn: async () => {
+      return tokenListQuery.data!.find(t => t.chainAssetType.equals(ChainAssetType.Native))
+    },
+    enabled: !!tokenListQuery.data
+  })
   const nativeBalanceQuery = useTokenBalanceQuery(nativeTokenQuery.data || undefined)
   const feeQuery = useQuery({
     queryKey: ['estimatedFee', state],
@@ -93,11 +94,11 @@ const SendTokenConfirmPage: FC = observer(() => {
         amount: state.amount,
       })
       console.debug('[txId]', txId)
-      setTransferResult({ state: 'done', txId })
+      setResultTxId(txId)
       sendTokenStore.reset()
     } catch (e) {
       console.error(e)
-      setTransferResult({ state: 'pending', txId: '' })
+      setResultTxId('')
       toaster.error(e instanceof Error ? e.message : JSON.stringify(e))
     }
   }
@@ -113,9 +114,8 @@ const SendTokenConfirmPage: FC = observer(() => {
     )
   }
 
-  if (transferResult.state === 'done') {
-    const txLink = getChainTxLink(hibitIdSession.chainInfo.chainId, transferResult.txId)
-
+  if (transferMutation.isSuccess) {
+    const txLink = getChainTxLink(hibitIdSession.chainInfo.chainId, resultTxId)
     return (
       <div className="h-full px-6 flex flex-col overflow-auto">
         <div className="flex-1 flex flex-col gap-8 justify-center items-center">
@@ -188,7 +188,7 @@ const SendTokenConfirmPage: FC = observer(() => {
       </div>
 
       <div className="flex items-center gap-2">
-        <button className="btn btn-sm flex-1">
+        <button className="btn btn-sm flex-1" onClick={() => navigate(-1)}>
           Cancel
         </button>
         <button

diff --git a/apps/wallet/src/pages/send-token/index.tsx b/apps/wallet/src/pages/send-token/index.tsx
@@ -18,8 +18,8 @@ import PageHeader from "../../components/PageHeader";
 
 const SendTokenPage: FC = observer(() => {
   const { addressOrSymbol } = useParams()
-  const [token, setToken] = useState<RootAssetInfo | null>(null)
   const { state, setState } = sendTokenStore
+  const [token, setToken] = useState<RootAssetInfo | null>(null)
   const navigate = useNavigate()
 
   const tokenQuery = useTokenQuery(addressOrSymbol ?? '')
@@ -68,10 +68,12 @@ const SendTokenPage: FC = observer(() => {
   })
 
   useEffect(() => {
-    if (tokenQuery.data) {
+    if (state.token) {
+      setToken(state.token)
+    } else if (tokenQuery.data) {
       setToken(tokenQuery.data)
     }
-  }, [tokenQuery.data])
+  }, [state.token, tokenQuery.data])
 
   const handleSend = handleSubmit(async ({ toAddress, amount }) => {
     if (!hibitIdSession.walletPool || !token) {
@@ -107,21 +109,21 @@ const SendTokenPage: FC = observer(() => {
           </label>
         </div>
         <div>
-          <label className="form-control w-full">
+          <div className="form-control w-full">
             <div className="label">
               <span className="label-text text-neutral text-sm font-bold">Amount</span>
               <span className="label-text-alt text-xs">
                 <button
                   className="btn btn-link btn-xs px-0 no-underline gap-0"
                   onClick={() => {
                     setValue('amount', balanceQuery.data?.toString() ?? '0')
+                    trigger('amount')
                   }}
                 >
                   Max:
-                  {balanceQuery.isLoading && (
+                  {balanceQuery.isFetching ? (
                     <span className="loading loading-spinner loading-xs"></span>
-                  )}
-                  {balanceQuery.data && (
+                  ) : (
                     <span className="mx-1">{formatNumber(balanceQuery.data || 0)}</span>
                   )}
                   {token?.assetSymbol}
@@ -166,7 +168,7 @@ const SendTokenPage: FC = observer(() => {
                 <span className="label-text-alt text-error">{errors.amount.message}</span>
               </div>
             )}
-          </label>
+          </div>
         </div>
       </div>
 

diff --git a/apps/wallet/src/pages/token-detail/index.tsx b/apps/wallet/src/pages/token-detail/index.tsx
@@ -41,10 +41,9 @@ const TokenDetailPage: FC = observer(() => {
         </div>
         <div className="flex flex-col items-center">
           <span className="text-2xl">
-            {balanceQuery.isLoading && (
+            {balanceQuery.isFetching ? (
               <span className="loading loading-spinner loading-sm"></span>
-            )}
-            {balanceQuery.data && (
+            ) : (
               <span>{`${formatNumber(balanceQuery.data)} ${token.assetSymbol}`}</span>
             )}
           </span>