Skip to content
This repository was archived by the owner on Jul 30, 2025. It is now read-only.

Commit 1cd13e4

Browse files
authored
Update docs for fetching wallets in the wallet adapter (#937)
* update docs for fetching wallets in the wallet adapter * fix nextjs broken link * typo
1 parent 436e3f9 commit 1cd13e4

File tree

2 files changed

+61
-3
lines changed
  • apps/nextra/pages/en

2 files changed

+61
-3
lines changed

apps/nextra/pages/en/build/sdks/wallet-adapter/dapp.mdx

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -152,6 +152,64 @@ See the next.js example dapp for a demonstration of how these components are use
152152
- [Live site](https://aptos-labs.github.io/aptos-wallet-adapter/)
153153
- [Source code](https://github.com/aptos-labs/aptos-wallet-adapter/tree/main/apps/nextjs-example)
154154

155+
### `wallets`
156+
157+
`wallets` is a list of available wallets, including standard supported ones, each with name, URL, icon, readiness state, and AIP62 standard compliance indication.
158+
159+
```tsx filename="WalletDisplayDemo.tsx"
160+
import { useWallet } from '@aptos-labs/wallet-adapter-react';
161+
162+
const displayInstalledWalletsDemo = () => {
163+
164+
const { wallets } = useWallet();
165+
166+
return (
167+
<div>
168+
{wallets.map(wallet => {
169+
return <p>{wallet.name}</p>
170+
})}
171+
</div>
172+
)
173+
}
174+
```
175+
176+
#### Support for Uninstalled Wallets
177+
178+
Following AIP-62, the adapter uses an event-based communication model between a wallet and a dapp. This means only wallets installed in the user's browser are detected automatically and available for use.
179+
To support the full Aptos wallet ecosystem, the adapter maintains a registry of supported wallets—allowing dapps to also display uninstalled wallets. It also exposes a utility function to easily manage all wallets.
180+
181+
```tsx filename="WalletDisplayDemo.tsx"
182+
import { useWallet, groupAndSortWallets } from '@aptos-labs/wallet-adapter-react';
183+
184+
const displayAllWalletsDemo = () => {
185+
186+
const { wallets = [], notDetectedWallets = [] } = useWallet();
187+
188+
const { aptosConnectWallets, availableWallets, installableWallets } =
189+
groupAndSortWallets(
190+
[...wallets, ...notDetectedWallets]
191+
);
192+
193+
return (
194+
<div>
195+
/** Wallets that use social login to create an account on the blockchain */
196+
{aptosConnectWallets.map((aptosConnectwallet) => (
197+
return <p>{aptosConnectwallet.name}</p>
198+
))}
199+
/** Wallets that are currently installed or loadable. */
200+
{availableWallets.map((availableWallet) => (
201+
return <p>{availableWallet.name}</p>
202+
))}
203+
/** Wallets that are NOT currently installed or loadable. */
204+
{installableWallets.map((installableWallet) => (
205+
return <p>{installableWallet.name}</p>
206+
))}
207+
</div>
208+
)
209+
}
210+
```
211+
212+
155213
### `connect()` and `disconnect()`
156214

157215
`connect()` establishes a connection between the dapp and a Wallet. You can then use `disconnect()` to

apps/nextra/pages/en/developer-platforms/contribute/components/image.mdx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,18 +5,18 @@ searchable: false
55
# Next.js Image
66

77
The standard way to use
8-
[Next.js Image](https://nextjs.org/docs/basic-features/image-optimization)
8+
[Next.js Image](https://nextjs.org/docs/app/getting-started/images)
99
inside MDX is to directly import the component:
1010

1111
```mdx filename="MDX"
12-
import Image from 'next/image'
12+
import Image from "next/image";
1313

1414
<Image src="/demo.png" alt="Hello" width={500} height={500} />
1515
```
1616

1717
## Static Image
1818

19-
import { Callout } from 'nextra/components'
19+
import { Callout } from "nextra/components";
2020

2121
<Callout>
2222
This feature is enabled via `staticImage: true` in the Nextra config by

0 commit comments

Comments
 (0)