Skip to main content

Status

The Status card displays the user's current Flex status and opens the Embedded Checkout when tapped.

Initialization​

Import and render FlexStatusCard in your component. It takes no props.

JSX
import { FlexStatusCard } from '@flexapp/flex-checkout-react-native'

function StatusScreen() {
  return (
    <View>
      <FlexStatusCard />
    </View>
  )
}
info

When the Status card CTA is tapped, it automatically opens checkout. Make sure you have registered a token provider with loadToken and configured checkout callbacks with useFlexCheckout before rendering the card.

JSX
import { FlexStatusCard, useFlexCheckout } from '@flexapp/flex-checkout-react-native'

function StatusScreen() {
  useFlexCheckout({
    onEvent: (event) => {},
  })

  return (
    <View>
      <FlexStatusCard />
    </View>
  )
}

Next Steps​

  • Configure Checkout callbacks to handle events and errors
  • Review the Installation guide for lifecycle management and error handling