import * as React from "react";
import Header from "./layout/header";
import SideBad from "./layout/sideBar";
import { Footer } from "./layout/footer";

const Layout = (props: {
	children?: React.ReactNode,
	cartItemsAmount: number,
	onLogoutClick(e: React.MouseEvent<HTMLAnchorElement, MouseEvent>): void,
	onSearchClick(searchString: string): void,
	userName: string
}) => (
	<div className="page__container">
		<div className="content__wrap">
			<Header	cartItemsAmount={props.cartItemsAmount}	onLougoutClick={props.onLogoutClick} userName={props.userName} />
			<SideBad onSearchClick={props.onSearchClick} />
			{props.children}
			<Footer />
		</div>
	</div>
);

export default Layout;