Props
Snapshot
required
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
import { getSiteVersion } from "@makeswift/runtime/next/server";
import { notFound } from "next/navigation";
import { Page as MakeswiftPage } from "@makeswift/runtime/next";
import { client } from "@/makeswift/client";
export async function generateStaticParams() {
const pages = await client.getPages().toArray();
return pages.map((page) => ({
path: page.path.split("/").filter((segment) => segment !== ""),
}));
}
export default async function Page({
params,
}: {
params: Promise<{ path?: string[] }>;
}) {
const path = "/" + ((await params)?.path ?? []).join("/");
const snapshot = await client.getPageSnapshot(path, {
siteVersion: getSiteVersion(),
});
if (snapshot == null) return notFound();
return <MakeswiftPage snapshot={snapshot} />;
}
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} />;
}