Migration from fetchLinks to graphQuery

Developing with Prismic
1

Hi there,

I stumbled upon the issue that fetchLinks only returns the first element of a specific field - in my case, the rich text field. So the second and third paragraphs are not returned. Quite a bummer.

I read that graphQuery is being referred to as fetchLinks v2, but tbh the syntax is just much more complex and not really intuitive - I know, it's basically gql syntax, but fetchLinks was just straightforward and simple.

I am having a hard time as well to migrate fetchLinks to graphQuery.

My use case is on the homepage, where I have some slices that have a content relationship field. With fetchLinks, I could simply do the following:

const doc = await client.getByUID("generic_page", params?.uid as string, {
    fetchLinks: [
      "crosspromo.image",
      "crosspromo.title",
    ]
});

CrossPromo is a slice that contains a content relationship to a single crosspromo which is a repeatable custom type.

Not sure how that would translate to graphQuery tbh.

Could you help me out here?

Thanks!

4

Hello @andreas.kratzel

Thanks for reaching out to us.

It's true that fetchLinks doesn't work if you want to retrieve linked content from Slices and Group fields. For that, you must use graphQuery. Let me allow you to clarify one thing that GraphQuery is different than GraphQL. GraphQuery is an updated version of fetchLinks which allows you to retrieve content from a Content Relationship field when using the REST API.

I think that your GraphQuery will look something like this:

generic_page {
  body {
    ...on CrossPromo {
        non-repeat {
          ...non-repeatFields
          content_relationship_field_name {
           ... on type_of_linked_doc {
             ...linked_doc_type_Fields
          }
        }
     } 
   }
}

Give that a try and let me know if it works for you. Keep in mind that you’ll need to update content_relationship_field_name, on type_of_linked_doc, and linked_doc_type_Fields` with the API ID of the Custom Type that you are querying. Please follow this article: GraphQuery API Option Technical Reference - Documentation - Prismic

Thanks,
Priyanka

5

Thanks, I'll give it a try and lyk :+1:

6

btw, why don't you internally rework the fetchLinks functionality instead of coming up with a whole new syntax that's just awfully overcomplex?

graphQuery={
  page {
    slices {
      ...on paragraph_slice {
        variation {
          ...on default {
            primary {
              details {
                ...on author {
                  slices {
                    ...on contact_slice {
                      variation {
                        ...on default {
                          items {
                            name
                          }
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}

@Priyanka

7

Hello @andreas.kratzel

I understand that using graphQuery is a bit complex and has an entirely different syntax, but once we learn it, I assume it wouldn't be a big problem. I will open this conversation to my team and see if we can simplify them. I'll have to continue this conversation internally.

Thanks,
Priyanka