Props
The Makeswift snapshot to render.
Example
App Router
The following example sets up a catch all dynamic route in the app router under [[...path]]/page.tsx
.
src/app/[[...path]]/page.tsx
Pages Router
The following example sets up a catch all dynamic route in the pages router under [[...path]].tsx
.
import {
GetStaticPathsResult,
GetStaticPropsContext,
GetStaticPropsResult,
} from "next";
import {
Page as MakeswiftPage,
PageProps as MakeswiftPageProps,
Makeswift,
} from "@makeswift/runtime/next";
import { client } from "@/makeswift/client";
import "@/makeswift/components";
type ParsedUrlQuery = { path?: string[] };
export async function getStaticPaths(): Promise<
GetStaticPathsResult<ParsedUrlQuery>
> {
const pages = await client.getPages().toArray();
return {
paths: pages.map((page) => ({
params: {
path: page.path.split("/").filter((segment) => segment !== ""),
},
})),
fallback: "blocking",
};
}
export type PageProps = MakeswiftPageProps & {
previewMode: boolean;
locale: string | undefined;
};
export async function getStaticProps({
params,
previewData,
locale,
}: GetStaticPropsContext<ParsedUrlQuery>): Promise<
GetStaticPropsResult<PageProps>
> {
const path = "/" + (params?.path ?? []).join("/");
const snapshot = await client.getPageSnapshot(path, {
siteVersion: Makeswift.getSiteVersion(previewData),
locale,
});
if (snapshot == null) return { notFound: true };
return {
props: {
snapshot,
previewMode: Makeswift.getPreviewMode(previewData),
locale,
},
};
}
export default function Page({ snapshot }: MakeswiftPageProps) {
return <MakeswiftPage snapshot={snapshot} />;
}