> ## Documentation Index
> Fetch the complete documentation index at: https://docs.privacyboost.io/llms.txt
> Use this file to discover all available pages before exploring further.

# React Native Quickstart

> Get started with Privacy Boost in React Native in 5 minutes

# React Native Quickstart

Add private token transfers to your React Native app with native wallet integration.

<Info>
  This quickstart gets you running in 5 minutes with minimal explanation. For detailed walkthroughs of each step, see the [React Native Getting Started guide](/sdk/react-native/getting-started). For background on configuration and auth options, see [Setup](/sdk/concepts/app-setup).
</Info>

## Installation

```bash theme={null}
npm install @sunnyside-io/privacy-boost-react-native
# or
yarn add @sunnyside-io/privacy-boost-react-native
```

See the [Installation guide](/sdk/react-native/installation) for native setup details and any Hermes/Expo caveats.

### iOS

```bash theme={null}
cd ios && pod install
```

### Android

Auto-linked. The package ships prebuilt libraries for `arm64-v8a`,
`armeabi-v7a`, and `x86_64`.

## Quick Example

### 1. Create Wallet Delegate

```typescript theme={null}
import { PrivacyBoost, type WalletDelegate } from '@sunnyside-io/privacy-boost-react-native';

const walletDelegate: WalletDelegate = {
  getAddress: async () => wallet.address,
  getChainId: async () => BigInt(wallet.chainId),
  signMessage: async (message: string) => wallet.signMessage(message),
  signTypedData: async (typedDataJson: string) => wallet.signTypedData(typedDataJson),
  sendTransaction: async (toAddress: string, value: string, data: string) =>
    wallet.sendTransaction({ to: toAddress, value, data }),
  waitForTransactionReceipt: async (txHash: string) => {
    const receipt = await wallet.waitForReceipt(txHash);
    return { txHash, status: receipt.status === 1, logs: receipt.logs };
  },
};
```

### 2. Initialize and Use SDK

```typescript theme={null}
import {
  PrivacyBoost,
  PrivacyBoostConfig,
  KeySource,
} from '@sunnyside-io/privacy-boost-react-native';

// 1. Create configuration
const config = PrivacyBoostConfig.create({
  serverUrl: 'https://optimism.sepolia.privacyboost.io',
  chainId: 10n,
  shieldContractAddress: '0x...',
  wethContractAddress: '0x4200000000000000000000000000000000000006',
  teePublicKey: undefined,
  appId: 'app_abc123xyz',
  persistenceStorage: undefined,
  persistenceUnlock: undefined,
});

// 2. Initialize SDK
const sdk = new PrivacyBoost(config);

// 3. Authenticate
const authResult = await sdk.authenticate(
  walletDelegate,
  new KeySource.WalletDerived(),
  undefined,
);
switch (authResult.tag) {
  case 'Authenticated':
    console.log('Privacy address:', authResult.loginResult.privacyAddress);
    break;
  case 'MnemonicGenerated':
    // First-time user — display the mnemonic, confirm the user saved it,
    // then proceed.
    await confirmMnemonicSaved(authResult.mnemonic);
    const newLogin = await sdk.proceedAfterMnemonic(undefined, undefined);
    console.log('Privacy address:', newLogin.privacyAddress);
    break;
  case 'CredentialRequired': {
    // Prompt the user for their PIN / password, then submit it.
    const pin = await promptUserForPin(authResult.challenge);
    const loginResult = await sdk.submitCredential(pin, undefined);
    console.log('Privacy address:', loginResult.privacyAddress);
    break;
  }
  case 'RecoveryRequired':
    // Local keys are missing but an account exists — prompt for the
    // recovery mnemonic and re-authenticate with new KeySource.Mnemonic(...).
    console.log('Recovery needed:', authResult.challenge);
    break;
}

// 4. Check balance
const balance = await sdk.getBalance('0x...');
console.log('Shielded:', balance.shieldedBalance);

// 5. Deposit
const shieldResult = await sdk.shield('0x...', '1000000000000000000'); // 1 token
console.log('Deposit tx:', shieldResult.txHash, 'requestId:', shieldResult.requestId);

// 6. Transfer
const transferResult = await sdk.send(
  '0x...',
  '500000000000000000',
  '0x04...recipient-privacy-address',
);
console.log('Transfer tx:', transferResult.txHash);

// 7. Withdraw
const unshieldResult = await sdk.unshield(
  '0x...',
  '250000000000000000',
  '0x...',
);
console.log('Withdraw tx:', unshieldResult.txHash);
```

<Info>
  `MnemonicGenerated` fires for first-time users — show the phrase, confirm
  the user saved it, then call `proceedAfterMnemonic`. `CredentialRequired`
  only fires when persistence with PIN / password / biometric unlock is
  configured. `RecoveryRequired` fires when the device has an account record
  but local keys are missing — prompt for the mnemonic and re-authenticate
  with `new KeySource.Mnemonic(phrase)`. See the
  [full auth flow](/sdk/react-native/getting-started#connecting-a-wallet).
</Info>

## React Native Example

```typescript theme={null}
import React, { useState, useCallback } from 'react';
import { View, Text, Button } from 'react-native';
import { PrivacyBoost, PrivacyBoostConfig } from '@sunnyside-io/privacy-boost-react-native';

function WalletScreen() {
  const [isAuthenticated, setIsAuthenticated] = useState(false);
  const [privacyAddress, setPrivacyAddress] = useState<string | null>(null);
  const [sdk] = useState(() => new PrivacyBoost(
    PrivacyBoostConfig.create({
      serverUrl: 'https://optimism.sepolia.privacyboost.io',
      chainId: undefined,
      shieldContractAddress: undefined,
      wethContractAddress: '0x4200000000000000000000000000000000000006',
      teePublicKey: undefined,
      appId: 'app_abc123xyz',
      persistenceStorage: undefined,
      persistenceUnlock: undefined,
    })
  ));

  const authenticate = useCallback(async () => {
    try {
      const result = await sdk.authenticate(walletDelegate, undefined, undefined);
      if (result.tag === 'Authenticated') {
        setPrivacyAddress(result.loginResult.privacyAddress);
        setIsAuthenticated(true);
      }
      // Other variants (MnemonicGenerated, CredentialRequired, RecoveryRequired)
      // need their own handling — see the Quick Example above.
    } catch (error) {
      console.error('Authentication failed:', error);
    }
  }, [sdk]);

  const shield = useCallback(async () => {
    try {
      await sdk.shield('0x...', '1000000000000000000');
    } catch (error) {
      console.error('Deposit failed:', error);
    }
  }, [sdk]);

  const clearSession = useCallback(() => {
    sdk.clearSession();
    setIsAuthenticated(false);
    setPrivacyAddress(null);
  }, [sdk]);

  if (isAuthenticated) {
    return (
      <View>
        <Text>Privacy Address:</Text>
        <Text style={{ fontSize: 10 }}>{privacyAddress}</Text>
        <Button title="Deposit 1 Token" onPress={shield} />
        <Button title="Clear Session" onPress={clearSession} />
      </View>
    );
  }

  return (
    <View>
      <Button title="Connect Wallet" onPress={authenticate} />
    </View>
  );
}
```

## Next Steps

<CardGroup cols={2}>
  <Card title="React Native Getting Started" href="/sdk/react-native/getting-started">
    Detailed walkthrough of each integration step
  </Card>

  <Card title="Setup Guide" href="/sdk/concepts/app-setup">
    App ID, configuration, and auth method selection
  </Card>

  <Card title="Session Storage" href="/sdk/react-native/guides/session-storage">
    Secure persistence with AsyncStorage and encryption
  </Card>

  <Card title="API Reference" href="/sdk/react-native/api-reference">
    Complete API documentation
  </Card>
</CardGroup>