title: Sanity.io - Image URL exposure for preview/select
body: <p>I have been using and enjoying Sanity and am currently doing a reasonable sized CMS build with this. I am attempting to set some &quot;preview&quot; images for a gallery of images (using type array).
  Having trawled through the docs I am unable to find the solution I am looking for - and judging by their usage of the <code>preview</code> setting in the schema I am unable to replicate the same usage of <code>image.asset.url</code> as it is not in the object when logged.</p>
  <p>Any help would be greatly appreciated - I assume theres a configuration issue or a package I may not have that helps to expose this. But after looking at multiple Sanity Test Repo's, none have anything that sticks out.</p>
  <p>Schema Code.</p>
  <pre><code>export default {
      name: &quot;imageSliderBlock&quot;,
      type: &quot;object&quot;,
      title: &quot;Image Slider Block&quot;,
      fields: [
          {
              name: &quot;slider&quot;,
              type: &quot;array&quot;,
              title: &quot;Slider&quot;,
              options: {
                  layout: 'grid'
              },
              of: [
                  {
                      // These are the images I am attempting to query
                      name: &quot;image&quot;,
                      type: &quot;image&quot;,
                      title: &quot;Slide Image&quot;,
                      options: {
                          hotspot: true,
                      },
                      fields: [
                          {
                              name: &quot;alt&quot;,
                              type: &quot;string&quot;,
                              title: &quot;Alternative Text&quot;,
                              validation: Rule =&gt; Rule.error('You have to fill out the alternative text.').required(),
                              options: {
                                  isHighlighted: true,
                              }
                          }
                      ]
                  }
              ]
          }
      ],
      preview: {
          select: {
              // This is the query that should work
              // It should find the first array index within the name:slider
              // and grab the asset url within the object.
              media: 'slider.0.asset.url'
          },
          prepare: ({media}) =&gt; {
              // Returns only asset._ref and asset._type:reference
              console.log(media);
              return {
                  title: &quot;Image Slider Block&quot;,
              }
          }
      }
  }
  </code></pre>
  <p>NOTE: The following is the <code>console.log()</code> from calling &gt; <code>media: slider.0</code> to show the object (as obviously the above schema won't work as I have stated theres no <code>asset.url</code> in the object.</p>
  <pre><code>{_type: &quot;image&quot;, asset: {…}}
  asset:
  _ref: &quot;image-cd7896b89af6cbd0feb9d47dc1ebd6cff396f400-1755x1241-png&quot;
  _type: &quot;reference&quot;
  __proto__: Object
  _type: &quot;image&quot;
  __proto__: Object
  </code></pre>