import React, { Component } from "react";
import { connect } from 'react-redux';
import { func, object } from 'prop-types';
import { bindActionCreators } from 'redux' 

import HeaderComponent from './../../components/public-components/header';

import {signOut} from './../../actions/auth/signOut'

const UserContext = React.createContext();

class Header extends Component {
    static propTypes = {
        user: object,
        signOut: func,
    }

    render() {
        const { user, signOut } = this.props;

        return (
            <UserContext.Provider
                value={{
                    user,
                    signOut
                }}
            >
                <HeaderComponent />;
            </UserContext.Provider>
        )
        
    }
}

const
    mapStateToProps = ({ user }) => ({
        user
    }),
    mapDispatchToProps = dispatch => bindActionCreators({
        signOut
    }, dispatch);

export { UserContext };
export default connect(mapStateToProps, mapDispatchToProps)(Header);