👋 Next.js Conf 2024: Come build, party, run, and connect with us! See all events

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– 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.

Was this answer helpful?