Skip to content

Commit 6e011f7

Browse files
lwin-kyawlwin-kyaw
committed
chore: update demo solana
1 parent e410f1d commit 6e011f7

File tree

4 files changed

+53
-32
lines changed

4 files changed

+53
-32
lines changed

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

Lines changed: 7 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ import {
1212
useWalletUI,
1313
useWeb3Auth,
1414
useWeb3AuthUser,
15-
1615
} from "@web3auth/modal/vue";
1716
import { CONNECTOR_INITIAL_AUTHENTICATION_MODE, type CustomChainConfig } from "@web3auth/no-modal";
1817
import { useI18n } from "petite-vue-i18n";
@@ -30,7 +29,7 @@ import {
3029
import { getCapabilities, getCallsStatus, sendCalls, showCallsStatus } from "@wagmi/core";
3130
import { parseEther } from "viem";
3231
import { createWalletTransactionSigner, toAddress } from "@solana/client";
33-
import { address as solanaAddress, } from "@solana/kit";
32+
import { address as solanaAddress } from "@solana/kit";
3433
import { getTransferSolInstruction } from "@solana-program/system";
3534
import { computed, ref, watch } from "vue";
3635
import X402Tester from "./X402Tester.vue";
@@ -109,10 +108,7 @@ const isDisplay = (name: "dashboard" | "ethServices" | "solServices" | "walletSe
109108
return Boolean(conn?.solanaWallet);
110109
111110
case "walletServices":
112-
return (
113-
web3Auth.value?.connectedConnectorName === WALLET_CONNECTORS.AUTH &&
114-
Boolean(conn?.ethereumProvider || conn?.solanaWallet)
115-
);
111+
return web3Auth.value?.connectedConnectorName === WALLET_CONNECTORS.AUTH && Boolean(conn?.ethereumProvider || conn?.solanaWallet);
116112
117113
default: {
118114
return false;
@@ -395,8 +391,6 @@ const onSwitchChain = async () => {
395391
printToConsole("switchedChain error", error);
396392
}
397393
};
398-
399-
400394
</script>
401395

402396
<template>
@@ -497,22 +491,14 @@ const onSwitchChain = async () => {
497491

498492
<!-- EIP-5792 -->
499493
<div class="mb-2 mt-4 text-xl font-bold leading-tight text-left">EIP-5792</div>
500-
<Button block size="xs" pill class="mb-2" @click="onGetCapabilities">
501-
Get Capabilities
502-
</Button>
503-
<Button block size="xs" pill class="mb-2" @click="onSendBatchCalls">
504-
Send Batch Calls
505-
</Button>
506-
<Button v-if="trackedCallsId" block size="xs" pill class="mb-2" @click="onRefetchCallsStatus">
507-
Refresh Calls Status
508-
</Button>
509-
<Button v-if="trackedCallsId" block size="xs" pill class="mb-2" @click="onShowCallsStatusInWallet">
510-
Show Calls Status in Wallet
511-
</Button>
494+
<Button block size="xs" pill class="mb-2" @click="onGetCapabilities">Get Capabilities</Button>
495+
<Button block size="xs" pill class="mb-2" @click="onSendBatchCalls">Send Batch Calls</Button>
496+
<Button v-if="trackedCallsId" block size="xs" pill class="mb-2" @click="onRefetchCallsStatus">Refresh Calls Status</Button>
497+
<Button v-if="trackedCallsId" block size="xs" pill class="mb-2" @click="onShowCallsStatusInWallet">Show Calls Status in Wallet</Button>
512498
</Card>
513499

514500
<!-- x402 -->
515-
<X402Tester v-if="isDisplay('ethServices')" class="mb-2" @print-to-console="printToConsole" />
501+
<X402Tester v-if="isDisplay('ethServices') || isDisplay('solServices')" class="mb-2" @print-to-console="printToConsole" />
516502

517503
<!-- SOLANA -->
518504
<Card v-if="isDisplay('solServices')" class="h-auto gap-4 px-4 py-4 mb-2" :shadow="false">

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

Lines changed: 42 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,11 @@ import { CHAIN_NAMESPACES } from "@web3auth/no-modal";
77
import { ref, watch } from "vue";
88
99
const BASE_SEPOLIA_CHAIN_ID = "0x14a34"; // 84532
10+
const SOLANA_DEVNET_CHAIN_ID = "0x67"; // 103
11+
const SOLANA_DEVNET_CAIP_CHAIN_ID = `solana:${Number(SOLANA_DEVNET_CHAIN_ID)}`;
1012
const DEFAULT_X402_URL = import.meta.env.VITE_APP_X402_TEST_CONTENT_URL || "https://x402.org/protected";
1113
12-
const { isConnected } = useWeb3Auth();
14+
const { isConnected, connection, web3Auth } = useWeb3Auth();
1315
const { chainId, chainNamespace } = useChain();
1416
const { mutateAsync: switchChainAsync } = useSwitchChain();
1517
const { fetchWithPayment } = useX402Fetch();
@@ -21,6 +23,7 @@ const url = ref(DEFAULT_X402_URL);
2123
const fetchLoading = ref(false);
2224
2325
const isOnBaseSepolia = ref(false);
26+
const isOnSolanaDevnet = ref(false);
2427
2528
const parseConsoleBody = (text: string) => {
2629
try {
@@ -31,9 +34,10 @@ const parseConsoleBody = (text: string) => {
3134
};
3235
3336
watch(
34-
chainId,
35-
(id) => {
36-
isOnBaseSepolia.value = id?.toLowerCase() === BASE_SEPOLIA_CHAIN_ID.toLowerCase();
37+
[chainId, chainNamespace],
38+
([id, namespace]) => {
39+
isOnBaseSepolia.value = namespace === CHAIN_NAMESPACES.EIP155 && id?.toLowerCase() === BASE_SEPOLIA_CHAIN_ID.toLowerCase();
40+
isOnSolanaDevnet.value = namespace === CHAIN_NAMESPACES.SOLANA && id?.toLowerCase() === SOLANA_DEVNET_CHAIN_ID.toLowerCase();
3741
},
3842
{ immediate: true }
3943
);
@@ -49,6 +53,28 @@ const onSwitchToBaseSepolia = async () => {
4953
}
5054
};
5155
56+
const onSwitchToSolanaDevnet = async () => {
57+
fetchLoading.value = true;
58+
try {
59+
const provider = connection.value?.ethereumProvider;
60+
61+
if (provider?.request) {
62+
await provider.request({
63+
method: "wallet_switchChain",
64+
params: { chainId: SOLANA_DEVNET_CAIP_CHAIN_ID },
65+
});
66+
return;
67+
}
68+
69+
if (!web3Auth.value) throw new Error("Web3Auth is not ready");
70+
await web3Auth.value.switchChain({ chainId: SOLANA_DEVNET_CHAIN_ID });
71+
} catch (err) {
72+
emit("print-to-console", "x402 network error", err instanceof Error ? err.message : String(err));
73+
} finally {
74+
fetchLoading.value = false;
75+
}
76+
};
77+
5278
const onFetchWithPayment = async () => {
5379
fetchLoading.value = true;
5480
try {
@@ -75,7 +101,6 @@ const onFetchWithPayment = async () => {
75101
<Card class="px-4 py-4 gap-4 h-auto" :shadow="false">
76102
<div class="mb-3 text-xl font-bold leading-tight text-left">x402 Payment Fetch</div>
77103

78-
<!-- Status badges -->
79104
<div class="flex flex-wrap gap-2 mb-3 text-xs">
80105
<span class="px-2 py-1 rounded-full font-medium" :class="isConnected ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-600'">
81106
{{ isConnected ? "Connected" : "Not connected" }}
@@ -91,16 +116,26 @@ const onFetchWithPayment = async () => {
91116
>
92117
{{ isOnBaseSepolia ? "Base Sepolia" : "Not on Base Sepolia" }}
93118
</span>
119+
<span
120+
v-if="chainNamespace === CHAIN_NAMESPACES.SOLANA"
121+
class="px-2 py-1 rounded-full font-medium"
122+
:class="isOnSolanaDevnet ? 'bg-blue-100 text-blue-700' : 'bg-yellow-100 text-yellow-700'"
123+
>
124+
{{ isOnSolanaDevnet ? "Solana Devnet" : "Not on Solana Devnet" }}
125+
</span>
94126
</div>
95127

96-
<!-- Switch chain -->
97128
<div v-if="isConnected && chainNamespace === CHAIN_NAMESPACES.EIP155" class="mb-3">
98129
<Button block size="xs" pill :loading="fetchLoading" :disabled="isOnBaseSepolia" @click="onSwitchToBaseSepolia">
99130
{{ isOnBaseSepolia ? "Already on Base Sepolia" : "Switch to Base Sepolia" }}
100131
</Button>
101132
</div>
133+
<div v-if="isConnected && chainNamespace === CHAIN_NAMESPACES.SOLANA" class="mb-3">
134+
<Button block size="xs" pill :loading="fetchLoading" :disabled="isOnSolanaDevnet" @click="onSwitchToSolanaDevnet">
135+
{{ isOnSolanaDevnet ? "Already on Solana Devnet" : "Switch to Solana Devnet" }}
136+
</Button>
137+
</div>
102138

103-
<!-- URL input -->
104139
<div class="mb-3">
105140
<label class="block mb-1 text-xs font-medium text-gray-600">Endpoint URL</label>
106141
<input
@@ -111,7 +146,6 @@ const onFetchWithPayment = async () => {
111146
/>
112147
</div>
113148

114-
<!-- Fetch button -->
115149
<Button block size="xs" pill :loading="fetchLoading" :disabled="!isConnected" class="mb-3" @click="onFetchWithPayment">Fetch with Payment</Button>
116150
</Card>
117151
</template>

‎demo/wagmi-react-app/src/components/X402.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { useWalletClient } from "wagmi";
77

88
import styles from "../styles/Home.module.css";
99

10-
const X402_URL = import.meta.env.VITE_APP_X402_TEST_CONTENT_URL;
10+
const X402_URL = import.meta.env.VITE_APP_X402_TEST_CONTENT_URL || "https://x402.org/protected";
1111
const FETCH_OPTIONS: RequestInit = { method: "GET", headers: { "Content-Type": "application/json" } };
1212

1313
// ─── Shared response renderer ────────────────────────────────────────────────

‎packages/no-modal/src/x402/index.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,8 +37,9 @@ async function normalizePaymentRequiredResponse(response: Response): Promise<Res
3737
try {
3838
if (body.x402Version && body.x402Version >= 2) {
3939
const newHeaders = new Headers(response.headers);
40-
newHeaders.set(PAYMENT_REQUIRED_HEADER, encodeBase64Url(JSON.stringify(body)));
41-
return new Response(body, {
40+
const jsonData = JSON.stringify(body);
41+
newHeaders.set(PAYMENT_REQUIRED_HEADER, encodeBase64Url(jsonData));
42+
return new Response(jsonData, {
4243
status: response.status,
4344
statusText: response.statusText,
4445
headers: newHeaders,

0 commit comments

Comments
 (0)
⚡