Skip to content
👀 Our most exciting product launch yet 🚀 Join us May 8th for Sanity Connect
Get help on Slack

How to display the parent's label in a preview in Sanity.io

18 replies
Last updated: May 28, 2020
May 28, 2020, 7:36 PM
May 28, 2020, 7:42 PM
user B
Thanks, but this does not work for references.
May 28, 2020, 7:48 PM
export default {
  title: 'Subcategory',
  name: 'subcategory',
  type: 'document',
  fields: [
    {
      title: 'Label',
      name: 'label',
      type: 'string',
    },
    {
      title: 'Parent category',
      name: 'parent',
      type: 'reference',
      to: [{ type: 'category' }],
    },
    {
      title: 'Position',
      name: 'position',
      type: 'number',
    },
  ],
  preview: {
    select: {
      title: 'label',
      subtitle: 'parent',
    },
  },
}
May 28, 2020, 7:48 PM
The 
subtitle
could only be 
parent._ref
which is not helpful information to the user. Is it possible to see the parent’s label?
May 28, 2020, 7:49 PM
I talked with
user M
about this, and he had this suggestion for the filter:
{
  title: 'Subcategory',
  name: 'subcategory',
  type: 'reference',
  to: { type: 'subcategory' },
  options: {
    filter: ({ document }) => {
      if (!document.category) {
        return
      }
      return {
        filter: 'parent._ref == $category',
        params: {
          category: document.category._ref
        }
      }
    }
  }
},

May 28, 2020, 7:51 PM
Oh, sorry. Didn't read your question properly there. 🙂
May 28, 2020, 7:51 PM
And, this for the preview:
...,
preview: {
  select: {
    title: 'name',
    subtitle: 'slug.current',
    media: 'image'
  }
}

May 28, 2020, 7:52 PM
Hey Ben, great to have you here 👋 For the preview question - assuming 
parent
has a field called 
label
, try using 
subtitle: 'parent.label'
instead.
May 28, 2020, 7:55 PM
The 
subtitle
could only be 
parent._ref
which is not helpful information to the user. Is it possible to see the parent’s label?
May 28, 2020, 7:49 PM
Hey Ben, great to have you here 👋 For the preview question - assuming 
parent
has a field called 
label
, try using 
subtitle: 'parent.label'
instead.
May 28, 2020, 7:55 PM
Ah – let me try that. It failed when I put 
subtitle: 'parent'
which it should as parent is an object. But the console showed 
parent
as being an object with just a 
_ref
and 
_id
property. Will try now
May 28, 2020, 7:56 PM
I talked with
user M
about this, and he had this suggestion for the filter:
{
  title: 'Subcategory',
  name: 'subcategory',
  type: 'reference',
  to: { type: 'subcategory' },
  options: {
    filter: ({ document }) => {
      if (!document.category) {
        return
      }
      return {
        filter: 'parent._ref == $category',
        params: {
          category: document.category._ref
        }
      }
    }
  }
},

May 28, 2020, 7:51 PM
Oh, sorry. Didn't read your question properly there. 🙂
May 28, 2020, 7:51 PM
Knut Melvær
user M
The filter works great, wasn’t sure what I could/could not query in the GROQ filter but the 
._ref
works, cheers
May 28, 2020, 7:58 PM
And, this for the preview:
...,
preview: {
  select: {
    title: 'name',
    subtitle: 'slug.current',
    media: 'image'
  }
}

May 28, 2020, 7:52 PM
Now lets try the previews
May 28, 2020, 7:58 PM
That works too! Thanks so much guys, I joked on twitter that I wouldn’t get a response, but you guys have been awesome and so fast!
May 28, 2020, 8:00 PM
We're at least trying 😅
May 28, 2020, 8:03 PM

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.

Get started for freeExplore the demo

Was this answer helpful?