skills-ws
Version:
87 agent skills for AI coding assistants — marketing, growth, web3, dev, design & operations. Built for OpenClaw, Claude Code, Cursor, and Codex.
53 lines (46 loc) • 1.95 kB
Markdown
```tsx
import { useSignTypedData, useAccount, useChainId } from 'wagmi';
import { USDC_MAINNET, RECIPIENT } from './addresses';
function SignPermit() {
const { address: owner } = useAccount();
const chainId = useChainId();
const { signTypedData, data: signature } = useSignTypedData();
function handleSign() {
if (!owner) return;
signTypedData({
domain: {
name: 'USD Coin',
version: '2',
chainId, // bind the signature to the connected chain
verifyingContract: USDC_MAINNET, // the token/contract you're permitting
},
types: {
Permit: [
{ name: 'owner', type: 'address' },
{ name: 'spender', type: 'address' },
{ name: 'value', type: 'uint256' },
{ name: 'nonce', type: 'uint256' },
{ name: 'deadline', type: 'uint256' },
],
},
primaryType: 'Permit',
message: {
owner, // the connected account, not a hardcoded address
spender: RECIPIENT, // who you're granting an allowance to
value: 1000000n, // 1 USDC (6 decimals) — show this to the user verbatim
nonce: 0n, // read from the token's nonces(owner) before signing
deadline: BigInt(Math.floor(Date.now() / 1000) + 3600),
},
});
}
return (
<div>
<button onClick={handleSign}>Sign Permit</button>
{signature && <p>Signature: {signature}</p>}
</div>
);
}
```
> A `Permit` signature is a **gasless approval** — once signed, anyone can submit it to grant `spender` an allowance. Always render `spender`, `value`, the token name, and chain in your UI before calling `signTypedData`, fetch the live `nonce` from the contract, and prefer a finite `value` over `type(uint256).max`. See section 13 for the full signing-safety checklist.
---