import { useDynamicContext } from '@dynamic-labs/sdk-react-core';
import { isEthereumWallet } from '@dynamic-labs/ethereum';
const SignTypedDataButton = () => {
const { primaryWallet } = useDynamicContext();
const signTypedData = async () => {
if (!primaryWallet || !isEthereumWallet(primaryWallet)) return;
const domain = {
name: 'Example DApp',
version: '1.0.0',
chainId: 1,
verifyingContract: '0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC' as `0x${string}`,
};
const types = {
Person: [
{ name: 'name', type: 'string' },
{ name: 'wallet', type: 'address' },
],
Mail: [
{ name: 'from', type: 'Person' },
{ name: 'to', type: 'Person' },
{ name: 'contents', type: 'string' },
],
};
const message = {
from: {
name: 'Alice',
wallet: primaryWallet.address,
},
to: {
name: 'Bob',
wallet: '0xbBbBBBBbbBBBbbbBbbBbbbbBBbBbbbbBbBbbBBbB',
},
contents: 'Hello, this is a signed message!',
};
const typedData = {
primaryType: 'Mail' as const,
domain,
types,
message
};
try {
const walletClient = await primaryWallet.getWalletClient();
const signature = await walletClient.signTypedData(typedData);
console.log('Typed data signature:', signature);
return signature;
} catch (error) {
console.error('Error signing typed data:', error);
throw error;
}
};
return (
<button onClick={signTypedData}>
Sign Typed Data
</button>
);
};