There is an issue with adding pages with 2 slugs in Builder.io. So we are fetching the pages (published and unpublished both) from Builder.io and if we don’t get any data i.e. if page doesn’t exist, we are showing 404 page.
e.g. If I create a new page with URL /slug1/slug2 , it allows us to add blocks to the page.
This works perfectly each time we create a new page.
However, if I edit the slugs on this same page again (not create new), it does not return any data for this thus shows me 404 page.
This is our code for fetching pages from builder.io and showing 404 if not found.
export async function getStaticProps({ params }) {
// Fetch the builder content
const pages = await builderClient
.get("page", {
userAttributes: {
urlPath: "/" + (params?.pages?.join("/") || ""),
},
options: { includeUnpublished: true },
})
.toPromise();
let homePage = null;
if (
params?.pages &&
(params.pages.includes("account") ||
params.pages.includes("login") ||
params.pages.includes("register"))
) {
homePage = await builderClient
.get("page", {
userAttributes: {
urlPath: "/",
},
})
.toPromise();
}
if (pages) {
return {
props: {
page: pages || null,
homePage: homePage || null,
},
revalidate: 60,
};
} else if (!generalConstants.valid_plp_slug.includes(params.pages[0])) {
return {
// returns the default 404 page with a status code of 404
notFound: true,
};
} else {
return {
props: {
page: pages || null,
homePage: homePage || null,
},
revalidate: 60,
};
}
}