[rich-text-react-renderer] Are there any working examples using GatsbyJS?

[daydream05]

trafficstars

[mgmolisani]

Query to export...

export const PageQuery = graphql`
  query {
    contentfulPage {
      title
      slug
      richText {
        json
      }
    }
  }
`;

Your page component...

const MyPage = ({data}) => {
  return <>
    {/* Stuff before */}
    {documentToReactComponents(data.contentfulPage.richText.json, /* your options */)}
    {/* Stuff after */}
  </>
}

Basically, use the renderer like you would in any React app and data comes in the shape you query it from the GraphQL endpoint data object. The important note is you want to pass the json field returned from the query as shown above.

This assumes you are using the Gatsby Contentful source plugin.

[sbezludny]

I have a private sandbox for gatsby/RT integration that I can share: https://codesandbox.io/s/5x2ym34k7n

But that's a good point and we'll improve our existing docs on this topic

[Praneeth-Pike]

@sbezludny The sandbox has an error. It's not working. TypeError: node.data.target.sys.contentType is undefined. Are you guys working on something?

[joeweale]

I'm seeing the same issue as above. Anyone got an example of querying a contentful rich text field with an embedded entry?

[joeweale]

So the issue I was having is gatsby caching. Needed to run a gatsby clean before develop in order to get the full object property tree.

Might be worth including this in the documentation