bitget-wallet-developer-skill

# Bitget Wallet Developer Skill Developer skill for integrating Bitget Wallet into DApps. Covers 8 blockchains, 5 adapter frameworks, Telegram Mini Apps, and DeepLinks. ## Instructions ### Step 1: Identify What the User Wants to Build Determine the **chain**, **platform**, and **framework**, then route to the right references. **Routing Table:** | User Intent | Load References | |---|---| | "Connect EVM / MetaMask-compatible wallet" | `detection-and-setup.md` + `evm.md` | | "Solana DApp" | `detection-and-setup.md` + `solana.md` | | "Bitcoin / Ordinals / BRC-20" | `detection-and-setup.md` + `bitcoin.md` | | "TON application" | `detection-and-setup.md` + `ton.md` | | "Aptos DApp" | `detection-and-setup.md` + `aptos.md` | | "Cosmos / IBC" | `detection-and-setup.md` + `cosmos.md` | | "Tron DApp" | `detection-and-setup.md` + `tron.md` | | "Sui DApp" | `detection-and-setup.md` + `sui.md` | | "Use Wagmi / RainbowKit" | `adapters.md` (adapter handles detection) | | "Add Bitget Wallet to recommended / default wallet list" | `adapters.md` → see "How to Put Bitget Wallet in the Recommended / Default Wallet List" section | | "Multi-chain DApp" | `detection-and-setup.md` + each chain reference | | "Telegram Mini App" | `telegram-miniapp.md` | | "Open Bitget Swap" | `bitget-exclusive.md` | | "DeepLink / open in App" | `deeplink.md` | > **Routing wildcard rule**: When the user mentions any chain name not listed above, default to loading `detection-and-setup.md` + `{chain}.md`. **Decision Tree — JS Bridge vs Adapter:** ``` React project + EVM only → adapters.md (recommend Wagmi/RainbowKit) React project + multi-chain → detection-and-setup.md + chain references Vue / Angular / Vanilla JS → detection-and-setup.md + chain references Telegram Mini App → telegram-miniapp.md Existing ethers.js / web3.js → evm.md (use Provider directly) ``` ### Companion Skill: DApp Common Skill If the user is building a complete DApp (not just a wallet integration snippet), also load `dapp-common-skill`. It provides: - **Layout** — header, wallet status bar, card components, responsive design - **Transfer forms** — amount input, MAX button, token selector, balance display - **Chain switching UI** — chain selector dropdown, unsupported chain banner - **Signing panel** — message input, personal_sign vs typed data toggle, verification - **Transaction lifecycle** — state machine (signing→pending→confirmed), explorer links - **Error messages** — user-friendly error display This skill (Bitget Wallet Developer Skill) tells the agent **how to call wallet APIs**. The DApp Common Skill tells the agent **how to build good DApp UX**. Both are needed for a complete DApp. ### Step 2: Read the Relevant References Load only the references you need. Each file is self-contained with full code examples. **Infrastructure:** - `references/detection-and-setup.md` — Provider detection, install prompts, EIP-6963, environment detection **Chain Integration (by chain):** - `references/evm.md` — Ethereum, BSC, Polygon, Arbitrum, Base, and all EVM chains - `references/solana.md` — Solana (Phantom-compatible) - `references/bitcoin.md` — Bitcoin (UniSat protocol) - `references/ton.md` — TON (OpenMask/TonKeeper compatible + TonConnect) - `references/aptos.md` — Aptos (Petra-compatible) - `references/cosmos.md` — Cosmos (Keplr protocol) - `references/tron.md` — Tron (TronLink protocol) - `references/sui.md` — Sui (Wallet Standard) **Framework Integration (by adapter):** - `references/adapters.md` — Wagmi, RainbowKit, WalletConnect, TonConnect, Web3-Onboard **Extended Scenarios:** - `references/telegram-miniapp.md` — Telegram Mini App (TonConnect) - `references/deeplink.md` — DeepLink navigation + App invocation - `references/bitget-exclusive.md` — Open Bitget Wallet's built-in Swap page ### Step 3: Ask the Right Questions Before Implementing | Chain | Must Confirm | |---|---| | EVM | Target chain? Need chain switching? Using ethers.js or viem? | | Solana | Legacy or Versioned Transaction? | | Bitcoin | Need Ordinals/Inscriptions? PSBT signing? | | TON | Use JS Bridge or TonConnect? | | Aptos | Mainnet or Testnet? | | All chains | Use JS Bridge (`window.bitkeep`) or Adapter (Wagmi etc.)? | ### Step 4: Implement Follow the patterns in the reference files. Key rules: - **Always detect the provider first** — use the detection pattern from `detection-and-setup.md` or rely on the adapter's built-in detection. - **Handle all errors** — every wallet call can throw. See Error Handling section below. - **Use TypeScript types** — all code examples include type annotations. - **Test on both Chrome Extension and Bitget Wallet App** — behavior may differ slightly. ### Step 5: Handle Errors Standard error codes across all chains: | Code | Meaning | Action | |---|---|---| | 4001 | User rejected request | Show retry prompt. Do NOT auto-retry. | | 4100 | Unauthorized | Call `connect()` first. | | 4200 | Unsupported method | Verify method name and chain compatibility. | | 4900 | Disconnected | Reconnect the wallet. | | 4901 | Chain disconnected | Switch to a connected chain. | | -32000 | Invalid input | Check parameter format. | | -32602 | Invalid params | Check parameter types and values. | | -32603 | Internal error | Check RPC node status, retry with backoff. | ```typescript interface WalletError { code: number; message: string; } function handleWalletError(error: WalletError): void { switch (error.code) { case 4001: console.log('User rejected the request. Please try again.'); break; case 4100: console.log('Unauthorized. Please connect your wallet first.'); break; case -32603: console.log('Internal error. Please check your network connection.'); break; default: console.error(`Wallet error ${error.code}: ${error.message}`); } } ``` ## Core Knowledge (No Reference Loading Required) ### Provider Quick Reference | Chain | Provider | Compatible With | |---|---|---| | EVM | `window.bitkeep.ethereum` | MetaMask (`window.ethereum`) | | Solana | `window.bitkeep.solana` | Phantom (`window.solana`) | | Bitcoin | `window.bitkeep.unisat` | UniSat (`window.unisat`) | | TON | `window.bitkeep.ton` | OpenMask (`window.ton`) | | Aptos | `window.bitkeep.aptos` | Petra (`window.aptos`, `window.petra`) | | Cosmos | `window.bitkeep.keplr` | Keplr (`window.keplr`) | | Tron | `window.bitkeep.tronWeb` / `.tronLink` | TronLink | | Sui | `window.bitkeep.suiWallet` | Wallet Standard | ### Quick Connect (30-Second Version) ```typescript // EVM — most common const accounts: string[] = await window.bitkeep.ethereum.request({ method: 'eth_requestAccounts' }); // Solana await window.bitkeep.solana.connect(); const pubkey: string = window.bitkeep.solana.publicKey.toString(); // Bitcoin const btcAccounts: string[] = await window.bitkeep.unisat.requestAccounts(); ``` ### Wallet Constants ``` Name: Bitget Wallet Namespace: window.bitkeep Website: https://web3.bitget.com Extension: https://chromewebstore.google.com/detail/jiidiaalihmmhddjgbnbgdfflelocpak EIP-6963 RDNS: com.bitget.web3 Developer Docs: https://web3.bitget.com/en/docs/ Demo Repo: https://github.com/bitgetwallet/dapp-integration-demos ``` ### Detect Installation ```typescript const provider = window.bitkeep?.ethereum; if (!provider) { window.open('https://web3.bitget.com/en/wallet-download'); } ``` ### Multi-Chain Quick Start For DApps needing 2-3 chains, use this pattern to connect all providers: ```typescript interface WalletConnections { evm?: string; solana?: string; bitcoin?: string; } async function connectMultiChain(): Promise<WalletConnections> { const connections: WalletConnections = {}; if (window.bitkeep?.ethereum) { const [evmAddr] = await window.bitkeep.ethereum.request({ method: 'eth_requestAccounts' }); connections.evm = evmAddr; } if (window.bitkeep?.solana) { await window.bitkeep.solana.connect(); connections.solana = window.bitkeep.solana.publicKey.toString(); } if (window.bitkeep?.unisat) { const [btcAddr] = await window.bitkeep.unisat.requestAccounts(); connections.bitcoin = btcAddr; } return connections; } ``` ### Multi-Chain React Architecture For React multi-chain DApps, use one Context per chain and compose them at the app level. Import each chain's hook from the corresponding reference (e.g., `useWallet` from `evm.md`, `useSolanaWallet` from `solana.md`). ```tsx // src/providers/MultiChainProvider.tsx import { createContext, useContext, ReactNode } from 'react'; import { useWallet } from '../hooks/useWallet'; // from evm.md import { useSolanaWallet } from '../hooks/useSolanaWallet'; // from solana.md import { useBitcoinWallet } from '../hooks/useBitcoinWallet'; // from bitcoin.md interface MultiChainState { evm: ReturnType<typeof useWallet>; solana: ReturnType<typeof useSolanaWallet>; bitcoin: ReturnType<typeof useBitcoinWallet>; } const MultiChainContext = createContext<MultiChainState | null>(null); export function MultiChainProvider({ children }: { children: ReactNode }) { const evm = useWallet(); const solana = useSolanaWallet(); const bitcoin = useBitcoinWallet(); return ( <MultiChainContext.Provider value={{ evm, solana, bitcoin }}> {children} </MultiChainContext.Provider> ); } export const useMultiChain = () => { const ctx = useContext(MultiChainContext); if (!ctx) throw new Error('Wrap with <MultiChainProvider>'); return ctx; }; ``` ```tsx // src/components/Portfolio.tsx — aggregated view import { useMultiChain } from '../providers/MultiChainProvider'; export function Portfolio() { const { evm, solana, bitcoin } = useMultiChain(); const chains = [ { name: 'Ethereum', address: evm.account, connected: evm.isConnected, connect: evm.connect, balance: evm.balance }, { name: 'Solana', address: solana.publicKey, connected: solana.isConnected, connect: solana.connect }, { name: 'Bitcoin', address: bitcoin.account, connected: bitcoin.isConnected, connect: bitcoin.connect, balance: bitcoin.balance }, ]; return ( <div> {chains.map((c) => ( <div key={c.name}> <h3>{c.name}</h3> {c.connected ? <p>{c.address} {c.balance && `— ${c.balance}`}</p> : <button onClick={c.connect}>Connect {c.name}</button>} </div> ))} </div> ); } ``` ```tsx // src/App.tsx import { MultiChainProvider } from './providers/MultiChainProvider'; import { Portfolio } from './components/Portfolio'; export default function App() { return ( <MultiChainProvider> <h1>Multi-Chain Portfolio</h1> <Portfolio /> </MultiChainProvider> ); } ``` ## Examples ### Example 1: Connect Wallet on Ethereum User says: "Create a Next.js app that connects to Bitget Wallet on Ethereum" Actions: 1. Read `references/detection-and-setup.md` and `references/evm.md` 2. Detect Bitget Wallet provider 3. Connect using `eth_requestAccounts` 4. Display connected address 5. Handle user rejection (4001) ### Example 2: Multi-Chain DApp User says: "Build a multi-chain DApp supporting ETH, SOL, and BTC" Actions: 1. Read `references/detection-and-setup.md`, `references/evm.md`, `references/solana.md`, `references/bitcoin.md` 2. Detect each provider under `window.bitkeep` 3. Connect each chain independently 4. Display chain-specific balances and addresses ### Example 3: Add to Wagmi Project User says: "Add Bitget Wallet to my existing Wagmi project" Actions: 1. Read `references/adapters.md` 2. Bitget Wallet works with `injected()` connector in Wagmi 3. Add EIP-6963 auto-detection (rdns: `com.bitget.web3`) 4. No extra SDK needed ### Example 4: Solana NFT Minting User says: "Build a Solana NFT minting page with Bitget Wallet" Actions: 1. Read `references/detection-and-setup.md` and `references/solana.md` 2. Connect via `window.bitkeep.solana.connect()` 3. Build mint transaction using Metaplex 4. Sign with `signAndSendTransaction` ### Example 5: TON Mini App User says: "Create a TON Mini App with wallet connection" Actions: 1. Read `references/telegram-miniapp.md` and `references/ton.md` 2. Choose TonConnect or JS Bridge based on environment 3. Connect and handle TON transactions ### Example 6: Bitcoin Transaction User says: "Send a Bitcoin transaction using Bitget Wallet" Actions: 1. Read `references/detection-and-setup.md` and `references/bitcoin.md`