{"size": 1100, "ext": "js", "max_stars_repo_path": "src/layouts/AppHeader.js", "max_stars_repo_name": "mnishiguchi/hanarecafe-gatsby", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/layouts/AppHeader.js", "max_issues_repo_name": "mnishiguchi/hanarecafe-gatsby", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/layouts/AppHeader.js", "max_forks_repo_name": "mnishiguchi/hanarecafe-gatsby", "max_forks_repo_forks_event_min_datetime": "2020-05-11T03:00:44.000Z", "max_forks_repo_forks_event_max_datetime": "2020-05-11T03:00:44.000Z"}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": 1, "avg_line_length": 22.4489795918, "max_line_length": 61, "alphanum_fraction": 0.5290909091}
import React from 'react';
import { Container, Menu, Segment } from 'semantic-ui-react';
import { useTranslation } from 'react-i18next';

import NavMenuItems from './NavMenuItems';
import SocialButtons from './SocialButtons';
import I18nSwitcher from './I18nSwitcher';
import I18nLink from '../components/I18nLink';

function AppHeader({ children }) {
  const { t } = useTranslation();

  return (
    <Segment
      vertical
      style={{
        position: 'fixed',
        zIndex: 999,
        width: '100%',
        padding: 0,
        background: 'rgba(255,255,255,.8)',
      }}
    >
      <Container>
        <Menu secondary>
          <Menu.Item
            as={I18nLink}
            to={'/'}
            content={t('pages.home.link-label')}
          />

          <NavMenuItems />

          <Menu.Menu position="right">
            <Menu.Item>
              <I18nSwitcher />
            </Menu.Item>
            <Menu.Item>
              <SocialButtons />
            </Menu.Item>
          </Menu.Menu>
        </Menu>
      </Container>
    </Segment>
  );
}

export default AppHeader;
