Seeking help to generate a table of contents for a blog post using portable text and block-content-to-react.

Hi everyone. I want to create table of content for a blog post and I'm using portable text to render the post using block-content-to-react. Is there a plugin/lib that can generate that from the portable text ? I couldn't find one. Has anyone else already solved this ?

Something like this? https://codesandbox.io/s/linked-headings-with-portable-text-and-react-qlbt4

Something like this? https://codesandbox.io/s/linked-headings-with-portable-text-and-react-qlbt4

yeah something like this....the links are not working on clicking in the codesandbox...but I get the idea. Thanks !

It’s because it’s in a iframe I think. Should work in the standalone window :)

This might be a bug

If you add a list in block content under h2 it is still showing in the serialized component even when I'm returning null for everything except header tags

This might be a BUG. I'm using the above example and If I add a list after header tag no matter where ...it shows up in the serialized content even though I'm returning

null

for everything except header tags in

ToCserializer

.
I reproduced it here :
https://codesandbox.io/s/linked-headings-with-portable-text-and-react-zy487?file=/src/index.js

can u help with ^ ? Am I doing something wrong or is this a bug?