Use with WalletConnect

Auro Mobile supports WalletConnect, allowing seamless integration of zkApp with Auro Mobile with QR code scanning or deep linking.

The Auro Wallet in-app browser does not support building zkApps (due to SharedArrayBuffer limitations). Therefore, you need to build the zkApp in an external mobile browser and interact with Auro Wallet via deeplink. This feature is available in Auro Mobile v2.1.2 or later. Please update to the latest version to use this feature. On iOS, WalletConnect event handling in the mobile browser (e.g., Safari) is supported starting from v2.2.1.

Step

1. Get projectId from Reown.

2. Init client.

const client = await SignClient.init({
  projectId: process.env.NEXT_PUBLIC_WALLET_CONNECT_PROJECY_ID,
  metadata: {
    name: "Auro Wallet Demo",
    description: "A Mina Protocol dApp with WalletConnect",
    url: window.location.origin,
    icons: ["https://www.aurowallet.com/imgs/auro_icon.png"],
  },
  logger: "warn",
});

1. Request connect wallet.

const connectParams = {
  requiredNamespaces: {
    mina: {
      chains: ["mina:mainnet", "mina:devnet", "zeko:testnet"], // Chains currently supported by the zkApp, requiring Auro Wallet support.
      methods: [
        // The current zkApp requires the following methods, consistent with other methods supported by Auro Wallet.
        // The supported methods are listed below:
        // List only the required methods:
        "mina_sendPayment",
        "mina_sendStakeDelegation",
        "mina_sendTransaction",
        "mina_signMessage",
        "mina_sign_JsonMessage",
        "mina_signFields",
        "mina_createNullifier",
        "mina_verifyMessage",
        "mina_verify_JsonMessage",
        "mina_verifyFields",
        "wallet_info",
      ],
      events: ["accountsChanged", "chainChanged"],
    },
  },
};

1. Set Up Event Listener (Optional). If the app requires authorization or signing, you can configure it to trigger the app for operations upon a successful callback, or prompt the user in the zkApp to manually switch to Auro Wallet. Note that on iOS, ensure user interaction for any deep link redirects as per the considerations above.

client.on("session_request_sent", (event: any) => {
  console.log("Session request sent:", event);
  if (
    [
      "mina_sendPayment",
      "mina_sendStakeDelegation",
      "mina_sendTransaction",
      "mina_signMessage",
      "mina_sign_JsonMessage",
      "mina_signFields",
      "mina_createNullifier",
    ].includes(event?.request?.method)
  ) {
    const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
    const isIOS = /iPhone|iPad|iPod/i.test(navigator.userAgent);
    if (isMobile) {
      if (isIOS) {
        console.log("iOS: Dispatching wallet prompt for", event.request.method);
        window.dispatchEvent(new CustomEvent("showOpenWalletPrompt", { detail: { action: "request", method: event.request.method } }));
      } else {
        const deepLink = `aurowallet://`;
        console.log("Auro Wallet Deep Link for request (Android):", deepLink);
        openDeepLink(deepLink);
      }
    }
  }
});

1. UI Interaction.

const handleSendZkTransaction = async () => {
  if (!client || !session || !account) {
    setError("Please connect wallet first");
    return;
  }
  const zkTransaction = await getZkBuildBody(selectedChain, account);
  const zkRequest = {
    topic: session.topic,
    chainId: selectedChain,
    request: {
      method: "mina_sendTransaction",
      params: {
        // Optional: Specifies the current browser's scheme.
        // If set, the app automatically returns to the provided scheme's browser;
        // otherwise, the app only displays a pop-up prompting the user to return.
        scheme: chromeScheme,
        from: account,
        transaction: zkTransaction,
        feePayer: {
          fee: "0.01", // Optional
          memo: "test zkApp", // Optional
        },
      },
    },
  };
  const result = await client.request(zkRequest);
};

iOS-Specific Considerations

Auro Wallet on iOS supports WalletConnect, but there are platform-specific differences compared to Android due to iOS security and background execution policies.

1. Redirect (Jump) Issues

iOS only supports Universal Links (applinks) for redirects, and these require genuine user interaction (e.g., a tap) to trigger the app opening. This is a security measure to prevent malicious programmatic redirection without user consent. For more details, see Apple's documentation on Universal Links.

Without user interaction, attempting a redirect may first open the associated webpage before launching Auro Wallet, leading to a suboptimal user experience.

On Android, custom URL schemes are recommended for direct redirects. Using Universal Links on Android can result in similar issues as on iOS.

2. Background Execution Issues

When Auro Wallet is in the background on iOS, the app is suspended by the operating system, preventing it from receiving WalletConnect service messages (e.g., via WebSocket connections to the relay server). This affects events that do not trigger an app wake-up, such as wallet_info or verify requests. To handle these, you must explicitly open Auro Wallet (e.g., via deep link) to process the response.

For official guidance on iOS background execution, refer to Apple's Configuring background execution modes.

Android handles background WalletConnect messages normally without suspension.

Reference Links

Test Website Visit Test Website Core Code Examples

• UI Code

• Initialization Code WalletConnect Integration Documentation

• WalletConnect Sign Client

• Reown AppKit