diff --git a/packages/wallet-kit/README.md b/packages/wallet-kit/README.md index 687a3faf..6571e2db 100644 --- a/packages/wallet-kit/README.md +++ b/packages/wallet-kit/README.md @@ -1 +1,82 @@ -# `wallet-helpers` +# `@vecahin/dapp-kit` + +## Why ? + +- Allow easy interaction with all wallets. +- Connex is designed to play nice with one wallet at a time, this library provides a layer on top of Connex to easily + allow interaction with all wallets. +- Easy setup for wallet connect. +- Create your own + +## Installation + +- See the parent [README](../../README.md) for installation instructions. + +### Build + +```bash +yarn build +``` + +## Usage + +```bash +yarn add @vechain/dapp-kit +``` + +- Create a function to handle remote wallet disconnections. Some wallets can disconnect remotely (eg. Wallet Connect) + +```typescript +const onDisconnected = () => { + //TODO: handle disconnect +}; +``` + +- Optional: Configure wallet connect options + +```typescript +import type { WalletConnectOptions } from '@vechain/wallet-connect'; + +const walletConnectOptions: WalletConnectOptions = { + projectId: '', // Create your project here: https://cloud.walletconnect.com/sign-up + metadata: { + name: 'My dApp', + description: 'My dApp description', + url: window.location.origin, // Your app URL + icons: [`${window.location.origin}/images/my-dapp-icon.png`], // Your app Icon + }, +}; +``` + +- Create a new instance of `MultiWalletConnex` and pass in the options +- `thor` will be ready to use to interact with the chain, but calling any methods requiring a wallet will throw an + error. See the next step to finalise the setup. + +```typescript +const { thor, vendor, wallet } = new MultiWalletConnex({ + nodeUrl: 'https://sync-testnet.vechain.org/', //Required + genesis: 'main', //Optional - "main" | "test" | Connex.Thor.Block + walletConnectOptions, + onDisconnected, +}); +``` + +- You can set the wallet source when the user selects a wallet, or if you want to default to a specific wallet. +- Connex is ready to use as normal + +```typescript +wallet.setSource('veworld-extension'); +``` + +- Connect to the wallet. This will return the user's address +- `verified` indicates whether a certificate is signed by the user. If a sign in is required and the account is not + verified, you should request a subsequent certificate sign in + +```typescript +const { account, verified } = await wallet.connect(); +``` + +```typescript +const tx = await thor.account("0x...123").method(...).transact().request(); +const certRes = await vendor.sign("cert", {...}).requset(); +``` diff --git a/packages/wallet-kit/src/create-wallet.ts b/packages/wallet-kit/src/create-wallet.ts index 588da0bc..3c6da881 100644 --- a/packages/wallet-kit/src/create-wallet.ts +++ b/packages/wallet-kit/src/create-wallet.ts @@ -18,7 +18,7 @@ export const createWallet = ({ genesis, walletConnectOptions, onDisconnected, -}: ICreateWallet): ConnexWallet | undefined => { +}: ICreateWallet): ConnexWallet => { const genesisId = normalizeGenesisId(genesis); switch (source) { @@ -47,8 +47,7 @@ export const createWallet = ({ } case 'wallet-connect': { if (!walletConnectOptions) { - onDisconnected(); - return; + throw new Error('WalletConnect options are not provided'); } const { projectId, metadata } = walletConnectOptions; diff --git a/packages/wallet-kit/src/types.d.ts b/packages/wallet-kit/src/types.d.ts index 768d4f41..8e398c18 100644 --- a/packages/wallet-kit/src/types.d.ts +++ b/packages/wallet-kit/src/types.d.ts @@ -18,10 +18,17 @@ interface WalletConfig { export type Genesis = 'main' | 'test' | Connex.Thor.Block; +/** + * Options for the MultiWalletConnex class + * @param nodeUrl - The URL of the VeChain node to connect to + * @param genesis - Optional. The genesis block of the VeChain network you want to connect to. Eg, 'main', 'test', or a Connex.Thor.Block object + * @param onDisconnected - A callback that will be called when the session is disconnected + * @param walletConnectOptions - Optional. Options for the WalletConnect integration + */ interface ConnexOptions { nodeUrl: string; genesis?: Genesis; - onDisconnected: () => void; + onDisconnected?: () => void; walletConnectOptions?: WalletConnectOptions; } diff --git a/packages/wallet-kit/src/wallet-manager.ts b/packages/wallet-kit/src/wallet-manager.ts index 272f8d34..dab22df5 100644 --- a/packages/wallet-kit/src/wallet-manager.ts +++ b/packages/wallet-kit/src/wallet-manager.ts @@ -6,6 +6,7 @@ import type { WalletSource, } from './types'; import { createWallet } from './create-wallet'; +import { WalletSources } from './wallet'; class WalletManager implements ConnexWalletManager { private wallets: Record = {}; @@ -28,16 +29,14 @@ class WalletManager implements ConnexWalletManager { let wallet = this.wallets[source]; if (!wallet) { + // If it's not a built-in wallet, we can't create it + if (!WalletSources.includes(source)) + throw new Error(`No wallet found for: ${source}`); + const opts = { ...this.connexOptions, source }; wallet = createWallet(opts); - if (wallet) { - this.wallets[source] = wallet; - } - } - - if (!wallet) { - throw new Error('Signer is not initialized'); + this.wallets[source] = wallet; } return wallet;