Get a peek at our latest innovations at Sanity Product Day on Dec 8th →

Content Blocks - Is it Possible to Conditionally Hide Array Types?

3 replies
Last updated: Jun 28, 2022

Hey, all! I have an array of various object types and I want to conditionally hide some of those array types based on the value of another field. I've tried a bunch of different things and nothing seems to work. Would appreciate any advice! Here's an example of what I'm trying to do (for the last item):

{
  name: 'blocks',
  title: 'Content Blocks',
  type: 'array',
  of: [
    { type: 'introBlock' },
    { type: 'subscriptionBlock' },
    { type: 'pressMentionsBlock' },
    { type: 'videoBlock' },
    { type: 'recirculationBlock' },
    { type: 'profileBlock' },
    { type: 'eventBlock' },
    { type: 'blogFeedBlock' },
    { type: 'imagesBlock' },
    { type: 'preFooterBlock' },
    {
      type: 'blogListingBlock',
      hidden: ({ document }) => document.pageType !== 'blogListing',
    },
  ],
},

Jun 22, 2022, 3:55 PM

There currently isn't a way of conditionally showing options inside of an array. You could use conditional fields to return an entirely different array depending on another field though.

Jun 27, 2022, 7:09 PM

Thanks for the response! I ended up having some more complex requirements for singleton pages, so I just used a different document altogether that has a different set of blocks, but what you're suggesting was the next thing I tried and it worked well. Appreciate it!

Jun 27, 2022, 11:59 PM

Glad you got it figured out!

Jun 28, 2022, 12:06 AM

Sanity.io: Get the most out of your content

Sanity.io is a platform to build websites and applications. It comes with great APIs that let you treat content like data. Free to get started, and pay-as-you-go on all plans. Find out more.