import { Image, StyleSheet, Text, View } from 'react-native'
import React, { useContext } from 'react'
import images from '../../../assets/images/images'
import { ThemeContext } from '../../../context/theme.context'
import colors from '../../../constants/colors'
import { verticalScale } from '../../../constants/metrics'

const NewscoutCenteredLogoHeader = props => {
  
    const {
        navigation,
        route,
        headerStyle,
        imageStyle,
    } = props
    const theme = useContext(ThemeContext)
    const currentTheme = theme.state.theme
    const styles = StyleSheet.create({
        container: {
            backgroundColor: colors().dominant,
            justifyContent:'center',
            alignItems:'center',
            paddingVertical:verticalScale(16)
        },
        image:{
            height: 64,
            width: 192,
        }
    })

    return (

    <View style={[styles.container,headerStyle]}>
      <Image style={[styles.image,imageStyle]} source={currentTheme === 'light' ? images.newscoutTextLight : images.newscoutTextDark}/>
    </View>
  )
}

export default NewscoutCenteredLogoHeader

