Filter repeatable zone by text

So I have this document where I have a title and a text and in the repeatable zone I have an image, a neighborhood id, and a text like this:

My question is if I can filter the repeatable zone to get the one that matches the neighborhood id, so, let's say this is my data:

    {
      title: "Neighborhood",
      blog_link_text: "Visit Our Blog",
      repeat: [
        {
          main_image: "www.example.com/Roma.jpg",
          neighborhood_id: "Roma",
          description: "really long text"
        },
        {
          main_image: "www.example.com/Polanco.jpg",
          neighborhood_id: "Polanco",
          description: "really long text"
        },
        {
          main_image: "www.example.com/condesa.jpg",
          neighborhood_id: "condesa",
          description: "really long text"
        }
      ]
    }

And from the front-end, I set the neighborhood_id to Roma, I would like to get the title, the blog_link_text, and only the repeatable zone that matches that Id, so the result would be something like this:

    {
      title: "Neighborhood",
      blog_link_text: "Visit Our Blog",
      repeat: [
        {
          main_image: "www.example.com/Roma.jpg",
          neighborhood_id: "Roma",
          description: "really long text"
        },
      ]
    }

Please let me know if this is even possible.

Thanks!

Hey @cms1, welcome to the forum!

Seems like you need to add a conditional statement to render a specific part of a document.
For example, if you have a neighborhood component, first you loop over the array of the repeatable zone and then you can add something simple like a switch case of an if else to verify the neighbourhood_id

slice.items.map((location, i) => { if (location.neighbourhood_id === "Roma"){ // do something } })

Can you tell me more about your use case?
What do you want to render/do after filtering this value?

Thanks for responding, Paulina!

The main problem with that approach is that it will download unnecessary data because there will be several neighborhoods and the field description could have a lot of text.

I think we could close this topic because I ended up creating a repeatable custom type for the neighborhoods and on the front-end I just do this:

cmsClient
    .query(Prismic.predicates.at('my.neighborhood.id', 'Roma'))

So that way I only fetch the neighborhood that I need.

1 Like

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.