# Add to an Existing Project

Add Joey Wallet to an app that already uses WalletConnect.

If your app already connects wallets with WalletConnect (Reown), you can add Joey without installing anything new.

## Prerequisites

Joey is tested with the current Reown packages:

- `@walletconnect/universal-provider` for sessions and requests
- `@reown/appkit` for the connect modal

> [!WARNING]
> Older or deprecated `@walletconnect` packages may still work, but reliability isn't guaranteed. We recommend migrating to the packages above.

## Integration

1. **Feature Joey in the AppKit modal.** Add Joey's WalletConnect wallet ID to `featuredWalletIds` (or `includeWalletIds`):

   ```ts
   createAppKit({
     // ...your existing config
     featuredWalletIds: [
       'd9f5432e932c6fad8e19a0cea9d4a3372a84aed16e98a52e6655dd2821a63404', // Joey Wallet
     ],
   });
   ```

   This is Joey's listing ID in the WalletConnect Explorer. It is **not** a Reown project ID; your app still uses its own project ID.

2. **Request the `xrpl` namespace** with the chains and methods Joey supports:

   ```ts
   const namespaces = {
     xrpl: {
       chains: ['xrpl:0'], // Mainnet; xrpl:1 Testnet, xrpl:2 Devnet
       methods: ['xrpl_signTransaction', 'xrpl_signTransactionFor', 'xrpl_signTransactionBulk'],
       events: [],
     },
   };
   ```

   See [Chains](/docs/integration/supported-networks/xrp-ledger/chains) and [Methods](/docs/integration/supported-networks/xrp-ledger/methods).

3. **Handle disconnects.** Joey ends the session whenever the user switches account or network. Listen for `session_delete` and reconnect. See [Events](/docs/integration/supported-networks/xrp-ledger/events).

## Custom buttons and QR codes

To build your own "Connect with Joey" button instead of using the modal:

**QR code content.** Show the raw WalletConnect URI:

```text
wc:60b4991652e56dc0892721711db95886c9f166ced36cb8a60a759b61e89194ae@2?relay-protocol=irn&symKey=6dcd83bed7292707fd03befef27616958a02e574bdff8784937c1cf584fdd206&expiryTimestamp=1753908348
```

**Deep link on mobile.** Open Joey directly with the URI, URL-encoded:

```ts
const deeplink = `joey://settings/wc?uri=${encodeURIComponent(uri)}`;
window.location.href = deeplink;
```

See [Deeplinking](/docs/integration/deeplinking) for all supported links.