import React, {Component} from 'react';
import {Platform, StyleSheet, View, TouchableOpacity} from 'react-native';
import {scale, verticalScale, moderateScale } from 'react-native-size-matters';
import Icon from 'react-native-vector-icons/dist/Ionicons';
import Text from 'react-native-text';
import { width, height } from '../../config/screen';
import Size from '../../config/size'
const size = new Size;
export default class Header extends Component {

  backAction(){
    if(this.props.login){
      this.props.navigation.navigate('menu')
    }else{
      this.props.navigation.goBack()
    }
  }

  render() {
    return (
      <View style={{width:width,height:verticalScale(70),alignItems:'center',
      justifyContent:'center', marginTop:20}}>
        <Text style = {{fontSize: 22,}}>
        {this.props.title}
        </Text>
        { !this.props.order?(
        <TouchableOpacity
         style = {{position: 'absolute', left:scale(5),width:scale(40),
         height:scale(40),alignItems:'center',justifyContent: 'center',}}
         onPress = {()=>this.backAction()}>
        <Icon name="ios-arrow-back-outline" size={size.getSize(40)} color={'black'}
       /> 
    </TouchableOpacity>
        ):(
          <TouchableOpacity
          style = {{position: 'absolute', left:scale(5),width:scale(40),
          height:scale(40),alignItems:'center',justifyContent: 'center',}}
          onPress = {()=> this.props.onPress && this.props.onPress()} >
         <Icon name="ios-arrow-back-outline" size={size.getSize(40)} color={'black'}
        /> 
     </TouchableOpacity>
        )
        }
      </View>
    );
  }
}