GROQ Query Response - Making a Separate Property the Property an Object

9 replies

Last updated: Oct 6, 2021

I'm having trouble with a query. Not sure if what I'd like to do is possible.
The query:

*[_type == "post"][0] {
  	mainImage,
    "lqip": mainImage.asset->metadata.lqip
}

returns:

{
  "lqip": "data:image/jpeg;base64,/9j/2wBDAAYEBQYFBAYGBQYHBw...",
  "mainImage": {
    "_type": "image",
    "altText": "Mountains with pink sky and turquoise water",
    "asset": {
      "_ref": "image-db89f238f31f609d2cac163248de2105d4c1f06c-3374x2000-jpg",
      "_type": "reference"
    }
  }
}

I'd like

lqip

to be a property of the

mainImage

object:

{
  "mainImage": {
    "_type": "image",
    "altText": "Mountains with pink sky and turquoise water",
    "lqip": "data:image/jpeg;base64,/9j/2wBDAAYEBQYFBAYGBQYHBw...",
    "asset": {
      "_ref": "image-db89f238f31f609d2cac163248de2105d4c1f06c-3374x2000-jpg",
      "_type": "reference"
    }
  }
}

Is there a way to achieve this?

Oct 6, 2021, 1:13 AM

Could you try:

*[_type == 'post'][0]{
  mainImage{
  	...,
  	'lqip': ^.mainImage.asset->metadata.lqip,
  }
}

Oct 6, 2021, 1:18 AM

Hey Geoff, I'll give it a try.

Oct 6, 2021, 1:19 AM

Just getting on a computer to check this.

Oct 6, 2021, 1:20 AM

Just tried and it works perfectly.

Oct 6, 2021, 1:20 AM

Thanks very much Geoff. Still getting my mind wrapped around these kinds of queries. Really appreciate the help.

Oct 6, 2021, 1:21 AM

This should do the same and removes some complexity:

*[_type == 'post'][0]{
  mainImage{
  	...,
  	'lqip': asset->metadata.lqip,
  }
}

Oct 6, 2021, 1:21 AM

Oh cool, I'll try it.

Oct 6, 2021, 1:22 AM

You’re welcome! Yes, they can get complex but are sure powerful. It’s fun when you try a query and it works. 🙂

Oct 6, 2021, 1:22 AM

Definitely! Yeah that one is simpler and intuitive. Works perfectly.

Oct 6, 2021, 1:23 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.

Get started for free Explore the demo

GROQ Query Response - Making a Separate Property the Property an Object

Sanity– build remarkable experiences at scale

Was this answer helpful?