🔮 Sanity Create is here. Writing is reinvented. Try now, no developer setup

Issue with dynamic nested route and `getStaticProps` query for contributions document type.

2 replies
Last updated: Oct 4, 2022
Hi everyone!
I'm stuck on a tricky implementation of a dynamic nested route and am wondering if there may be a smarter way to go about what I'm trying to achieve. I have a feeling the issue lies in the way I'm writing my
business for groq queries, but I'm not 100% sure.
As per the first screenshot, I have a route,
that features the contributions of a particular artist. A given artist ([slug]) may have 3-4 contributions that each should have their own link. For
, I've set up my
as follows (referencing the artist + the reference to their contributions):

export async function getStaticPaths() {
  const data = await client.fetch(
    groq`*[_type == "artistesEnResidence" && defined(slug.current) && defined(contributionsEcrivain)] {
      "slug": slug.current,
        "slug": slug.current,

  const pages = data.reduce((arr, item) => {
    item.contributionsEcrivain.forEach((c) => {
      const params = {
        slug: item.slug,
        contributions: c.slug,
      arr.push({ params: params });
    return arr;
  }, []);

  return {
    paths: pages.map((page) => page),
    fallback: true,
, rather than querying the artist -> their contributions, I just reference the contributions document type as follows:

export const residencesEcrivainQuery = groq`
  *[_type == "contributionsEcrivain" && defined(slug.current)][] {
      "slug": slug.current,
      "slug": slug.current,
    "slug": slug.current,
However when I do so, the output is an empty array (even though I'm getting output in Sanity's Vision tool). Why might that be the case?
Oct 4, 2022, 1:18 PM
I have also tried to manually infer
data for
like so:

export async function getStaticPaths() {
  const data = [
      slug: "lucile-de-peslouan",
      contributions: "cherry-bomb",
  return {
    paths: data.map((post) => ({
      params: {
        contributions: post.contributions,
        slug: post.slug,
    fallback: true,
But was met with the following error (presumably because the query is returning an array of 18 "contributions" objects):
Oct 4, 2022, 1:59 PM
Hey guys! I figured it out.
In my
, I was not entering the
value in

export async function getStaticProps({ params }) {
  console.log("params", params);

  const footerLogos = await client.fetch(footerLogoQuery);

  const pageData = await client.fetch(residencesEcrivainQuery, {
    contributions: params.contributions,
    slug: params.contributions,

  return {
    props: {
    revalidate: 10,
I previously had it set to
slug: params.slug
. I had to pass in the right prop to the groq query:

*[_type == "contributionsEcrivain" && slug.current == $slug][0] {...}
Everything is working great now!!
knock on wood
Oct 4, 2022, 3:25 PM

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.

Was this answer helpful?