Sanity Helper Functions

Jun 5, 2024

Pro Tips

Read time: 1 minute

Mitchell Christ

Bill Murray holding a sign that says "Don't Repeat Yourself", a ground hog sticking his head out of the ground, film still from the movie Ground Hog day

An important rule in programming is: DRY

Don't Repeat Yourself

This starter template comes included with a number of helper functions to use in your Sanity Studio so you don't have to repeat yourself.

Structure Helpers¶

Customizing and organizing your Sanity Studio structure (where your content lives) is super easy. Here's a handy cheat sheet, too.

Singleton¶

sanity/src/structure.ts

import { singleton } from './utils'

S.list()
  .title('Content')
  .items([
    // ...
    singleton(S, 'yourDocumentId').icon(...)
  ])

Group¶

sanity/src/structure.ts

import { group } from './utils'

S.list()
  .title('Content')
  .items([
    // ...
    group(S, 'Group name', [
      S.documentTypeListItem('logo').title('Logos'),
      S.documentTypeListItem('testimonial').title('Testimonials'),
    ]).icon(...),
  ])

Preview Helpers¶

Customizing previews are also super easy. Here's official documentation on that.

Converting PortableText to a string¶

import { getBlockText } from '@sanity/src/utils'

preview: {
  select: {
    content: 'content' // this is a block type (a.k.a. PortableText)
  },
  prepare: ({ content }) => ({
    title: getBlockText(content)
  })
}

Preview of portable text when used with the helper function — Line breaks will be rendered as arrows ("↩︎")

Item count¶

import { count } from '@sanity/src/utils'

preview: {
  select: {
    items: 'items' // this is an array type
  },
  prepare: ({ items }) => ({
    title: count(items)  // 1 item, 2 items
    title: count(items, 'pikachu')  // 1 pikachu, 2 pikachus
    title: count(items, 'octopus', 'octopi')  // 1 octopus, 2 octopi
  })
}

Source Code¶

The source code for all helper functions can be found here.