Issue with previewing a predefined list in Sanity schema
3 replies
Last updated: Jun 23, 2023
Y
Hey all, I am unsure if this is correct (from Previewing from predefined string lists ):
If you wish to use that value in your preview, Sanity will default to providing theI have a predefined list and the “preview” insists on using thetitle…
valueinstead of the
title. Here is my schema:
export default {
name: 'bigGulp',
title: 'Big Gulp',
type: 'object',
fields: [
{
name: "Type",
type: "string",
options: {
list: [
{
title: 'Small',
value: 'small'
},
{
title: 'Regular',
value: 'regular'
}
],
layout: 'dropdown'
}
}
],
}Jun 21, 2023, 10:22 AM
Y
Here is how it is “previewed”
Jun 21, 2023, 10:35 AM
K
Hey Yousef,
There are a few things.
1. You'll need a
Previewing from predefined lists documentation.
Here's the updated code, and for fun, I gave you an icon (to see it, you might need to install
There are a few things.
1. You'll need a
previewobject to customize the preview2. Change the
nameto
type(although, a better choice in this case might be
size), and add a
titleof
Type(although, I would suggest
sizehere as well)I have updated your code based on the
Previewing from predefined lists documentation.
Here's the updated code, and for fun, I gave you an icon (to see it, you might need to install
react-icons), and included some TypeScript.
import { BsCupStraw as icon } from 'react-icons/bs'
import { defineField, defineType } from 'sanity'
const TYPES = [
{
title: 'Small',
value: 'small'
},
{
title: 'Regular',
value: 'regular'
}
]
export default defineType({
name: 'bigGulp',
title: 'Big Gulp',
type: 'object',
icon,
fields: [
defineField({
title: "Type",
name: "type",
type: "string",
options: {
list: TYPES,
layout: 'dropdown'
}
})
],
preview: {
select: {
type: 'type',
},
prepare({ type }) {
const typeName = type && TYPES.flatMap(option => option.value === type ? [option.title] : [])
return {
title: `${typeName}`
}
},
},
})Jun 21, 2023, 6:32 PM
Y
Thanks for that KJ, I think I got side-tracked by the quote from that page in my original message (and the fact that it references “the second example above”). I thought that using the preview object without the prepare function would give me the title as it says on the page. Thanks for the help and also showing me how to do the icons 😉
Jun 23, 2023, 9:27 AM
Sanity– build remarkable experiences at scale
Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.