{"size": 1340, "ext": "js", "max_stars_repo_path": "src/components/Navbar/index.js", "max_stars_repo_name": "thebsking/react-portfolio", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/Navbar/index.js", "max_issues_repo_name": "thebsking/react-portfolio", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/Navbar/index.js", "max_forks_repo_name": "thebsking/react-portfolio", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 27.9166666667, "max_line_length": 76, "alphanum_fraction": 0.3970149254}
import React, { Component } from 'react';
import { Menu } from 'semantic-ui-react';
import './navbar.css'

class Navbar extends Component {
    state = {}

    handleItemClick = (evt, { name }) => this.setState({ activeItem: name })

    render() {
        const { activeItem } = this.state
        return (
            <Menu fluid widths={3} id='main-nav'>
                <Menu.Item
                    name='home'
                    active={activeItem === 'home'}
                    onClick={this.handleItemClick}
                    href='/'
                    color='red'
                >
                    home
                </Menu.Item>
                <Menu.Item
                    name='portfolio'
                    active={activeItem === 'portfolio'}
                    onClick={this.handleItemClick}
                    href='/gallery'
                    color='red'
                >
                    projects
                </Menu.Item>
                <Menu.Item
                    color='red'
                    name='contact'
                    active={activeItem === 'contact'}
                    onClick={this.handleItemClick}
                    href='/contact'
                >
                    contact
                </Menu.Item>

            </Menu>
        )
    }
}


export default Navbar;