Untitled

import getContentBySlug from "lib/wordpress/global/getContentBySlug";
import getAllSinglePages from "lib/wordpress/pages/getAllSinglePages";
import Page from "../../components/common/Page";
import StoreTemplate from "@/components/templates/store/StoreTemplate";

const DynamicPages = ({ page }) => {
  console.log("Page :: ", page);

  return (
    <Page seo={page.seo}>
      <StoreTemplate componentData={page.acf.content} />
    </Page>
  );
};

export default DynamicPages;

export async function getStaticProps({ params }) {
  const page = await getContentBySlug("stores", params.slug[0]);

  //* Example of how to render 404 on static pages; if 'page' data doesn't exist a 404 page will be displayed
  if (!page) {
    return {
      notFound: true,
    };
  }

  //* This will be passed to the page component as props
  return {
    props: {
      page,
    },
  };
}

export async function getStaticPaths() {
  // Get all stores content-types
  //* Example of fetching data for all pages to pass to getStaticPaths() paths
  const pages = await getAllSinglePages("stores");

  await Promise.all(
    pages.map(async (page) => {
      return {
        params: { slug: [page.slug] },
      };
    })
  );

  //* Get the paths we want to pre-render for pages for example fetching dynamic paths will look like:
  const paths = pages.map((page) => {
    const slug = page.slug.split("/");
    return { params: { slug: slug } };
  });

  console.log("Paths2 :: ", paths);

  // We'll pre-render only these paths at build time.
  // { fallback: false } means other routes should 404.
  return {
    paths,
    fallback: "blocking",
  };
}