Skip to content
Get help on Slack

Including author name and image in GROQ query for multiple types

4 replies
Last updated: Feb 28, 2022
I have a GROQ query where I am checking for multiple types. But the author name is not working. I have author reference which I am using for all these types. How can i Include the following to this query:
Need this:

author -> {
      name,
      image
 }
inside this:

groq`*[_type in ["homePage", "page", "article", "case"] && defined(slug.current)][].slug.current`
Feb 28, 2022, 7:42 PM
After changing the code I get the following erro:

TypeError: slug.split is not a function

export async function getStaticPaths() {
  const pageQueries = await getClient().fetch(
    groq`*[_type in ["homePage", "page", "article", "case"] && defined(slug.current)]{
      'slug': slug.current,
      author->{
        name,
        image,
      },
    }`
  );

  // Split the slug strings to arrays (as required by Next.js)
  const paths = pageQueries.map((slug: string) => ({
    params: { slug: slug !== "/home" && slug.split("/").filter((p) => p) },
  }));

  return { paths, fallback: false };
}

Feb 28, 2022, 9:08 PM
After changing the code I get the following erro:

TypeError: slug.split is not a function

export async function getStaticPaths() {
  const pageQueries = await getClient().fetch(
    groq`*[_type in ["homePage", "page", "article", "case"] && defined(slug.current)]{
      'slug': slug.current,
      author->{
        name,
        image,
      },
    }`
  );

  // Split the slug strings to arrays (as required by Next.js)
  const paths = pageQueries.map((slug: string) => ({
    params: { slug: slug !== "/home" && slug.split("/").filter((p) => p) },
  }));

  return { paths, fallback: false };
}

Feb 28, 2022, 9:08 PM
Each item in 
pageQueries
is now an object, so you can’t run 
slug.split()
. You’ll likely want to rename your parameter inside your map (e.g., to 
item
) and then do 
item.slug.split()
.
Feb 28, 2022, 9:15 PM
I did now I have item.slug instead. But the query is not using mine but still the default one.

export async function getStaticPaths() {
  const pageQueries = await getClient().fetch(
    groq`*[_type in ["homePage", "page", "article", "case"] && defined(slug.current)]{
      ...,
      'slug': slug.current,
      body,
      title,
      _createdAt,
      _id,
      _rev,
      _type,
      _updatedAt,
      caseManager->{
        name,
        image,
      },
      author->{
        name,
        image,
      },
    }`
  );

  const paths = pageQueries.map((item: any) => ({
    params: {
      slug: item.slug.split("/").filter((p: any) => p),
    },
  }));

  return { paths, fallback: false };
}

Feb 28, 2022, 9:44 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.

Get started for freeExplore the demo

Was this answer helpful?