Как сопоставить подсвойство graphQL

Question

Я хочу превратить свой блог Wordpress в приложение для реагирования через безголовую CMS Hygraph.

В моем запросе API есть сообщения «wordPressPosts» в главном свойстве «сообщения».

      const { posts } = await hygraph.request(
`
  {
    posts {
      wordPressPosts {
        id
        title {
          rendered
        }
        categories
      }
    }
  }
`
);

Как я могу получить доступ к «идентификаторам» wordPressPosts и опубликовать «заголовки», чтобы сопоставить их? Я пытался возиться с posts.wordPressPosts, но он ничего не отображает на экране.

       return {
    props: {
      posts
    }
  };
}

export default ({ posts }) =>
  posts.map(({ id, title }) => <p key={id}>{title}</p>);

Полная песочница кода: https://codesandbox.io/s/wp-source-for-hygraph-li2ssl?file=/src/pages/index.js

Здоровья, Л.