rival-black•2y ago

GraphQL support for nodes and edges

Hi @Omer I am trying to use Elide's GraphQL API and trying to use refine-graphql. Elide returns data inside edges and node format.

{
      "data": {
          "group": {
              "edges": [
              {
                  "node": {
                  "commonName": "Example Repository",
                  "description": "The code for this project",
                  "name": "com.example.repository"
                  }
              }
              ]
          }
      }
  }

{
      "data": {
          "group": {
              "edges": [
              {
                  "node": {
                  "commonName": "Example Repository",
                  "description": "The code for this project",
                  "name": "com.example.repository"
                  }
              }
              ]
          }
      }
  }

How can I achieve this with Refine?

8 Replies

kapa.ai•2y ago

Hi @.dark.energy. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

foreign-sapphire•2y ago

I am trying to use Elide's GraphQL API and trying to use refine-graphql. Elide returns data inside edges and node format. { "data": { "group": { "edges": [ { "node": { "commonName": "Example Repository", "description": "The code for this project", "name": "com.example.repository" } } ] } } } How can I achieve this with Refine?

kapa.ai•2y ago

Sorry @.dark.energy, I seem to be having a bit of trouble. Don't worry though, I've pinged my supprt and they will try to fix me up! :technologist: Perhaps try again in 15mins?

Omer•2y ago

Hey @salihozdemir , Can you help @.dark.energy ?

stormy-gold•2y ago

Hey @.dark.energy, If you sure that the data will always be in the same format, you can implement a return type in your dataProvider like this:

const dataProvider = (client: GraphQLClient): Required<DataProvider> => {
  return {
    getList: async ({ resource, pagination, sorters, filters, meta }) => {
      //...

      const response = await client.request<BaseRecord>(query, variables);

      return {
        data: response[operation].data.group.edges.map((edge) => edge.node),
        total: response[operation].count,
      };
    },
    //...
  };
};

const dataProvider = (client: GraphQLClient): Required<DataProvider> => {
  return {
    getList: async ({ resource, pagination, sorters, filters, meta }) => {
      //...

      const response = await client.request<BaseRecord>(query, variables);

      return {
        data: response[operation].data.group.edges.map((edge) => edge.node),
        total: response[operation].count,
      };
    },
    //...
  };
};

foreign-sapphire•2y ago

Thanks @salihozdemir that's the transformation part but I need to modify the query before it gets sent Adding edges and nodes to the fieldset Any update?

stormy-gold•2y ago

We'll use gql-query-builder to build the graphQL query. It provides flexible API to build the query. You can find the documentation here: https://github.com/atulmy/gql-query-builder Also, you can checkout our hasura and strapi-graphql data provider to see how we are using it.

foreign-sapphire•2y ago

Thanks I was able to achieve it reading the strapi graphql implementation

fields: [ 
{ edges: [{ node:  meta?.fields  }]}
]

fields: [ 
{ edges: [{ node:  meta?.fields  }]}
]

Alternatively, implement your own graphql query adapter