kofi-stack-template-generator 2.1.27 → 2.1.28

package/templates/marketing/payload/src/endpoints/seed/index.ts.hbs

@@ -0,0 +1,235 @@
+import type { CollectionSlug, File, Payload, PayloadRequest } from "payload"
+
+import { home } from "./home"
+import { image1 } from "./image-1"
+import { image2 } from "./image-2"
+import { imageHero } from "./image-hero"
+import { post1 } from "./post-1"
+
+const collections: CollectionSlug[] = [
+  "categories",
+  "media",
+  "pages",
+  "posts",
+]
+
+const categories = ["Technology", "News", "Finance", "Design", "Software", "Engineering"]
+
+// Next.js revalidation errors are normal when seeding the database without a server running
+// i.e. running `yarn seed` locally instead of using the admin UI within an active app
+// The app is not running to revalidate the pages and so the API routes are not available
+// These error messages can be ignored: `Error hitting revalidate route for...`
+export const seed = async ({
+  payload,
+  req,
+}: {
+  payload: Payload
+  req: PayloadRequest
+}): Promise<void> => {
+  payload.logger.info("Seeding database...")
+
+  // we need to clear the media directory before seeding
+  // as well as the collections and globals
+  // this is because while `yarn seed` drops the database
+  // the custom `/api/seed` endpoint does not
+  payload.logger.info(`— Clearing collections and globals...`)
+
+  // clear the database - header
+  await payload.updateGlobal({
+    slug: "header",
+    data: {
+      navItems: [],
+    },
+    depth: 0,
+    context: {
+      disableRevalidate: true,
+    },
+  })
+
+  // clear the database - footer
+  await payload.updateGlobal({
+    slug: "footer",
+    data: {
+      columns: [],
+      socialLinks: {},
+      newsletter: { enabled: false },
+      copyrightText: "",
+      bottomLinks: [],
+    },
+    depth: 0,
+    context: {
+      disableRevalidate: true,
+    },
+  })
+
+  await Promise.all(
+    collections.map((collection) => payload.db.deleteMany({ collection, req, where: {} })),
+  )
+
+  await Promise.all(
+    collections
+      .filter((collection) => Boolean(payload.collections[collection].config.versions))
+      .map((collection) => payload.db.deleteVersions({ collection, req, where: {} })),
+  )
+
+  payload.logger.info(`— Seeding demo author and user...`)
+
+  await payload.delete({
+    collection: "users",
+    depth: 0,
+    where: {
+      email: {
+        equals: "demo-author@example.com",
+      },
+    },
+  })
+
+  payload.logger.info(`— Seeding media...`)
+
+  const [image1Buffer, image2Buffer, heroBuffer] = await Promise.all([
+    fetchFileByURL(
+      "https://raw.githubusercontent.com/payloadcms/payload/refs/heads/main/templates/website/src/endpoints/seed/image-post1.webp",
+    ),
+    fetchFileByURL(
+      "https://raw.githubusercontent.com/payloadcms/payload/refs/heads/main/templates/website/src/endpoints/seed/image-post2.webp",
+    ),
+    fetchFileByURL(
+      "https://raw.githubusercontent.com/payloadcms/payload/refs/heads/main/templates/website/src/endpoints/seed/image-hero1.webp",
+    ),
+  ])
+
+  const [demoAuthor, image1Doc, image2Doc, imageHeroDoc] = await Promise.all([
+    payload.create({
+      collection: "users",
+      data: {
+        name: "Demo Author",
+        email: "demo-author@example.com",
+        password: "password",
+      },
+    }),
+    payload.create({
+      collection: "media",
+      data: image1,
+      file: image1Buffer,
+    }),
+    payload.create({
+      collection: "media",
+      data: image2,
+      file: image2Buffer,
+    }),
+    payload.create({
+      collection: "media",
+      data: imageHero,
+      file: heroBuffer,
+    }),
+    ...categories.map((category) =>
+      payload.create({
+        collection: "categories",
+        data: {
+          title: category,
+        },
+      }),
+    ),
+  ])
+
+  payload.logger.info(`— Seeding posts...`)
+
+  const post1Doc = await payload.create({
+    collection: "posts",
+    depth: 0,
+    context: {
+      disableRevalidate: true,
+    },
+    data: post1({ heroImage: image1Doc, author: demoAuthor }),
+  })
+
+  payload.logger.info(`— Seeding pages...`)
+
+  await payload.create({
+    collection: "pages",
+    depth: 0,
+    data: home({ heroImage: imageHeroDoc }),
+  })
+
+  payload.logger.info(`— Seeding globals...`)
+
+  await Promise.all([
+    payload.updateGlobal({
+      slug: "header",
+      data: {
+        navItems: [
+          {
+            type: "link",
+            label: "Posts",
+            link: {
+              type: "custom",
+              url: "/posts",
+            },
+          },
+        ],
+      },
+    }),
+    payload.updateGlobal({
+      slug: "footer",
+      data: {
+        columns: [
+          {
+            title: "Resources",
+            links: [
+              {
+                link: {
+                  type: "custom",
+                  label: "Admin",
+                  url: "/admin",
+                },
+              },
+              {
+                link: {
+                  type: "custom",
+                  label: "Payload Docs",
+                  newTab: true,
+                  url: "https://payloadcms.com/docs",
+                },
+              },
+            ],
+          },
+        ],
+        socialLinks: {
+          github: "https://github.com/payloadcms/payload",
+          twitter: "https://x.com/payloadcms",
+        },
+        newsletter: {
+          enabled: true,
+          title: "Newsletter",
+          description: "Stay up to date with the latest updates.",
+          buttonText: "Subscribe",
+          placeholder: "Enter your email",
+        },
+        copyrightText: "{{projectName}}",
+        bottomLinks: [],
+      },
+    }),
+  ])
+
+  payload.logger.info("Seeded database successfully!")
+}
+
+async function fetchFileByURL(url: string): Promise<File> {
+  const res = await fetch(url, {
+    credentials: "include",
+    method: "GET",
+  })
+
+  if (!res.ok) {
+    throw new Error(`Failed to fetch file from ${url}, status: ${res.status}`)
+  }
+
+  const data = await res.arrayBuffer()
+
+  return {
+    name: url.split("/").pop() || `file-${Date.now()}`,
+    data: Buffer.from(data),
+    mimetype: `image/${url.split(".").pop()}`,
+    size: data.byteLength,
+  }
+}

package/templates/marketing/payload/src/endpoints/seed/post-1.ts.hbs

@@ -0,0 +1,252 @@
+import type { Media, User } from "@/payload-types"
+import type { RequiredDataFromCollectionSlug } from "payload"
+
+export type PostArgs = {
+  heroImage: Media
+  author: User
+}
+
+export const post1: (args: PostArgs) => RequiredDataFromCollectionSlug<"posts"> = ({
+  heroImage,
+  author,
+}) => {
+  return {
+    slug: "getting-started",
+    _status: "published",
+    authors: [author],
+    content: {
+      root: {
+        type: "root",
+        children: [
+          {
+            type: "heading",
+            children: [
+              {
+                type: "text",
+                detail: 0,
+                format: 0,
+                mode: "normal",
+                style: "",
+                text: "Welcome to your new Payload CMS site!",
+                version: 1,
+              },
+            ],
+            direction: "ltr",
+            format: "",
+            indent: 0,
+            tag: "h2",
+            version: 1,
+          },
+          {
+            type: "paragraph",
+            children: [
+              {
+                type: "text",
+                detail: 0,
+                format: 0,
+                mode: "normal",
+                style: "",
+                text: "This is a sample post to help you get started. You can edit this post from the admin dashboard or create new ones.",
+                version: 1,
+              },
+            ],
+            direction: "ltr",
+            format: "",
+            indent: 0,
+            textFormat: 0,
+            version: 1,
+          },
+          {
+            type: "heading",
+            children: [
+              {
+                type: "text",
+                detail: 0,
+                format: 0,
+                mode: "normal",
+                style: "",
+                text: "Key Features",
+                version: 1,
+              },
+            ],
+            direction: "ltr",
+            format: "",
+            indent: 0,
+            tag: "h3",
+            version: 1,
+          },
+          {
+            type: "paragraph",
+            children: [
+              {
+                type: "text",
+                detail: 0,
+                format: 0,
+                mode: "normal",
+                style: "",
+                text: "Payload CMS provides a powerful and flexible content management system that integrates seamlessly with Next.js. Some key features include:",
+                version: 1,
+              },
+            ],
+            direction: "ltr",
+            format: "",
+            indent: 0,
+            textFormat: 0,
+            version: 1,
+          },
+          {
+            type: "list",
+            children: [
+              {
+                type: "listitem",
+                children: [
+                  {
+                    type: "text",
+                    detail: 0,
+                    format: 0,
+                    mode: "normal",
+                    style: "",
+                    text: "Fully customizable collections and fields",
+                    version: 1,
+                  },
+                ],
+                direction: "ltr",
+                format: "",
+                indent: 0,
+                value: 1,
+                version: 1,
+              },
+              {
+                type: "listitem",
+                children: [
+                  {
+                    type: "text",
+                    detail: 0,
+                    format: 0,
+                    mode: "normal",
+                    style: "",
+                    text: "Built-in authentication and access control",
+                    version: 1,
+                  },
+                ],
+                direction: "ltr",
+                format: "",
+                indent: 0,
+                value: 2,
+                version: 1,
+              },
+              {
+                type: "listitem",
+                children: [
+                  {
+                    type: "text",
+                    detail: 0,
+                    format: 0,
+                    mode: "normal",
+                    style: "",
+                    text: "Live preview and draft functionality",
+                    version: 1,
+                  },
+                ],
+                direction: "ltr",
+                format: "",
+                indent: 0,
+                value: 3,
+                version: 1,
+              },
+              {
+                type: "listitem",
+                children: [
+                  {
+                    type: "text",
+                    detail: 0,
+                    format: 0,
+                    mode: "normal",
+                    style: "",
+                    text: "SEO optimization tools",
+                    version: 1,
+                  },
+                ],
+                direction: "ltr",
+                format: "",
+                indent: 0,
+                value: 4,
+                version: 1,
+              },
+            ],
+            direction: "ltr",
+            format: "",
+            indent: 0,
+            listType: "bullet",
+            start: 1,
+            tag: "ul",
+            version: 1,
+          },
+          {
+            type: "paragraph",
+            children: [
+              {
+                type: "text",
+                detail: 0,
+                format: 0,
+                mode: "normal",
+                style: "",
+                text: "Visit the ",
+                version: 1,
+              },
+              {
+                type: "link",
+                children: [
+                  {
+                    type: "text",
+                    detail: 0,
+                    format: 0,
+                    mode: "normal",
+                    style: "",
+                    text: "admin dashboard",
+                    version: 1,
+                  },
+                ],
+                direction: "ltr",
+                fields: {
+                  linkType: "custom",
+                  newTab: false,
+                  url: "/admin",
+                },
+                format: "",
+                indent: 0,
+                version: 3,
+              },
+              {
+                type: "text",
+                detail: 0,
+                format: 0,
+                mode: "normal",
+                style: "",
+                text: " to start managing your content.",
+                version: 1,
+              },
+            ],
+            direction: "ltr",
+            format: "",
+            indent: 0,
+            textFormat: 0,
+            version: 1,
+          },
+        ],
+        direction: "ltr",
+        format: "",
+        indent: 0,
+        version: 1,
+      },
+    },
+    heroImage: heroImage.id,
+    meta: {
+      description: "Learn how to get started with your new Payload CMS site.",
+      image: heroImage.id,
+      title: "Getting Started with Payload CMS",
+    },
+    relatedPosts: [],
+    title: "Getting Started with Payload CMS",
+  }
+}

package/templates/marketing/payload/src/fields/defaultLexical.ts.hbs

@@ -0,0 +1,73 @@
+import {
+  AlignFeature,
+  BlockquoteFeature,
+  BoldFeature,
+  ChecklistFeature,
+  EXPERIMENTAL_TableFeature,
+  IndentFeature,
+  InlineCodeFeature,
+  ItalicFeature,
+  LinkFeature,
+  type LinkFields,
+  OrderedListFeature,
+  ParagraphFeature,
+  RelationshipFeature,
+  StrikethroughFeature,
+  SubscriptFeature,
+  SuperscriptFeature,
+  UnderlineFeature,
+  UnorderedListFeature,
+  UploadFeature,
+  lexicalEditor,
+} from "@payloadcms/richtext-lexical"
+import type { TextFieldSingleValidation } from "payload"
+
+export const defaultLexical = lexicalEditor({
+  features: [
+    ParagraphFeature(),
+    UnderlineFeature(),
+    BoldFeature(),
+    ItalicFeature(),
+    StrikethroughFeature(),
+    SubscriptFeature(),
+    SuperscriptFeature(),
+    InlineCodeFeature(),
+    BlockquoteFeature(),
+    UnorderedListFeature(),
+    OrderedListFeature(),
+    ChecklistFeature(),
+    AlignFeature(),
+    IndentFeature(),
+    RelationshipFeature(),
+    UploadFeature(),
+    EXPERIMENTAL_TableFeature(),
+    LinkFeature({
+      enabledCollections: ["pages", "posts"],
+      fields: ({ defaultFields }) => {
+        const defaultFieldsWithoutUrl = defaultFields.filter((field) => {
+          if ("name" in field && field.name === "url") return false
+          return true
+        })
+
+        return [
+          ...defaultFieldsWithoutUrl,
+          {
+            name: "url",
+            type: "text",
+            admin: {
+              condition: (_data, siblingData) => siblingData?.linkType !== "internal",
+            },
+            label: ({ t }) => t("fields:enterURL"),
+            required: true,
+            validate: ((value, options) => {
+              if ((options?.siblingData as LinkFields)?.linkType === "internal") {
+                return true // no validation needed, as no url should exist for internal links
+              }
+              return value ? true : "URL is required"
+            }) as TextFieldSingleValidation,
+          },
+        ]
+      },
+    }),
+  ],
+})

package/templates/marketing/payload/src/fields/index.ts.hbs

@@ -0,0 +1,3 @@
+export { link, appearanceOptions, type LinkAppearances } from "./link"
+export { linkGroup } from "./linkGroup"
+export { defaultLexical } from "./defaultLexical"

package/templates/marketing/payload/src/fields/link.ts.hbs

@@ -0,0 +1,139 @@
+import type { Field, GroupField } from "payload"
+
+import deepMerge from "@/utilities/deepMerge"
+
+export type LinkAppearances = "default" | "outline"
+
+export const appearanceOptions: Record<LinkAppearances, { label: string; value: string }> = {
+  default: {
+    label: "Default",
+    value: "default",
+  },
+  outline: {
+    label: "Outline",
+    value: "outline",
+  },
+}
+
+type LinkType = (options?: {
+  appearances?: LinkAppearances[] | false
+  disableLabel?: boolean
+  overrides?: Partial<GroupField>
+}) => Field
+
+export const link: LinkType = ({ appearances, disableLabel = false, overrides = {} } = {}) => {
+  const linkResult: GroupField = {
+    name: "link",
+    type: "group",
+    admin: {
+      hideGutter: true,
+    },
+    fields: [
+      {
+        type: "row",
+        fields: [
+          {
+            name: "type",
+            type: "radio",
+            admin: {
+              layout: "horizontal",
+              width: "50%",
+            },
+            defaultValue: "reference",
+            options: [
+              {
+                label: "Internal link",
+                value: "reference",
+              },
+              {
+                label: "Custom URL",
+                value: "custom",
+              },
+            ],
+          },
+          {
+            name: "newTab",
+            type: "checkbox",
+            admin: {
+              style: {
+                alignSelf: "flex-end",
+              },
+              width: "50%",
+            },
+            label: "Open in new tab",
+          },
+        ],
+      },
+    ],
+  }
+
+  const linkTypes: Field[] = [
+    {
+      name: "reference",
+      type: "relationship",
+      admin: {
+        condition: (_, siblingData) => siblingData?.type === "reference",
+      },
+      label: "Document to link to",
+      relationTo: ["pages", "posts"],
+      required: true,
+    },
+    {
+      name: "url",
+      type: "text",
+      admin: {
+        condition: (_, siblingData) => siblingData?.type === "custom",
+      },
+      label: "Custom URL",
+      required: true,
+    },
+  ]
+
+  if (!disableLabel) {
+    linkTypes.map((linkType) => ({
+      ...linkType,
+      admin: {
+        ...linkType.admin,
+        width: "50%",
+      },
+    }))
+
+    linkResult.fields.push({
+      type: "row",
+      fields: [
+        ...linkTypes,
+        {
+          name: "label",
+          type: "text",
+          admin: {
+            width: "50%",
+          },
+          label: "Label",
+          required: true,
+        },
+      ],
+    })
+  } else {
+    linkResult.fields = [...linkResult.fields, ...linkTypes]
+  }
+
+  if (appearances !== false) {
+    let appearanceOptionsToUse = [appearanceOptions.default, appearanceOptions.outline]
+
+    if (appearances) {
+      appearanceOptionsToUse = appearances.map((appearance) => appearanceOptions[appearance])
+    }
+
+    linkResult.fields.push({
+      name: "appearance",
+      type: "select",
+      admin: {
+        description: "Choose how the link should be rendered.",
+      },
+      defaultValue: "default",
+      options: appearanceOptionsToUse,
+    })
+  }
+
+  return deepMerge(linkResult, overrides)
+}