Skip to content

Commit 0ca9d08

Browse files
tanguyenvntanguyenvn
committed
update demo app
1 parent 20d5355 commit 0ca9d08

File tree

4 files changed

+34
-103
lines changed

4 files changed

+34
-103
lines changed

‎demo/vue-app-new/package-lock.json‎

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎demo/vue-app-new/src/MainView.vue‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import {
99
TrustSmartAccount,
1010
// SimpleSmartAccount,
1111
} from "@web3auth/account-abstraction-provider";
12-
import { CHAIN_NAMESPACES, ChainNamespaceType, IAdapter, IBaseProvider, IProvider, storageAvailable, WALLET_ADAPTERS } from "@web3auth/base";
12+
import { CHAIN_NAMESPACES, getChainConfig, IAdapter, IBaseProvider, IProvider, storageAvailable, WALLET_ADAPTERS } from "@web3auth/base";
1313
import { CommonPrivateKeyProvider } from "@web3auth/base-provider";
1414
import { CoinbaseAdapter } from "@web3auth/coinbase-adapter";
1515
import { getInjectedAdapters as getInjectedEvmAdapters } from "@web3auth/default-evm-adapter";
@@ -36,16 +36,20 @@ const formData = formDataStore;
3636
3737
const externalAdapters = ref<IAdapter<unknown>[]>([]);
3838
39-
const chainOptions = computed(() =>
40-
chainConfigs[formData.chainNamespace as ChainNamespaceType].map((x) => ({
41-
name: `${x.chainId} ${x.tickerName}`,
42-
value: x.chainId,
43-
}))
44-
);
39+
const getChainById = (chainId: string) => {
40+
const chain = getChainConfig(formData.chainNamespace, chainId, clientIds[formData.network]);
41+
if (!chain) {
42+
throw new Error(`Chain config not found for chainId: ${chainId}`);
43+
}
44+
if (formData.chainNamespace === CHAIN_NAMESPACES.SOLANA && chainId === "0x65") {
45+
chain.rpcTarget = import.meta.env.VITE_APP_SOLANA_MAINNET_RPC || chain.rpcTarget;
46+
}
47+
return chain;
48+
};
4549
4650
// Populate the private key provider based on the chain selected
4751
const privateKeyProvider = computed((): IBaseProvider<string> => {
48-
const chainConfig = chainConfigs[formData.chainNamespace as ChainNamespaceType].find((x) => x.chainId === formData.chain)!;
52+
const chainConfig = getChainById(formData.chain)!;
4953
5054
switch (formData.chainNamespace) {
5155
case CHAIN_NAMESPACES.EIP155:
@@ -75,7 +79,7 @@ const accountAbstractionProvider = computed((): IBaseProvider<IProvider> | undef
7579
const { useAccountAbstractionProvider } = formData;
7680
if (!showAAProviderSettings.value || !useAccountAbstractionProvider) return undefined;
7781
78-
const chainConfig = chainConfigs[formData.chainNamespace as ChainNamespaceType].find((x) => x.chainId === formData.chain)!;
82+
const chainConfig = getChainById(formData.chain)!;
7983
// setup aa provider
8084
let smartAccountInit: ISmartAccount;
8185
switch (formData.smartAccountType) {
@@ -199,7 +203,7 @@ onBeforeMount(() => {
199203
}
200204
} catch (error) {}
201205
}
202-
if (!chainOptions.value.find((option) => option.value === formData.chain)) formData.chain = chainOptions.value[0]?.value;
206+
if (!chainConfigs[formData.chainNamespace].find((chainId) => chainId === formData.chain)) formData.chain = chainConfigs[formData.chainNamespace][0];
203207
});
204208
205209
watch(formData, () => {

‎demo/vue-app-new/src/components/AppSettings.vue‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
<script setup lang="ts">
22
import { Button, Card, Select, Tab, Tabs, Tag, TextField, Toggle } from "@toruslabs/vue-components";
3-
import { ADAPTER_STATUS, CHAIN_NAMESPACES, ChainNamespaceType, log } from "@web3auth/base";
3+
import { ADAPTER_STATUS, CHAIN_NAMESPACES, ChainNamespaceType, log, getChainConfig } from "@web3auth/base";
44
import { useWeb3Auth } from "@web3auth/modal-vue-composables";
55
import { computed, InputHTMLAttributes, ref } from "vue";
66
77
import {
88
chainConfigs,
99
chainNamespaceOptions,
10+
clientIds,
1011
confirmationStrategyOptions,
1112
languageOptions,
1213
loginProviderOptions,
@@ -20,10 +21,16 @@ const formData = formDataStore;
2021
const { status, isConnected, isInitialized, connect } = useWeb3Auth();
2122
2223
const chainOptions = computed(() =>
23-
chainConfigs[formData.chainNamespace as ChainNamespaceType].map((x) => ({
24-
name: `${x.chainId} ${x.tickerName}`,
25-
value: x.chainId,
26-
}))
24+
chainConfigs[formData.chainNamespace].map((chainId) => {
25+
const chainConfig = getChainConfig(formData.chainNamespace, chainId, clientIds[formData.network]);
26+
if (!chainConfig) {
27+
throw new Error(`Chain config not found for chainId: ${chainId}`);
28+
}
29+
return {
30+
name: `${chainId} ${chainConfig.displayName}`,
31+
value: chainId,
32+
};
33+
})
2734
);
2835
2936
const adapterOptions = computed(() =>
@@ -83,7 +90,7 @@ const isActiveTab = (index: number) => activeTab.value === index;
8390
8491
const onChainNamespaceChange = (value: string) => {
8592
log.info("onChainNamespaceChange", value);
86-
formData.chain = chainConfigs[value as ChainNamespaceType][0].chainId;
93+
formData.chain = chainConfigs[value as ChainNamespaceType][0];
8794
formData.adapters = [];
8895
};
8996
</script>

‎demo/vue-app-new/src/config.ts‎

Lines changed: 4 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { LANGUAGE_TYPE, LANGUAGES, LOGIN_PROVIDER, LOGIN_PROVIDER_TYPE, WhiteLabelData } from "@web3auth/auth";
2-
import { CHAIN_NAMESPACES, ChainNamespaceType, CustomChainConfig, WEB3AUTH_NETWORK, WEB3AUTH_NETWORK_TYPE } from "@web3auth/base";
2+
import { CHAIN_NAMESPACES, ChainNamespaceType, WEB3AUTH_NETWORK, WEB3AUTH_NETWORK_TYPE } from "@web3auth/base";
33
import { SignTypedDataMessageV4 } from "@web3auth/ethereum-provider";
44
import { CONFIRMATION_STRATEGY, CONFIRMATION_STRATEGY_TYPE } from "@web3auth/wallet-services-plugin";
55

@@ -9,89 +9,9 @@ export const networkOptions = Object.values(WEB3AUTH_NETWORK).map((x) => ({ name
99

1010
export const chainNamespaceOptions = Object.values(CHAIN_NAMESPACES).map((x) => ({ name: x, value: x }));
1111

12-
export const chainConfigs: Record<ChainNamespaceType, CustomChainConfig[]> = {
13-
[CHAIN_NAMESPACES.EIP155]: [
14-
{
15-
chainNamespace: CHAIN_NAMESPACES.EIP155,
16-
rpcTarget: "https://rpc.ankr.com/eth",
17-
blockExplorerUrl: "https://etherscan.io",
18-
logo: "https://cryptologos.cc/logos/ethereum-eth-logo.png",
19-
chainId: "0x1",
20-
ticker: "ETH",
21-
tickerName: "Ethereum",
22-
},
23-
{
24-
chainNamespace: CHAIN_NAMESPACES.EIP155,
25-
rpcTarget: "https://rpc.ankr.com/eth_sepolia",
26-
blockExplorerUrl: "https://sepolia.etherscan.io",
27-
logo: "https://cryptologos.cc/logos/ethereum-eth-logo.png",
28-
chainId: "0xaa36a7",
29-
ticker: "ETH",
30-
tickerName: "Sepolia Testnet",
31-
},
32-
{
33-
chainNamespace: CHAIN_NAMESPACES.EIP155,
34-
rpcTarget: "https://mainnet.base.org",
35-
blockExplorerUrl: "https://base.blockscout.com",
36-
chainId: "0x2105",
37-
displayName: "Base Mainnet",
38-
ticker: "ETH",
39-
tickerName: "Base Ethereum",
40-
logo: "https://cryptologos.cc/logos/ethereum-eth-logo.png",
41-
},
42-
{
43-
chainNamespace: CHAIN_NAMESPACES.EIP155,
44-
rpcTarget: "https://sepolia.base.org",
45-
blockExplorerUrl: "https://sepolia-explorer.base.org",
46-
chainId: "0x14A34",
47-
displayName: "Base Sepolia",
48-
ticker: "ETH",
49-
tickerName: "Base Sepolia Testnet",
50-
logo: "https://cryptologos.cc/logos/ethereum-eth-logo.png",
51-
},
52-
{
53-
chainNamespace: CHAIN_NAMESPACES.EIP155,
54-
rpcTarget: "https://data-seed-prebsc-2-s3.binance.org:8545",
55-
blockExplorerUrl: "https://testnet.bscscan.com",
56-
logo: "https://cryptologos.cc/logos/binance-coin-bnb-logo.png",
57-
chainId: "0x61",
58-
displayName: "Binance SmartChain Testnet",
59-
ticker: "BNB",
60-
tickerName: "BNB",
61-
},
62-
{
63-
chainNamespace: CHAIN_NAMESPACES.EIP155,
64-
chainId: "0x13882",
65-
rpcTarget: "https://rpc.ankr.com/polygon_amoy",
66-
displayName: "Polygon Amoy Testnet",
67-
blockExplorerUrl: "https://amoy.polygonscan.com/",
68-
ticker: "POL",
69-
tickerName: "Polygon Ecosystem Token",
70-
},
71-
],
72-
[CHAIN_NAMESPACES.SOLANA]: [
73-
// Ref: https://namespaces.chainagnostic.org/solana/caip10
74-
{
75-
chainNamespace: CHAIN_NAMESPACES.SOLANA,
76-
rpcTarget: "https://api.devnet.solana.com",
77-
blockExplorerUrl: "https://solscan.io",
78-
logo: "https://cryptologos.cc/logos/solana-sol-logo.png",
79-
chainId: "0x67",
80-
ticker: "SOL",
81-
tickerName: "Solana",
82-
displayName: "Solana Devnet",
83-
},
84-
{
85-
chainNamespace: CHAIN_NAMESPACES.SOLANA,
86-
rpcTarget: import.meta.env.VITE_SOLANA_MAINNET_RPC,
87-
blockExplorerUrl: "https://explorer.solana.com",
88-
logo: "https://cryptologos.cc/logos/solana-sol-logo.png",
89-
chainId: "0x65",
90-
ticker: "SOL",
91-
tickerName: "Solana",
92-
displayName: "Solana Mainnet",
93-
},
94-
],
12+
export const chainConfigs: Record<ChainNamespaceType, string[]> = {
13+
[CHAIN_NAMESPACES.EIP155]: ["0x1", "0xaa36a7", "0x2105", "0x61", "0x13882"],
14+
[CHAIN_NAMESPACES.SOLANA]: ["0x67", "0x65"],
9515
[CHAIN_NAMESPACES.CASPER]: [],
9616
[CHAIN_NAMESPACES.XRPL]: [],
9717
[CHAIN_NAMESPACES.OTHER]: [],

0 commit comments

Comments
 (0)