import React from 'react';
import PropTypes from 'prop-types';

import { Text, TouchableOpacity, View } from 'react-native';

import BackIcon from './IconButtons/BackIcon.js';
import EventsIcon from './IconButtons/EventsIcon.js';

export default function HeaderContentLeft({ activeRoute, hasMultipleEvents, navigation }) {
    const _goBack = () => {
        if (hasActiveEvent) {
            navigation.goBack();
            return false;
        }

        console.log('nowhere to go...');
    };

    const _showEvents = () => {
        navigation.navigate('Events');
        return false;
    };

    if (activeRoute === 'Events') {
        return <EventsIcon action={_goBack} />;
    }

    if (activeRoute === 'Profile') {
        return <BackIcon action={_goBack} />;
    }

    return <EventsIcon action={hasMultipleEvents ? _showEvents : null} />;
}

HeaderContentLeft.propTypes = {
    activeRoute: PropTypes.string.isRequired,
    hasActiveEvent: PropTypes.bool,
    navigation: PropTypes.func.isRequired,
};

HeaderContentLeft.defaultProps = {
    hasActiveEvent: false,
};