Refactor VerificationScreen to include KeyboardAvoidingView for improved keyboard handling; update text in CardTransactionOrderDetailsScreen for better localization.
This commit is contained in:
@@ -10,6 +10,7 @@ import {
|
|||||||
Keyboard,
|
Keyboard,
|
||||||
BackHandler,
|
BackHandler,
|
||||||
Platform,
|
Platform,
|
||||||
|
KeyboardAvoidingView,
|
||||||
} from 'react-native';
|
} from 'react-native';
|
||||||
import { StatusBar } from 'expo-status-bar';
|
import { StatusBar } from 'expo-status-bar';
|
||||||
import { useFocusEffect } from '@react-navigation/native';
|
import { useFocusEffect } from '@react-navigation/native';
|
||||||
@@ -134,54 +135,61 @@ const VerificationScreen = ({ navigation }) => {
|
|||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
<TouchableWithoutFeedback onPress={Keyboard.dismiss}>
|
<KeyboardAvoidingView
|
||||||
<View style={styles.content}>
|
style={{ flex: 1 }}
|
||||||
<View style={styles.logoContainer}>
|
behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
|
||||||
<View style={styles.verificationIcon}>
|
>
|
||||||
<Text style={styles.verificationIconText}>✓</Text>
|
<TouchableWithoutFeedback onPress={Keyboard.dismiss}>
|
||||||
|
<View style={styles.content}>
|
||||||
|
<View style={styles.logoContainer}>
|
||||||
|
<View style={styles.verificationIcon}>
|
||||||
|
<Text style={styles.verificationIconText}>✓</Text>
|
||||||
|
</View>
|
||||||
|
<Text style={styles.title}>Tassyklama</Text>
|
||||||
|
<Text style={styles.subtitle}>
|
||||||
|
{formatPhoneNumber(pendingVerification.phone)} belgisine iberilen
|
||||||
|
6 sanly tassyklama koduny giriziň
|
||||||
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text style={styles.title}>Tassyklama</Text>
|
|
||||||
<Text style={styles.subtitle}>
|
|
||||||
{formatPhoneNumber(pendingVerification.phone)} belgisine iberilen
|
|
||||||
6 sanly tassyklama koduny giriziň
|
|
||||||
</Text>
|
|
||||||
</View>
|
|
||||||
|
|
||||||
<View style={styles.formContainer}>
|
<View style={styles.formContainer}>
|
||||||
<Input
|
<Input
|
||||||
label="Tassyklama kody"
|
label="Tassyklama kody"
|
||||||
value={code}
|
value={code}
|
||||||
onChangeText={setCode}
|
onChangeText={setCode}
|
||||||
placeholder="123456"
|
placeholder="123456"
|
||||||
keyboardType="numeric"
|
keyboardType="numeric"
|
||||||
maxLength={6}
|
maxLength={6}
|
||||||
style={styles.codeInput}
|
style={styles.codeInput}
|
||||||
textAlign="center"
|
textAlign="center"
|
||||||
returnKeyType="done"
|
returnKeyType="done"
|
||||||
onSubmitEditing={handleVerify}
|
onSubmitEditing={handleVerify}
|
||||||
/>
|
textContentType="oneTimeCode"
|
||||||
|
autoComplete="sms-otp"
|
||||||
|
/>
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
title="Tassykla"
|
title="Tassykla"
|
||||||
onPress={handleVerify}
|
onPress={handleVerify}
|
||||||
loading={isLoading}
|
loading={isLoading}
|
||||||
style={styles.verifyButton}
|
style={styles.verifyButton}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<View style={styles.resendContainer}>
|
<View style={styles.resendContainer}>
|
||||||
{canResend ? (
|
{canResend ? (
|
||||||
<TouchableOpacity onPress={handleResendCode}>
|
<TouchableOpacity onPress={handleResendCode}>
|
||||||
<Text style={styles.resendText}>Kodu gaýtadan iber</Text>
|
<Text style={styles.resendText}>Kodu gaýtadan iber</Text>
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
) : (
|
) : (
|
||||||
<Text style={styles.countdownText}>
|
<Text style={styles.countdownText}>
|
||||||
Gaýtadan ibermek üçin {countdown} sekunt garaşyň
|
Gaýtadan ibermek üçin {countdown} sekunt garaşyň
|
||||||
</Text>
|
</Text>
|
||||||
)}
|
)}
|
||||||
|
</View>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</TouchableWithoutFeedback>
|
||||||
</TouchableWithoutFeedback>
|
</KeyboardAvoidingView>
|
||||||
</SafeAreaView>
|
</SafeAreaView>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -93,7 +93,7 @@ const CardTransactionOrderDetailsScreen = () => {
|
|||||||
if (!order) {
|
if (!order) {
|
||||||
return (
|
return (
|
||||||
<View style={styles.centered}>
|
<View style={styles.centered}>
|
||||||
<Text>No data</Text>
|
<Text>Maglumat tapylmady</Text>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user