Gatsby: How can reuse query with variables and fragment in pageQuery

Created on 11 Sep 2018  路  4Comments  路  Source: gatsbyjs/gatsby

Summary

I want to reuse my fragment definition and query with variable in many types of page. how can i implement this.

for example:

export const articleNodeFields = graphql`
  fragment articleNodeFields on mongodbDatabaseArticles {
    id
    title
    source
    summary
    content
    info {
      author
      top_img
    }
  }
`

export const  querySourcedArticle= graphql`
query querySourcedArticle($source: String) {
    allMongodbDatabaseArticles(
      limit: 10
      filter: { info: { top_img: { ne: null } }, summary: { ne: null }, source: {eq: $source} }
      sort: { fields: id, order: DESC }
    ) {
      edges {
        node {
    ...articleNodeFields // HOW to use fragment here?
        }
      }
    }
}
`

and at page
```js
import {querySourcedArticle} from "file-from-above"

export const pageQuery = graphql`
  querySourcedArticle(source: "topic1") // HOW
`

```

Relevant information

Environment (if relevant)

File contents (if changed)

gatsby-config.js: N/A
package.json: N/A
gatsby-node.js: N/A
gatsby-browser.js: N/A
gatsby-ssr.js: N/A

question or discussion

Most helpful comment

@kakadiadarpan found how to reuse fragment. but i don't find any example for reusing query with variable(like function with parameters). newbie to gatsby's graphql

All 4 comments

Hi @sivagao, please go through this documentation of querying with graphql - fragments. This should answer your question

(If you disagree, feel free to re-open 馃槃 and we can help you further)

@kakadiadarpan found how to reuse fragment. but i don't find any example for reusing query with variable(like function with parameters). newbie to gatsby's graphql

@sivagao currently, parameterized fragments are not supported by GraphQL. You can follow the original issue on GraphQL repo here - facebook/graphql#204

I guess I found a sort of hacky way to do this: #11205

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jimfilippou picture jimfilippou  路  3Comments

magicly picture magicly  路  3Comments

dustinhorton picture dustinhorton  路  3Comments

ferMartz picture ferMartz  路  3Comments

theduke picture theduke  路  3Comments