code snippet 2.javascript

import React from "react";
import { View, Button, Text } from "react-native";
import { presentIdentityVerificationSheet } from "@stripe/stripe-identity-react-native";

const fetchVerificationSessionParams = async () => {
 //  same implementation as in function component
};

const fetchOptions = async () => {
 //  same implementation as in function component
};

class VerifyScreen extends React.Component {
 constructor(props) {
   super(props);
   this.state = { loading: false, status: undefined, error: undefined };
 }

 present = async () => {
   // without provided hooks implementation user has to manage error and loading states manually
   this.setState({ loading: true });
   const options = await fetchOptions();
   this.setState({ loading: false });
   const { status, error } = await presentIdentityVerificationSheet(options);
   this.setState({ status, error });
 };

 render() {
   return (
     <View>
       <View>
         {this.state.loading ? (
           <View>
             <Text>Loading...</Text>
           </View>
         ) : (
           <Button title="Verify Identity" onPress={this.present} />
         )}
       </View>
       <Text>Status: {this.state.status}</Text>
     </View>
   );
 }
}