Skip to content

Latest commit

 

History

History
144 lines (108 loc) · 4.23 KB

File metadata and controls

144 lines (108 loc) · 4.23 KB

WalletConnect Deep Linking

ShapeShift mobile app supports WalletConnect v2 for connecting to dApps on both Android and iOS.

How It Works

Architecture

dApp → WalletConnect Modal → wc:// URI → ShapeShift Mobile → WebView → ShapeShift Web → WalletConnect Session

The ShapeShift mobile app is a WebView wrapper around app.shapeshift.com. When a user connects via WalletConnect:

  1. dApp generates WalletConnect pairing URI: wc://topic@2?relay-protocol=irn&symKey=...
  2. Mobile app receives the deep link via Android/iOS intent system
  3. Deep link handler (src/App.tsx:125-132) converts to: shapeshift://wc?uri=wc%3A%2F%2F...
  4. WebView navigates to: https://app.shapeshift.com/#/wc?uri=...
  5. Web app handles the actual WalletConnect protocol via @walletconnect/ethereum-provider

For details on the web side implementation, see: Web WalletConnect README

Platform Support

Android

Registered Schemes:

  • wc:// - WalletConnect protocol scheme (appears in "Open with" dialog)
  • shapeshift:// - App-specific scheme

Implementation:

  • Intent filters defined via Expo config plugin: plugins/withWalletConnectScheme.js
  • Plugin runs during expo prebuild to modify AndroidManifest.xml
  • Both schemes route to the same deep link handler

User Experience: When users connect from dApps with older WalletConnect modals on Android:

  1. User clicks "Connect Wallet"
  2. Android shows "Open with" dialog
  3. ShapeShift appears in the list
  4. User selects ShapeShift
  5. Connection completes

iOS

Registered Schemes:

  • shapeshift:// - App-specific scheme
  • com.shapeShift.shapeShift:// - Bundle identifier scheme

Implementation:

  • URL types defined in ios/ShapeShift/Info.plist
  • iOS uses WalletConnect Cloud Registry for wallet discovery (not raw wc:// scheme)

Testing Deep Links

Android

# Verify wc:// scheme is registered
adb shell pm query-activities -a android.intent.action.VIEW -d "wc://test"

# Test deep link
adb shell "am start -a android.intent.action.VIEW -d 'wc://test@2?relay=irn'"

# Verify shapeshift:// still works
adb shell pm query-activities -a android.intent.action.VIEW -d "shapeshift://test"

iOS

# Test shapeshift:// scheme
xcrun simctl openurl booted "shapeshift://wc?uri=wc%3A%2F%2Ftest"

Implementation Files

Core Files

  • plugins/withWalletConnectScheme.js - Expo config plugin for Android intent filter
  • app.json - Plugin registration
  • src/App.tsx (lines 125-132) - Deep link handler
  • ios/ShapeShift/Info.plist - iOS URL schemes

Generated Files (Not in Git)

  • android/app/src/main/AndroidManifest.xml - Generated by expo prebuild
  • Contains both wc:// and shapeshift:// intent filters

Building and Running

Development

# Start Metro bundler
npx expo start --clear

# Press 's' for development build
# Press 'a' for Android or 'i' for iOS

Testing Changes

# Regenerate native files
npx expo prebuild --clean

# Build Android
npx expo run:android

# Build iOS
npx expo run:ios

Production Builds

# Android
eas build -p android --profile production

# iOS
eas build -p ios --profile production

Troubleshooting

Plugin Not Running

# Clean prebuild and check console output
npx expo prebuild --clean --platform android

# Look for: "✅ Added wc:// intent filter to AndroidManifest"

Deep Link Not Working (Android)

# Check if app is installed
adb shell pm list packages | grep shapeshift

# Verify intent filters
adb shell pm dump com.shapeshift.droid_shapeshift | grep -A 10 "intent-filter"

# Test with simple URI
adb shell "am start -a android.intent.action.VIEW -d 'wc://test'"

App Opens But Doesn't Connect

  • Check Metro bundler is running
  • Check WebView console via chrome://inspect
  • Verify settings are loaded (EXPO_PUBLIC_SHAPESHIFT_URI)

Related Documentation