import "../styles/globals.scss";
import Contentlayout from "../components/_App/MainLayout"; //is admin layout
import Landingpagelayout from "../components/_App/LandingLayout";
import Switcherlayout from "../components/_App/SwitcherLayout";
import Authenticationlayout from "../components/_App/AuthenticationLayout";
import { ToastContainer } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
const layouts = {
  Contentlayout: Contentlayout,
  Landingpagelayout: Landingpagelayout,
  Switcherlayout: Switcherlayout,
  Authenticationlayout: Authenticationlayout,
};

import type { AppProps } from 'next/app';
import type { NextComponentType, NextPageContext } from 'next';

type LayoutKey = keyof typeof layouts;

type CustomComponent = NextComponentType<NextPageContext, any, any> & {
  layout?: LayoutKey;
};

function MyApp({ Component, pageProps }: AppProps & { Component: CustomComponent }) {
  const Layout =
    layouts[Component.layout as LayoutKey] ||
    (({ children }: { children: React.ReactNode }) => <>{children}</>);
  return (
    <>
      <ToastContainer position="top-right" autoClose={3000} />
      <Layout>
        <Component {...pageProps} />
      </Layout>
    </>
  );
}

export default MyApp;