{"size": 1388, "ext": "js", "max_stars_repo_path": "Tesla-Clone/src/components/Header/index.js", "max_stars_repo_name": "chirag-23/Tesla-clone-reactjs", "max_stars_repo_stars_event_min_datetime": "2022-01-20T05:06:33.000Z", "max_stars_repo_stars_event_max_datetime": "2022-02-21T09:27:16.000Z", "max_issues_repo_path": "Tesla-Clone/src/components/Header/index.js", "max_issues_repo_name": "chirag-23/Tesla-clone-reactjs", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "Tesla-Clone/src/components/Header/index.js", "max_forks_repo_name": "chirag-23/Tesla-clone-reactjs", "max_forks_repo_forks_event_min_datetime": "2022-02-01T17:44:43.000Z", "max_forks_repo_forks_event_max_datetime": "2022-02-01T17:44:43.000Z"}
{"max_stars_count": 4, "max_issues_count": null, "max_forks_count": 1, "avg_line_length": 30.1739130435, "max_line_length": 69, "alphanum_fraction": 0.4510086455}
import React,{ useState } from 'react'
import { Wrapper,Content,Content1 } from './header.style'
import { Link } from 'react-router-dom';

import SideNav from '../SideNav'
import CloseIcon from '@mui/icons-material/Close';

const Header = () => {

    const [open,setOpen] = useState(false);

    return (
        <>
        <Wrapper>
            <div className='logo' >
            <Link to='/'>
                <img src='/images/logo.svg' alt='logo'/>
            </Link>
            </div>
            <Content>
                <Link to='/models'>Model S</Link>
                <Link to='/model3'>Model 3</Link>
                <Link to='/modelx'>Model X</Link>
                <Link to='/modely'>Model Y</Link>
                <Link to='#'>Solar Roof</Link>
                <Link to='#'>Solar Panels</Link>
            </Content>
            <Content1>
                <a href='#' className='none' >Shop</a>
                <Link to='/login' className='none'>Account</Link>
                <a href='#' onClick={()=> setOpen(true)} >Menu</a>
            </Content1>
            {open && 
            <div className='top'>
                <div className='close' onClick={()=> setOpen(false)}>
                    <CloseIcon/>
                </div>
            </div> 
            }       
            <SideNav show={open}/>
        </Wrapper>
        </>
    )
}

export default Header