kofi-stack-template-generator 2.1.37 → 2.1.39

package/templates/marketing/payload/src/app/(frontend)/posts/page/[pageNumber]/page.tsx

@@ -0,0 +1,87 @@
+import type { Metadata } from "next/types"
+
+import { CollectionArchive } from "@/components/CollectionArchive"
+import { PageRange } from "@/components/PageRange"
+import { Pagination } from "@/components/Pagination"
+import configPromise from "@payload-config"
+import { notFound } from "next/navigation"
+import { getPayload } from "payload"
+import PageClient from "./page.client"
+
+export const revalidate = 600
+
+type Args = {
+	params: Promise<{
+		pageNumber: string
+	}>
+}
+
+export default async function Page({ params: paramsPromise }: Args) {
+	const { pageNumber } = await paramsPromise
+	const payload = await getPayload({ config: configPromise })
+
+	const sanitizedPageNumber = Number(pageNumber)
+
+	if (!Number.isInteger(sanitizedPageNumber)) notFound()
+
+	const posts = await payload.find({
+		collection: "posts",
+		depth: 1,
+		limit: 12,
+		page: sanitizedPageNumber,
+		overrideAccess: false,
+	})
+
+	return (
+		<div className="pt-24 pb-24">
+			<PageClient />
+			<div className="container mb-16">
+				<div className="prose dark:prose-invert max-w-none">
+					<h1>Posts</h1>
+				</div>
+			</div>
+
+			<div className="container mb-8">
+				<PageRange
+					collection="posts"
+					currentPage={posts.page}
+					limit={12}
+					totalDocs={posts.totalDocs}
+				/>
+			</div>
+
+			<CollectionArchive posts={posts.docs} />
+
+			<div className="container">
+				{posts?.page && posts?.totalPages > 1 && (
+					<Pagination page={posts.page} totalPages={posts.totalPages} />
+				)}
+			</div>
+		</div>
+	)
+}
+
+export async function generateMetadata({ params: paramsPromise }: Args): Promise<Metadata> {
+	const { pageNumber } = await paramsPromise
+	return {
+		title: `Payload Website Template Posts Page ${pageNumber || ""}`,
+	}
+}
+
+export async function generateStaticParams() {
+	const payload = await getPayload({ config: configPromise })
+	const { totalDocs } = await payload.count({
+		collection: "posts",
+		overrideAccess: false,
+	})
+
+	const totalPages = Math.ceil(totalDocs / 10)
+
+	const pages: { pageNumber: string }[] = []
+
+	for (let i = 1; i <= totalPages; i++) {
+		pages.push({ pageNumber: String(i) })
+	}
+
+	return pages
+}

package/templates/marketing/payload/src/app/(frontend)/posts/page.tsx

@@ -0,0 +1,49 @@
+import type { Metadata } from "next/types"
+
+import configPromise from "@payload-config"
+import { getPayload } from "payload"
+import { BlogPageClient } from "./BlogPageClient"
+
+export const dynamic = "force-static"
+export const revalidate = 600
+
+export default async function Page() {
+	const payload = await getPayload({ config: configPromise })
+
+	const posts = await payload.find({
+		collection: "posts",
+		depth: 1,
+		limit: 100,
+		overrideAccess: false,
+		select: {
+			title: true,
+			slug: true,
+			categories: true,
+			meta: true,
+			publishedAt: true,
+		},
+		sort: "-publishedAt",
+	})
+
+	const categories = await payload.find({
+		collection: "categories",
+		limit: 50,
+		overrideAccess: false,
+	})
+
+	return (
+		<BlogPageClient
+			initialPosts={posts.docs}
+			categories={categories.docs}
+			totalPosts={posts.totalDocs}
+		/>
+	)
+}
+
+export function generateMetadata(): Metadata {
+	return {
+		title: "Blog — DirectoryHub Resources & Guides",
+		description:
+			"Learn how to build, grow, and monetize directory websites. Tips, strategies, and success stories from the DirectoryHub team.",
+	}
+}

package/templates/marketing/payload/src/app/(frontend)/search/page.client.tsx

@@ -0,0 +1,15 @@
+"use client"
+import { useHeaderTheme } from "@/providers/HeaderTheme"
+import React, { useEffect } from "react"
+
+const PageClient: React.FC = () => {
+	/* Force the header to be dark mode while we have an image behind it */
+	const { setHeaderTheme } = useHeaderTheme()
+
+	useEffect(() => {
+		setHeaderTheme("light")
+	}, [setHeaderTheme])
+	return <React.Fragment />
+}
+
+export default PageClient

package/templates/marketing/payload/src/app/(frontend)/search/page.tsx

@@ -0,0 +1,87 @@
+import type { Metadata } from "next/types"
+
+import type { CardPostData } from "@/components/Card"
+import { CollectionArchive } from "@/components/CollectionArchive"
+import { Search } from "@/search/Component"
+import configPromise from "@payload-config"
+import { getPayload } from "payload"
+import PageClient from "./page.client"
+
+type Args = {
+	searchParams: Promise<{
+		q: string
+	}>
+}
+export default async function Page({ searchParams: searchParamsPromise }: Args) {
+	const { q: query } = await searchParamsPromise
+	const payload = await getPayload({ config: configPromise })
+
+	const posts = await payload.find({
+		collection: "search",
+		depth: 1,
+		limit: 12,
+		select: {
+			title: true,
+			slug: true,
+			categories: true,
+			meta: true,
+		},
+		// pagination: false reduces overhead if you don't need totalDocs
+		pagination: false,
+		...(query
+			? {
+					where: {
+						or: [
+							{
+								title: {
+									like: query,
+								},
+							},
+							{
+								"meta.description": {
+									like: query,
+								},
+							},
+							{
+								"meta.title": {
+									like: query,
+								},
+							},
+							{
+								slug: {
+									like: query,
+								},
+							},
+						],
+					},
+				}
+			: {}),
+	})
+
+	return (
+		<div className="pt-24 pb-24">
+			<PageClient />
+			<div className="container mb-16">
+				<div className="prose dark:prose-invert max-w-none text-center">
+					<h1 className="mb-8 lg:mb-16">Search</h1>
+
+					<div className="max-w-[50rem] mx-auto">
+						<Search />
+					</div>
+				</div>
+			</div>
+
+			{posts.totalDocs > 0 ? (
+				<CollectionArchive posts={posts.docs as CardPostData[]} />
+			) : (
+				<div className="container">No results found.</div>
+			)}
+		</div>
+	)
+}
+
+export function generateMetadata(): Metadata {
+	return {
+		title: `Payload Website Template Search`,
+	}
+}

package/templates/marketing/payload/src/app/(payload)/admin/[[...segments]]/not-found.tsx

@@ -0,0 +1,24 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import type { Metadata } from "next"
+
+import config from "@payload-config"
+import { NotFoundPage, generatePageMetadata } from "@payloadcms/next/views"
+import { importMap } from "../importMap"
+
+type Args = {
+	params: Promise<{
+		segments: string[]
+	}>
+	searchParams: Promise<{
+		[key: string]: string | string[]
+	}>
+}
+
+export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>
+	generatePageMetadata({ config, params, searchParams })
+
+const NotFound = ({ params, searchParams }: Args) =>
+	NotFoundPage({ config, params, searchParams, importMap })
+
+export default NotFound

package/templates/marketing/payload/src/app/(payload)/admin/[[...segments]]/page.tsx

@@ -0,0 +1,24 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import type { Metadata } from "next"
+
+import config from "@payload-config"
+import { RootPage, generatePageMetadata } from "@payloadcms/next/views"
+import { importMap } from "../importMap"
+
+type Args = {
+	params: Promise<{
+		segments: string[]
+	}>
+	searchParams: Promise<{
+		[key: string]: string | string[]
+	}>
+}
+
+export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>
+	generatePageMetadata({ config, params, searchParams })
+
+const Page = ({ params, searchParams }: Args) =>
+	RootPage({ config, params, searchParams, importMap })
+
+export default Page

package/templates/marketing/payload/src/app/(payload)/admin/importMap.js

@@ -0,0 +1,83 @@
+import { RscEntryLexicalCell as RscEntryLexicalCell_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
+import { RscEntryLexicalField as RscEntryLexicalField_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
+import { LexicalDiffComponent as LexicalDiffComponent_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
+import { TableFeatureClient as TableFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { UploadFeatureClient as UploadFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { RelationshipFeatureClient as RelationshipFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { IndentFeatureClient as IndentFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { AlignFeatureClient as AlignFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { ChecklistFeatureClient as ChecklistFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { OrderedListFeatureClient as OrderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { UnorderedListFeatureClient as UnorderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { BlockquoteFeatureClient as BlockquoteFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { InlineCodeFeatureClient as InlineCodeFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { SuperscriptFeatureClient as SuperscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { SubscriptFeatureClient as SubscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { StrikethroughFeatureClient as StrikethroughFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { InlineToolbarFeatureClient as InlineToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { FixedToolbarFeatureClient as FixedToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { HeadingFeatureClient as HeadingFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { ParagraphFeatureClient as ParagraphFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { UnderlineFeatureClient as UnderlineFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { BoldFeatureClient as BoldFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { ItalicFeatureClient as ItalicFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { LinkFeatureClient as LinkFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { OverviewComponent as OverviewComponent_a8a977ebc872c5d5ea7ee689724c0860 } from '@payloadcms/plugin-seo/client'
+import { MetaTitleComponent as MetaTitleComponent_a8a977ebc872c5d5ea7ee689724c0860 } from '@payloadcms/plugin-seo/client'
+import { MetaImageComponent as MetaImageComponent_a8a977ebc872c5d5ea7ee689724c0860 } from '@payloadcms/plugin-seo/client'
+import { MetaDescriptionComponent as MetaDescriptionComponent_a8a977ebc872c5d5ea7ee689724c0860 } from '@payloadcms/plugin-seo/client'
+import { PreviewComponent as PreviewComponent_a8a977ebc872c5d5ea7ee689724c0860 } from '@payloadcms/plugin-seo/client'
+import { SlugField as SlugField_3817bf644402e67bfe6577f60ef982de } from '@payloadcms/ui'
+import { HorizontalRuleFeatureClient as HorizontalRuleFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { BlocksFeatureClient as BlocksFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { FolderTableCell as FolderTableCell_ab83ff7e88da8d3530831f296ec4756a } from '@payloadcms/ui/rsc'
+import { FolderField as FolderField_ab83ff7e88da8d3530831f296ec4756a } from '@payloadcms/ui/rsc'
+import { LinkToDoc as LinkToDoc_aead06e4cbf6b2620c5c51c9ab283634 } from '@payloadcms/plugin-search/client'
+import { ReindexButton as ReindexButton_aead06e4cbf6b2620c5c51c9ab283634 } from '@payloadcms/plugin-search/client'
+import { FolderTypeField as FolderTypeField_3817bf644402e67bfe6577f60ef982de } from '@payloadcms/ui'
+import { RowLabel as RowLabel_ec255a65fa6fa8d1faeb09cf35284224 } from '@/Header/RowLabel'
+import { default as default_1a7510af427896d367a49dbf838d2de6 } from '@/components/BeforeDashboard'
+import { default as default_8a7ab0eb7ab5c511aba12e68480bfe5e } from '@/components/BeforeLogin'
+
+export const importMap = {
+  "@payloadcms/richtext-lexical/rsc#RscEntryLexicalCell": RscEntryLexicalCell_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/rsc#RscEntryLexicalField": RscEntryLexicalField_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/rsc#LexicalDiffComponent": LexicalDiffComponent_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/client#TableFeatureClient": TableFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UploadFeatureClient": UploadFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#RelationshipFeatureClient": RelationshipFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#IndentFeatureClient": IndentFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#AlignFeatureClient": AlignFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ChecklistFeatureClient": ChecklistFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#OrderedListFeatureClient": OrderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UnorderedListFeatureClient": UnorderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#BlockquoteFeatureClient": BlockquoteFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#InlineCodeFeatureClient": InlineCodeFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#SuperscriptFeatureClient": SuperscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#SubscriptFeatureClient": SubscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#StrikethroughFeatureClient": StrikethroughFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#InlineToolbarFeatureClient": InlineToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#FixedToolbarFeatureClient": FixedToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#HeadingFeatureClient": HeadingFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ParagraphFeatureClient": ParagraphFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UnderlineFeatureClient": UnderlineFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#BoldFeatureClient": BoldFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ItalicFeatureClient": ItalicFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#LinkFeatureClient": LinkFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/plugin-seo/client#OverviewComponent": OverviewComponent_a8a977ebc872c5d5ea7ee689724c0860,
+  "@payloadcms/plugin-seo/client#MetaTitleComponent": MetaTitleComponent_a8a977ebc872c5d5ea7ee689724c0860,
+  "@payloadcms/plugin-seo/client#MetaImageComponent": MetaImageComponent_a8a977ebc872c5d5ea7ee689724c0860,
+  "@payloadcms/plugin-seo/client#MetaDescriptionComponent": MetaDescriptionComponent_a8a977ebc872c5d5ea7ee689724c0860,
+  "@payloadcms/plugin-seo/client#PreviewComponent": PreviewComponent_a8a977ebc872c5d5ea7ee689724c0860,
+  "@payloadcms/ui#SlugField": SlugField_3817bf644402e67bfe6577f60ef982de,
+  "@payloadcms/richtext-lexical/client#HorizontalRuleFeatureClient": HorizontalRuleFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#BlocksFeatureClient": BlocksFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/ui/rsc#FolderTableCell": FolderTableCell_ab83ff7e88da8d3530831f296ec4756a,
+  "@payloadcms/ui/rsc#FolderField": FolderField_ab83ff7e88da8d3530831f296ec4756a,
+  "@payloadcms/plugin-search/client#LinkToDoc": LinkToDoc_aead06e4cbf6b2620c5c51c9ab283634,
+  "@payloadcms/plugin-search/client#ReindexButton": ReindexButton_aead06e4cbf6b2620c5c51c9ab283634,
+  "@payloadcms/ui#FolderTypeField": FolderTypeField_3817bf644402e67bfe6577f60ef982de,
+  "@/Header/RowLabel#RowLabel": RowLabel_ec255a65fa6fa8d1faeb09cf35284224,
+  "@/components/BeforeDashboard#default": default_1a7510af427896d367a49dbf838d2de6,
+  "@/components/BeforeLogin#default": default_8a7ab0eb7ab5c511aba12e68480bfe5e
+}

package/templates/marketing/payload/src/app/(payload)/api/[...slug]/{route.ts.hbs → route.ts}

@@ -1,19 +1,23 @@
 /* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
 /* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
-import config from '@payload-config'
-import '@payloadcms/next/css'
+import config from "@payload-config"
+import "@payloadcms/next/css"
 import {
-  REST_DELETE,
-  REST_GET,
-  REST_OPTIONS,
-  REST_PATCH,
-  REST_POST,
-  REST_PUT,
-} from '@payloadcms/next/routes'
+	REST_DELETE,
+	REST_GET,
+	REST_OPTIONS,
+	REST_PATCH,
+	REST_POST,
+	REST_PUT,
+} from "@payloadcms/next/routes"
+
+// Route segment config for large file uploads (videos up to 50MB)
+export const maxDuration = 60 // Increase timeout for large uploads (seconds)
 
 export const GET = REST_GET(config)
 export const POST = REST_POST(config)
 export const DELETE = REST_DELETE(config)
 export const PATCH = REST_PATCH(config)
+
 export const PUT = REST_PUT(config)
 export const OPTIONS = REST_OPTIONS(config)

package/templates/marketing/payload/src/app/(payload)/api/graphql/{route.ts.hbs → route.ts}

@@ -1,7 +1,7 @@
 /* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
 /* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
-import config from '@payload-config'
-import { GRAPHQL_POST, REST_OPTIONS } from '@payloadcms/next/routes'
+import config from "@payload-config"
+import { GRAPHQL_POST, REST_OPTIONS } from "@payloadcms/next/routes"
 
 export const POST = GRAPHQL_POST(config)
 

package/templates/marketing/payload/src/app/(payload)/api/graphql-playground/{route.ts.hbs → route.ts}

@@ -1,7 +1,7 @@
 /* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
 /* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
-import config from '@payload-config'
-import '@payloadcms/next/css'
-import { GRAPHQL_PLAYGROUND_GET } from '@payloadcms/next/routes'
+import config from "@payload-config"
+import "@payloadcms/next/css"
+import { GRAPHQL_PLAYGROUND_GET } from "@payloadcms/next/routes"
 
 export const GET = GRAPHQL_PLAYGROUND_GET(config)

package/templates/marketing/payload/src/app/(payload)/layout.tsx

@@ -0,0 +1,31 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from "@payload-config"
+import "@payloadcms/next/css"
+import { RootLayout, handleServerFunctions } from "@payloadcms/next/layouts"
+import type { ServerFunctionClient } from "payload"
+import type React from "react"
+
+import { importMap } from "./admin/importMap.js"
+import "./custom.scss"
+
+type Args = {
+	children: React.ReactNode
+}
+
+const serverFunction: ServerFunctionClient = async (args) => {
+	"use server"
+	return handleServerFunctions({
+		...args,
+		config,
+		importMap,
+	})
+}
+
+const Layout = ({ children }: Args) => (
+	<RootLayout config={config} importMap={importMap} serverFunction={serverFunction}>
+		{children}
+	</RootLayout>
+)
+
+export default Layout

package/templates/marketing/payload/src/blocks/ArchiveBlock/Component.tsx

@@ -0,0 +1,65 @@
+import type { ArchiveBlock as ArchiveBlockProps, Post } from "@/payload-types"
+
+import RichText from "@/components/RichText"
+import configPromise from "@payload-config"
+import { getPayload } from "payload"
+import type React from "react"
+
+import { CollectionArchive } from "@/components/CollectionArchive"
+
+export const ArchiveBlock: React.FC<
+	ArchiveBlockProps & {
+		id?: string
+	}
+> = async (props) => {
+	const { id, categories, introContent, limit: limitFromProps, populateBy, selectedDocs } = props
+
+	const limit = limitFromProps || 3
+
+	let posts: Post[] = []
+
+	if (populateBy === "collection") {
+		const payload = await getPayload({ config: configPromise })
+
+		const flattenedCategories = categories?.map((category) => {
+			if (typeof category === "object") return category.id
+			else return category
+		})
+
+		const fetchedPosts = await payload.find({
+			collection: "posts",
+			depth: 1,
+			limit,
+			...(flattenedCategories && flattenedCategories.length > 0
+				? {
+						where: {
+							categories: {
+								in: flattenedCategories,
+							},
+						},
+					}
+				: {}),
+		})
+
+		posts = fetchedPosts.docs
+	} else {
+		if (selectedDocs?.length) {
+			const filteredSelectedPosts = selectedDocs.map((post) => {
+				if (typeof post.value === "object") return post.value
+			}) as Post[]
+
+			posts = filteredSelectedPosts
+		}
+	}
+
+	return (
+		<div className="my-16" id={`block-${id}`}>
+			{introContent && (
+				<div className="container mb-16">
+					<RichText className="ms-0 max-w-[48rem]" data={introContent} enableGutter={false} />
+				</div>
+			)}
+			<CollectionArchive posts={posts} />
+		</div>
+	)
+}

package/templates/marketing/payload/src/blocks/ArchiveBlock/config.ts

@@ -0,0 +1,120 @@
+import type { Block } from "payload"
+
+import {
+	AlignFeature,
+	BlockquoteFeature,
+	ChecklistFeature,
+	EXPERIMENTAL_TableFeature,
+	FixedToolbarFeature,
+	HeadingFeature,
+	IndentFeature,
+	InlineCodeFeature,
+	InlineToolbarFeature,
+	OrderedListFeature,
+	RelationshipFeature,
+	StrikethroughFeature,
+	SubscriptFeature,
+	SuperscriptFeature,
+	UnorderedListFeature,
+	UploadFeature,
+	lexicalEditor,
+} from "@payloadcms/richtext-lexical"
+
+export const Archive: Block = {
+	slug: "archive",
+	interfaceName: "ArchiveBlock",
+	fields: [
+		{
+			name: "introContent",
+			type: "richText",
+			editor: lexicalEditor({
+				features: ({ rootFeatures }) => {
+					return [
+						...rootFeatures,
+						HeadingFeature({ enabledHeadingSizes: ["h1", "h2", "h3", "h4"] }),
+						FixedToolbarFeature(),
+						InlineToolbarFeature(),
+						StrikethroughFeature(),
+						SubscriptFeature(),
+						SuperscriptFeature(),
+						InlineCodeFeature(),
+						BlockquoteFeature(),
+						UnorderedListFeature(),
+						OrderedListFeature(),
+						ChecklistFeature(),
+						AlignFeature(),
+						IndentFeature(),
+						RelationshipFeature(),
+						UploadFeature(),
+						EXPERIMENTAL_TableFeature(),
+					]
+				},
+			}),
+			label: "Intro Content",
+		},
+		{
+			name: "populateBy",
+			type: "select",
+			defaultValue: "collection",
+			options: [
+				{
+					label: "Collection",
+					value: "collection",
+				},
+				{
+					label: "Individual Selection",
+					value: "selection",
+				},
+			],
+		},
+		{
+			name: "relationTo",
+			type: "select",
+			admin: {
+				condition: (_, siblingData) => siblingData.populateBy === "collection",
+			},
+			defaultValue: "posts",
+			label: "Collections To Show",
+			options: [
+				{
+					label: "Posts",
+					value: "posts",
+				},
+			],
+		},
+		{
+			name: "categories",
+			type: "relationship",
+			admin: {
+				condition: (_, siblingData) => siblingData.populateBy === "collection",
+			},
+			hasMany: true,
+			label: "Categories To Show",
+			relationTo: "categories",
+		},
+		{
+			name: "limit",
+			type: "number",
+			admin: {
+				condition: (_, siblingData) => siblingData.populateBy === "collection",
+				step: 1,
+			},
+			defaultValue: 10,
+			label: "Limit",
+		},
+		{
+			name: "selectedDocs",
+			type: "relationship",
+			admin: {
+				condition: (_, siblingData) => siblingData.populateBy === "selection",
+			},
+			hasMany: true,
+			label: "Selection",
+			relationTo: ["posts"],
+		},
+	],
+	labels: {
+		plural: "Archives",
+		singular: "Archive",
+	},
+}