|
| 1 | +--- |
| 2 | +title: "Aptos Wallet Adapter" |
| 3 | +id: "wallet-adapter-concept" |
| 4 | +--- |
| 5 | + |
| 6 | +import ThemedImage from '@theme/ThemedImage'; |
| 7 | +import useBaseUrl from '@docusaurus/useBaseUrl'; |
| 8 | + |
| 9 | +# Aptos Wallet Adapter |
| 10 | + |
| 11 | +Building a dapp requiers to provide a wallet for the user to interact with the Aptos chain, and for a good user experience, it requires to provide multiple wallets so users can chose the one they want to use. |
| 12 | + |
| 13 | +Implementing wallet integration can be difficult for dapps in: |
| 14 | + |
| 15 | +1. Support and test all edge cases |
| 16 | +2. Implement and maintain different wallet APIs |
| 17 | +3. Provide users with needed functionality the wallet itself doesnt support |
| 18 | +4. Keep track on all the different wallets in our ecosystem |
| 19 | + |
| 20 | +In addition, creating and implementing a wallet is also not an easy task, |
| 21 | + |
| 22 | +1. Provide a wallet that follows a known standard so it is easy to integrate with |
| 23 | +2. Getting visibility and exposure in the ecosystem among all the other wallets |
| 24 | +3. Dapp projects need to dedicate time and resource to integrate the wallet within their app |
| 25 | + |
| 26 | +When we started building a wallet adapter, we wanted to provide an adapter that can be easy enough for wallets to integrate with and for dapps to use and implement. |
| 27 | + |
| 28 | +For that, we provide an [Aptos Wallet Adapter](https://github.com/aptos-labs/aptos-wallet-adapter) monorepo for wallet and dapps creators to ease development and ensure a smooth process in building projects on the Aptos network. |
| 29 | +The Aptos Wallet Adapter acts as a service between dapps and wallets and exposes APIs for dapps to interact with the wallets by following our [Wallet Standard](../guides/wallet-standard). This in turns allows dapps to support many wallets with minimal integration efforts, and for wallets to follow a known standard and gain visibility. |
| 30 | + |
| 31 | +## Adapter structure |
| 32 | + |
| 33 | +The adapter has three different components, the: |
| 34 | + |
| 35 | +1. Adapter Core package |
| 36 | +2. Adapter React provider (for dapps) |
| 37 | +3. Adapter Template plugin (for wallets) |
| 38 | + |
| 39 | +This structure offers the following benefits: |
| 40 | + |
| 41 | +- Modularity (separation of concerns) - separating the adapter into three components can help having more freedom in design, implementation, deployment and usage. |
| 42 | +- Wallets create and own their plugin implementation (instead of having all in the same monorepo): |
| 43 | + - Reduces the packages bundle size used by dapps. |
| 44 | + - Lets them be self-service and support themselves without too much friction. |
| 45 | + - Prevents build failures in case of any bugs/bad implementation/wrong config files/etc. |
| 46 | +- Simplicity - keeps the Provider package very light and small as the major logic is implemented in the core package. |
| 47 | +- Flexibility - for wallets in creating and implementing custom functions. |
| 48 | + |
| 49 | +### Adapter Core package |
| 50 | + |
| 51 | +The [Adapter Core package](https://github.com/aptos-labs/aptos-wallet-adapter/tree/main/packages/wallet-adapter-core) handles the interaction between the dapp and the wallet. It: |
| 52 | + |
| 53 | +- Exposes the standard API (and some different functions supported by different wallets) |
| 54 | +- Holds the current wallet state and the installed wallets |
| 55 | +- Emits events on different actions and much more |
| 56 | + |
| 57 | +Dapps should not _know_ this package as dapps interact with the provider, which in turn interacts with the core package; some Types are exposed from the core package for the dapp to use. |
| 58 | + |
| 59 | +Wallets should implement their own plugin class that extends the basic plugin class (properties + events) interface that lives in the core package. |
| 60 | + |
| 61 | +:::tip |
| 62 | +If a wallet supports functions that are not part of the basic plugin interface, a pull request should be made to the core package to include this function so it can support it. You can take a look at the `signTransaction` on the wallet core package for guidance. |
| 63 | +::: |
| 64 | + |
| 65 | +### Adapter React provider |
| 66 | + |
| 67 | +The light [Adapter React package](https://github.com/aptos-labs/aptos-wallet-adapter/tree/main/packages/wallet-adapter-react) is for dapps to import and use. The package contains a `Provider` and a `Context` to implement and use within your app. |
| 68 | + |
| 69 | +Follow the [Wallet Adapter For Dapp Builders](../guides/wallet-adapter-for-dapp.md) guide on how to use the provider package on your dapp. |
| 70 | + |
| 71 | +### Adapter Template plugin |
| 72 | + |
| 73 | +Wallets looking to integrate with the adapter should implement their own wallet plugin, to ease the process we provide you with a pre-made class that implements the basic functionality needed (according to the wallet standard). |
| 74 | + |
| 75 | +The [Wallet Adapter Plugin Template repo](https://github.com/aptos-labs/wallet-adapter-plugin-template) holds a pre-made class, a test file, and some config files to help you build and publish the plugin as an NPM package. |
| 76 | + |
| 77 | +Follow the [Wallet Adapter For Wallet Builders](../guides/wallet-adapter-for-wallets.md) on how to use the template to implement and publish your wallet plugin. |
| 78 | + |
| 79 | +<center> |
| 80 | +<ThemedImage |
| 81 | +alt="Wallet Adapter Concept" |
| 82 | +sources={{ |
| 83 | + light: useBaseUrl('/img/docs/wallet-adapter-chart-light.svg'), |
| 84 | + dark: useBaseUrl('/img/docs/wallet-adapter-chart-dark.svg'), |
| 85 | + }} |
| 86 | +/> |
| 87 | +</center> |
0 commit comments