Querying category documents in a Next.js app connected to a Sanity project
9 replies
Last updated: Aug 4, 2021
L
Hi there, was just doing some testing yesterday where I created a Next.js app connected to a Sanity project using the Blog boiler-plate starter project...afterwards, I created 2 posts and 1 category in Sanity Studio then inside the getStaticProps async function in the index.js file of the Next app, I queried multiple variations (via await sanityClient.fetch):1. queried the title & slug for 'post'; and queried the title for 'category'
2. just queried the title & slug for 'post'
3. just queried the title for 'category'
the results for 'post' and 'category' are then passed as props to be consumed by the Home component in the same file (index.js)
From the above, it seems I only get returned data from the 'post' query where the 'category' query returns an empty array when I do a console.log on them in the Home component where I consume them as props. The part I'm failing to understand is when I tested both the 'post' and 'category' GROQ queries on the Vision tab of Sanity Studio both return data hence why is the 'post' query the only one returning data in the Next app?
2. just queried the title & slug for 'post'
3. just queried the title for 'category'
the results for 'post' and 'category' are then passed as props to be consumed by the Home component in the same file (index.js)
From the above, it seems I only get returned data from the 'post' query where the 'category' query returns an empty array when I do a console.log on them in the Home component where I consume them as props. The part I'm failing to understand is when I tested both the 'post' and 'category' GROQ queries on the Vision tab of Sanity Studio both return data hence why is the 'post' query the only one returning data in the Next app?
Aug 4, 2021, 4:13 PM
G
If a document is a draft, you’re working with a private dataset , or the
_idof your document has a dot in it, that document will show up in Vision but not in an unauthenticated query from your front end. Let me know if you need help checking any of those.
Aug 4, 2021, 4:34 PM
L
hi Geoff, thanks for replying...what would I need to check?
Aug 4, 2021, 4:36 PM
G
Probably the easiest way would be to go to a post that’s not appearing in Next.js, hit Publish, rebuild your front end, then check again if it appears on your front end.
Aug 4, 2021, 4:38 PM
G
If a document is a draft, you’re working with a private dataset , or the
_idof your document has a dot in it, that document will show up in Vision but not in an unauthenticated query from your front end. Let me know if you need help checking any of those.
Aug 4, 2021, 4:34 PM
G
Another way would be to add this to your queries in Vision and see if you get the same results as you were on your front end:
So if your query is
&& !(_id in path('drafts.**'))
*[_type == 'post'], now it would be:
*[_type == 'post' && !(_id in path('drafts.**'))]
Aug 4, 2021, 4:40 PM
G
What that’s doing is returning all documents with a
_typeof
post, except those that are drafts (which have an
_idprepended with
drafts.).
Aug 4, 2021, 4:42 PM
L
hi Geoff, so my posts are showing up fine...it's my category documents that are failing to show up
Aug 4, 2021, 4:42 PM
L
in my frontend's console.log I mean
Aug 4, 2021, 4:43 PM
L
ok, sorry just tried publishing that category document I created and it seems to be appearing in the frontend now...do you mind if I DM you because this test was me trying to tinker about a problem that I brought up in the channel about a week and a bit ago...?
Aug 4, 2021, 4:46 PM
Sanity– build remarkable experiences at scale
The Sanity Composable Content Cloud is the headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.