{"size": 815, "ext": "js", "max_stars_repo_path": "src/components/header.js", "max_stars_repo_name": "thanhvd/pomodoro-react", "max_stars_repo_stars_event_min_datetime": "2020-04-15T15:51:48.000Z", "max_stars_repo_stars_event_max_datetime": "2020-05-07T13:47:36.000Z", "max_issues_repo_path": "src/components/header.js", "max_issues_repo_name": "thanhvd/pomodoro-react", "max_issues_repo_issues_event_min_datetime": "2022-03-02T13:22:40.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-02T19:54:13.000Z", "max_forks_repo_path": "src/components/header.js", "max_forks_repo_name": "thanhvd/pomodoro-react", "max_forks_repo_forks_event_min_datetime": "2020-01-10T17:19:03.000Z", "max_forks_repo_forks_event_max_datetime": "2020-01-10T17:19:03.000Z"}
{"max_stars_count": 4, "max_issues_count": 6, "max_forks_count": 1, "avg_line_length": 20.8974358974, "max_line_length": 69, "alphanum_fraction": 0.5595092025}
import React from "react"
import { Link } from "gatsby"
import PropTypes from "prop-types"

import { Switch } from "./Switch"

const Header = ({ siteTitle, theme, isLightTheme, toggleTheme }) => {
  return (
    <header className="topbar">
      <div className="topbar-inner">
        <h1 style={{ margin: 0 }}>
          <Link
            to="/"
            style={{
              color: theme.fontColor,
              textDecoration: `none`,
            }}
          >
            {siteTitle}
          </Link>
        </h1>
        <Switch on={isLightTheme} onClick={toggleTheme} />
      </div>
    </header>
  )
}

Header.propTypes = {
  isLightTheme: PropTypes.bool,
  siteTitle: PropTypes.string,
  toggleTheme: PropTypes.func.isRequired,
}

Header.defaultProps = {
  siteTitle: ``,
}

export default Header
