mars-v2-frontend/src/components/Wallet/index.tsx
2024-02-19 15:01:04 +01:00

41 lines
1.3 KiB
TypeScript

import { useShuttle } from '@delphi-labs/shuttle-react'
import { useEffect } from 'react'
import WalletConnectButton from 'components/Wallet/WalletConnectButton'
import WalletConnectedButton from 'components/Wallet/WalletConnectedButton'
import WalletConnecting from 'components/Wallet/WalletConnecting'
import useCurrentWallet from 'hooks/useCurrentWallet'
import useStore from 'store'
export default function Wallet() {
const { disconnectWallet } = useShuttle()
const currentWallet = useCurrentWallet()
const address = useStore((s) => s.address)
useEffect(() => {
if (address && address === currentWallet?.account.address) return
useStore.setState({
address: undefined,
userDomain: undefined,
client: undefined,
focusComponent: currentWallet
? {
component: <WalletConnecting />,
onClose: () => {
disconnectWallet(currentWallet)
useStore.setState({
client: undefined,
address: undefined,
userDomain: undefined,
balances: [],
focusComponent: null,
})
},
}
: null,
})
}, [currentWallet, address, disconnectWallet])
return address ? <WalletConnectedButton /> : <WalletConnectButton />
}