diff --git a/app/(tabs)/services.tsx b/app/(tabs)/services.tsx index bfea57a..9c59ec2 100644 --- a/app/(tabs)/services.tsx +++ b/app/(tabs)/services.tsx @@ -1,20 +1,31 @@ -import { StyleSheet, SafeAreaView, FlatList, View } from 'react-native'; +import { StyleSheet, SafeAreaView, View, TouchableOpacity } from 'react-native'; import { Text } from '@/components/Themed'; import i18n from '@/i18n'; import { FontAwesome5 } from '@expo/vector-icons'; import ServiceCard from '@/components/ServiceCard'; +import React, { useState } from 'react'; +import CurrencyConverterModal from '@/components/CurrencyConverterModal'; export default function ServicesScreen() { + const [modalVisible, setModalVisible] = useState(false); + return ( {i18n.t('services')} - } /> + setModalVisible(true)}> + } /> + + } /> } /> } /> + setModalVisible(false)} + /> ); } diff --git a/components/CurrencyConverterModal.tsx b/components/CurrencyConverterModal.tsx new file mode 100644 index 0000000..71a3918 --- /dev/null +++ b/components/CurrencyConverterModal.tsx @@ -0,0 +1,125 @@ +import React, { useState } from 'react'; +import { View, Text, TextInput, Modal, StyleSheet, TouchableOpacity, KeyboardAvoidingView, Platform } from 'react-native'; +import { FontAwesome } from '@expo/vector-icons'; +import i18n from '@/i18n'; + +interface CurrencyConverterModalProps { + visible: boolean; + onClose: () => void; +} + +const CurrencyConverterModal: React.FC = ({ visible, onClose }) => { + const [sar, setSar] = useState(''); + const [tmt, setTmt] = useState(''); + const USD_TO_SAR = '3.70'; + const USD_TO_TMT = '19.5'; + + const handleSarChange = (value: string) => { + setSar(value); + + if (value) { + const tmtValue = ((Number(value) / Number(USD_TO_SAR)) * Number(USD_TO_TMT)).toFixed(2); + setTmt(tmtValue); + } else { + setTmt(''); + } + }; + + return ( + + + + + + + {i18n.t('currencyConverter')} + + + Riyal + + + + + Manat + {tmt || '0.00'} + + + + + + ); +}; + +const styles = StyleSheet.create({ + centeredView: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + backgroundColor: 'rgba(0,0,0,0.5)', + }, + modalView: { + margin: 20, + backgroundColor: 'white', + borderRadius: 20, + padding: 35, + alignItems: 'center', + shadowColor: '#000', + shadowOffset: { + width: 0, + height: 2, + }, + shadowOpacity: 0.25, + shadowRadius: 4, + elevation: 5, + width: '80%', + }, + closeButton: { + position: 'absolute', + right: 15, + top: 15, + }, + modalTitle: { + fontSize: 20, + fontWeight: 'bold', + marginBottom: 20, + }, + inputContainer: { + flexDirection: 'row', + alignItems: 'center', + marginBottom: 15, + width: '100%', + }, + currencyLabel: { + fontSize: 18, + marginRight: 10, + width: 60, + }, + input: { + borderBottomWidth: 1, + borderBottomColor: '#ccc', + fontSize: 18, + padding: 5, + flex: 1, + }, + resultText: { + fontSize: 18, + padding: 5, + flex: 1, + } +}); + +export default CurrencyConverterModal; diff --git a/locales/tk.json b/locales/tk.json index f457453..c97027b 100644 --- a/locales/tk.json +++ b/locales/tk.json @@ -37,5 +37,6 @@ "sarToTmt": "SAR-dan TMT-a", "hotelBusinessCard": "Myhmanhananyň wizit karty", "masterkeyBox": "Masterkey gutusy", - "translator": "Terjimeçi" + "translator": "Terjimeçi", + "currencyConverter": "Walýuta hasaplama" }