Content Delivery and SEO

import { defineContentType, field } from "@vitnode/core/content"

export const articleContentType = defineContentType({
  id: "blog.article",
  tableName: "blog_articles",
  publication: { enabled: true },
  editorial: { enabled: true },
  fields: {
    excerpt: field.textarea({ nullable: true }),
    slug: field.slug({ source: "title" }),
    title: field.text({ required: true }),
  },
  publicApi: {
    enabled: true,
    fields: ["id", "title", "slug", "excerpt", "publishedAt"],
    path: "articles",
  },
  delivery: {
    enabled: true,
    redirects: { enabled: true },
    seo: {
      descriptionField: "excerpt",
      titleField: "title",
    },
    sitemap: { enabled: true, changeFrequency: "weekly", priority: 0.8 },
  },
})

import { definePluginRoutes, lazy, page } from "@vitnode/core/routing"

export const routes = definePluginRoutes([
  page("/articles/:slug", {
    component: lazy(() => import("./pages/article-page")),
  }),
])

import type { PluginRoutePageProps } from "@vitnode/core/routing"
import { definePluginRoute } from "@vitnode/core/routing"

interface Article {
  excerpt: string | null
  title: string
}

export const route = definePluginRoute({
  load: async ({ params }) => await fetchArticle(params.slug),
  head: ({ loaderData }) => ({
    description: loaderData?.excerpt,
    title: loaderData?.title,
  }),
})

const ArticlePage = ({ loaderData }: PluginRoutePageProps<Article>) => (
  <article className="container mx-auto max-w-3xl p-4">
    <h2 className="text-3xl font-semibold">{loaderData.title}</h2>
    <p>{loaderData.excerpt}</p>
  </article>
)

export default ArticlePage