diff --git a/examples/nextjs/src/app/[slug]/page.tsx b/examples/nextjs/src/app/[slug]/page.tsx index 98d6b53..d94d2e4 100644 --- a/examples/nextjs/src/app/[slug]/page.tsx +++ b/examples/nextjs/src/app/[slug]/page.tsx @@ -23,16 +23,16 @@ export default async function SlugPage({ params }: { params: { slug: string } }) blocks={blocks} options={{ // Example customization: Render dates as German dates - formatDateFn: (date: Date) => { - return date.toLocaleDateString("de", { + formatDateFn: (dateString: string) => { + return new Date(dateString).toLocaleDateString("de", { month: "long", day: "numeric", year: "numeric", }) }, // Example resolving links to other Notion pages - resolveLinkFn: (nId) => { - const page = pages.find((p) => p.blockId === nId) + resolveLinkFn: (pageId) => { + const page = pages.find((p) => p.blockId === pageId) if (page === undefined) { return null } diff --git a/packages/render/src/block.tsx b/packages/render/src/block.tsx index cf67c12..595769f 100644 --- a/packages/render/src/block.tsx +++ b/packages/render/src/block.tsx @@ -12,8 +12,8 @@ import { PageTitle } from "./components/page-title" import { Code } from "./components/html/code" import { Img } from "./components/html/img" -const defaultFormatDateFn = (date: Date) => date.toString() -const defaultResolveLinkFn = (nId: string) => null +const defaultFormatDateFn = (dateString: string) => new Date(dateString).toString() +const defaultResolveLinkFn = (pageId: string) => null export const Render = ({ blocks, @@ -21,8 +21,8 @@ export const Render = ({ }: { blocks: Array<BlockObjectResponseWithChildren> options?: { - formatDateFn?: (date: Date) => string - resolveLinkFn?: (nId: string) => { href: string; icon: IconResponse | null } | null + formatDateFn?: (dateString: string) => string + resolveLinkFn?: (pageId: string) => { href: string; icon: IconResponse | null } | null htmlComponents?: { a?: (props: React.ComponentPropsWithoutRef<"a">) => JSX.Element code?: (props: React.ComponentPropsWithoutRef<"code">) => JSX.Element diff --git a/packages/render/src/components/text.tsx b/packages/render/src/components/text.tsx index a0917b9..735d744 100644 --- a/packages/render/src/components/text.tsx +++ b/packages/render/src/components/text.tsx @@ -4,7 +4,7 @@ import type { TextRichTextItemResponse, } from "@notionhq/client/build/src/api-endpoints" -import { cn, notionColor, notionLinkToUuid, notionUrl } from "../util" +import { cn, notionColor, notionLinkToUuid } from "../util" import { RenderOptions } from "../types" import { PageTitle } from "./page-title" @@ -109,15 +109,15 @@ const FormattedText = ({ ) } -const mentionText = (value: MentionRichTextItemResponse, formatDateFn: (date: Date) => string) => { +const mentionText = (value: MentionRichTextItemResponse, formatDateFn: (dateString: string) => string) => { switch (value.mention.type) { case "database": return null case "date": try { - let dateText = formatDateFn(new Date(value.mention.date.start)) + let dateText = formatDateFn(value.mention.date.start) if (value.mention.date.end) { - dateText += ` → ${formatDateFn(new Date(value.mention.date.end))}` + dateText += ` → ${formatDateFn(value.mention.date.end)}` } // Ignored: value.mention.date.time_zone return dateText diff --git a/packages/render/src/types.ts b/packages/render/src/types.ts index f681b75..7676b2a 100644 --- a/packages/render/src/types.ts +++ b/packages/render/src/types.ts @@ -10,8 +10,8 @@ export type BlockObjectResponseWithChildren = BlockObjectResponse & { export type IconResponse = PageObjectResponse["icon"] export type RenderOptions = { - formatDateFn: (date: Date) => string - resolveLinkFn: (nId: string) => { href: string; icon: IconResponse | null } | null + formatDateFn: (dateString: string) => string + resolveLinkFn: (pageId: string) => { href: string; icon: IconResponse | null } | null htmlComponents: { a: (props: React.ComponentPropsWithoutRef<"a">) => JSX.Element code: (props: React.ComponentPropsWithoutRef<"code">) => JSX.Element