4
0
forked from crowetic/commerce
commerce/pages/[...pages].tsx

71 lines
2.2 KiB
TypeScript
Raw Normal View History

2020-10-29 19:03:43 -05:00
import type {
GetStaticPathsContext,
GetStaticPropsContext,
InferGetStaticPropsType,
} from 'next'
2020-10-27 04:53:21 -05:00
import { getConfig } from '@bigcommerce/storefront-data-hooks/api'
import getPage from '@bigcommerce/storefront-data-hooks/api/operations/get-page'
import getAllPages from '@bigcommerce/storefront-data-hooks/api/operations/get-all-pages'
2020-10-27 05:53:30 -05:00
import getSlug from '@lib/get-slug'
2020-10-16 12:13:26 -03:00
import { Layout, HTMLContent } from '@components/core'
2020-10-15 18:00:33 -05:00
export async function getStaticProps({
preview,
params,
2020-10-25 13:31:12 -05:00
locale,
2020-10-15 18:00:33 -05:00
}: GetStaticPropsContext<{ pages: string[] }>) {
2020-10-27 04:00:42 -05:00
const config = getConfig({ locale })
const { pages } = await getAllPages({ preview, config })
2020-10-25 13:31:12 -05:00
const path = params?.pages.join('/')
const slug = locale ? `${locale}/${path}` : path
2020-10-15 18:00:33 -05:00
const pageItem = pages.find((p) => (p.url ? getSlug(p.url) === slug : false))
2020-10-27 00:47:29 -05:00
const data =
2020-10-27 04:00:42 -05:00
pageItem &&
(await getPage({ variables: { id: pageItem.id! }, config, preview }))
2020-10-15 18:00:33 -05:00
const page = data?.page
if (!page) {
2020-10-25 13:31:12 -05:00
// We throw to make sure this fails at build time as this is never expected to happen
2020-10-15 18:00:33 -05:00
throw new Error(`Page with slug '${slug}' not found`)
}
return {
props: { pages, page },
2020-10-25 13:31:12 -05:00
revalidate: 60 * 60, // Every hour
2020-10-15 18:00:33 -05:00
}
}
2020-10-29 19:03:43 -05:00
export async function getStaticPaths({ locales }: GetStaticPathsContext) {
2020-10-15 18:00:33 -05:00
const { pages } = await getAllPages()
return {
2020-10-29 19:03:43 -05:00
paths: pages
.map((page) => page.url)
.filter((url) => {
if (!locales) return url
// If there are locales, only include the pages that include one of the available locales
if (url && locales.includes(getSlug(url).split('/')[0])) return url
console.log(
`The page '${url}' does not include a locale, when using i18n web pages from BigCommerce are expected to have a locale or they will be ignored`
)
}),
2020-10-15 18:00:33 -05:00
// Fallback shouldn't be enabled here or otherwise this route
// will catch every page, even 404s, and we don't want that
fallback: false,
}
}
export default function Pages({
page,
}: InferGetStaticPropsType<typeof getStaticProps>) {
2020-10-15 18:42:03 -05:00
return (
<div className="max-w-2xl mx-auto py-20">
2020-10-26 12:33:56 -03:00
{page?.body && <HTMLContent html={page.body} />}
2020-10-15 18:42:03 -05:00
</div>
)
2020-10-15 18:00:33 -05:00
}
Pages.Layout = Layout