fea12/src/header.js

import React from "react";

import Button from "./button";
const liArr = [
	{ text: "123", id: 1 },
	{ text: "1s23", id: 2 },
	{ text: "12asd3", id: 3 },
	{ text: "12s23", id: 4 },
	{ text: "222", id: 5 },
	{ text: "123as", id: 6 },
	{ text: "123asd", id: 7 },
	{ text: "123asd", id: 8 },
	{ text: "12sss3", id: 9 },
	{ text: "12aa3", id: 10 }
];

export default ({ toggle }) => (
	<header className="header">
		<div className="header__left-wrapper">
			<div className="header__logo-box">logo</div>
			<nav className="header__nav">
				<ul className="header__list">
					{liArr.map(el => (
						<li className="header__item" key={el.id}>
							{el.text}
						</li>
					))}
				</ul>
			</nav>
		</div>
		<Button className="header__log-in" text="log in" onClick={toggle} />
	</header>
);