/* eslint-disable no-unused-vars */
/* eslint-disable react/prop-types */
import NavBar from "../components/NavBar/NavBar";
import Footer from "../components/Footer/Footer";
import { ScaleFade, SlideFade } from "@chakra-ui/react";
import { useLocation } from "react-router-dom";

const DefaultLayout = ({ children }) => {
  const location = useLocation();
  return (
    <div>
      <NavBar />
      <SlideFade
        key={location.pathname}
        initialScale={0.9}
        finalScale={1.2}
        in={true}
        transition={{
          enter: {
            duration: 0.5,
            delay: 0.1,
          },
        }}
      >
        {children}
      </SlideFade>
      <Footer />
    </div>
  );
};

export default DefaultLayout;