javascript – How to avoid code duplication in graphql request?
I am making a blog with Gatsby and GraphQl but I can’t find a way to avoid code duplication in my queries.
I have 3 almost identical queries:
graphql(`
{
allContentfulRecette {
edges {
node {
id
nom
}
}
}
}
`)
graphql`
query IndexQuery {
posts : allContentfulRecette(sort: {fields: dateDePublication}){
edges {
node {
id
nom
}
}
}
}
`
graphql`
query allRecettesByCategorie($slug: String!) {
recettes : allContentfulRecette(
sort: {fields: dateDePublication}
filter: {categorie: {elemMatch: {slug: {eq: $slug}}}}
) {
edges {
node {
id
nom
}
}
}
}
`
As you can see they are very similar, the second one just has a sort, and the third one has a sort and a filter.
My problem is that I have way more than just the 2 parameters ‘id’ and ‘nom’, so having those 3 requests in different pages is hard to maintain each time I edit a field in my headless CMS.
I tried to do something like this but I got this error : “String interpolation is not allowed in graphql tag:”
export const pageQuery = graphql`
query IndexQuery {
posts : allContentfulRecette(sort: {fields: dateDePublication}){
${allContentfulRecette}
}
}
`
Is there a way I can have the common elements of my request (everything inside “edges”) in one place and use it in different request ?
Read more here: Source link