Refactor VerificationScreen to include KeyboardAvoidingView for improved keyboard handling; update text in CardTransactionOrderDetailsScreen for better localization.

This commit is contained in:
2025-09-11 15:28:40 +05:00
parent 27f43a77fd
commit a41851dfcc
2 changed files with 51 additions and 43 deletions

View File

@@ -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>
); );
}; };

View File

@@ -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>
); );
} }