WalletConnect Integration

import { WcTransport, EthereumApp, DEFAULT_ETH_PATH } from '@openloop/sdk-core'
import SignClient from '@walletconnect/sign-client'

// Initialize the WalletConnect SignClient
const client = await SignClient.init({
  projectId: 'your-project-id',
})

// Pair and establish a session
const { uri, approval } = await client.connect({
  requiredNamespaces: {
    eip155: {
      methods: ['openloop_exchange', 'openloop_lock', 'openloop_unlock'],
      chains: ['eip155:1'],
      events: [],
    },
  },
})

// Show the URI as a QR code → the user scans it with Openloop Connect
console.log('Pairing URI:', uri)

// Wait for session approval
const session = await approval()

// Create the WcTransport
const transport = new WcTransport({
  client,
  session: { topic: session.topic },
  chainId: 'eip155:1', // optional (default: 'eip155:1')
})

await transport.open()

// The regular App classes work as-is
const eth = new EthereumApp(transport)
const { address } = await eth.getAddress(DEFAULT_ETH_PATH)

interface WcTransportOptions {
  client: IWcSignClient   // WalletConnect SignClient instance
  session: WcSession       // Active session { topic: string }
  chainId?: string         // Chain ID (default: "eip155:1")
}

interface IWcSignClient {
  request<T>(params: {
    topic: string
    chainId: string
    request: { method: string; params: unknown }
  }): Promise<T>
}

interface WcSession {
  topic: string
}

import { SUPPORTED_BIP122_CHAINS, SUPPORTED_BIP122_METHODS } from '@openloop/sdk-core'

console.log(SUPPORTED_BIP122_CHAINS.length, SUPPORTED_BIP122_METHODS.join(', '))
// 2 "signPsbt, getAccountAddresses, signMessage, sendTransfer"

import type { BtcMessageSignature } from '@openloop/sdk-core'
import { extractRawTx } from '@openloop/sdk-core/bitcoin'
import { verifyBtcMessage } from '@openloop/sdk-core/verify'

function base64ToBytes(b64: string): Uint8Array {
  return Uint8Array.from(atob(b64), c => c.charCodeAt(0))
}
function toHex(bytes: Uint8Array): string {
  return Array.from(bytes, b => b.toString(16).padStart(2, '0')).join('')
}

// Result of signPsbt → raw transaction ready to broadcast
function rawTxFromSignPsbt(result: { psbt: string }) {
  return extractRawTx(toHex(base64ToBytes(result.psbt))) // { rawTxHex, txid }
}

// Result of signMessage → verify the BIP-137 signature
function verifySignMessage(message: string, result: { address: string; signature: string }) {
  const bytes = base64ToBytes(result.signature) // [v(1)][r(32)][s(32)]
  const hex = toHex(bytes)
  const sig: BtcMessageSignature = { v: bytes[0], r: hex.slice(2, 66), s: hex.slice(66, 130), signature: result.signature }
  return verifyBtcMessage(message, sig, result.address)
}

import { createAppKit } from '@reown/appkit/react'
import { WagmiAdapter } from '@reown/appkit-adapter-wagmi'
import { SolanaAdapter } from '@reown/appkit-adapter-solana'
import { BitcoinAdapter } from '@reown/appkit-adapter-bitcoin'
import { TronAdapter } from '@reown/appkit-adapter-tron'
import { mainnet, sepolia, bitcoin, bitcoinTestnet } from '@reown/appkit/networks'

const projectId = 'your-walletconnect-project-id'

// Create the adapters
const wagmiAdapter = new WagmiAdapter({ projectId, networks: [mainnet, sepolia] })
const solanaAdapter = new SolanaAdapter()
const bitcoinAdapter = new BitcoinAdapter()
const tronAdapter = new TronAdapter()

// Create the AppKit instance
const modal = createAppKit({
  projectId,
  adapters: [wagmiAdapter, solanaAdapter, bitcoinAdapter, tronAdapter],
  networks: [mainnet, sepolia, bitcoin, bitcoinTestnet],
  metadata: {
    name: 'My dApp',
    description: 'My dApp with Openloop',
    url: 'https://my-dapp.com',
    icons: ['https://my-dapp.com/icon.png'],
  },
  customWallets: [
    {
      id: 'openloop-connect',
      name: 'Openloop Connect',
      homepage: 'https://crypto.haudi.jp/openloop/',
      mobile_link: 'openloop://',
      desktop_link: 'openloop://',
      image_url: 'https://crypto.haudi.jp/openloop/images/logo/openloop-icon.png',
    },
  ],
})