Issue with GraphQL hang on re-deploying Gatsby API due to too many block types in Portable Text editor schema.

8 replies
Last updated: Aug 23, 2021
Anyone have any ideas why “sanity graphql deploy’ hangs on “generating graphql schema” when re-deploying the API for Gatsby? I’ve double-checked everything, it’s all good, and I’ve never had this happen to me before.
EDIT: So this is just about the weirdest thing. Something about THIS schema is causing the ‘sanity graphql deploy’ to hang on “generating GraphQL schema”


export default {

name: "postProsAndCons",

title: "Pros & Cons",

type: "object",

fields: [

{

name: "pros",

title: "Pros",

type: "blockContent",

},

{

name: "cons",

title: "Cons",

type: "blockContent",

},

],

preview: {

select: {

title: "title",

},

*prepare*(selection) {

const { title } = selection;

return {

title: "Pros & Cons",

};

},

},

};

EDIT #2: When removing the two blockContent types and replacing them with arrays of strings instead (just another way of implementing what I’m trying to implement), the API re-deploys successfully.

Could this perhaps be because I have so many block types associated with BlockContent? I’ve implemented a page builder inside the portable text editor.

EDIT #3:
https://gitmemory.com/issue/sanity-io/sanity/1788/629853143 seems to be the same issue or a similar issue to what I’m having.
Aug 22, 2021, 2:48 AM
Much appreciated!
For context, this project includes a page builder inside the portable text editor with quite a few block types. It’s a company project so I can’t link the repo or anything like that, but the block content array is basic enough so I’ll include it:


import React from "react";


const *centeredRender* = (props) => (

<div style={{ textAlign: "center" }}>{props.children}</div>

);


export default {

title: "Block Content",

name: "blockContent",

type: "array",

of: [

{

title: "Block",

type: "block",

styles: [

{ title: "Normal", value: "normal" },

{ title: "H1", value: "h1" },

{ title: "H2", value: "h2" },

{ title: "H3", value: "h3" },

{ title: "H4", value: "h4" },

{ title: "H5", value: "h5" },

{ title: "H6", value: "h6" },

{ title: "Quote", value: "blockquote" },

{

title: "Centered",

value: "centered",

blockEditor: { *render*: *centeredRender* },

},

],

lists: [

{ title: "Bullet", value: "bullet" },

{ title: "Numbered", value: "number" },

{

title: "Ticked",

value: "ticked",

blockEditor: { *icon*: () => "TC" },

},

{

title: "Crossed",

value: "crossed",

blockEditor: { *icon*: () => "CR" },

},

],

marks: {

decorators: [

{ title: "Strong", value: "strong" },

{ title: "Emphasis", value: "em" },

{ title: "Underline", value: "underline" },

],

annotations: [

{

title: "URL",

name: "link",

type: "object",

fields: [

{

title: "URL",

name: "href",

type: "url",

},

],

},

{

title: "Internal Link",

name: "internalLink",

type: "object",

fields: [

{

title: "Link To",

name: "internal",

type: "reference",

to: [{ type: "page" }, { type: "post" }],

},

],

},

],

},

},

{

type: "image",
`title:
Image
,` `type:
image
,

    
},`
{

type: "postGridBestExchanges",

title: "Grid - Best Exchanges",

},

{

type: "anchorPoint",

title: "Anchor Point",

},

{

type: "anchorSubPoint",

title: "Anchor Sub Point",

},

{

type: "postComparisonTable",

title: "Exchange Comparison Table",

},

{

type: "postExchangeStatCard",

title: "Card - Exchange Stats",

},

{

type: "postAccordion",

title: "Accordion",

},

{

type: "postFiveRowList",

title: "5-Row List",

},

{

type: "externalCta",

title: "Call To Action - External",

},

{

type: "internalCta",

title: "Call To Action - Internal",

},

{

type: "postFurtherReading",

title: "Post Footer - Further Reading",

},

{

type: "postShare",

title: "Post Footer - Share This Post",

},

{

type: "postAbout",

title: "Post Footer - About Me",

},

{

type: "postProsAndCons",

title: "Pros And Cons Comparison",

},

{

type: "postBestDebitCards",

title: "Best Debit Cards",

},

{

type: "postDebitComparisonTable",

title: "Exchange Debit Card Comparison Table",

},

{

type: "postImageLinkExternal",

title: "Image Link - External",

},

{

type: "postImageLinkInternal",

title: "Image Link - Internal",

},

{

type: "table",

title: "Table",

},

],

};
Aug 23, 2021, 6:43 PM
Ah, that is quite a number of custom objects inside of Portable Text editor! What your reasoning for having them in there instead of as fields inside of array in a document?
Aug 23, 2021, 7:33 PM
With this, rich text can be typed around the objects inside the editor. Like so:
Aug 23, 2021, 7:36 PM
Just seems like a more flexible editing experience for my “post” type pages that are content-heavy
Aug 23, 2021, 7:40 PM
I definitely see your reasoning! From a structured content perspective, it may be better in the future to extract these into an array of objects (including Block Content for adding rich text around the them). I personally have found it easier to maintain when it’s more modular. But, again, that’s just personally what works for me 🤷 . I don’t know if that’s the reason you’re getting these generation hangs. I’ll update you if I hear back from someone who knows more about GraphQL than me!
Aug 23, 2021, 7:43 PM
I maaaay switch to that structure (especially if you guys advise it’s the reason for the GraphQL hang), what you describe is how we have our “page” page-builder implemented so it’d be an easy switch, it’s just that with our “post” types there’s a lot more rich text so it seemed like a more fluid UX for our client’s content editors to have those types structured like so.
Aug 23, 2021, 7:51 PM
user M
I think that was the case, because I’ve made a new schema for a portable text editor without the page builder and it’s generating the API just fine now. I think once the schema has a certain number of block types associated with it, GraphQL gets angry when it’s used multiple times in the same document.
Aug 23, 2021, 9:08 PM
Thanks for the update! I kind of suspected that was the issue, but it was mostly gut-feeling so I was hesitant to say it was definitely the issue.
Aug 23, 2021, 9:10 PM

Sanity– build remarkable experiences at scale

The Sanity Composable Content Cloud is the headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?