Discussion about errors with block content to React and adding a serializer for a citation type in a new project.

Hello! New to the Slack, been using and really enjoying Sanity for a bit now. I'm having some trouble with block content to React on a new project -- is anyone around who could chat about some errors I'm getting?

What errors are you getting?

Hi ! I'm using

@sanity/block-content-to-react

and adding a serializer for the

citation

type that I've added in, but I keep getting

I tried two different ways of implementing the custom block within my schema and got the same error both times. Happy to share how I structured that if it's helpful.

This suggests that there’s something up with the

blocks

data I think

Is it the whole Portable Text array? Do you see anything funky with the data if you console.log it?

Is it the whole Portable Text array? Do you see anything funky with the data if you console.log it?

That's part of what's interesting, the date looks pretty normal in the console log, but I don't see any

type

attached to any of the children. Could that be part of the problem?

The

_type: 'citation'

 should be on the root objects. So there might be something going on here. Are you using framework or anything?

If you have code to look at, that’s helpful!

I do! One sec, I'll push up the latest code.

I do! One sec, I'll push up the latest code.

It's on this branch here: https://github.com/throneless-tech/recoding-tech/tree/design-implementation

It's on this branch here: https://github.com/throneless-tech/recoding-tech/tree/design-implementation

cool - where in the project do I find the serializer?

cool - where in the project do I find the serializer?

Ha sorry yes that would help! https://github.com/throneless-tech/recoding-tech/blob/276d665f53ca64845c18602d763bdd88de964f34/src/layouts/policy_action.js#L22

Ha sorry yes that would help! https://github.com/throneless-tech/recoding-tech/blob/276d665f53ca64845c18602d763bdd88de964f34/src/layouts/policy_action.js#L22

hmm… weird. looks alright to me

is the dataset private?

Currently yes unfortunately. Would looking at the schema help? I built it here: https://github.com/throneless-tech/recoding-tech/blob/design-implementation/studio/schemas/portable_text.js

ah, this is an annotation

ah, this is an annotation

try to put it under

marks

 instead of

types

 in the serializer

Yes! Is the structure incorrect?

ah, this is an annotation

Ah gotcha, thanks so much. I'll give that a try

I suspect it’s this pattern that you’re trying at https://www.sanity.io/guides/portable-text-internal-and-external-links

Ah yes that's exactly what I was working from

So progress, I'm getting a new error 😆

It feels like you're not getting data into the component

It's definitely reading other fields that I've added, like the title and even other references. And if I log the object, all the data appears to be there

It's definitely reading other fields that I've added, like the title and even other references. And if I log the object, all the data appears to be there

Now getting the error

Now getting the error

I need to run offline for a bit but will be back and would love to hear if you have any other ideas. Thanks so much for your help this far!

I need to run offline for a bit but will be back and would love to hear if you have any other ideas. Thanks so much for your help this far!

Now getting the error

It would help to access the data. I’m not super familiar with Stackbit, and it’s not super clear to me how they handle the data fetching

I don’t understand what happens here 😅 https://github.com/throneless-tech/recoding-tech/blob/design-implementation/sourcebit.js#L78-L98

Haha ok totally fair, I'm not sure either. Makes sense that it could be something with stackbit, and I'll see if I can make the dataset accessible!

Haha ok totally fair, I'm not sure either. Makes sense that it could be something with stackbit, and I'll see if I can make the dataset accessible!

Hi ! Following up on this because I think I figured out the problem and am submitting a PR to stackbit. My new question though is how best to format a serializer for an annotation. Is there a recommended format for adding a mark that's a reference? I see the example usage for a mark that's a highlighter, but what if the mark is a reference to another record?

Hi ! Following up on this because I think I figured out the problem and am submitting a PR to stackbit. My new question though is how best to format a serializer for an annotation. Is there a recommended format for adding a mark that's a reference? I see the example usage for a mark that's a highlighter, but what if the mark is a reference to another record?