[DOC] add aptos wallet adapter docs (#5812)

* [DOC] add aptos wallet adapter docs

* [DOC] add aptos wallet adapter docs

* [DOC] add aptos wallet adapter docs

* import image and baseUrl components

* add missing link

* rename image files

* add words to dict file

* Make direct edits to Wallet Adapter concept

* Make direct edits to Wallet Adapter for Dapps doc

* Edit Wallet Adapter for Wallets directly

* Fix order of new dictionary entries

* address feedback

* add context on the adapter

* Make small edits directly

Co-authored-by: Clay Murphy <[email protected]>

developer-docs-site/docs/concepts/wallet-adapter-concept.md

@@ -0,0 +1,87 @@
+---
+title: "Aptos Wallet Adapter"
+id: "wallet-adapter-concept"
+---
+
+import ThemedImage from '@theme/ThemedImage';
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
+# Aptos Wallet Adapter
+
+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.
+
+Implementing wallet integration can be difficult for dapps in:
+
+1. Support and test all edge cases
+2. Implement and maintain different wallet APIs
+3. Provide users with needed functionality the wallet itself doesnt support
+4. Keep track on all the different wallets in our ecosystem
+
+In addition, creating and implementing a wallet is also not an easy task,
+
+1. Provide a wallet that follows a known standard so it is easy to integrate with
+2. Getting visibility and exposure in the ecosystem among all the other wallets
+3. Dapp projects need to dedicate time and resource to integrate the wallet within their app
+
+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.
+
+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.
+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.
+
+## Adapter structure
+
+The adapter has three different components, the:
+
+1. Adapter Core package
+2. Adapter React provider (for dapps)
+3. Adapter Template plugin (for wallets)
+
+This structure offers the following benefits:
+
+- Modularity (separation of concerns) - separating the adapter into three components can help having more freedom in design, implementation, deployment and usage.
+- Wallets create and own their plugin implementation (instead of having all in the same monorepo):
+  - Reduces the packages bundle size used by dapps.
+  - Lets them be self-service and support themselves without too much friction.
+  - Prevents build failures in case of any bugs/bad implementation/wrong config files/etc.
+- Simplicity - keeps the Provider package very light and small as the major logic is implemented in the core package.
+- Flexibility - for wallets in creating and implementing custom functions.
+
+### Adapter Core package
+
+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:
+
+- Exposes the standard API (and some different functions supported by different wallets)
+- Holds the current wallet state and the installed wallets
+- Emits events on different actions and much more
+
+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.
+
+Wallets should implement their own plugin class that extends the basic plugin class (properties + events) interface that lives in the core package.
+
+:::tip
+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.
+:::
+
+### Adapter React provider
+
+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.
+
+Follow the [Wallet Adapter For Dapp Builders](../guides/wallet-adapter-for-dapp.md) guide on how to use the provider package on your dapp.
+
+### Adapter Template plugin
+
+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).
+
+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.
+
+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.
+
+<center>
+<ThemedImage
+alt="Wallet Adapter Concept"
+sources={{
+    light: useBaseUrl('/img/docs/wallet-adapter-chart-light.svg'),
+    dark: useBaseUrl('/img/docs/wallet-adapter-chart-dark.svg'),
+  }}
+/>
+</center>

developer-docs-site/docs/guides/wallet-adapter-for-dapp.md

@@ -0,0 +1,87 @@
+---
+title: "For Dapps"
+id: "wallet-adapter-for-dapp"
+---
+
+# Wallet Adapter For Dapp builders
+
+Imagine you have a great idea for a dapp and you want to start building it. Eventually, you will need to integrate a wallet or multiple wallets so your users can interact with the Aptos blockchain.
+Implementing wallet integration can be difficult in supporting all edge cases, new features, unsupported functionality. And it can be even harder to support multiple wallets.
+
+In addition, different wallets have different APIs, and not all wallets share the same naming convention. For example, maybe all wallets have a `connect` method, but not all wallets call that method `connect`; that can be tricky to support.
+
+Luckily, Aptos built a wallet adapter, created and maintained by the Aptos team, to help you ramp up development and standardize where possible.
+
+The Aptos Wallet Adapter provides:
+
+- Easy wallet implementation - no need to implement and support code for multiple wallets.
+- Support for different wallet APIs.
+- Support for features not implemented on the wallet level.
+- Detection for uninstalled wallets (so you can show users that a wallet is not installed).
+- Auto-connect functionality and remembers the current wallet state.
+- Listens to wallet events, such as account and network changes.
+- A well-developed and maintained reference implementation by the Aptos ecosystem team.
+
+## Install
+
+Currently, the adapter supports a _React provider_ for you to include in your app.
+
+Install wallet dependencies you want to include in your app. You can find a list of the wallets in the Aptos Wallet Adapter [README](https://github.com/aptos-labs/aptos-wallet-adapter#supported-wallet-packages).
+
+Install the React provider:
+
+```bash
+npm install @aptos-labs/wallet-adapter-react
+```
+
+## Import dependencies
+
+In the `App.jsx` file:
+
+Import the installed wallets:
+
+```js
+import { PetraWallet } from "petra-plugin-wallet-adapter";
+```
+
+Import the `AptosWalletAdapterProvider`:
+
+```js
+import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react";
+```
+
+Wrap your app with the Provider, pass it the plugins (wallets) you want to have on your app as an array, and include an autoConnect option (set to false by default):
+
+```js
+const wallets = [new PetraWallet()];
+<AptosWalletAdapterProvider plugins={wallets} autoConnect={true}>
+  <App />
+</AptosWalletAdapterProvider>;
+```
+
+### Use
+
+On any page you want to use the wallet properties, import `useWallet` from `@aptos-labs/wallet-adapter-react`:
+
+```js
+import { useWallet } from "@aptos-labs/wallet-adapter-react";
+```
+
+You can then use the exported properties:
+
+```js
+const {
+  connect,
+  account,
+  network,
+  connected,
+  disconnect,
+  wallet,
+  wallets,
+  signAndSubmitTransaction,
+  signTransaction,
+  signMessage,
+} = useWallet();
+```
+
+Finally, use the [examples](https://github.com/aptos-labs/aptos-wallet-adapter/tree/main/packages/wallet-adapter-react#examples) on the package README file to build more functionality into your dapps.

developer-docs-site/docs/guides/wallet-adapter-for-wallets.md

@@ -0,0 +1,41 @@
+---
+title: "For Wallets"
+id: "wallet-adapter-for-wallets"
+---
+
+# Wallet Adapter For Wallet Builders
+
+To gain from dapps in the Aptos Ecosystem and provide your users the functionality they are looking for in a wallet, your wallet plugin should follow the [Aptos Wallet Standard](./wallet-standard.md) and be built from the Aptos Wallet Adapter.
+
+The [wallet-adapter-plugin-template](https://github.com/aptos-labs/wallet-adapter-plugin-template) repository gives wallet builders a pre-made class with all required wallet functionality following the Aptos Wallet Standard for easy and fast development.
+
+## Configuration
+
+1. `git clone [email protected]:aptos-labs/wallet-adapter-plugin-template.git`
+1. Open `src/index.ts` for editing.
+1. Replace all `AptosWindow` references with: `<Your-Wallet-Name>Window`
+1. Replace `AptosWalletName` with: `<Your-Wallet-Name>WalletName`
+1. Replace `url` with your website URL.
+1. Change `icon` to your wallet icon (pay attention to the required format).
+1. Replace `window.aptos` with: `window.<your-wallet-name>`
+  - Make sure the `Window Interface` has `<your-wallet-name>` as a key (instead of `aptos`).
+1. Open `__tests/index.test.tsx` and change `AptosWallet` to: `<Your-Wallet-Name>Wallet`
+1. Run tests with `pnpm test` - all tests should pass.
+
+At this point, you have a ready wallet class with all required properties and functions to integrate with the Aptos Wallet Adapter.
+
+### Publish as a package
+
+The next step is to publish your wallet as an NPM package so dapps can install it as a dependency. Use one of the options below:
+
+[Creating and publishing scoped public packages](https://docs.npmjs.com/creating-and-publishing-scoped-public-packages)
+
+[Creating and publishing unscoped public packages](https://docs.npmjs.com/creating-and-publishing-unscoped-public-packages)
+
+:::tip
+If your wallet provides functionality that is not included, you should open a pull request against `aptos-wallet-adapter` in the core package to have it support this functionality. See the `signTransaction` on the [wallet core package](https://github.com/aptos-labs/aptos-wallet-adapter/blob/main/packages/wallet-adapter-core/src/WalletCore.ts) for guidance.
+:::
+
+### Add your name to the wallets list
+
+Once the package is published, create a pull request against the [aptos-wallet-adapter](https://github.com/aptos-labs/aptos-wallet-adapter) package and add your wallet name to the [supported wallet list](https://github.com/aptos-labs/aptos-wallet-adapter#supported-wallet-packages) on the README file as a URL to your NPM package.

developer-docs-site/scripts/additional_dict.txt

@@ -17,6 +17,8 @@ AptosBFT
 AptosCoin
 AptosLabs
 AptosNet
+AptosWalletAdapterProvider
+autoConnect
 BCS
 BFT
 BIP
@@ -36,8 +38,11 @@ CoinType
 Ctrl
 DAO
 DApps
+Dapps
+dapps
 DDoS
 DECL
+doesnt
 DM
 DNS
 Dev
@@ -120,6 +125,8 @@ Mainnnet
 ManagedCoin
 Merkle
 MiB
+Modularity
+monorepo
 Monterey
 MoonCoin
 MoveVM
@@ -132,6 +139,7 @@ NFTs
 NHC
 NetworkAddress
 NoAvailablePeers
+NPM
 ORM
 Octa
 Octas
@@ -278,6 +286,7 @@ io
 ip
 ips
 isConnected
+jsx
 kickstart
 korean
 leaderboard
@@ -331,6 +340,7 @@ quickstart
 quickstarts
 repo
 repos
+requiers
 ruleset
 runtime
 scalability
@@ -369,6 +379,7 @@ uint
 unexportable
 unixtime
 unmount
+unscoped
 untracked
 upgradeability
 upgradeable
@@ -377,6 +388,7 @@ upvote
 url
 useBaseUrl
 usecase
+useWallet
 utc
 validator
 validator's

developer-docs-site/sidebars.js

@@ -137,6 +137,13 @@ const sidebars = {
         "guides/move-guides/upgrading-move-code",
       ],
     },
+    {
+      type: "category",
+      label: "Aptos Wallet Adapter",
+      collapsible: true,
+      collapsed: true,
+      items: ["concepts/wallet-adapter-concept", "guides/wallet-adapter-for-dapp", "guides/wallet-adapter-for-wallets"],
+    },
     {
       type: "html",
       value: "Run Nodes",