Compare commits

...

3 Commits

8 changed files with 316 additions and 56 deletions

View File

@@ -1,54 +1,30 @@
{
"expo": {
"name": "TBBANK ONLINE",
"slug": "tbbank-online",
"name": "temp-expo",
"slug": "temp-expo",
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/icon.png",
"userInterfaceStyle": "light",
"newArchEnabled": true,
"splash": {
"image": "./assets/splash-icon.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"ios": {
"supportsTablet": true,
"statusBar": {
"barStyle": "dark-content"
}
"supportsTablet": true
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#17b69b"
},
"edgeToEdgeEnabled": true,
"package": "com.nurmuhammet.ali.tbbankonline",
"statusBar": {
"barStyle": "dark-content",
"backgroundColor": "#ffffff"
}
},
"web": {
"favicon": "./assets/favicon.png"
},
"extra": {
"eas": {
"projectId": "280bed78-9335-4b73-a686-15a9f726a7ad"
}
},
"plugins": [
"expo-font",
[
"expo-splash-screen",
{
"backgroundColor": "#ffffff",
"image": "./assets/splash-icon.png",
"imageWidth": 200
}
],
"expo-system-ui"
"@config-plugins/react-native-pdf"
]
}
}

141
package-lock.json generated
View File

@@ -8,6 +8,7 @@
"name": "temp-expo",
"version": "1.0.0",
"dependencies": {
"@config-plugins/react-native-pdf": "^11.0.0",
"@expo/vector-icons": "^14.1.0",
"@react-native-async-storage/async-storage": "2.1.2",
"@react-native-community/datetimepicker": "8.4.1",
@@ -16,19 +17,24 @@
"@react-navigation/native": "^7.1.14",
"@react-navigation/stack": "^7.4.2",
"expo": "53.0.22",
"expo-file-system": "~18.1.11",
"expo-font": "~13.3.2",
"expo-image-picker": "~16.1.4",
"expo-media-library": "~17.1.7",
"expo-splash-screen": "^31.0.8",
"expo-status-bar": "~2.2.3",
"expo-system-ui": "~5.0.11",
"react": "19.0.0",
"react-native": "0.79.5",
"react-native-confirmation-code-field": "^8.0.1",
"react-native-gesture-handler": "~2.24.0",
"react-native-modal-datetime-picker": "^15.0.1",
"react-native-pdf": "^6.7.7",
"react-native-safe-area-context": "5.4.0",
"react-native-screens": "^4.11.1",
"react-native-svg": "15.11.2",
"react-native-webview": "13.13.5"
"react-native-webview": "13.13.5",
"rn-fetch-blob": "^0.12.0"
},
"devDependencies": {
"@babel/core": "^7.20.0"
@@ -1406,6 +1412,14 @@
"node": ">=6.9.0"
}
},
"node_modules/@config-plugins/react-native-pdf": {
"version": "11.0.0",
"resolved": "https://registry.npmjs.org/@config-plugins/react-native-pdf/-/react-native-pdf-11.0.0.tgz",
"integrity": "sha512-zpGsZ2wMly37WgIJ0CVWOZHmdtM98j33VUeHAFQMM9hzxANZsG/BmoPLp0AOqIENmucxif//pESUgF8aMiiqmA==",
"peerDependencies": {
"expo": "^53"
}
},
"node_modules/@egjs/hammerjs": {
"version": "2.0.17",
"resolved": "https://registry.npmjs.org/@egjs/hammerjs/-/hammerjs-2.0.17.tgz",
@@ -2568,6 +2582,11 @@
"node": ">=18"
}
},
"node_modules/@react-native/normalize-color": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/@react-native/normalize-color/-/normalize-color-2.1.0.tgz",
"integrity": "sha512-Z1jQI2NpdFJCVgpY+8Dq/Bt3d+YUi1928Q+/CZm/oh66fzM0RUl54vvuXlPJKybH4pdCZey1eDTPaLHkMPNgWA=="
},
"node_modules/@react-native/normalize-colors": {
"version": "0.79.5",
"resolved": "https://registry.npmjs.org/@react-native/normalize-colors/-/normalize-colors-0.79.5.tgz",
@@ -3150,6 +3169,11 @@
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
},
"node_modules/base-64": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/base-64/-/base-64-0.1.0.tgz",
"integrity": "sha512-Y5gU45svrR5tI2Vt/X9GPd3L0HNIKzGu202EjxrXMpuc2V2CiKgemAbUUsqYmZJvPtCXoUKjNZwBJzsNScUbXA=="
},
"node_modules/base64-js": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
@@ -3708,6 +3732,11 @@
"node": ">= 8"
}
},
"node_modules/crypto-js": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
"integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
},
"node_modules/crypto-random-string": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-2.0.0.tgz",
@@ -3829,6 +3858,16 @@
"node": ">= 0.8"
}
},
"node_modules/deprecated-react-native-prop-types": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/deprecated-react-native-prop-types/-/deprecated-react-native-prop-types-2.3.0.tgz",
"integrity": "sha512-pWD0voFtNYxrVqvBMYf5gq3NA2GCpfodS1yNynTPc93AYA/KEMGeWDqqeUB6R2Z9ZofVhks2aeJXiuQqKNpesA==",
"dependencies": {
"@react-native/normalize-color": "*",
"invariant": "*",
"prop-types": "*"
}
},
"node_modules/destroy": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
@@ -4168,6 +4207,15 @@
"react": "*"
}
},
"node_modules/expo-media-library": {
"version": "17.1.7",
"resolved": "https://registry.npmjs.org/expo-media-library/-/expo-media-library-17.1.7.tgz",
"integrity": "sha512-hLCoMvlhjtt+iYxPe71P1F6t06mYGysuNOfjQzDbbf64PCkglCZJYmywPyUSV1V5Hu9DhRj//gEg+Ki+7VWXog==",
"peerDependencies": {
"expo": "*",
"react-native": "*"
}
},
"node_modules/expo-modules-autolinking": {
"version": "2.1.14",
"resolved": "https://registry.npmjs.org/expo-modules-autolinking/-/expo-modules-autolinking-2.1.14.tgz",
@@ -6733,6 +6781,37 @@
}
}
},
"node_modules/react-native-blob-util": {
"version": "0.22.2",
"resolved": "https://registry.npmjs.org/react-native-blob-util/-/react-native-blob-util-0.22.2.tgz",
"integrity": "sha512-Czx01QMg7aLsm/4F/7+eqoRAi1q/qjLY2Kao16g+n2SRnTH1+qkD8Qhx2q9okB+VNQvZKB1LbiXhktzYQV52xQ==",
"peer": true,
"dependencies": {
"base-64": "0.1.0",
"glob": "^10.3.10"
},
"peerDependencies": {
"react": "*",
"react-native": "*"
}
},
"node_modules/react-native-confirmation-code-field": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/react-native-confirmation-code-field/-/react-native-confirmation-code-field-8.0.1.tgz",
"integrity": "sha512-pwrhQtspFEp0y/gxZRp8hrra+UjAYfwAsW5Sn3yYtdUZVyRjAZPBnUb3rOc+z5L5o2ml03z5P3uvTK0yQwXsmA==",
"peerDependencies": {
"react": ">=16.4.0",
"react-native": ">=0.64.0"
},
"peerDependenciesMeta": {
"react": {
"optional": true
},
"react-native": {
"optional": true
}
}
},
"node_modules/react-native-edge-to-edge": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/react-native-edge-to-edge/-/react-native-edge-to-edge-1.6.0.tgz",
@@ -6777,6 +6856,20 @@
"react-native": ">=0.65.0"
}
},
"node_modules/react-native-pdf": {
"version": "6.7.7",
"resolved": "https://registry.npmjs.org/react-native-pdf/-/react-native-pdf-6.7.7.tgz",
"integrity": "sha512-D0ga/eyPsVWSPEBm622sGVZLl3gibxPmfm2cxsLcUrZ4WDSGR5HyGmvvWaR/m9wXEyIbD4J6q9qzuG6yObcSXw==",
"dependencies": {
"crypto-js": "4.2.0",
"deprecated-react-native-prop-types": "^2.3.0"
},
"peerDependencies": {
"react": "*",
"react-native": "*",
"react-native-blob-util": ">=0.13.7"
}
},
"node_modules/react-native-safe-area-context": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-5.4.0.tgz",
@@ -7148,6 +7241,52 @@
"node": "*"
}
},
"node_modules/rn-fetch-blob": {
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/rn-fetch-blob/-/rn-fetch-blob-0.12.0.tgz",
"integrity": "sha512-+QnR7AsJ14zqpVVUbzbtAjq0iI8c9tCg49tIoKO2ezjzRunN7YL6zFSFSWZm6d+mE/l9r+OeDM3jmb2tBb2WbA==",
"dependencies": {
"base-64": "0.1.0",
"glob": "7.0.6"
}
},
"node_modules/rn-fetch-blob/node_modules/brace-expansion": {
"version": "1.1.12",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
"integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
"dependencies": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
}
},
"node_modules/rn-fetch-blob/node_modules/glob": {
"version": "7.0.6",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
"integrity": "sha512-f8c0rE8JiCxpa52kWPAOa3ZaYEnzofDzCQLCn3Vdk0Z5OVLq3BsRFJI4S4ykpeVW6QMGBUkMeUpoEgWnMTnw5Q==",
"deprecated": "Glob versions prior to v9 are no longer supported",
"dependencies": {
"fs.realpath": "^1.0.0",
"inflight": "^1.0.4",
"inherits": "2",
"minimatch": "^3.0.2",
"once": "^1.3.0",
"path-is-absolute": "^1.0.0"
},
"engines": {
"node": "*"
}
},
"node_modules/rn-fetch-blob/node_modules/minimatch": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
"integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
"dependencies": {
"brace-expansion": "^1.1.7"
},
"engines": {
"node": "*"
}
},
"node_modules/safe-buffer": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",

View File

@@ -9,6 +9,7 @@
"web": "expo start --web"
},
"dependencies": {
"@config-plugins/react-native-pdf": "^11.0.0",
"@expo/vector-icons": "^14.1.0",
"@react-native-async-storage/async-storage": "2.1.2",
"@react-native-community/datetimepicker": "8.4.1",
@@ -17,19 +18,24 @@
"@react-navigation/native": "^7.1.14",
"@react-navigation/stack": "^7.4.2",
"expo": "53.0.22",
"expo-file-system": "~18.1.11",
"expo-font": "~13.3.2",
"expo-image-picker": "~16.1.4",
"expo-media-library": "~17.1.7",
"expo-splash-screen": "^31.0.8",
"expo-status-bar": "~2.2.3",
"expo-system-ui": "~5.0.11",
"react": "19.0.0",
"react-native": "0.79.5",
"react-native-confirmation-code-field": "^8.0.1",
"react-native-gesture-handler": "~2.24.0",
"react-native-modal-datetime-picker": "^15.0.1",
"react-native-pdf": "^6.7.7",
"react-native-safe-area-context": "5.4.0",
"react-native-screens": "^4.11.1",
"react-native-svg": "15.11.2",
"react-native-webview": "13.13.5",
"expo-system-ui": "~5.0.11"
"rn-fetch-blob": "^0.12.0"
},
"devDependencies": {
"@babel/core": "^7.20.0"

View File

@@ -104,13 +104,9 @@ const EditProfileModal = ({
}
// Card year validation (optional, 4 digits and reasonable year)
if (formData.card_year) {
const year = parseInt(formData.card_year.trim(), 10);
const currentYear = new Date().getFullYear();
if (!/^[0-9]{4}$/.test(formData.card_year.trim()) || year < currentYear - 10 || year > currentYear + 10) {
newErrors.card_year = `Ýyl ${currentYear - 10}-den ${currentYear + 10}-e çenli bolmaly`;
}
}
// if (formData.card_year) {
// }
setErrors(newErrors);
return Object.keys(newErrors).length === 0;

View File

@@ -25,6 +25,7 @@ import CardPinOrderDetailsScreen from '../screens/Card/CardPinOrderDetailsScreen
import CardOrdersScreen from '../screens/Card/CardOrdersScreen';
import CreateCardOrderScreen from '../screens/Card/CreateCardOrderScreen';
import CardOrderDetailsScreen from '../screens/Card/CardOrderDetailsScreen';
import PdfViewerScreen from '../screens/Shared/PdfViewerScreen';
const Stack = createStackNavigator();
@@ -54,6 +55,11 @@ const MenuNavigator = () => (
<Stack.Screen name="CardOrders" component={CardOrdersScreen} />
<Stack.Screen name="CreateCardOrder" component={CreateCardOrderScreen} />
<Stack.Screen name="CardOrderDetails" component={CardOrderDetailsScreen} />
<Stack.Screen
name="PdfViewer"
component={PdfViewerScreen}
options={{ headerShown: true }}
/>
</Stack.Navigator>
);

View File

@@ -16,15 +16,27 @@ import { StatusBar } from 'expo-status-bar';
import { useFocusEffect } from '@react-navigation/native';
import { useAuth } from '../../contexts/AuthContext';
import Button from '../../components/Button';
import Input from '../../components/Input';
import {
CodeField,
Cursor,
useBlurOnFulfill,
useClearByFocusCell,
} from 'react-native-confirmation-code-field';
import { COLORS } from '../../constants/colors';
const CELL_COUNT = 6;
const VerificationScreen = ({ navigation }) => {
const [code, setCode] = useState('');
const [countdown, setCountdown] = useState(60);
const [canResend, setCanResend] = useState(false);
const { verify, isLoading, pendingVerification, clearPendingVerification } = useAuth();
const countdownRef = useRef(null);
const ref = useBlurOnFulfill({ value: code, cellCount: CELL_COUNT });
const [props, getCellOnLayoutHandler] = useClearByFocusCell({
value: code,
setValue: setCode,
});
useEffect(() => {
if (!pendingVerification) {
@@ -74,18 +86,18 @@ const VerificationScreen = ({ navigation }) => {
}, 1000);
};
const handleVerify = async () => {
if (!code.trim()) {
const handleVerify = async (filledCode) => {
if (!filledCode.trim()) {
Alert.alert('Ýalňyşlyk', 'Tassyklama koduny giriziň');
return;
}
if (!/^\d{6}$/.test(code.trim())) {
if (!/^\d{6}$/.test(filledCode.trim())) {
Alert.alert('Ýalňyşlyk', 'Tassyklama kody 6 sanly bolmaly');
return;
}
const result = await verify(code.trim());
const result = await verify(filledCode.trim());
if (result.success) {
// Navigation will be handled by AuthContext
@@ -94,6 +106,8 @@ const VerificationScreen = ({ navigation }) => {
}
};
const handleVerifyWrapper = () => handleVerify(code);
const handleResendCode = async () => {
if (!canResend) return;
@@ -153,24 +167,29 @@ const VerificationScreen = ({ navigation }) => {
</View>
<View style={styles.formContainer}>
<Input
label="Tassyklama kody"
<CodeField
ref={ref}
{...props}
value={code}
onChangeText={setCode}
placeholder="123456"
keyboardType="numeric"
maxLength={6}
style={styles.codeInput}
textAlign="center"
returnKeyType="done"
onSubmitEditing={handleVerify}
cellCount={CELL_COUNT}
rootStyle={styles.otpContainer}
keyboardType="number-pad"
textContentType="oneTimeCode"
autoComplete="sms-otp"
renderCell={({ index, symbol, isFocused }) => (
<Text
key={index}
style={[styles.otpInput, isFocused && styles.otpInputHighlight]}
onLayout={getCellOnLayoutHandler(index)}>
{symbol || (isFocused ? <Cursor/> : null)}
</Text>
)}
onSubmitEditing={handleVerifyWrapper}
/>
<Button
title="Tassykla"
onPress={handleVerify}
onPress={handleVerifyWrapper}
loading={isLoading}
style={styles.verifyButton}
/>
@@ -259,10 +278,25 @@ const styles = StyleSheet.create({
formContainer: {
alignItems: 'center',
},
codeInput: {
width: '100%',
otpContainer: {
width: '90%',
marginBottom: 32,
},
otpInput: {
width: 45,
height: 60,
lineHeight: 58,
borderWidth: 1,
borderRadius: 12,
borderColor: COLORS.gray[300],
color: COLORS.textPrimary,
fontSize: 24,
fontWeight: 'bold',
textAlign: 'center',
},
otpInputHighlight: {
borderColor: COLORS.primary,
},
verifyButton: {
width: '100%',
marginBottom: 32,

View File

@@ -75,7 +75,7 @@ const CardTransactionOrderDetailsScreen = () => {
const res = await apiService.downloadCardTransactions(orderId, startDate, endDate);
setDownloading(false);
if (res.success && res.data?.url) {
Linking.openURL(res.data.url);
navigation.navigate('PdfViewer', { url: res.data.url, title: 'Card Transactions' });
setModalVisible(false);
} else {
Alert.alert('Ýalňyşlyk', res.data.message || 'Näsazlyk ýüze çykdy');

View File

@@ -0,0 +1,103 @@
import React, { useLayoutEffect, useState } from 'react';
import { View, TouchableOpacity, Text, StyleSheet, ActivityIndicator, Alert, Dimensions } from 'react-native';
import Pdf from 'react-native-pdf';
import { useNavigation, useRoute } from '@react-navigation/native';
import { Ionicons } from '@expo/vector-icons';
import * as MediaLibrary from 'expo-media-library';
import { COLORS } from '../../constants/colors';
const PdfViewerScreen = () => {
const navigation = useNavigation();
const route = useRoute();
const { url: pdfUrl, title = 'Document' } = route.params;
const [saving, setSaving] = useState(false);
const [cachedPdfPath, setCachedPdfPath] = useState(null);
const source = { uri: pdfUrl, cache: true };
const handleSavePdf = async () => {
if (!cachedPdfPath) {
Alert.alert('Error', 'PDF is not loaded yet. Please wait.');
return;
}
setSaving(true);
try {
const { status } = await MediaLibrary.requestPermissionsAsync();
if (status !== 'granted') {
Alert.alert('Permission required', 'We need permission to save files to your device.');
setSaving(false);
return;
}
const asset = await MediaLibrary.createAssetAsync(cachedPdfPath);
const album = await MediaLibrary.getAlbumAsync('Downloads');
if (album == null) {
await MediaLibrary.createAlbumAsync('Downloads', asset, false);
} else {
await MediaLibrary.addAssetsToAlbumAsync([asset], album, false);
}
Alert.alert('Saved!', 'PDF has been saved to your Downloads folder.');
} catch (error) {
console.error(error);
Alert.alert('Error', 'Could not save the PDF.');
} finally {
setSaving(false);
}
};
useLayoutEffect(() => {
navigation.setOptions({
title: title,
headerRight: () => (
saving ? (
<ActivityIndicator color={COLORS.primary} style={{ marginRight: 15 }}/>
) : (
<TouchableOpacity onPress={handleSavePdf} style={{ marginRight: 15 }}>
<Ionicons name="download-outline" size={24} color={COLORS.primary} />
</TouchableOpacity>
)
),
});
}, [navigation, saving, pdfUrl, title, cachedPdfPath]);
return (
<View style={styles.container}>
<Pdf
trustAllCerts={false}
source={source}
onLoadComplete={(numberOfPages, filePath) => {
setCachedPdfPath(filePath);
}}
onPageChanged={(page, numberOfPages) => {
// console.log(`Current page: ${page}`);
}}
onError={(error) => {
console.log(error);
Alert.alert('Error', 'Could not load the document.');
}}
onPressLink={(uri) => {
// console.log(`Link pressed: ${uri}`);
}}
style={styles.pdf}
/>
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'flex-start',
alignItems: 'center',
backgroundColor: '#f5f5f5',
},
pdf: {
flex: 1,
width: Dimensions.get('window').width,
height: Dimensions.get('window').height,
},
});
export default PdfViewerScreen;