/** Wallets that use social login to create an account on the blockchain */
{aptosConnectWallets.map((aptosConnectwallet) => (
return
{aptosConnectwallet.name}
))}
/** Wallets that are currently installed or loadable. */
{availableWallets.map((availableWallet) => (
return
{availableWallet.name}
))}
/** Wallets that are NOT currently installed or loadable. */
{installableWallets.map((installableWallet) => (
return
{installableWallet.name}
))}
)
}
```
### `connect()` and `disconnect()`
`connect()` establishes a connection between the dapp and a Wallet. You can then use `disconnect()` to
```tsx filename="WalletConnectDemo.tsx"
import React from 'react';
import { WalletName, useWallet } from '@aptos-labs/wallet-adapter-react';
const WalletConnectDemo = () => {
const { connect, disconnect, account, connected } = useWallet();
const handleConnect = async () => {
try {
// Change below to the desired wallet name instead of "Petra"
await connect("Petra" as WalletName<"Petra">);
console.log('Connected to wallet:', account);
} catch (error) {
console.error('Failed to connect to wallet:', error);
}
};
const handleDisconnect = async () => {
try {
await disconnect();
console.log('Disconnected from wallet');
} catch (error) {
console.error('Failed to disconnect from wallet:', error);
}
};
return (