{"size": 1159, "ext": "js", "max_stars_repo_path": "src/components/Navigation.js", "max_stars_repo_name": "nayed/cs-ko", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/Navigation.js", "max_issues_repo_name": "nayed/cs-ko", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/Navigation.js", "max_forks_repo_name": "nayed/cs-ko", "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": 23.6530612245, "max_line_length": 96, "alphanum_fraction": 0.550474547}
import React, { Component } from 'react'
import { Collapse, Navbar, NavbarToggler, NavbarBrand, Nav, NavItem, NavLink } from 'reactstrap'

import '../style/Navigation.scss'
import book from '../svg/book.svg'

class Navigation extends Component {
  constructor(props) {
    super(props)

    this.toggle = this.toggle.bind(this)
    this.state = {
      isOpen: false
    }
  }

  toggle() {
    this.setState({
      isOpen: !this.state.isOpen
    })
  }

  render() {
    return (
      <div>
        <Navbar toggleable className="navigation">
          <NavbarToggler right onClick={this.toggle} />
          <NavbarBrand href="#">
            <span>Coding Style Koolog <img src={book} alt="book" /></span>
          </NavbarBrand>

          <Collapse isOpen={this.state.isOpen} navbar>
            <Nav className="ml-auto nav navbar-right" navbar>
              <NavItem>
                <NavLink href="#">Link</NavLink>
              </NavItem>
              <NavItem>
                <NavLink href="#">Link</NavLink>
              </NavItem>
            </Nav>
          </Collapse>
        </Navbar>
      </div>
    )
  }
}

export default Navigation
