Я новичок в GraphQL, и у меня возникают проблемы с доступом к данным из моего запроса GraphQL. Мне удалось записать в консоль данные, которые показывают, что запрос работает, но когда я пытаюсь получить к нему доступ, я получаю сообщение об ошибке «Не удается прочитать свойство« имя_страницы »неопределенного»

Смотрите изображения вариантов, которые я пробовал:

https://i.ibb.co/6JS20K5/Graph-QL-1.png
https://i.ibb.co/wMq1V6g/Graph-QL-2.png
https://i.ibb.co/MN5g5Pk/Graph-QL-3.png

Я вижу свои данные в консоли, когда использую: console.info(data.allPagesJson.edges)

Насколько я понимаю, для доступа к точным данным, которые мне нужны, я должен использовать:

console.info(data.allPagesJson.edges.node.page_name)

Однако теперь это дает мне сообщение об ошибке «Не удается прочитать свойство« имя_страницы »неопределенного». Причина этого, кажется, в том, что "узел" не определен, но я не уверен, почему...

Это мой шаблон страниц:

import React from "react"
import { graphql } from "gatsby"


export default ({ data }) => {
  console.info(data.allPagesJson.edges.node.page_name)
  return (

      <div>
        <h1>Test</h1>
      </div>

  )
}

export const query = graphql`
query($page_url: String!) {
  allPagesJson(filter: { page_url: { eq: $page_url } }) {
    edges{
      node{
        page_url
        page_name
      }
    }
  }
}

`

Это файл моих страниц gatsby-node.js:

const path = require(`path`)

exports.createPages = ({ graphql, actions }) => {
    const { createPage } = actions
    return graphql(`
    {
        allPagesJson {
          edges {
            node {   
             page_url
            }
          }
        } 

      }
    `
  ).then(result => {    
      result.data.allPagesJson.edges.forEach(({ node }) => {
        createPage({
            path: node.page_url,
            component: path.resolve(`./src/templates/product-pages.js`),
            context: {

                page_url: node.page_url,
      },
    })
  })
    })
  }