@privy-io/expo

@privy-io/expo

Usage

// Required pollyfils
import 'react-native-get-random-values';
import '@ethersproject/shims';

import React from 'react';

import {PrivyProvider} from '@privy-io/expo';

// Your components
import {HomeScreen} from './Homescreen';

export default function App() {
  return (
    <PrivyProvider appId={'<your-privy-app-id>'}>
      <HomeScreen />
    </PrivyProvider>
  );
}

Auth

import {useLoginWithEmail} from '@privy-io/expo';

export function LoginScreen() {
  const [email, setEmail] = useState('');
  const [code, setCode] = useState('');

  const {sendCode, loginWithCode} = useLoginWithEmail();

  return (
    <View style={styles.container}>
      <Text>Login</Text>

      <TextInput value={email} onChangeText={setEmail} placeholder="Email" inputMode="email" />
      <Button onPress={() => sendCode({email})}>Send Code</Button>

      <TextInput value={code} onChangeText={setCode} placeholder="Code" inputMode="numeric" />
      <Button onPress={() => loginWithCode({code})}>Login</Button>
    </View>
  );
}

Embedded Wallets

export function SignMessageScreen() {
  const [signature, setSignature] = useState<string | null>(null);

  const {user} = usePrivy();
  const wallet = useEmbeddedWallet();
  const address = getUserEmbeddedWallet(user)?.address;

  const signMessage = async (provider: PrivyEmbeddedWalletProvider) => {
    const sig = await provider.request({
      method: 'personal_sign',
      params: ['Hello Privy!', account?.address],
    });

    setSignature(sig);
  };

  return (
    <View style={styles.container}>
      <Text>Sign</Text>

      {wallet.status === 'connected' && (
        <Button onPress={() => signMessage(wallet.provider)}>Sign Message</Button>
      )}

      {signature && <Text>{signature}</Text>}
    </View>
  );
}