import React, { useEffect } from "react";
import Head from "next/head";
import Header from "./Header";
import Footer from "./Footer";
import { ToastContainer } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import { loadUser } from "../../redux/actions/userActions";
import { useDispatch, useSelector } from "react-redux";
const Layout = ({ children, title = "Zango", description = "Zango" }) => {
const dispatch = useDispatch();
// const { loadedUser } = useSelector(state => state.loadedUser);
// console.log(">>>", loadedUser);
useEffect(() => {
dispatch(loadUser());
}, []);
return (
<div>
<Head>
<title>{title}</title>
<meta charSet="utf-8"></meta>
<meta name="viewport" content="initial-scale=1.0,width=device-width" />
<meta name="description" content={description} />
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
</Head>
<Header></Header>
<ToastContainer position="bottom-right" />
{children}
<Footer></Footer>
</div>
);
};
export default Layout;