Skip to content

Commit a9bf039

Browse files
ihsrahamihsraham
committed
nuxt and react qs updated
1 parent ef8e01e commit a9bf039

File tree

8 files changed

+1857
-397
lines changed

8 files changed

+1857
-397
lines changed

‎web-modal-sdk/quick-starts/nuxt-modal-quick-start/components/Home.vue‎

Lines changed: 6 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -49,12 +49,7 @@
4949
<script lang="ts">
5050
import { ref, onMounted } from "vue";
5151
// IMP START - Quick Start
52-
import { Web3Auth } from "@web3auth/modal";
53-
import type { Web3AuthOptions } from "@web3auth/modal";
54-
import { WEB3AUTH_NETWORK, getEvmChainConfig } from "@web3auth/base";
55-
import type { IAdapter, IProvider } from "@web3auth/base";
56-
import { EthereumPrivateKeyProvider } from "@web3auth/ethereum-provider";
57-
import { getDefaultExternalAdapters } from "@web3auth/default-evm-adapter";
52+
import { CONNECTOR_EVENTS, type IProvider, Web3Auth, WEB3AUTH_NETWORK, type Web3AuthOptions } from "@web3auth/modal";
5853
// IMP END - Quick Start
5954
6055
// IMP START - Blockchain Calls
@@ -73,21 +68,10 @@ export default {
7368
const clientId = "BPi5PB_UiIZ-cPz1GtV5i1I2iOSOHuimiXBI0e-Oe_u6X3oVAbCiAZOTEBtTXw4tsluTITPqA8zMsfxIKMjiqNQ"; // get from https://dashboard.web3auth.io
7469
// IMP END - Dashboard Registration
7570
76-
// IMP START - Chain Config
77-
const chainId = 0x13882; // Polygon Amoy Testnet
78-
// Get custom chain configs for your chain from https://web3auth.io/docs/connect-blockchain
79-
const chainConfig = getEvmChainConfig(chainId, clientId)!;
80-
// IMP END - Chain Config
81-
82-
// IMP START - SDK Initialization
83-
const privateKeyProvider = new EthereumPrivateKeyProvider({
84-
config: { chainConfig: chainConfig }
85-
});
86-
8771
const web3AuthOptions: Web3AuthOptions = {
8872
clientId,
8973
web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_MAINNET,
90-
privateKeyProvider,
74+
authBuildEnv: "testing",
9175
}
9276
const web3auth = new Web3Auth(web3AuthOptions);
9377
// IMP END - SDK Initialization
@@ -98,20 +82,14 @@ export default {
9882
onMounted(async () => {
9983
const init = async () => {
10084
try {
101-
// IMP START - Configuring External Wallets
102-
const adapters = getDefaultExternalAdapters({ options: web3AuthOptions });
103-
adapters.forEach((adapter: IAdapter<unknown>) => {
104-
web3auth.configureAdapter(adapter);
105-
});
106-
// IMP END - Configuring External Wallets
10785
// IMP START - SDK Initialization
10886
await web3auth.initModal();
10987
// IMP END - SDK Initialization
11088
provider = web3auth.provider;
11189
112-
if (web3auth.connected) {
90+
web3auth.on(CONNECTOR_EVENTS.CONNECTED, () => {
11391
loggedIn.value = true;
114-
}
92+
});
11593
} catch (error) {
11694
console.error(error);
11795
}
@@ -124,9 +102,9 @@ export default {
124102
// IMP START - Login
125103
provider = await web3auth.connect();
126104
// IMP END - Login
127-
if (web3auth.connected) {
105+
web3auth.on(CONNECTOR_EVENTS.CONNECTED, () => {
128106
loggedIn.value = true;
129-
}
107+
});
130108
};
131109
132110
const getUserInfo = async () => {

‎web-modal-sdk/quick-starts/nuxt-modal-quick-start/components/ethersRPC.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/* eslint-disable @typescript-eslint/no-explicit-any */
2-
import type { IProvider } from "@web3auth/base";
2+
import type { IProvider } from "@web3auth/modal";
33
import { ethers } from "ethers";
44

55
const getChainId = async (provider: IProvider): Promise<any> => {

‎web-modal-sdk/quick-starts/nuxt-modal-quick-start/components/viemRPC.ts‎

Lines changed: 31 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
import { createWalletClient, createPublicClient, custom, formatEther, parseEther } from 'viem'
2-
import { mainnet, polygonAmoy, sepolia } from 'viem/chains'
3-
import type { IProvider } from "@web3auth/base";
1+
/* eslint-disable no-console */
2+
import type { IProvider } from "@web3auth/modal";
3+
import { createPublicClient, createWalletClient, custom, formatEther, parseEther } from "viem";
4+
import { mainnet, polygonAmoy, sepolia } from "viem/chains";
45

56
const getViewChain = (provider: IProvider) => {
67
switch (provider.chainId) {
@@ -13,29 +14,28 @@ const getViewChain = (provider: IProvider) => {
1314
default:
1415
return mainnet;
1516
}
16-
}
17+
};
1718

1819
const getChainId = async (provider: IProvider): Promise<any> => {
1920
try {
2021
const walletClient = createWalletClient({
21-
transport: custom(provider)
22-
})
22+
transport: custom(provider),
23+
});
2324

24-
const address = await walletClient.getAddresses()
25-
console.log(address)
25+
const address = await walletClient.getAddresses();
26+
console.log(address);
2627

27-
const chainId = await walletClient.getChainId()
28+
const chainId = await walletClient.getChainId();
2829
return chainId.toString();
2930
} catch (error) {
3031
return error;
3132
}
32-
}
33+
};
3334
const getAccounts = async (provider: IProvider): Promise<any> => {
3435
try {
35-
3636
const walletClient = createWalletClient({
3737
chain: getViewChain(provider),
38-
transport: custom(provider)
38+
transport: custom(provider),
3939
});
4040

4141
const address = await walletClient.getAddresses();
@@ -44,40 +44,40 @@ const getAccounts = async (provider: IProvider): Promise<any> => {
4444
} catch (error) {
4545
return error;
4646
}
47-
}
47+
};
4848

4949
const getBalance = async (provider: IProvider): Promise<string> => {
5050
try {
5151
const publicClient = createPublicClient({
5252
chain: getViewChain(provider),
53-
transport: custom(provider)
54-
})
53+
transport: custom(provider),
54+
});
5555

5656
const walletClient = createWalletClient({
5757
chain: getViewChain(provider),
58-
transport: custom(provider)
58+
transport: custom(provider),
5959
});
6060

6161
const address = await walletClient.getAddresses();
6262

6363
const balance = await publicClient.getBalance({ address: address[0] });
64-
console.log(balance)
64+
console.log(balance);
6565
return formatEther(balance);
6666
} catch (error) {
6767
return error as string;
6868
}
69-
}
69+
};
7070

7171
const sendTransaction = async (provider: IProvider): Promise<any> => {
7272
try {
7373
const publicClient = createPublicClient({
7474
chain: getViewChain(provider),
75-
transport: custom(provider)
76-
})
75+
transport: custom(provider),
76+
});
7777

7878
const walletClient = createWalletClient({
7979
chain: getViewChain(provider),
80-
transport: custom(provider)
80+
transport: custom(provider),
8181
});
8282

8383
// data for the transaction
@@ -91,25 +91,23 @@ const sendTransaction = async (provider: IProvider): Promise<any> => {
9191
to: destination,
9292
value: amount,
9393
});
94-
console.log(hash)
94+
console.log(hash);
9595
const receipt = await publicClient.waitForTransactionReceipt({ hash });
9696

97-
98-
return JSON.stringify(receipt, (key, value) =>
99-
typeof value === 'bigint'
100-
? value.toString()
101-
: value // return everything else unchanged
97+
return JSON.stringify(
98+
receipt,
99+
(key, value) => (typeof value === "bigint" ? value.toString() : value) // return everything else unchanged
102100
);
103101
} catch (error) {
104102
return error;
105103
}
106-
}
104+
};
107105

108106
const signMessage = async (provider: IProvider): Promise<any> => {
109107
try {
110108
const walletClient = createWalletClient({
111109
chain: getViewChain(provider),
112-
transport: custom(provider)
110+
transport: custom(provider),
113111
});
114112

115113
// data for signing
@@ -119,15 +117,15 @@ const signMessage = async (provider: IProvider): Promise<any> => {
119117
// Sign the message
120118
const hash = await walletClient.signMessage({
121119
account: address[0],
122-
message: originalMessage
120+
message: originalMessage,
123121
});
124122

125-
console.log(hash)
123+
console.log(hash);
126124

127125
return hash.toString();
128126
} catch (error) {
129127
return error;
130128
}
131-
}
129+
};
132130

133-
export default {getChainId, getAccounts, getBalance, sendTransaction, signMessage};
131+
export default { getChainId, getAccounts, getBalance, sendTransaction, signMessage };

‎web-modal-sdk/quick-starts/nuxt-modal-quick-start/components/web3RPC.ts‎

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import type { IProvider } from "@web3auth/base";
22
import Web3 from "web3";
33

4-
54
const getChainId = async (provider: IProvider): Promise<string> => {
65
try {
76
const web3 = new Web3(provider);
@@ -13,20 +12,20 @@ const getChainId = async (provider: IProvider): Promise<string> => {
1312
} catch (error) {
1413
return error as string;
1514
}
16-
}
15+
};
1716

1817
const getAccounts = async (provider: IProvider): Promise<any> => {
1918
try {
2019
const web3 = new Web3(provider as any);
2120

2221
// Get user's Ethereum public address
23-
const address = (await web3.eth.getAccounts());
22+
const address = await web3.eth.getAccounts();
2423

2524
return address;
2625
} catch (error) {
2726
return error;
2827
}
29-
}
28+
};
3029

3130
const getBalance = async (provider: IProvider): Promise<string> => {
3231
try {
@@ -45,7 +44,7 @@ const getBalance = async (provider: IProvider): Promise<string> => {
4544
} catch (error) {
4645
return error as string;
4746
}
48-
}
47+
};
4948

5049
const signMessage = async (provider: IProvider): Promise<string> => {
5150
try {
@@ -67,7 +66,7 @@ const signMessage = async (provider: IProvider): Promise<string> => {
6766
} catch (error) {
6867
return error as string;
6968
}
70-
}
69+
};
7170

7271
const sendTransaction = async (provider: IProvider): Promise<any> => {
7372
try {
@@ -84,24 +83,21 @@ const sendTransaction = async (provider: IProvider): Promise<any> => {
8483
to: destination,
8584
data: "0x",
8685
value: amount,
87-
}
86+
};
8887

8988
// calculate gas transaction before sending
9089
transaction = { ...transaction, gas: await web3.eth.estimateGas(transaction) } as any;
9190

9291
// Submit transaction to the blockchain and wait for it to be mined
9392
const receipt = await web3.eth.sendTransaction(transaction);
9493

95-
return JSON.stringify(receipt, (key, value) =>
96-
typeof value === 'bigint'
97-
? value.toString()
98-
: value // return everything else unchanged
94+
return JSON.stringify(
95+
receipt,
96+
(key, value) => (typeof value === "bigint" ? value.toString() : value) // return everything else unchanged
9997
);
10098
} catch (error) {
10199
return error as string;
102100
}
103-
}
104-
105-
101+
};
106102

107-
export default {getChainId, getAccounts, getBalance, sendTransaction, signMessage};
103+
export default { getChainId, getAccounts, getBalance, sendTransaction, signMessage };

0 commit comments

Comments
 (0)