React Native SDK

npm install @truv/react-native

yarn add @truv/react-native

cd ios && pod install

import { FC } from 'react';
import { StyleSheet, View } from 'react-native';
import { TruvOrder, TruvEventPayload, TruvOrderEventPayload } from '@truv/react-native';

const OrderScreen: FC<{ bridgeToken: string }> = ({ bridgeToken }) => {
  return (
    <TruvOrder
      bridgeToken={bridgeToken}
      style={styles.order}
      onOrderEvent={(payload: TruvOrderEventPayload) => {
        switch (payload.eventType) {
          case "LOAD":
            // Order page finished loading
            break;

          case "CLOSE":
            // User closed the Order
            break;

          case "SUCCESS":
            // A task within the Order completed successfully.
            // The Order is still open at this point — it may show
            // a success screen or a self-certification screen
            // depending on the configuration.
            break;

          case "COMPLETED":
            // The entire Order is complete (all tasks finished)
            break;
        }
      }}
      onWidgetEvent={(payload: TruvEventPayload) => {
        // Fired when the user interacts with the Bridge for a
        // sub-order (task) within the Order.
        // Equivalent to TruvBridge onEvent.
      }}
    />
  );
};

const styles = StyleSheet.create({
  order: { flex: 1 },
});

import { FC } from 'react';
import { StyleSheet, View } from 'react-native';
import TruvBridge, { TruvEventPayload, TruvSuccessPayload } from '@truv/react-native';

const BridgeScreen: FC<{ bridgeToken: string }> = ({ bridgeToken }) => {
  return (
    <TruvBridge
      bridgeToken={bridgeToken}
      style={styles.bridge}
      onLoad={() => {
        // Bridge finished loading
      }}
      onClose={() => {
        // User closed the Bridge
      }}
      onSuccess={(payload: TruvSuccessPayload) => {
        // Called when the Bridge closes after a successful task.
        // payload.publicToken — use this to retrieve data server-side.
        // payload.metadata.taskId — the task identifier.
      }}
      onEvent={(payload: TruvEventPayload) => {
        // Lifecycle event — see Bridge Events for all types.
        // payload.eventType — one of TruvEventType enum values
      }}
    />
  );
};

const styles = StyleSheet.create({
  bridge: { flex: 1 },
});