text: import React from 'react';
  import { useSelector } from 'react-redux';
  import { TouchableOpacity } from 'react-native';
  import Icon from 'react-native-vector-icons/MaterialIcons';
  import PropTypes from 'prop-types';
  
  import { Wrapper, Container, Logo, BasketContainer, ItemCount } from './styles';
  
  const Header = ({ navigation }) => {
    const cartSize = useSelector(state => state.cart.length);
    return (
      <Wrapper>
        <Container>
          <TouchableOpacity onPress={() => navigation.navigate('Main')}>
            <Logo />
          </TouchableOpacity>
          <BasketContainer onPress={() => navigation.navigate('Cart')}>
            <Icon name="shopping-basket" color="#FFF" size={24} />
            <ItemCount>{cartSize || 0}</ItemCount>
          </BasketContainer>
        </Container>
      </Wrapper>
    );
  };
  
  Header.propTypes = {
    navigation: PropTypes.shape.isRequired,
  };
  
  export default Header;
  