GraphQL retrieve all headings from structured Text

🆘 Support
1

Hello there. To sharpen my understanding of graphQL I thought to return all headings from a post.

(using the blog starter examples given by dato cms)

I can see that a post is build up out of a structured text
inside that I see there is an image block.

Now for my question… How can I return all headings from my content?

As seen below: value gives me a list of the actual values, but I can’t go any deeper.
In the results I can see value > document> children > type: heading…
But I am unsure how to retrieve them … or maybe this is something I will need to do in my actual code of the website?

My idea is to create a post outline sidebar with all headings that will be clickable for the user to just to that section.

Thanks for your expertise.

{
  post {
    id
    title
    content {
      value
    }
  }
}

gives…

"value": {
          "schema": "dast",
          "document": {
            "type": "root",
            "children": [
              {
                "type": "heading",
                "level": 1,
                "children": [
                  {
                    "type": "span",
                    "value": "This is a title "
                  }
                ]
              },
1 Like
2

hello @ZeroEqualsZero, you are right, you cannot filter any deeper via GraphQL. Once you get the content of the field, you can process it on your frontend.

Have a look at this section of the documentation: Structured Text and Dast format - DatoCMS where you can find links to various utilities, like this one: GitHub - syntax-tree/unist-util-select: utility to select unist nodes with CSS-like selectors that should do what you need.

Feel free to ask if you need more details!

1 Like
3

Thank You! That does seem very clear to me, great examples as well.

1 Like