Skip to content

Commit ceafc07

Browse files
aorumbayevaorumbayev
authored
feat: latest use-wallet v2 integration (#12)
* feat: integrating latest use-wallet v2 * chore: tmp change to check ci error * chore: testing ci * chore: testing ci
1 parent 241d2fe commit ceafc07

File tree

8 files changed

+194
-94
lines changed

8 files changed

+194
-94
lines changed

‎template_content/package.json.jinja‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -24,26 +24,24 @@
2424
"tailwindcss": "3.3.2",
2525
{% endif -%}
2626
{% if use_jest -%}
27-
"ts-jest": "29.1.0",
28-
"@types/jest": "27.5.2",
27+
"ts-jest": "^29.1.1",
28+
"@types/jest": "29.5.2",
2929
{% endif -%}
3030
"ts-node": "10.9.1",
31-
"typescript": "5.0.4",
31+
"typescript": "5.1.6",
3232
{% if use_playwright -%}
3333
"@playwright/test": "^1.35.0",
3434
"playwright": "^1.35.0",
3535
{% endif -%}
3636
"vite": "4.3.9"
3737
},
3838
"dependencies": {
39+
"@walletconnect/modal-sign-html": "^2.5.5",
3940
"@algorandfoundation/algokit-utils": "^2.2.0",
40-
"@blockshake/defly-connect": "1.1.2",
41+
"@blockshake/defly-connect": "1.1.5",
4142
"@daffiwallet/connect": "1.0.3",
42-
"@json-rpc-tools/utils": "1.7.6",
4343
"@perawallet/connect": "1.2.3",
44-
"@txnlab/use-wallet": "1.3.0",
45-
"@walletconnect/client": "1.8.0",
46-
"algorand-walletconnect-qrcode-modal": "^1.8.0",
44+
"@txnlab/use-wallet": "2.0.0",
4745
"algosdk": "^2.3.0",
4846
{% if use_daisy_ui -%}
4947
"daisyui": "3.1.0",

‎template_content/src/hooks/useAlgoWalletProvider.ts‎

Lines changed: 43 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,14 @@ import algosdk from 'algosdk'
55
import { useEffect } from 'react'
66

77
type SupportedProviders = Partial<{
8-
kmd: Promise<WalletClient | null>
9-
pera: Promise<WalletClient | null> // ok
10-
myalgo: Promise<WalletClient | null>
11-
algosigner: Promise<WalletClient | null>
12-
defly: Promise<WalletClient | null> // ok
13-
exodus: Promise<WalletClient | null> // ok
14-
walletconnect: Promise<WalletClient | null>
15-
mnemonic: Promise<WalletClient | null>
8+
kmd: WalletClient | null
9+
pera: WalletClient | null // ok
10+
myalgo: WalletClient | null
11+
algosigner: WalletClient | null
12+
defly: WalletClient | null // ok
13+
exodus: WalletClient | null // ok
14+
walletconnect: WalletClient | null
15+
mnemonic: WalletClient | null
1616
}>
1717

1818
let providerIds: PROVIDER_ID[] = []
@@ -21,20 +21,20 @@ if (import.meta.env.VITE_ALGOD_NETWORK === '') {
2121
} else {
2222
providerIds = [PROVIDER_ID.PERA, PROVIDER_ID.DEFLY, PROVIDER_ID.EXODUS]
2323
}
24-
const walletProviders: SupportedProviders = {}
24+
const walletProviders: Partial<SupportedProviders> = {}
2525

2626
export function useAlgoWallet(context: { autoConnect: boolean; network: string; nodeServer: string; nodePort: string; nodeToken: string }) {
2727
const algodOptions = [context.nodeToken, context.nodeServer, context.nodePort] as AlgodClientOptions
2828

2929
const network = context.network
3030

31-
providerIds.forEach((id) => {
32-
if (id in walletProviders) {
31+
providerIds.forEach(async (id) => {
32+
if (Object.keys(walletProviders).includes(id)) {
3333
return
3434
} else {
3535
switch (id) {
3636
case PROVIDER_ID.PERA:
37-
walletProviders[id] = pera.init({
37+
walletProviders[id] = await pera.init({
3838
algosdkStatic: algosdk,
3939
clientStatic: PeraWalletConnect,
4040
clientOptions: {
@@ -44,25 +44,48 @@ export function useAlgoWallet(context: { autoConnect: boolean; network: string;
4444
network: network,
4545
})
4646
break
47+
4748
case PROVIDER_ID.DEFLY:
48-
walletProviders[id] = defly.init({
49+
walletProviders[id] = await defly.init({
4950
algosdkStatic: algosdk,
5051
clientStatic: DeflyWalletConnect,
5152
algodOptions: algodOptions,
5253
network: network,
5354
})
5455
break
56+
5557
case PROVIDER_ID.EXODUS:
56-
walletProviders[id] = exodus.init({
58+
walletProviders[id] = await exodus.init({
5759
algosdkStatic: algosdk,
5860
algodOptions: algodOptions,
5961
network: network,
6062
})
6163
break
6264

65+
// // For WalletConnect, you need to provide your own clientStatic and clientOptions
66+
// // Refer to https://github.com/TxnLab/use-wallet for integration instructions
67+
// case PROVIDER_ID.WALLETCONNECT:
68+
// walletProviders[id] = await walletconnect.init({
69+
// algosdkStatic: algosdk,
70+
// clientStatic: WalletConnectModalSign,
71+
// clientOptions: {
72+
// relayUrl: 'wss://relay.walletconnect.com',
73+
// projectId: '{YOUR_PROJECT_ID}',
74+
// metadata: {
75+
// name: 'AlgoKit React Starter',
76+
// description: 'AlgoKit React Starter web app',
77+
// url: '#',
78+
// icons: ['https://algorand.com/assets/media-kit/logos/logo-marks/png/algorand_logo_mark_white.png'],
79+
// },
80+
// },
81+
// algodOptions: algodOptions,
82+
// network: network,
83+
// })
84+
// break
85+
6386
default:
6487
if (import.meta.env.VITE_ALGOD_NETWORK === '') {
65-
walletProviders[PROVIDER_ID.KMD] = kmd.init({
88+
walletProviders[PROVIDER_ID.KMD] = await kmd.init({
6689
algosdkStatic: algosdk,
6790
algodOptions: algodOptions,
6891
network: network,
@@ -73,8 +96,12 @@ export function useAlgoWallet(context: { autoConnect: boolean; network: string;
7396
})
7497

7598
useEffect(() => {
99+
const reconnect = async (walletProviders: SupportedProviders) => {
100+
await reconnectProviders(walletProviders)
101+
}
102+
76103
if (context.autoConnect) {
77-
reconnectProviders(walletProviders)
104+
reconnect(walletProviders)
78105
}
79106
}, [])
80107

‎tests_generated/test_all_default_parameters_off/package.json‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,18 +13,16 @@
1313
"@vitejs/plugin-react-swc": "3.3.2",
1414
"autoprefixer": "10.4.14",
1515
"ts-node": "10.9.1",
16-
"typescript": "5.0.4",
16+
"typescript": "5.1.6",
1717
"vite": "4.3.9"
1818
},
1919
"dependencies": {
20+
"@walletconnect/modal-sign-html": "^2.5.5",
2021
"@algorandfoundation/algokit-utils": "^2.2.0",
21-
"@blockshake/defly-connect": "1.1.2",
22+
"@blockshake/defly-connect": "1.1.5",
2223
"@daffiwallet/connect": "1.0.3",
23-
"@json-rpc-tools/utils": "1.7.6",
2424
"@perawallet/connect": "1.2.3",
25-
"@txnlab/use-wallet": "1.3.0",
26-
"@walletconnect/client": "1.8.0",
27-
"algorand-walletconnect-qrcode-modal": "^1.8.0",
25+
"@txnlab/use-wallet": "2.0.0",
2826
"algosdk": "^2.3.0",
2927
"notistack": "3.0.1",
3028
"react": "18.2.0",

‎tests_generated/test_all_default_parameters_off/src/hooks/useAlgoWalletProvider.ts‎

Lines changed: 43 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,14 @@ import algosdk from 'algosdk'
55
import { useEffect } from 'react'
66

77
type SupportedProviders = Partial<{
8-
kmd: Promise<WalletClient | null>
9-
pera: Promise<WalletClient | null> // ok
10-
myalgo: Promise<WalletClient | null>
11-
algosigner: Promise<WalletClient | null>
12-
defly: Promise<WalletClient | null> // ok
13-
exodus: Promise<WalletClient | null> // ok
14-
walletconnect: Promise<WalletClient | null>
15-
mnemonic: Promise<WalletClient | null>
8+
kmd: WalletClient | null
9+
pera: WalletClient | null // ok
10+
myalgo: WalletClient | null
11+
algosigner: WalletClient | null
12+
defly: WalletClient | null // ok
13+
exodus: WalletClient | null // ok
14+
walletconnect: WalletClient | null
15+
mnemonic: WalletClient | null
1616
}>
1717

1818
let providerIds: PROVIDER_ID[] = []
@@ -21,20 +21,20 @@ if (import.meta.env.VITE_ALGOD_NETWORK === '') {
2121
} else {
2222
providerIds = [PROVIDER_ID.PERA, PROVIDER_ID.DEFLY, PROVIDER_ID.EXODUS]
2323
}
24-
const walletProviders: SupportedProviders = {}
24+
const walletProviders: Partial<SupportedProviders> = {}
2525

2626
export function useAlgoWallet(context: { autoConnect: boolean; network: string; nodeServer: string; nodePort: string; nodeToken: string }) {
2727
const algodOptions = [context.nodeToken, context.nodeServer, context.nodePort] as AlgodClientOptions
2828

2929
const network = context.network
3030

31-
providerIds.forEach((id) => {
32-
if (id in walletProviders) {
31+
providerIds.forEach(async (id) => {
32+
if (Object.keys(walletProviders).includes(id)) {
3333
return
3434
} else {
3535
switch (id) {
3636
case PROVIDER_ID.PERA:
37-
walletProviders[id] = pera.init({
37+
walletProviders[id] = await pera.init({
3838
algosdkStatic: algosdk,
3939
clientStatic: PeraWalletConnect,
4040
clientOptions: {
@@ -44,25 +44,48 @@ export function useAlgoWallet(context: { autoConnect: boolean; network: string;
4444
network: network,
4545
})
4646
break
47+
4748
case PROVIDER_ID.DEFLY:
48-
walletProviders[id] = defly.init({
49+
walletProviders[id] = await defly.init({
4950
algosdkStatic: algosdk,
5051
clientStatic: DeflyWalletConnect,
5152
algodOptions: algodOptions,
5253
network: network,
5354
})
5455
break
56+
5557
case PROVIDER_ID.EXODUS:
56-
walletProviders[id] = exodus.init({
58+
walletProviders[id] = await exodus.init({
5759
algosdkStatic: algosdk,
5860
algodOptions: algodOptions,
5961
network: network,
6062
})
6163
break
6264

65+
// // For WalletConnect, you need to provide your own clientStatic and clientOptions
66+
// // Refer to https://github.com/TxnLab/use-wallet for integration instructions
67+
// case PROVIDER_ID.WALLETCONNECT:
68+
// walletProviders[id] = await walletconnect.init({
69+
// algosdkStatic: algosdk,
70+
// clientStatic: WalletConnectModalSign,
71+
// clientOptions: {
72+
// relayUrl: 'wss://relay.walletconnect.com',
73+
// projectId: '{YOUR_PROJECT_ID}',
74+
// metadata: {
75+
// name: 'AlgoKit React Starter',
76+
// description: 'AlgoKit React Starter web app',
77+
// url: '#',
78+
// icons: ['https://algorand.com/assets/media-kit/logos/logo-marks/png/algorand_logo_mark_white.png'],
79+
// },
80+
// },
81+
// algodOptions: algodOptions,
82+
// network: network,
83+
// })
84+
// break
85+
6386
default:
6487
if (import.meta.env.VITE_ALGOD_NETWORK === '') {
65-
walletProviders[PROVIDER_ID.KMD] = kmd.init({
88+
walletProviders[PROVIDER_ID.KMD] = await kmd.init({
6689
algosdkStatic: algosdk,
6790
algodOptions: algodOptions,
6891
network: network,
@@ -73,8 +96,12 @@ export function useAlgoWallet(context: { autoConnect: boolean; network: string;
7396
})
7497

7598
useEffect(() => {
99+
const reconnect = async (walletProviders: SupportedProviders) => {
100+
await reconnectProviders(walletProviders)
101+
}
102+
76103
if (context.autoConnect) {
77-
reconnectProviders(walletProviders)
104+
reconnect(walletProviders)
78105
}
79106
}, [])
80107

‎tests_generated/test_all_default_parameters_on_netlify/package.json‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,23 +19,21 @@
1919
"@typescript-eslint/parser": "5.59.9",
2020
"postcss": "8.4.24",
2121
"tailwindcss": "3.3.2",
22-
"ts-jest": "29.1.0",
23-
"@types/jest": "27.5.2",
22+
"ts-jest": "^29.1.1",
23+
"@types/jest": "29.5.2",
2424
"ts-node": "10.9.1",
25-
"typescript": "5.0.4",
25+
"typescript": "5.1.6",
2626
"@playwright/test": "^1.35.0",
2727
"playwright": "^1.35.0",
2828
"vite": "4.3.9"
2929
},
3030
"dependencies": {
31+
"@walletconnect/modal-sign-html": "^2.5.5",
3132
"@algorandfoundation/algokit-utils": "^2.2.0",
32-
"@blockshake/defly-connect": "1.1.2",
33+
"@blockshake/defly-connect": "1.1.5",
3334
"@daffiwallet/connect": "1.0.3",
34-
"@json-rpc-tools/utils": "1.7.6",
3535
"@perawallet/connect": "1.2.3",
36-
"@txnlab/use-wallet": "1.3.0",
37-
"@walletconnect/client": "1.8.0",
38-
"algorand-walletconnect-qrcode-modal": "^1.8.0",
36+
"@txnlab/use-wallet": "2.0.0",
3937
"algosdk": "^2.3.0",
4038
"daisyui": "3.1.0",
4139
"notistack": "3.0.1",

0 commit comments

Comments
 (0)