@txnlab/use-wallet 2.0.0-rc.1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +15 -10
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -1,10 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+

|
|
2
|
+
|
|
3
|
+
# UseWallet v2
|
|
2
4
|
|
|
3
5
|
`@txnlab/use-wallet` is a React library that provides a simplified, consistent interface for integrating multiple Algorand wallets into your decentralized applications (dApps).
|
|
4
6
|
|
|
7
|
+
[](https://badge.fury.io/js/%40txnlab%2Fuse-wallet)
|
|
8
|
+

|
|
9
|
+
|
|
5
10
|
## Overview
|
|
6
11
|
|
|
7
|
-
With
|
|
12
|
+
With UseWallet's hooks and utility functions, you can:
|
|
8
13
|
|
|
9
14
|
- Easily add or remove wallet support with a few lines of code
|
|
10
15
|
- Configure each wallet provider as needed for your application
|
|
@@ -14,7 +19,7 @@ With the `use-wallet`'s hooks and utility functions, you can:
|
|
|
14
19
|
|
|
15
20
|
It provides an abstraction layer that unifies the initialization, connection, and transaction signing logic, eliminating the need to interact with each wallet's individual API.
|
|
16
21
|
|
|
17
|
-
|
|
22
|
+
UseWallet supports most Algorand wallet providers, including Defly, Pera, Daffi, and Exodus (see [Supported Wallet Providers](#supported-wallet-providers) for the full list).
|
|
18
23
|
|
|
19
24
|
Version 2.x introduces [WalletConnect 2.0 support](#walletconnect-20-support).
|
|
20
25
|
|
|
@@ -84,7 +89,7 @@ npm install @blockshake/defly-connect @perawallet/connect @daffiwallet/connect
|
|
|
84
89
|
|
|
85
90
|
In the root of your app, initialize the `WalletProvider` with the `useInitializeProviders` hook.
|
|
86
91
|
|
|
87
|
-
This example initializes
|
|
92
|
+
This example initializes Defly, Pera, Daffi and Exodus wallet providers. The default node configuration (mainnet via [AlgoNode](https://algonode.io/api/)) is used. See [Provider Configuration](#provider-configuration) for more options.
|
|
88
93
|
|
|
89
94
|
```jsx
|
|
90
95
|
import React from 'react'
|
|
@@ -363,7 +368,7 @@ The promise will resolve to an object containing the transaction `id` and the [`
|
|
|
363
368
|
|
|
364
369
|
## Checking Connection Status
|
|
365
370
|
|
|
366
|
-
The `isActive` and `isReady` properties can be used to check the status of the wallet providers. The `isActive` property determines whether or not an account is currently active. The `isReady` property indicates whether
|
|
371
|
+
The `isActive` and `isReady` properties can be used to check the status of the wallet providers. The `isActive` property determines whether or not an account is currently active. The `isReady` property indicates whether client has mounted and successfully read the connection status from the wallet providers.
|
|
367
372
|
|
|
368
373
|
These properties are useful when setting up client side access restrictions, for example, by redirecting a user if no wallet provider `isActive`, as shown below.
|
|
369
374
|
|
|
@@ -500,7 +505,7 @@ const providers = await initializeProviders({
|
|
|
500
505
|
|
|
501
506
|
### Algosdk Static Import
|
|
502
507
|
|
|
503
|
-
By default,
|
|
508
|
+
By default, the providers dynamically import the `algosdk` peer dependency installed in your app, to reduce bundle size.
|
|
504
509
|
|
|
505
510
|
Some React frameworks, like [Remix](https://remix.run/), do not support dynamic imports. To get around this, you can set the optional `algosdkStatic` root property to the imported `algosdk` module.
|
|
506
511
|
|
|
@@ -578,9 +583,9 @@ export default function App() {
|
|
|
578
583
|
|
|
579
584
|
## WalletConnect 2.0 Support
|
|
580
585
|
|
|
581
|
-
|
|
586
|
+
UseWallet v2 introduces support for WalletConnect 2.0. This is a major upgrade to the WalletConnect protocol, and introduces a number of breaking changes for app developers.
|
|
582
587
|
|
|
583
|
-
However, Algorand apps with
|
|
588
|
+
However, Algorand apps with UseWallet will be able to support the new protocol with minimal effort:
|
|
584
589
|
|
|
585
590
|
1. **Obtain a project ID** - You will need to obtain a project ID from [WalletConnect Cloud](https://cloud.walletconnect.com/). This is a simple process, and there is no waiting period. Every app will need its own unique project ID.
|
|
586
591
|
|
|
@@ -679,7 +684,7 @@ See [Provider Configuration](#provider-configuration) for more details.
|
|
|
679
684
|
|
|
680
685
|
### shouldShowSignTxnToast
|
|
681
686
|
|
|
682
|
-
Pera Connect, Defly Connect and Daffi Connect share a `shouldShowSignTxnToast` option that is set to `true` by default.
|
|
687
|
+
Pera Connect, Defly Connect and Daffi Connect share a `shouldShowSignTxnToast` option that is set to `true` by default. UseWallet v1 set these to `false` by default, and required setting the option back to `true` to achieve the libraries' default behavior.
|
|
683
688
|
|
|
684
689
|
In v2 this option is set to `true` by default. If your app has this option set to `true` you can remove it from your configuration. If you wish to disable the toast(s), you must now explicitly set the option to `false`.
|
|
685
690
|
|
|
@@ -724,7 +729,7 @@ yarn install
|
|
|
724
729
|
yarn dev
|
|
725
730
|
```
|
|
726
731
|
|
|
727
|
-
To develop against a local version of
|
|
732
|
+
To develop against a local version of `@txnlab/use-wallet` in your application, do the following:
|
|
728
733
|
|
|
729
734
|
### Build the library
|
|
730
735
|
|
package/package.json
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
"url": "https://github.com/txnlab/use-wallet/issues"
|
|
13
13
|
},
|
|
14
14
|
"homepage": "https://txnlab.github.io/use-wallet",
|
|
15
|
-
"version": "2.0.0
|
|
15
|
+
"version": "2.0.0",
|
|
16
16
|
"description": "React hooks for using Algorand compatible wallets in dApps.",
|
|
17
17
|
"scripts": {
|
|
18
18
|
"dev": "yarn storybook",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"@babel/preset-env": "^7.16.4",
|
|
32
32
|
"@babel/preset-react": "^7.16.0",
|
|
33
33
|
"@babel/preset-typescript": "^7.16.0",
|
|
34
|
-
"@blockshake/defly-connect": "^1.1.
|
|
34
|
+
"@blockshake/defly-connect": "^1.1.5",
|
|
35
35
|
"@daffiwallet/connect": "^1.0.3",
|
|
36
36
|
"@mdx-js/react": "^2.3.0",
|
|
37
37
|
"@perawallet/connect": "^1.2.1",
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
"typescript": "^4.8.4"
|
|
90
90
|
},
|
|
91
91
|
"peerDependencies": {
|
|
92
|
-
"@blockshake/defly-connect": "^1.1.
|
|
92
|
+
"@blockshake/defly-connect": "^1.1.5",
|
|
93
93
|
"@daffiwallet/connect": "^1.0.3",
|
|
94
94
|
"@perawallet/connect": "^1.2.1",
|
|
95
95
|
"@randlabs/myalgo-connect": "^1.4.2",
|