{"size": 1516, "ext": "js", "max_stars_repo_path": "web/src/components/header/header.js", "max_stars_repo_name": "mutualaidphilly/mutual-aid-philly-sanity", "max_stars_repo_stars_event_min_datetime": "2020-09-24T00:18:29.000Z", "max_stars_repo_stars_event_max_datetime": "2020-09-24T00:18:29.000Z", "max_issues_repo_path": "web/src/components/header/header.js", "max_issues_repo_name": "mutualaidphilly/mutual-aid-philly-sanity", "max_issues_repo_issues_event_min_datetime": "2020-07-19T19:58:35.000Z", "max_issues_repo_issues_event_max_datetime": "2021-06-01T08:40:51.000Z", "max_forks_repo_path": "web/src/components/header/header.js", "max_forks_repo_name": "mutualaidphilly/mutual-aid-philly-sanity", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": 63, "max_forks_count": null, "avg_line_length": 23.6875, "max_line_length": 78, "alphanum_fraction": 0.5996042216}
import {Link} from 'gatsby'
import React from 'react'

import {root, wrapper, languageLink} from './header.module.css'
import MobileNav from './mobileNav'
import DesktopNav from './desktopNav'

const createLanguageLinks = (currentLocale, currentLocation) => {
  const supportedLocales = [
    {locale: 'en', label: 'English'},
    {locale: 'es', label: 'Español'},
    {locale: 'zh', label: '中文'}
  ]

  return supportedLocales
    .filter(localeObj => localeObj.locale !== currentLocale)
    .map(localeObj => {
      const url = currentLocation.replace(currentLocale, localeObj.locale)
      return (
        <li key={url}>
          <Link to={url} className={languageLink}>
            {localeObj.label}
          </Link>
        </li>
      )
    })
}

const Header = ({
  onHideNav,
  onShowNav,
  showNav,
  slugs,
  siteTitle,
  currentLocale,
  location,
  ctas
}) => {
  return (
    <div className={root}>
      <div className={wrapper}>
        <MobileNav
          onHideNav={onHideNav}
          onShowNav={onShowNav}
          showNav={showNav}
          slugs={slugs}
          currentLocale={currentLocale}
          ctas={ctas}
          languageList={createLanguageLinks(currentLocale, location.pathname)}
        />
        <DesktopNav
          slugs={slugs}
          currentLocale={currentLocale}
          ctas={ctas}
          languageList={createLanguageLinks(currentLocale, location.pathname)}
          siteTitle={siteTitle}
        />
      </div>
    </div>
  )
}

export default Header
