omnipay-reactnative-sdk 1.2.0 → 1.2.1-beta.0

package/src/components/OmnipayProvider.tsx

@@ -19,6 +19,7 @@ import WebView, { WebViewMessageEvent } from 'react-native-webview';
 import { getContact } from '../functions';
 import Share from 'react-native-share';
 import AsyncStorage from '@react-native-async-storage/async-storage';
+import FaceVerification from './FaceVerification';
 
 const OmnipayActivity = NativeModules.OmnipayActivity || {};
 
@@ -66,8 +67,10 @@ type InitiateWalletType = {
   deviceName?: string;
   hideWalletTransfer?: boolean;
   isBvnValidationRequired?: boolean;
-  walletTab?: 'Paylater' | 'Account';
+  walletTab?: 'Paylater' | 'Account' | 'Omoni';
   sessionId?: string;
+  kycStatus?: 'verified' | 'unverified';
+  launchPage?: string;
 };
 
 export type OmnipayContextType = {
@@ -90,6 +93,8 @@ export type OmnipayContextType = {
     isBvnValidationRequired,
     walletTab,
     sessionId,
+    launchPage,
+    kycStatus,
   }: InitiateWalletType) => void;
 };
 
@@ -121,8 +126,16 @@ export const OmnipayProvider = ({
   const onCloseRef = useRef<(() => void) | undefined>(undefined);
   const [canUsePos, setCanUsePos] = useState(false);
 
+  // Face verification state
+  const [showFaceVerification, setShowFaceVerification] = useState(false);
+  const [faceVerificationOptions, setFaceVerificationOptions] =
+    useState<any>(null);
+
   useEffect(() => {
     checkPaymentApp();
+    setTimeout(() => {
+      setShowFaceVerification(true);
+    }, 5000);
   }, []);
 
   useEffect(() => {
@@ -221,7 +234,7 @@ export const OmnipayProvider = ({
 
   function getWebHost() {
     if (env === 'dev') {
-      return 'https://omnipay-websdk.vercel.app/';
+      return 'https://websdk-dev.ompy.ng/';
     }
     return 'https://websdk.ompy.ng/';
   }
@@ -274,6 +287,9 @@ export const OmnipayProvider = ({
         if (dataKey === 'startPosTransaction') {
           startPosTransaction(JSON.parse(dataValue));
         }
+        if (dataKey === 'startFaceVerification') {
+          startFaceVerification(dataValue ? JSON.parse(dataValue) : {});
+        }
       }
     } catch (error) {}
   }
@@ -319,6 +335,8 @@ export const OmnipayProvider = ({
     isBvnValidationRequired = false,
     walletTab = 'Account',
     sessionId = '',
+    kycStatus,
+    launchPage = 'wallet',
   }: InitiateWalletType) => {
     //prevent opening if it's already open
     if (visibilityRef.current) {
@@ -330,7 +348,9 @@ export const OmnipayProvider = ({
     const usesNativeShare = true;
 
     if (isPhoneNumberValid || isValidCustomerRef || isValidUserRef) {
-      const webUrl = `${webHost}?theme=${color}&view=wallet&publicKey=${publicKey}&phoneNumber=${phoneNumber}&usesPaylater=${usesPaylater}&usesPromo=${usesPromo}&usesAirtimeData=${usesAirtimeData}&usesTransfer=${usesTransfer}&usesBills=${usesBills}&usesPos=${usesPos}&customerRef=${customerRef}&userRef=${userRef}&promoBalanceOffset=${promoBalanceOffset}&deviceId=${deviceId}&deviceName=${deviceName}&hideWalletTransfer=${hideWalletTransfer}&bvnRequired=${isBvnValidationRequired}&usesNativeShare=${usesNativeShare}&isPosEnabled=${canUsePos}&walletTab=${walletTab}&sessionId=${sessionId}`;
+      const webUrl = `${webHost}?theme=${color}&view=wallet&publicKey=${publicKey}&phoneNumber=${phoneNumber}&usesPaylater=${usesPaylater}&usesPromo=${usesPromo}&usesAirtimeData=${usesAirtimeData}&usesTransfer=${usesTransfer}&usesBills=${usesBills}&usesPos=${usesPos}&customerRef=${customerRef}&userRef=${userRef}&promoBalanceOffset=${promoBalanceOffset}&deviceId=${deviceId}&deviceName=${deviceName}&hideWalletTransfer=${hideWalletTransfer}&bvnRequired=${isBvnValidationRequired}&usesNativeShare=${usesNativeShare}&isPosEnabled=${canUsePos}&walletTab=${walletTab}&sessionId=${sessionId}&kycStatus=${
+        kycStatus || ''
+      }&launchPage=${launchPage}`;
       setWebviewUrl(webUrl);
       setIsVisible(true);
       onCloseRef.current = onClose;
@@ -353,6 +373,44 @@ export const OmnipayProvider = ({
     }
   }
 
+  function startFaceVerification(options: any) {
+    setFaceVerificationOptions(options);
+    setShowFaceVerification(true);
+  }
+
+  function handleFaceVerificationSuccess(base64Image: string) {
+    setShowFaceVerification(false);
+    postMessage({
+      dataKey: 'faceVerificationComplete',
+      dataValue: {
+        success: true,
+        image: base64Image,
+        ...(faceVerificationOptions || {}),
+      },
+    });
+  }
+
+  function handleFaceVerificationFailure() {
+    setShowFaceVerification(false);
+    postMessage({
+      dataKey: 'faceVerificationComplete',
+      dataValue: {
+        success: false,
+        error: 'Face verification failed',
+      },
+    });
+  }
+
+  function handleFaceVerificationCancel() {
+    setShowFaceVerification(false);
+    postMessage({
+      dataKey: 'faceVerificationCancelled',
+      dataValue: {
+        cancelled: true,
+      },
+    });
+  }
+
   const webviewStyle = getWebviewStyle();
   const isPropsValid = isValidColor && !!publicKey && isValidEnv;
   const isWalletView = webviewUrl.includes('view=wallet');
@@ -445,6 +503,21 @@ export const OmnipayProvider = ({
               </TouchableOpacity>
             </Modal>
           )}
+
+          {/* Face Verification Modal */}
+          <Modal
+            visible={showFaceVerification}
+            transparent
+            animationType="slide"
+          >
+            <View style={styles.faceVerificationContainer}>
+              <FaceVerification
+                onSuccess={handleFaceVerificationSuccess}
+                onFailure={handleFaceVerificationFailure}
+                onCancel={handleFaceVerificationCancel}
+              />
+            </View>
+          </Modal>
         </>
       )}
       {children}
@@ -567,4 +640,8 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
   },
   buttonText: { color: 'white', fontSize: 16, paddingHorizontal: 30 },
+  faceVerificationContainer: {
+    flex: 1,
+    backgroundColor: 'white',
+  },
 });

package/src/types/faceVerification.ts

@@ -0,0 +1,27 @@
+export interface FaceVerificationOptions {
+  customData?: Record<string, any>;
+}
+
+export interface FaceVerificationResult {
+  success: boolean;
+  image?: string;
+  error?: string;
+  customData?: Record<string, any>;
+}
+
+export interface FaceVerificationCancelledResult {
+  cancelled: boolean;
+}
+
+export type FaceVerificationMessageType =
+  | 'startFaceVerification'
+  | 'faceVerificationComplete'
+  | 'faceVerificationCancelled';
+
+export interface FaceVerificationMessage {
+  dataKey: FaceVerificationMessageType;
+  dataValue:
+    | FaceVerificationOptions
+    | FaceVerificationResult
+    | FaceVerificationCancelledResult;
+}

package/src/types/index.ts

@@ -0,0 +1 @@
+export * from './faceVerification';