import "bootstrap/dist/css/bootstrap.min.css";
import "@/styles/globals.css";
import "@/styles/style.css";
import Header from "@/components/Layout/Header";
import Head from "next/head";
import Footer from "@/components/Layout/Footer";
import Providers from "@/redux/providers";
import { store } from "@/redux/store";
import SmoothScroll from "@/components/SmoothScroll";
import { getCollectionPageData } from "@/services/collectionApi";

export default function App({ Component, pageProps, collectionsData}) {
 
  return (
    <>
      <Providers store={store}>
        {/* <SmoothScroll> */}
          <Header collectionsData={collectionsData} />
          <Component {...pageProps} />
          <Footer />
        {/* </SmoothScroll> */}
      </Providers>
    </>
  );
}

/* ✅ THIS IS REQUIRED */
App.getInitialProps = async () => {
  try {
    const collectionsData = await getCollectionPageData();

    return {
      collectionsData,
    };
  } catch (error) {
    console.error("Collections fetch failed", error);
    return {
      collectionsData: [],
    };
  }
};