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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/README.md +153 -31
  2. package/lib/commonjs/components/FaceVerification.js +755 -0
  3. package/lib/commonjs/components/FaceVerification.js.map +1 -0
  4. package/lib/commonjs/components/OmnipayProvider.js +65 -4
  5. package/lib/commonjs/components/OmnipayProvider.js.map +1 -1
  6. package/lib/commonjs/types/faceVerification.js +2 -0
  7. package/lib/commonjs/types/faceVerification.js.map +1 -0
  8. package/lib/commonjs/types/index.js +17 -0
  9. package/lib/commonjs/types/index.js.map +1 -0
  10. package/lib/module/components/FaceVerification.js +746 -0
  11. package/lib/module/components/FaceVerification.js.map +1 -0
  12. package/lib/module/components/OmnipayProvider.js +65 -4
  13. package/lib/module/components/OmnipayProvider.js.map +1 -1
  14. package/lib/module/types/faceVerification.js +2 -0
  15. package/lib/module/types/faceVerification.js.map +1 -0
  16. package/lib/module/types/index.js +2 -0
  17. package/lib/module/types/index.js.map +1 -0
  18. package/lib/typescript/components/FaceVerification.d.ts +10 -0
  19. package/lib/typescript/components/FaceVerification.d.ts.map +1 -0
  20. package/lib/typescript/components/OmnipayProvider.d.ts +5 -3
  21. package/lib/typescript/components/OmnipayProvider.d.ts.map +1 -1
  22. package/lib/typescript/components/OmnipayView.d.ts +2 -0
  23. package/lib/typescript/components/OmnipayView.d.ts.map +1 -1
  24. package/lib/typescript/components/views/BvnVerification.d.ts +2 -0
  25. package/lib/typescript/components/views/BvnVerification.d.ts.map +1 -1
  26. package/lib/typescript/components/views/PaylaterAgreement.d.ts +2 -0
  27. package/lib/typescript/components/views/PaylaterAgreement.d.ts.map +1 -1
  28. package/lib/typescript/components/views/Registration.d.ts +2 -0
  29. package/lib/typescript/components/views/Registration.d.ts.map +1 -1
  30. package/lib/typescript/hooks/useOmnipay.d.ts +5 -3
  31. package/lib/typescript/hooks/useOmnipay.d.ts.map +1 -1
  32. package/lib/typescript/types/faceVerification.d.ts +18 -0
  33. package/lib/typescript/types/faceVerification.d.ts.map +1 -0
  34. package/lib/typescript/types/index.d.ts +2 -0
  35. package/lib/typescript/types/index.d.ts.map +1 -0
  36. package/package.json +10 -4
  37. package/src/components/FaceVerification.tsx +884 -0
  38. package/src/components/OmnipayProvider.tsx +81 -4
  39. package/src/types/faceVerification.ts +27 -0
  40. package/src/types/index.ts +1 -0
@@ -19,6 +19,7 @@ import WebView, { WebViewMessageEvent } from 'react-native-webview';
19
19
  import { getContact } from '../functions';
20
20
  import Share from 'react-native-share';
21
21
  import AsyncStorage from '@react-native-async-storage/async-storage';
22
+ import FaceVerification from './FaceVerification';
22
23
 
23
24
  const OmnipayActivity = NativeModules.OmnipayActivity || {};
24
25
 
@@ -66,8 +67,10 @@ type InitiateWalletType = {
66
67
  deviceName?: string;
67
68
  hideWalletTransfer?: boolean;
68
69
  isBvnValidationRequired?: boolean;
69
- walletTab?: 'Paylater' | 'Account';
70
- sessionId: string;
70
+ walletTab?: 'Paylater' | 'Account' | 'Omoni';
71
+ sessionId?: string;
72
+ kycStatus?: 'verified' | 'unverified';
73
+ launchPage?: string;
71
74
  };
72
75
 
73
76
  export type OmnipayContextType = {
@@ -90,6 +93,8 @@ export type OmnipayContextType = {
90
93
  isBvnValidationRequired,
91
94
  walletTab,
92
95
  sessionId,
96
+ launchPage,
97
+ kycStatus,
93
98
  }: InitiateWalletType) => void;
94
99
  };
95
100
 
@@ -121,8 +126,16 @@ export const OmnipayProvider = ({
121
126
  const onCloseRef = useRef<(() => void) | undefined>(undefined);
122
127
  const [canUsePos, setCanUsePos] = useState(false);
123
128
 
129
+ // Face verification state
130
+ const [showFaceVerification, setShowFaceVerification] = useState(false);
131
+ const [faceVerificationOptions, setFaceVerificationOptions] =
132
+ useState<any>(null);
133
+
124
134
  useEffect(() => {
125
135
  checkPaymentApp();
136
+ setTimeout(() => {
137
+ setShowFaceVerification(true);
138
+ }, 5000);
126
139
  }, []);
127
140
 
128
141
  useEffect(() => {
@@ -221,7 +234,7 @@ export const OmnipayProvider = ({
221
234
 
222
235
  function getWebHost() {
223
236
  if (env === 'dev') {
224
- return 'https://omnipay-websdk.vercel.app/';
237
+ return 'https://websdk-dev.ompy.ng/';
225
238
  }
226
239
  return 'https://websdk.ompy.ng/';
227
240
  }
@@ -274,6 +287,9 @@ export const OmnipayProvider = ({
274
287
  if (dataKey === 'startPosTransaction') {
275
288
  startPosTransaction(JSON.parse(dataValue));
276
289
  }
290
+ if (dataKey === 'startFaceVerification') {
291
+ startFaceVerification(dataValue ? JSON.parse(dataValue) : {});
292
+ }
277
293
  }
278
294
  } catch (error) {}
279
295
  }
@@ -319,6 +335,8 @@ export const OmnipayProvider = ({
319
335
  isBvnValidationRequired = false,
320
336
  walletTab = 'Account',
321
337
  sessionId = '',
338
+ kycStatus,
339
+ launchPage = 'wallet',
322
340
  }: InitiateWalletType) => {
323
341
  //prevent opening if it's already open
324
342
  if (visibilityRef.current) {
@@ -330,7 +348,9 @@ export const OmnipayProvider = ({
330
348
  const usesNativeShare = true;
331
349
 
332
350
  if (isPhoneNumberValid || isValidCustomerRef || isValidUserRef) {
333
- 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}`;
351
+ 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=${
352
+ kycStatus || ''
353
+ }&launchPage=${launchPage}`;
334
354
  setWebviewUrl(webUrl);
335
355
  setIsVisible(true);
336
356
  onCloseRef.current = onClose;
@@ -353,6 +373,44 @@ export const OmnipayProvider = ({
353
373
  }
354
374
  }
355
375
 
376
+ function startFaceVerification(options: any) {
377
+ setFaceVerificationOptions(options);
378
+ setShowFaceVerification(true);
379
+ }
380
+
381
+ function handleFaceVerificationSuccess(base64Image: string) {
382
+ setShowFaceVerification(false);
383
+ postMessage({
384
+ dataKey: 'faceVerificationComplete',
385
+ dataValue: {
386
+ success: true,
387
+ image: base64Image,
388
+ ...(faceVerificationOptions || {}),
389
+ },
390
+ });
391
+ }
392
+
393
+ function handleFaceVerificationFailure() {
394
+ setShowFaceVerification(false);
395
+ postMessage({
396
+ dataKey: 'faceVerificationComplete',
397
+ dataValue: {
398
+ success: false,
399
+ error: 'Face verification failed',
400
+ },
401
+ });
402
+ }
403
+
404
+ function handleFaceVerificationCancel() {
405
+ setShowFaceVerification(false);
406
+ postMessage({
407
+ dataKey: 'faceVerificationCancelled',
408
+ dataValue: {
409
+ cancelled: true,
410
+ },
411
+ });
412
+ }
413
+
356
414
  const webviewStyle = getWebviewStyle();
357
415
  const isPropsValid = isValidColor && !!publicKey && isValidEnv;
358
416
  const isWalletView = webviewUrl.includes('view=wallet');
@@ -445,6 +503,21 @@ export const OmnipayProvider = ({
445
503
  </TouchableOpacity>
446
504
  </Modal>
447
505
  )}
506
+
507
+ {/* Face Verification Modal */}
508
+ <Modal
509
+ visible={showFaceVerification}
510
+ transparent
511
+ animationType="slide"
512
+ >
513
+ <View style={styles.faceVerificationContainer}>
514
+ <FaceVerification
515
+ onSuccess={handleFaceVerificationSuccess}
516
+ onFailure={handleFaceVerificationFailure}
517
+ onCancel={handleFaceVerificationCancel}
518
+ />
519
+ </View>
520
+ </Modal>
448
521
  </>
449
522
  )}
450
523
  {children}
@@ -567,4 +640,8 @@ const styles = StyleSheet.create({
567
640
  justifyContent: 'center',
568
641
  },
569
642
  buttonText: { color: 'white', fontSize: 16, paddingHorizontal: 30 },
643
+ faceVerificationContainer: {
644
+ flex: 1,
645
+ backgroundColor: 'white',
646
+ },
570
647
  });
@@ -0,0 +1,27 @@
1
+ export interface FaceVerificationOptions {
2
+ customData?: Record<string, any>;
3
+ }
4
+
5
+ export interface FaceVerificationResult {
6
+ success: boolean;
7
+ image?: string;
8
+ error?: string;
9
+ customData?: Record<string, any>;
10
+ }
11
+
12
+ export interface FaceVerificationCancelledResult {
13
+ cancelled: boolean;
14
+ }
15
+
16
+ export type FaceVerificationMessageType =
17
+ | 'startFaceVerification'
18
+ | 'faceVerificationComplete'
19
+ | 'faceVerificationCancelled';
20
+
21
+ export interface FaceVerificationMessage {
22
+ dataKey: FaceVerificationMessageType;
23
+ dataValue:
24
+ | FaceVerificationOptions
25
+ | FaceVerificationResult
26
+ | FaceVerificationCancelledResult;
27
+ }
@@ -0,0 +1 @@
1
+ export * from './faceVerification';