import React, { Component } from 'react';
import { Animated, StyleSheet, View, Image, StatusBar, ScrollView, TouchableOpacity, Alert } from 'react-native';
let theme = require('./../../utils/theme.json');
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
const route = require('./../../route.json')
import I18n from 'react-native-i18n'
import { IlinkEmitter } from "../../utils/events";
import { TabView, TabBar, SceneMap } from 'react-native-tab-view';
import * as Utils from '../../utils/DeviceUtils';
import { SafeAreaView } from 'react-navigation';
import { Images } from '../../config/Images';
import CustomText from '../../components/CustomText';
import { Color } from '../../config/Color';
import Tag from '../../components/Tag';
import WalletDetail from './WalletDetail';

require('./../../utils/Translations');

export default class Wallet extends Component {

     constructor(props) {
          super(props);
          IlinkEmitter.on("langueChange", this.updateLangue.bind(this));
     }

     static options(passProps) {
          return {
               topBar: {
                    drawBehind: false,
                    visible: true,
                    animate: true,
                    buttonColor: 'white',
                    background: {
                         color: 'white',
                    },
                    rightButtons: []
               },
               backButton: {
                    visible: true,
                    color: "white"
               },
               buttonColor: "white",
               background: {
                    color: Color.primaryDarkColor
               },
               statusBar: {
                    drawBehind: false,
                    visible: true,
               }
          };
     }

     static navigationOptions = ({ navigation }) => {
          return {
               headerTitle: I18n.t('WALLET'),
               headerStyle: {
                    backgroundColor: theme.primary,
                    paddingTop: 10
               },
               headerTitleStyle: {
                    color: "white"
               }
          }
     };

     updateLangue() {
          this.props.navigation.setParams({ name: I18n.t('WALLET') })
          this.forceUpdate()
     }

     render() {
          return (
               <SafeAreaView forceInset={{ top: 'always' }} style={styles.container}>
                    <StatusBar
                         backgroundColor={Color.primaryDarkColor}
                         barStyle="light-content"
                         translucent={false}
                    />

                    <WalletDetail />


               </SafeAreaView>
          )
     }

}

const styles = StyleSheet.create({
     container: {
          flex: 1,
          backgroundColor: theme.containerBackground
     },

})