优化

components/WalletBindComponents.tsx

@@ -1,4 +1,4 @@
-import React, { Component, useState } from 'react';
+import React, { Component, useState, useEffect } from 'react';
 import { View, Text, TextInput, TouchableOpacity, StyleSheet, ActivityIndicator } from 'react-native';
 import { WalletType, FreechargePersonalBindResult, MobikwikPersonalBindResult, PaytmPersonalBindResult, PhonePePersonalBindResult, BharatPeBusinessBindResult, PaytmBusinessBindResult } from 'rnwalletman';
 import { OTPBindUI } from './OTPBindUI';
@@ -9,6 +9,7 @@ export class FreeChargeBind extends Component<{
     onSuccess: (result: FreechargePersonalBindResult) => void;
     onError: (error: string) => void;
     isDebug: boolean;
+    initialMobile?: string;
 }> {
     render() {
         return (
@@ -21,6 +22,7 @@ export class FreeChargeBind extends Component<{
                 onSuccess={this.props.onSuccess}
                 onError={this.props.onError}
                 isDebug={this.props.isDebug}
+                initialMobile={this.props.initialMobile}
             />
         );
     }
@@ -34,6 +36,7 @@ export class MobikwikOTPBind extends Component<{
     isDebug: boolean;
     deviceId: string;
     tuneUserId: string;
+    initialMobile?: string;
 }> {
     render() {
         return (
@@ -50,6 +53,7 @@ export class MobikwikOTPBind extends Component<{
                     deviceId: this.props.deviceId,
                     tuneUserId: this.props.tuneUserId,
                 }}
+                initialMobile={this.props.initialMobile}
             />
         );
     }
@@ -61,6 +65,7 @@ export class PayTmPersonalOTPBind extends Component<{
     onSuccess: (result: PaytmPersonalBindResult) => void;
     onError: (error: string) => void;
     isDebug: boolean;
+    initialMobile?: string;
 }> {
     render() {
         return (
@@ -73,6 +78,7 @@ export class PayTmPersonalOTPBind extends Component<{
                 onSuccess={this.props.onSuccess}
                 onError={this.props.onError}
                 isDebug={this.props.isDebug}
+                initialMobile={this.props.initialMobile}
             />
         );
     }
@@ -84,6 +90,7 @@ export class BharatPeBusinessOTPBind extends Component<{
     onSuccess: (result: BharatPeBusinessBindResult) => void;
     onError: (error: string) => void;
     isDebug: boolean;
+    initialMobile?: string;
 }> {
     render() {
         return (
@@ -96,6 +103,7 @@ export class BharatPeBusinessOTPBind extends Component<{
                 onSuccess={this.props.onSuccess}
                 onError={this.props.onError}
                 isDebug={this.props.isDebug}
+                initialMobile={this.props.initialMobile}
             />
         );
     }
@@ -107,6 +115,7 @@ export class PaytmBusinessOTPBind extends Component<{
     onSuccess: (result: PaytmBusinessBindResult) => void;
     onError: (error: string) => void;
     isDebug: boolean;
+    initialMobile?: string;
 }> {
     render() {
         return (
@@ -116,25 +125,31 @@ export class PaytmBusinessOTPBind extends Component<{
                 onSuccess={this.props.onSuccess}
                 onError={this.props.onError}
                 isDebug={this.props.isDebug}
+                initialMobile={this.props.initialMobile}
             />
         );
     }
 }
 
-function PaytmBusinessForm({ onRequestOTP, onVerifyOTP, onSuccess, onError, isDebug }: {
+function PaytmBusinessForm({ onRequestOTP, onVerifyOTP, onSuccess, onError, isDebug, initialMobile = '' }: {
     onRequestOTP: (walletType: WalletType, params: any) => Promise<any>;
     onVerifyOTP: (walletType: WalletType, params: any) => Promise<any>;
     onSuccess: (result: PaytmBusinessBindResult) => void;
     onError: (error: string) => void;
     isDebug: boolean;
+    initialMobile?: string;
 }) {
     const [step, setStep] = useState<'credentials' | 'otp'>('credentials');
-    const [mobile, setMobile] = useState('');
+    const [mobile, setMobile] = useState(initialMobile);
     const [otp, setOtp] = useState('');
     const [sessionToken, setSessionToken] = useState('');
     const [loading, setLoading] = useState(false);
     const [errorMsg, setErrorMsg] = useState('');
 
+    useEffect(() => {
+        if (initialMobile) setMobile(initialMobile);
+    }, [initialMobile]);
+
     const log = (...args: any[]) => { if (isDebug) console.log('[PaytmBusiness]', ...args); };
 
     const handleRequestOTP = async () => {
@@ -220,6 +235,7 @@ export class PhonePePersonalOTPBind extends Component<{
     onSuccess: (result: PhonePePersonalBindResult) => void;
     onError: (error: string) => void;
     isDebug: boolean;
+    initialMobile?: string;
 }> {
     render() {
         return (
@@ -232,6 +248,7 @@ export class PhonePePersonalOTPBind extends Component<{
                 onSuccess={this.props.onSuccess}
                 onError={this.props.onError}
                 isDebug={this.props.isDebug}
+                initialMobile={this.props.initialMobile}
             />
         );
     }