Skip to content
Watch a live product demo 👀 See how Sanity powers richer commerce experiences
Get help on SlackWatch Sanity demo

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.io – build remarkable experiences at scale

Sanity is a customizable solution that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Get startedWatch demo

Categorized in

Related answers

Get more help in the community Slack

TopicCategoriesFeaturedRepliesLast Updated
After adding the subtitle and running this code npm run graphql-deploy It does nothingSep 15, 2020
how to limit a reference to just one entry in Studio reference input side versus the default as-many-entries-as-you-fill-in-an-array...Sep 18, 2020
Is it possible to fetch more than one "_type" using GROQ?Nov 2, 2020
I want to add a view with the Structure builder (S.view.component) where I list similar documents based on the title. What...Sep 23, 2020
Is there a structure builder example where the format of each preview for the document list is modified?Feb 3, 2021
I have an array of references to a country schema type but it always just returns NULL values for meJan 30, 2021
Hi, I need help with a query for getting the url of an image asset. Here is what I've been trying, but I only get the _ref...Dec 1, 2020
Sanity UI looks brilliant :smiley: Is something like the current date picker possible at the moment? I’m not sure if anicon...Dec 21, 2020
Hey everyone. I have been coding and may have potentially accidentally deleted something. Does anyone know how to resolve...Dec 26, 2020
Hello everyone and happy new year :raised_hands::skin-tone-2:, I have a problem with outputting Portable Text :disappointed:...Jan 1, 2021

Related contributions

Clean Next.js + Sanity app
Template

Featured
Official

A clean example of Next.js with embedded Sanity ready for recomposition.

Cody Olsen

Blog with Built-in Content Editing
Template

Featured
Official

A Sanity-powered blog with built-in content editing and instant previews.