InAppWallet

A wallet configurator for In-App Wallet which allows integrating the wallet with React Native

import { inAppWallet } from "@thirdweb-dev/react-native";
const inAppWalletConfig = inAppWallet();

Options

Installation

To use the inAppWallet you need to add the following dependencies to your project. Find the command to add them all for convenience below.

npm i amazon-cognito-identity-js@6.3.3 react-native-quick-base64 react-native-quick-crypto react-native-aes-gcm-crypto @react-native-community/netinfo react-native-inappbrowser-reborn@3.7.0

Here are the dependencies added:

Usage with ConnectWallet

To allow users to connect to this wallet using the ConnectWallet component, you can add it to ThirdwebProvider's supportedWallets prop.

<ThirdwebProvider
clientId="your-client-id"
supportedWallets={[inAppWallet()]}
>
<YourApp />
</ThirdwebProvider>;

Usage with useInAppWallet

You can use the useInAppWallet hook to programmatically connect to the wallet without using the ConnectWallet component.

The wallet also needs to be added in ThirdwebProvider's supportedWallets if you want the wallet to auto-connect on next page load.

The hook will return all the necessary functions you'll need to authenticate and connect to the ina-- wallet.

Connecting with Google sign in

function App() {
const { connect } = useInAppWallet();
const handleConnect = async () => {
await connect({
strategy: "google",
redirectUrl: "redirect-url-to-your-app://",
});
};
return <View> ... </View>;
}

Connecting with email verification

function App() {
const { connect, sendVerificationEmail } = useInAppWallet();
const preLogin = async (email: string) => {
// send email verification code
await sendVerificationEmail({ email });
};
const handleLogin = async (
email: string,
verificationCode: string,
) => {
// verify email and connect
await connect({
strategy: "email",
email,
verificationCode,
});
};
return <View> ... </View>;
}

Available connection strategies

// email verification
type EmailVerificationAuthParams = {
strategy: "email";
email: string;
verificationCode: string;
recoveryCode?: string;
};
type SocialAuthParams = {
strategy: "google" | "facebook" | "apple";
redirectUrl: string;
};
// bring your own authentication
type JwtAuthParams = {
strategy: "jwt";
jwt: string;
encryptionKey: string;
};

Deleting an Account

You can delete an account by calling, deleteActiveAccount from the InAppWallet instance:

function App() {
const activeWallet = useWallet();
const deleteAccount = async () => {
await (activeWallet as InAppWallet).deleteActiveAccount();
};
return <View> ... </View>;
}

Apple App Store Guidelines

If you want to publish your app to the App Store you will need to allow users to delete their account as per Apple's Guidelines. You can use the deleteActiveAccount method for this purpose.

Try it out in our published apps

Android Google Play

Apple App Store