I can't find Strapi nested components in my GraphQL query - reactjs

Question

I'm very new to Strapi and GraphQL. I have created a nested data structure in Strapi that looks like this (this is a Navbar component). But when I go to GraphQL, my query looks like this.
So if this is the query:
query MyQuery {
allStrapiNavbar {
nodes {
Category {
Name
children {
id
}
}
}
}
}
This is the result:
{
"data": {
"allStrapiNavbar": {
"nodes": [
{
"Category": [
{
"Name": "Community",
"children": []
},
{
"Name": "Modules",
"children": []
},
{
"Name": "Company",
"children": []
},
{
"Name": "Pricing",
"children": []
}
]
}
]
}
},
"extensions": {}
}
This means the data is being fetched correctly. However, I can't find the nested component 'Item' inside 'Category'.
This is what my gatsby-config.ts file looks like currently:
{
resolve: "gatsby-source-strapi",
options: {
apiURL: process.env.STRAPI_API_URL || "http://localhost:1337",
queryLimit: 1000, // Default to 100
accessToken: process.env.STRAPI_TOKEN,
collectionTypes:[ 'faq', 'doc', 'docCategory', 'faqCategory', 'release', 'userType' ],
// contentTypes: [ 'Faq' ],
singleTypes: [ 'navbar' ],
},
I don't know why the data isn't showing up in GraphQL. I looked inside the children for Category, but the reality is that it should be at the same level as Name, which shows up.
Do I need to modify the gatsby-config file, or am I missing something else?
Edit: I am using the gatsby-source-strapi plugin.