text: import React, {useState} from 'react';
  
  import {
    ScrollView,
    StatusBar,
    StyleSheet,
    Text,
    TextInput,
    View,
    SafeAreaView,
    TouchableOpacity,
  } from 'react-native';
  
  const currencyPerRupee = {
    DOLLAR: 0.014,
    EURO: 0.012,
    RUBEL: 0.93,
    AUSDOLLAR: 0.2,
    CANDOLLAR: 0.019,
    YEN: 1.54,
    DINAR: 0.0043,
    BITCOIN: 0.000004,
  };
  
  import SnackBar from 'react-native-snackbar';
  
  const App = () => {
    const [inputValue, setInputValue] = useState(0);
    const [resultValue, setResultValue] = useState(0);
  
    const buttonPressed = currency => {
      if (!inputValue) {
        return SnackBar.show({
          text: 'Please enter a input value',
          backgroundColor: '#0f4c75',
          duration: SnackBar.LENGTH_SHORT,
          textColor: '#FFF',
        });
      }
      let result = parseFloat(inputValue) * currencyPerRupee[currency];
      setResultValue(result.toFixed(2));
    };
  
    return (
      <>
        <ScrollView
          backgroundColor="#1b262c"
          keyboardShouldPersistTaps="handled"
          contentInsetAdjustmentBehavior="automatic">
          <SafeAreaView style={styles.container}>
            <View style={styles.resultContainer}>
              <Text style={styles.resultValue}>{resultValue}</Text>
            </View>
            <View style={styles.inputContainer}>
              <TextInput
                keyboardType="numeric"
                placeholder="Enter Value"
                placeholderTextColor="#c1c1c1"
                value={inputValue}
                onChangeText={inputValue => setInputValue(inputValue)}
                style={styles.input}
              />
            </View>
            <View style={styles.convertButtonContainer}>
              {Object.keys(currencyPerRupee).map((currency, index) => {
                return (
                  <TouchableOpacity
                    key={index}
                    onPress={() => buttonPressed(currency)}
                    style={styles.convertorButton}>
                    <Text style={styles.convertButtonText}>{currency}</Text>
                  </TouchableOpacity>
                );
              })}
            </View>
          </SafeAreaView>
        </ScrollView>
      </>
    );
  };
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: '#1b262c',
    },
    resultContainer: {
      height: 70,
      marginTop: 80,
      justifyContent: 'center',
      borderWidth: 2,
      borderColor: '#bbe1fa',
      alignItems: 'center',
    },
    inputContainer: {
      height: 70,
      marginTop: 10,
      justifyContent: 'center',
      borderWidth: 2,
      borderColor: '#bbe1fa',
      alignItems: 'center',
    },
    resultValue: {
      fontSize: 30,
      color: '#FFF',
      fontWeight: 'bold',
    },
    input: {
      fontSize: 30,
      textAlign: 'center',
      color: '#FFF',
    },
    convertButtonContainer: {
      flexDirection: 'row',
      flexWrap: 'wrap',
      marginTop: 10,
    },
    convertorButton: {
      alignItems: 'center',
      justifyContent: 'center',
      height: 100,
      width: '33.3%',
      borderWidth: 2,
      borderColor: '#FFF',
      marginTop: 10,
      backgroundColor: '#0f4c75',
    },
    convertButtonText: {
      color: '#FFF',
      fontSize: 15,
    },
  });
  
  export default App;
  