Gatsby Prismic Preview aliased GQL queries

Developing with Prismic
1

Hi all,

I have been working on getting Gatsby Prismic previews working, although I have noticed a hurdle that I could use with a hand on.

I noticed that when working on this, that the aliasing of GraphQL queries within Gatsby prevents data from appearing so I have been working on removing it to see if that would work and it did, it seemed to be that the object that is pulled down for the preview uses non-aliased queries, potentially by reading the schema which wouldn't be aliased. But then I ran into the issue that I must Alias the 'primary' object in the query as I return the following error message:

GraphQLError: Fields "primary" conflict because subfields "left_text" conflict because they return conflicting types "String
  " and "PrismicStructuredTextType" and subfields "right_text" conflict because they return conflicting types "String" and "Pr
  ismicStructuredTextType". Use different aliases on the fields to fetch both if this was intentional.

I am relatively new to working with prismic, I get the idea there are Schemas (similar to Sanity but you don't code them) and that within those there must be type declarations for fields.

If anyone knows of any fixes to allow the preview to use aliased queries rather than what I assume is the Schema layout, or a possible fix for the above error message that would be great :)

part of the culript at play

... on PrismicPageDataBodyTextColumnsAlt {
          slice_type
          id
          textColumnsAltPrimary: primary {
            background_color
            heading
            heading_color
            line_color
            left_text {
              html
            }
            right_text {
              html
            }
            text_color
            image1 {
              fluid(imgixParams: {w: 603, h: 426, fit: "crop"}) {
                aspectRatio
                base64
                sizes
                src
                srcWebp
                srcSetWebp
                srcSet
              }
            }
            block_color
          }
        }
1 Like
3

Hello @james.harrison, according to the DevExp team, aliases are not supported using the previews plugin as it doesn't have access to the GraphQL query during a preview (it is removed at the site’s build time), so it is not able to re-apply them.

The error in that message happens because left_text and right_text are most likely set as Key Text fields before being changed to Rich Text fields. When a field type is changed, existing documents are not updated automatically. They still contain a plain string rather than the Rich Text format.

To fix it, each Page document needs to be opened, re-saved, and published. This will update the document in your Prismic repository, and Gatsby will no longer have a type conflict. This can be a tedious process if there are many existing documents using this field.

We recommend using Rich Text fields for any text content, even if it does not require formatting. The Rich Text field can be configured only to allow paragraphs (for example no headings, lists, etc.) and only one block (by unchecking “Allow multiple paragraphs”).

In Gatsby, you can query the field using the text subfield, just like a Key Text field. The field can then always be “upgraded” or “downgraded” to include formatting.