"Troubleshooting navigation building with schema and query"

2 replies
Last updated: Oct 13, 2021
Hi guys, I'm trying to build a navigation but im getting into some problem. Right now I have this schema:
/* eslint-disable import/no-anonymous-default-export */
export default {
  name: "siteSettings",
  type: "document",
  __experimental_actions: ["create", "update", /*'delete',*/ "publish"],
  title: "Site Settings",
  fields: [
    {
      name: "siteTitle",
      type: "string",
      title: "Site title",
      validation: (Rule) => Rule.required(),
    },
    {
      name: "siteDescription",
      type: "string",
      title: "Site description",
      validation: (Rule) => Rule.required(),
    },
    {
      title: "Menu items",
      name: "menuList",
      description: "Add pages below to feature in the main menu",
      type: "array",
      of: [
        {
          type: "object",
          title: "Page",
          name: "menuItem",
          fields: [
            { title: "Menu text", name: "text", type: "string" },
            {
              title: "Menu link",
              name: "link",
              description: "Only needed if it has no child pages",
              type: "reference",
              to: [
                {
                  type: "page",
                },
              ],
            },
            {
              title: "Child pages",
              name: "childpages",
              type: "array",
              of: [
                {
                  type: "reference",
                  title: "Child page",
                  description: "Pick a page from the dropdown list below",
                  to: [
                    {
                      type: "page",
                    },
                    {
                      type: "insurance",
                    },
                    {
                      type: "service",
                    },
                  ],
                },
              ],
            },
          ],
        },
      ],
    },
  ],
};
and to get the navigation I use this query:

export const navQuery = groq`
  *[_type == 'siteSettings'][0]{
    menuList[]->{
      text,
      _type,
      childpages[]->{
        "slug": slug.current,
      }
    }
  }
`;
But I keep getting an array of empty objects
Oct 13, 2021, 4:56 PM
Also tried:
export const navQuery = groq`
  *[_type == 'siteSettings'][0]{
    menuList[]->{
      menuItem{
        text
      }
    }
  }
`;
Oct 13, 2021, 5:09 PM
found it, for anyone else that had same problem it needs to be:
export const navQuery = groq`
  *[_type == 'siteSettings'][0]{
    menuList[]{
      text,
    }
  }
`;
Oct 13, 2021, 5:18 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.

Was this answer helpful?