# @manahippo/aptos-wallet-adapter > React `WalletProvider` supporting loads of aptos wallets. Latest version **1.0.10** (published 2023-01-10) · 0 weekly downloads > **Deprecated.** This package is deprecated. ## Install ```sh npm install @manahippo/aptos-wallet-adapter pnpm add @manahippo/aptos-wallet-adapter yarn add @manahippo/aptos-wallet-adapter bun add @manahippo/aptos-wallet-adapter ``` ## Health **Score 10/100 (F)** — status: deprecated. Negative: deprecated. ## Facts | | | |---|---| | Version | 1.0.10 | | Published | 2023-01-10 | | First published | 2022-07-07 | | Weekly downloads | 0 | | TypeScript types | bundled | | Module format | CommonJS | | Dependencies | 7 | | Unpacked size | 789 KB | | Known vulnerabilities | 0 | | Install scripts | no | | Maintainers | andy-hippo, hippolabs | ## Links - npm: https://www.npmjs.com/package/@manahippo/aptos-wallet-adapter - npm.io page: https://npm.io/package/@manahippo/aptos-wallet-adapter ## Dependencies (7) - [js-sha3](https://npm.io/package/js-sha3.md) ^0.8.0 - [@blocto/sdk](https://npm.io/package/@blocto/sdk.md) ^0.3.1 - [@fewcha/web3](https://npm.io/package/@fewcha/web3.md) 0.1.32 - [msafe-wallet](https://npm.io/package/msafe-wallet.md) ~2.1.3 - [eventemitter3](https://npm.io/package/eventemitter3.md) ^4.0.7 - [@openblockhq/dappsdk](https://npm.io/package/@openblockhq/dappsdk.md) ^5.0.2 - [@keystonehq/aptossnap-adapter](https://npm.io/package/@keystonehq/aptossnap-adapter.md) ^0.2.8 ## Recent versions - 1.0.10 (latest) — 2023-01-10 - 1.0.9 — 2023-01-07 - 1.0.8 — 2022-12-21 - 1.0.7 — 2022-12-17 - 1.0.6 — 2022-12-12 - 1.0.5 — 2022-12-08 - 1.0.3 — 2022-11-24 - 1.0.2 — 2022-10-21 - 1.0.1 — 2022-10-20 - 1.0.0 — 2022-10-18 - 0.4.13 — 2022-10-18 - 0.4.12 — 2022-10-17 - 0.4.11 — 2022-10-17 - 0.4.10 — 2022-10-16 - 0.4.9 — 2022-10-11 - … 40 more at https://npm.io/package/@manahippo/aptos-wallet-adapter/versions ## README # aptos-wallet-adapter React `WalletProvider` supporting loads of aptos wallets. Supports: - [Aptos official wallet](https://github.com/aptos-labs/aptos-core/releases/tag/wallet-v0.1.1) - [Martian wallet](https://martianwallet.xyz/) - [Fewcha wallet](https://fewcha.app/) - [Hippo wallet](https://github.com/hippospace/hippo-wallet) - [Hippo web wallet](https://hippo-wallet-test.web.app/) - [Pontem Wallet](https://pontem.network/pontem-wallet) - [Spika wallet](https://spika.app) - [Rise Wallet](https://risewallet.io/) - [Fletch wallet](http://fletchwallet.io/) - [TokenPocket Wallet](https://tokenpocket.pro) - [ONTO Wallet](https://onto.app) - [Blocto wallet](https://portto.com/download) - [Nightly Wallet](https://nightly.app/download) - [FoxWallet](https://foxwallet.com) - [Spacecy wallet](https://spacecywallet.com/) # Installation with `yarn` ``` yarn add @manahippo/aptos-wallet-adapter ``` with `npm` ``` npm install @manahippo/aptos-wallet-adapter ``` # Examples ## **Frontend Integration** Here's an example of how we integrate the adapter into [hippo's frontend](https://github.com/hippospace/hippo-frontend/blob/main/src/Providers.tsx): ### **Wallet integration** Wallets source code [here](https://github.com/hippospace/aptos-wallet-adapter/tree/main/src/WalletAdatpers). # Use React Provider ```typescript import React from 'react'; import { WalletProvider, HippoWalletAdapter, AptosWalletAdapter, HippoExtensionWalletAdapter, MartianWalletAdapter, FewchaWalletAdapter, PontemWalletAdapter, SpikaWalletAdapter, RiseWalletAdapter, FletchWalletAdapter, TokenPocketWalletAdapter, ONTOWalletAdapter, BloctoWalletAdapter, SafePalWalletAdapter, FoxWalletAdapter, CloverWalletAdapter, SpacecyWalletAdapter } from '@manahippo/aptos-wallet-adapter'; const wallets = [ new HippoWalletAdapter(), new MartianWalletAdapter(), new AptosWalletAdapter(), new FewchaWalletAdapter(), new HippoExtensionWalletAdapter(), new PontemWalletAdapter(), new SpikaWalletAdapter(), new RiseWalletAdapter(), new FletchWalletAdapter(), new TokenPocketWalletAdapter(), new ONTOWalletAdapter(), new BloctoWalletAdapter({ bloctoAppId:'6d85f56e-5f2e-46cd-b5f2-5cf9695b4d46' }), /** Must provide bloctoAppId **/ new SafePalWalletAdapter(), new FoxWalletAdapter(), new CloverWalletAdapter(), new SpacecyWalletAdapter() ]; const App: React.FC = () => { return ( { console.log('Handle Error Message', error); }}> {/* your website */} ); }; export default App; ``` # Web3 Hook ```typescript import { useWallet } from '@manahippo/aptos-wallet-adapter'; const { connected, account, network, ...rest } = useWallet(); /* ** Properties available: ** wallets: Wallet[]; - Array of wallets wallet: Wallet | null; - Selected wallet account: AccountKeys | null; - Wallet info: address, network: NetworkInfo - { name, chainId, api } publicKey, authKey connected: boolean; - check the website is connected yet connect(walletName: string): Promise; - trigger connect popup disconnect(): Promise; - trigger disconnect action signAndSubmitTransaction( transaction: TransactionPayload ): Promise; - function to sign and submit the transaction to chain */ ``` # Connect & Disconnect (updated @ 18/10/2022) ```typescript import { AptosWalletName, useWallet } from "@manahippo/aptos-wallet-adapter" ... const { connect, disconnect, connected } = useWallet(); /* No more manual connection required if you disable auto-connect mode while the previous select + connect will still work */ if (!connected) { return ( ); } else { return ( ); } ``` # Hippo Wallet Client ```typescript import { HippoSwapClient, HippoWalletClient } from '@manahippo/hippo-sdk'; import { getParserRepo } from '@manahippo/hippo-sdk'; export const hippoWalletClient = async (account: ActiveAptosWallet) => { if (!account) return undefined; const { netConf } = readConfig(); const repo = getParserRepo(); const walletClient = await HippoWalletClient.createInTwoCalls( netConf, aptosClient, repo, account ); return walletClient; }; ``` # Hippo Swap Client ```typescript import { HippoSwapClient, HippoWalletClient } from '@manahippo/hippo-sdk'; import { getParserRepo } from '@manahippo/hippo-sdk/'; export const hippoSwapClient = async () => { const { netConf } = readConfig(); const repo = getParserRepo(); const swapClient = await HippoSwapClient.createInOneCall(netConf, aptosClient, repo); return swapClient; }; ``` # Submit and sign transaction **Request faucet** ```typescript const { signAndSubmitTransaction } = useWallet(); const payload = await hippoWallet?.makeFaucetMintToPayload(uiAmtUsed, symbol); if (payload) { const result = await signAndSubmitTransaction(payload); if (result) { message.success('Transaction Success'); await hippoWallet?.refreshStores(); } } ``` **Swap Token** ```typescript const bestQuote = await hippoSwap.getBestQuoteBySymbols(fromSymbol, toSymbol, uiAmtIn, 3); if (!bestQuote) { throw new Error(`No route exists from ${fromSymbol} to ${toSymbol}`); } const payload = await bestQuote.bestRoute.makeSwapPayload(uiAmtIn, uiAmtOutMin); const result = await signAndSubmitTransaction(payload); if (result) { message.success('Transaction Success'); setRefresh(true); } ``` **Deposit Transaction** ```typescript const pool = hippoSwap.getDirectPoolsBySymbolsAndPoolType(lhsSymbol, rhsSymbol, poolType); if (pool.length === 0) { throw new Error('Desired pool does not exist'); } const payload = await pool[0].makeAddLiquidityPayload(lhsUiAmt, rhsUiAmt); const result = await signAndSubmitTransaction(payload); if (result) { message.success('Transaction Success'); setRefresh(true); } ``` --- _Source: https://npm.io/package/@manahippo/aptos-wallet-adapter · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._