How to get navigation meta from queryCollectionNavigation

[martijnhalekor]

I've been struggling all day trying to implement a category system into Nuxt Content. I really like the power of Nuxt Content, but this is starting to get a little bit frustrating 😅

My directory structure looks like this:

I've added a .navigation.yml file as mentioned in the docs.

I've also added the yml extension to the source key in content.config.ts as mentioned on this issue.:

export default defineContentConfig({
  collections: {
    articles: defineCollection({
      type: 'page',
      source: 'articles/**/*.{md,yml,json}',
      schema: z.object({
        draft: z.boolean(),
        icon: z.string()
      })
    })
  }
})

However, the category dirs are not returned in queryCollectionNavigation('articles'). I found it's possible to do with queryCollection('articles'), but that feels pretty wasteful as I only want to render a list of category links.

What's the recommended way to group articles on categories or tags? Thanks in advance!

[martijnhalekor]

Update: I think I was missing draft: false in my .navigation.yml file.

Next question: 😄 is it possible to filter on page: false in queryCollectionNavigation()?
Currently I have solved it like below, which feels very ugly and breakable:

const { data: nav } = await useAsyncData(() =>
  queryCollectionNavigation('articles')
);

const navChildren = computed(
  () => nav.value?.[0]?.children?.filter((x) => x?.page === false)?.[0],
);