👀 Our most exciting product launch yet 🚀 Join us May 8th for Sanity Connect

Implementing dynamic filters and reference multiple types in Sanity.io.

13 replies
Last updated: Dec 24, 2021
Hello!Not sure if it’s doable but, have any of you guys implemented
dynamic filters and reference multiple types at the same time?
I’m looking for something like the following code but having an array of references instead of a single reference:

{
  title: 'Director',
  name: 'director',
  type: 'reference',
  to: [{type: 'person'}],
  options: {
    filter: ({document}) => {
      // Always make sure to check for document properties
      // before attempting to use them
      if (!document.releaseYear) {
        return {
          filter: 'role == $role',
          params: {role: 'director'}
        }
      }
      
      return {
        filter: 'role == $role && birthYear >= $minYear',
        params: {
          role: 'director',
          minYear: document.releaseYear
        }
      }
    }
  }
}
Dec 24, 2021, 7:55 PM
Hi José! You can accomplish this with an array of references . I suspect you’ll want something like:

{
  name: "director",
  title: "Director",
  type: 'array',
  of: [
    {
      type: "reference",
      to: [{ type: "person" }, { type: "people" }, { type: "folks" }],
      options: {
        filter: ({ document }) => {
          // filter logic
        },
      },
    }
  ]
},
Dec 24, 2021, 8:07 PM
Thanks
user A
I tried that before but it seems like the
person | people | folk
data is not accesible at that point. I need to check for example, if
person | people | folk
have a
secondName
and if not they should not be listed in the dropdown.
Dec 24, 2021, 8:29 PM
My approach would be to remove the filter altogether and make sure the full data comes back, then build back in the filter incrementally. If you need any help, do follow up!
Dec 24, 2021, 8:31 PM
I’m sorry, probably the
secondName
field is not a good example. The filter that is need to filter by is actually an optional field, so I should assume that sometimes it will be null.
Dec 24, 2021, 8:41 PM
OR probably I’m not understanding your approach sorry if that’s the case.
Dec 24, 2021, 8:46 PM
What’s the
secondName
field?
Dec 24, 2021, 8:51 PM
Well, this is my actual code:
{
      name: "cards",
      title: "Assets cards",
      type: "array",
      of: [
        {
          type: "reference",
          to: [{ type: "asset" }, { type: "page" }, { type: "post" }],
        },
      ],
},
Dec 24, 2021, 10:00 PM
And what I need to do is to filter assets, pages and posts with a
featuredImage
present.
Dec 24, 2021, 10:01 PM
We want to prevent users from selecting assets, pages or posts without a
featuredImage
which is an optional field.
Dec 24, 2021, 10:03 PM
How about this? It will only return documents where the
featuredImage.asset
object is not null, which indicates there’s a reference to an image asset present.

{
  name: "cards",
  title: "Assets cards",
  type: 'array',
  of: [
    {
      type: "reference",
      to: [{ type: "asset" }, { type: "page" }, { type: "post" }],
      options: {
        filter: 'featuredImage.asset != null',
      },
    }
  ]
},
Dec 24, 2021, 10:32 PM
😮 yeah I will try that, thanks a lot
user A
Dec 24, 2021, 10:41 PM
This may be a case where you want to disable inline reference creation , since from a quick test, I believe your users would be able to create a reference without a
featuredImage
and the picker would allow it.
Dec 24, 2021, 10:55 PM
That’s right, I’ll also add
disableNew: true
Dec 24, 2021, 11:13 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.

Was this answer helpful?