NextJS app error when accessing post author information in Sanity.io

Hi, I am trying to figure out why

*[_type == "post"] | order(publish_date desc)

); returns [Object] in the results{
_createdAt: '2023-01-21T23
:38:11Z', _id: '9cfb89fd-66cb-45f9-b310-b2990782c325',
_rev: '0yPlmSh0SROjoBusCs2gsT',
_type: 'post',
_updatedAt: '2023-02-18T15
:43:28Z',
authors: [ [Object] ], banner_image: {
_type: 'image',
alt_text: 'Test Caption',
caption: 'Test Caption'
},

Where as this query ``*[_type == "post" && slug.current == $slug][0]`,{ slug },)` returns the expanded results for
Authors
_type: 'post',
_updatedAt: '2023-02-18T15
:43:28Z',
authors: [
{
_key: '97b1a4c0eb70',
_type: 'author',

data rendered in a console or in a terminal window truncates large objects to save memory. when you scope the query to single post the rendered object(array) is visible. in both instance they are “expanded” or if you dumped this query into a file they would both be fully visible.

this is just how it is visible in the preview but the data is fully accessible in both instances.

I hope thats clear. it has nothing to do with GROK, its only visual.

here is a article on how to get the full print of the return value if you are dumping this using console https://dev.to/samueldjones/using-console-dir-to-print-javascript-objects-in-the-console-3jkh

Thanks for your replies ... however, in my NextJS app, I get the following error ...

TypeError: Cannot read properties of undefined (reading '0')
On this statement

post.authors[0].profile_picture

So not sure what I am doing wrong.

Thanks in advance for your insight

not sure. would need to see your code. I assume posts are being iterated over?

what happens when you log

post

?

is there a possibility that some posts dont have authors? cause then you need to conditionally check to make sure authors exists first.

There is only 1 post in the result set ... A post can have multiple authors and an getting the 1st author's info ... [0]...

The post object is passed in...
const Post = ({ post }) => { ....

console log

post

verify that the post object has the properties you need.

Here is the log ...
[
{
_createdAt: '2023-01-21T23
:38:11Z', _id: '9cfb89fd-66cb-45f9-b310-b2990782c325',
_rev: '0yPlmSh0SROjoBusCs2gsT',
_type: 'post',
_updatedAt: '2023-02-18T15
:43:28Z', authors: [ [Object] ],
banner_image: {
_type: 'image',
alt_text: 'Test Caption',
caption: 'Test Caption'
},
body: [
[Object], [Object],
[Object], [Object],
[Object], [Object],
[Object], [Object]
],
category: [ 'Strategy' ],
headline: 'Lets make a big deal of this post. We want to bring in traffic to this post, so lets make it happen',
publish_date: '2023-01-21T23
:34:00.000Z', slug: { _type: 'slug', current: 'test-post' },
title: 'This is the title of the post2'
}
]
error - pages/posts/[slug].js (202:36) @ Post
error - TypeError: Cannot read properties of undefined (reading '0')
at Post (webpack-internal
:///./pages/posts/[slug].js:372:70) at processChild (/Users/donaldhook/Library/Mobile Documents/com~apple~CloudDocs/NextJS/fullonconsulting/node_modules/react-dom/cjs/react-dom-server.node.development.js
:3353:14) at resolve (/Users/donaldhook/Library/Mobile Documents/com~apple~CloudDocs/NextJS/fullonconsulting/node_modules/react-dom/cjs/react-dom-server.node.development.js
:3270:5) at ReactDOMServerRenderer.render (/Users/donaldhook/Library/Mobile Documents/com~apple~CloudDocs/NextJS/fullonconsulting/node_modules/react-dom/cjs/react-dom-server.node.development.js
:3753:22) at ReactDOMServerRenderer.read (/Users/donaldhook/Library/Mobile Documents/com~apple~CloudDocs/NextJS/fullonconsulting/node_modules/react-dom/cjs/react-dom-server.node.development.js
:3690:29) at Object.renderToString (/Users/donaldhook/Library/Mobile Documents/com~apple~CloudDocs/NextJS/fullonconsulting/node_modules/react-dom/cjs/react-dom-server.node.development.js
:4298:27) at Object.renderPage (/Users/donaldhook/Library/Mobile Documents/com~apple~CloudDocs/NextJS/fullonconsulting/node_modules/next/dist/server/render.js
:662:46) at Object.defaultGetInitialProps (/Users/donaldhook/Library/Mobile Documents/com~apple~CloudDocs/NextJS/fullonconsulting/node_modules/next/dist/server/render.js
:332:67) at MyDocument.getInitialProps (webpack-internal
:///./node_modules/next/dist/pages/_document.js:21:20) at Object.<anonymous> (/Users/donaldhook/Library/Mobile Documents/com~apple~CloudDocs/NextJS/fullonconsulting/node_modules/next/dist/shared/lib/utils.js
:75:33) { page: '/posts/[slug]'
}
200 | <div className="w-1/2">
201 | <Image

202 | src={post.authors[0].profile_picture}

ok well now its obv you need

post[0].authors[0].profile_picture

I tried that ... I thought the post was an array... but it was not ...

Same error ...

? you’re not doing it though

post is an array.

That was it ...

So the one query since I am using the slug as a parameter, returns a single object and the query which gets all the posts, is an array ...

Thank you for your time and help!!