Pontem WalletWallet Adapter
The wallet adapter allows you to integrate multiple wallets at once while using a single interface to interact with all of them.
The adapter was developed by the Hippo team, and the main repository can be found here: https://github.com/hippospace/aptos-wallet-adapter.
Supported wallets:
Installation
Using yarn
bash
yarn add @manahippo/aptos-wallet-adapter
Using npm
bash
npm install @manahippo/aptos-wallet-adapter
Examples
Add Pontem Wallet to an existing codebase (React Provider)
typescript
import React from "react";
import {
PontemWalletAdapter, // Import Pontem Wallet Adapter.
HippoWalletAdapter,
...
WalletProvider,
} from '@manahippo/aptos-wallet-adapter';
const wallets = () => [
new PontemWalletAdapter(),
new HippoWalletAdapter(),
// Add Pontem Wallet Adapter to list of supported wallets.
...
new HippoExtensionWalletAdapter(),
];
...
Use React Provider
typescript
import React from "react";
import {
PontemWalletAdapter,
HippoWalletAdapter,
AptosWalletAdapter,
HippoExtensionWalletAdapter,
MartianWalletAdapter,
FewchaWalletAdapter,
WalletProvider,
} from '@manahippo/aptos-wallet-adapter';
const wallets = () => [
new PontemWalletAdapter(),
new MartianWalletAdapter(),
new AptosWalletAdapter(),
new FewchaWalletAdapter(),
new HippoWalletAdapter(),
new HippoExtensionWalletAdapter(),
];
const App: React.FC = () => {
return (
<WalletProvider
wallets={wallets}
onError={(error: Error) => {
console.log('Handle Error Message', error)
}}>
{/* your website */}
</WalletProvider>
);
};
export default App;
Web3 Hook
typescript
import { useWallet } from '@manahippo/aptos-wallet-adapter';
const { connected, account, ...rest } = useWallet();
/*
** Available properties: **
wallets: Wallet[]; - Array of wallets
wallet: Wallet | null; - Selected wallet
account(): AccountKeys | null; - Wallet info: address, publicKey, authKey
connected: boolean; - check if a website is already connected
connecting: boolean; - true while adapter waits for connect() to finish
disconnecting: boolean; - true while adapter waits for disconnect() to finish
connect(walletName: string): Promise<void>; - trigger connect popup
disconnect(): Promise<void>; - trigger disconnect action
signAndSubmitTransaction(
transaction: TransactionPayload
): Promise<PendingTransaction>; - function to sign and submit a transaction to the chain
signTransaction(transaction: TransactionPayload): Promise<SubmitTransactionRequest>;
- function to sign a transaction, but not submit it
signMessage(message: string): Promise<string> - function to sign a message
*/
Connect & Disconnect
typescript
const { wallets, connect, disconnect, isConnected } = useWallet();
const wallet = 'PontemWallet';
if (!isConnected) {
return (
<Button
onClick={() => {
connect(wallet);
}}
>
Connect
</Button>
);
} else {
return (
<Button
onClick={() => {
disconnect();
}}
>
Disconnect
</Button>
);
}