personal-website/studio/schemas/blogPost.ts

import {DocumentTextIcon, LinkIcon, InsertBelowIcon, BookIcon} from '@sanity/icons'
import {defineType} from 'sanity'

const blogPost = defineType({
  name: 'blogPost',
  title: 'Blog posts',
  type: 'document',
  icon: DocumentTextIcon,
  fieldsets: [
    {
      name: 'metadata',
      title: 'Social media and SEO',
      description:
        'Data about the article for SEO, social media previews, etc. This is very important for reach and brand awareness since it will be the first contact many people will have with our brand and content!',
      options: {
        collapsible: true,
        collapsed: true,
      },
    },
  ],
  fields: [
    {
      name: 'title',
      title: 'Title',
      type: 'string',
      validation: (r) => r.required(),
      description:
        "The title of the article. Not only will it be used in the article page and list, but also in social previews and other websites, if you don't want to costumise it.",
    },
    {
      name: 'subtitle',
      title: 'Subtitle',
      type: 'array',
      of: [{type: 'block', styles: [{title: 'Normal', value: 'normal'}]}],
      description: 'The subtitle of the article. This will show beneath the title, if you use it.',
    },
    {
      name: 'slug',
      title: 'Slug',
      type: 'slug',
      options: {
        source: 'title',
        maxLength: 96,
      },
      validation: (r) => r.required(),
      description:
        'This will be the URL of this article. E.g. "article-one" will be available at URL "/blog/article-one".',
    },
    {
      name: 'headerImage',
      title: 'Header image',
      type: 'image',
      description:
        'This image will be used as the header image in the article page, on the article list/blog page and also eventually on social previews and other websites.',
      validation: (r) => r.required(),
      fields: [
        {
          title: 'Alt text',
          name: 'altText',
          type: 'string',
          validation: (r) => r.required(),
        },
      ],
      options: {
        hotspot: true,
      },
    },
    {
      name: 'content',
      title: 'Content',
      type: 'array',
      description: 'The body/content of this article.',
      of: [
        {
          type: 'block',
          marks: {
            annotations: [
              {
                name: 'link',
                type: 'object',
                title: 'Link',
                icon: LinkIcon,
                fields: [
                  {
                    type: 'url',
                    name: 'href',
                    title: 'URL',
                  },
                ],
              },
              {
                title: 'Footnote',
                name: 'footnote',
                type: 'object',
                icon: InsertBelowIcon,
                fields: [
                  {
                    title: 'Content',
                    name: 'content',
                    type: 'array',
                    of: [{type: 'block'}],
                  },
                ],
              },
              {
                title: 'Reference',
                name: 'referenceToSource',
                type: 'object',
                icon: BookIcon,
                fields: [
                  {
                    title: 'Author(s)',
                    name: 'authors',
                    type: 'string',
                    validation: (r) => r.required(),
                  },
                  {
                    title: 'Date of publication',
                    name: 'dateOfPublication',
                    type: 'string',
                  },
                  {
                    title: 'Link to reference',
                    name: 'linkToReference',
                    type: 'url',
                  },
                  {
                    title: 'Title',
                    name: 'title',
                    type: 'string',
                  },

                  {
                    title: 'Notes',
                    name: 'notes',
                    type: 'string',
                  },
                ],
              },
            ],
          },
        },
        {
          type: 'image',
          fields: [
            {
              title: 'Caption',
              name: 'caption',
              type: 'array',
              of: [{type: 'block'}],
            },
            {
              title: 'Alt text',
              name: 'altText',
              type: 'string',
              validation: (r) => r.required(),
            },
          ],
        },
      ],
      validation: (r) => r.required(),
    },
    {
      name: 'summary',
      title: 'Summary',
      type: 'string',
      validation: (r) => r.max(160).required(),
    },
    {
      name: 'readTime',
      title: 'Read time',
      type: 'string',
      description: 'Calculated automatically for you.',
      readOnly: true,
      options: {
        hotspot: true,
      },
    },
    {
      name: 'publishDate',
      title: 'Publish date',
      type: 'date',
      description:
        'Leave this empty if you want to use the current date (of publish). If you use a date in the past, everything will go normal. If you use a date in the future, the article will be hidden until that day, on which it will be published automatically.',
    },
    {
      name: 'linkPreviewImage',
      title: 'Link preview image',
      type: 'image',
      description: "If you don't specify this, falls back to 'Header image'",
      fieldset: 'metadata',
    },
    {
      name: 'linkPreviewDescription',
      title: 'Link preview description',
      type: 'string',
      description: "If you don't specify this, falls back to article summary",
      fieldset: 'metadata',
    },
    {
      name: 'twitterCardType',
      title: 'Twitter card type',
      type: 'string',
      description:
        'See https://developer.twitter.com/en/docs/twitter-for-websites/cards/guides/getting-started for more info.',
      options: {
        list: [
          {value: 'summary', title: 'Summary'},
          {
            value: 'summary_large_image',
            title: 'Summary with large image',
          },
          {value: 'player', title: 'Player'},
          {value: 'app', title: 'App'},
        ],
      },
      initialValue: 'summary_large_image',
      validation: (r) => r.required(),
      fieldset: 'metadata',
    },
    {
      name: 'language',
      hidden: true,
      type: 'string',
    },
  ],
  preview: {
    select: {
      title: 'title',
      media: 'headerImage',
    },
  },
})

export default blogPost