react-native-wallet

To set up the Expo example application, ensure you have Node.js 18+, Expo CLI, Xcode/CocoaPods (for iOS), and the Google TapAndPay SDK (for Android).

1. Install dependencies: Run npm install.
2. Configure Google TapAndPay SDK (Android only): Place the SDK zip file in the shared libs directory at apps/libs/expo-example/tapandpay-v18.7.0.zip. The Expo config plugin handles extraction during prebuild.
3. Generate native projects: Run npx expo prebuild --clean to generate iOS/Android projects, apply the wallet plugin, and extract the SDK.

npm install
# Place SDK at apps/libs/expo-example/tapandpay-v18.7.0.zip
npx expo prebuild --clean

Use the following commands to run the application on your target platform:

• iOS: npm run ios
• Android: npm run android
• Metro Bundler: npm start

To prevent Not verified errors when calling Google SDK functions, you must whitelist your app's package name and SHA-256 fingerprint with Google.

Prepare the following data:

• Package name: e.g., com.app.package.name
• Fingerprint: A SHA-256 checksum (e.g., SHA256: 36:38:63:59:6E:...:00:82:16:4E:FF). You can generate this using apksigner or keytool.

Submit these details via the official Google documentation instructions to complete the allowlisting process.

To use Push Provisioning on Android, you must manually integrate the Google TapAndPay SDK.

1. Request Access: Visit the Google Pay Android Push Provisioning API documentation to request access.
2. Download and Extract: Once approved, download the TapAndPay SDK and extract its contents into an /android/libs folder in your React Native project root.
3. Ignore SDK in Git: Add /android/libs to your .gitignore.
4. Configure Gradle: Connect the SDK in your android/build.gradle file by adding the libs directory to your repositories.

allprojects {
	repositories {
		google()
		maven { url "file://${rootDir}/libs" }
	}
}

Install the package using npm or yarn after completing the platform-specific setup (Google/Apple entitlements and SDKs).

npm install @expensify/react-native-wallet
# or
yarn add @expensify/react-native-wallet

After completing the setup, use the following commands to start the application.

Start Metro Bundler

npm start

Run on iOS

npm run ios

Or open the workspace in Xcode:

open ios/WalletExample.xcworkspace

Run on Android

npm run android

Use these commands to manage the development lifecycle of the example app.

Reloading the App

• iOS: Press Cmd ⌘ + R in the simulator.
• Android: Press R twice or Ctrl/Cmd + M to open the Developer Menu.

Performing a Clean Build

If you encounter build issues, use the following commands to clean the project:

iOS:

npm run clean-ios
npm run pods

Android:

npm run clean-android

The wallet plugin is configured within the plugins array in your app.json. You must provide the googleTapAndPaySdkPath pointing to the location of the Google TapAndPay SDK zip file.

"plugins": [
  [
    "@expensify/react-native-wallet",
    {
      "googleTapAndPaySdkPath": "../libs/tapandpay-v18.7.0.zip"
    }
  ]
]

On Android, the @expensify/react-native-wallet package exposes two primary interfaces to React Native:

1. WalletModule: A native module providing core wallet functionality.
2. RNAddToWalletButtonManager: A View Manager that allows you to use the native 'Add to Wallet' button component within your React Native application.

These are automatically linked via WalletPackage.