diff --git a/tauri-wallet/src/components/NavigationCards.tsx b/tauri-wallet/src/components/NavigationCards.tsx index 740cc1714b..f85687ba00 100644 --- a/tauri-wallet/src/components/NavigationCards.tsx +++ b/tauri-wallet/src/components/NavigationCards.tsx @@ -13,14 +13,12 @@ import { NymCard } from './NymCard' import { Alert } from '@material-ui/lab' import { handleCopy } from './CopyToClipboard' import { truncate } from '../utils' -import { useGetBalance } from '../hooks/useGetBalance' export const BalanceCard = () => { + const { getBalance } = useContext(ClientContext) const theme = useTheme() - const { balance, isLoading, error, getBalance } = useGetBalance() - - useEffect(getBalance, []) + useEffect(getBalance.fetchBalance, []) return (
@@ -30,7 +28,7 @@ export const BalanceCard = () => { noPadding Action={ - + @@ -38,14 +36,16 @@ export const BalanceCard = () => { >
- {isLoading ? ( + {getBalance.isLoading ? ( - ) : error ? ( + ) : getBalance.error ? ( - {error} + {getBalance.error} ) : ( - {balance?.printable_balance} + + {getBalance.balance?.printable_balance} + )}
diff --git a/tauri-wallet/src/context/main.tsx b/tauri-wallet/src/context/main.tsx index 48bee15883..4ce551617a 100644 --- a/tauri-wallet/src/context/main.tsx +++ b/tauri-wallet/src/context/main.tsx @@ -2,10 +2,12 @@ import React, { createContext, useEffect, useState } from 'react' import { useHistory } from 'react-router-dom' import { invoke } from '@tauri-apps/api' import { Coin, TClientDetails } from '../types' +import { TUseGetBalance, useGetBalance } from '../hooks/useGetBalance' type TClientContext = { clientDetails?: TClientDetails gasPrice?: Coin + getBalance: TUseGetBalance logIn: (clientDetails: TClientDetails) => void logOut: () => void } @@ -22,6 +24,8 @@ export const ClientContextProvider = ({ const history = useHistory() + const getBalance = useGetBalance() + useEffect(() => { !clientDetails ? history.push('/signin') : history.push('/balance') }, [clientDetails]) @@ -40,6 +44,7 @@ export const ClientContextProvider = ({ value={{ clientDetails, gasPrice, + getBalance, logIn, logOut, }} diff --git a/tauri-wallet/src/hooks/useGetBalance.tsx b/tauri-wallet/src/hooks/useGetBalance.tsx index cd0b0b6017..b60e1bb4f0 100644 --- a/tauri-wallet/src/hooks/useGetBalance.tsx +++ b/tauri-wallet/src/hooks/useGetBalance.tsx @@ -2,12 +2,19 @@ import { useState } from 'react' import { invoke } from '@tauri-apps/api' import { Balance } from '../types' -export const useGetBalance = () => { +export type TUseGetBalance = { + error?: string + balance?: Balance + isLoading: boolean + fetchBalance: () => void +} + +export const useGetBalance = (): TUseGetBalance => { const [balance, setBalance] = useState() const [error, setEror] = useState() const [isLoading, setIsLoading] = useState(false) - const getBalance = () => { + const fetchBalance = () => { setIsLoading(true) setEror(undefined) invoke('get_balance') @@ -24,6 +31,6 @@ export const useGetBalance = () => { error, isLoading, balance, - getBalance, + fetchBalance, } } diff --git a/tauri-wallet/src/routes/balance.tsx b/tauri-wallet/src/routes/balance.tsx index da3996c8c3..b14fba3270 100644 --- a/tauri-wallet/src/routes/balance.tsx +++ b/tauri-wallet/src/routes/balance.tsx @@ -8,9 +8,9 @@ import { theme } from '../theme' import { useGetBalance } from '../hooks/useGetBalance' export const Balance = () => { - const { balance, isLoading, error, getBalance } = useGetBalance() + const { balance, isLoading, error, fetchBalance } = useGetBalance() - useEffect(getBalance, []) + useEffect(fetchBalance, []) const RefreshAction = () => (