Graphql-engine: create hasura adapter for react-admin

[coco98]

react-admin is an open source admin dashboard built on React which can provide an interface to view/edit/manage data from various backends.

It supports GraphQL, but the grammar is a bit different from what Hasura has.

We can implement a DataProvider to support managing data through Hasura GraphQL APIs.

[supriyanta]

I want to work on this, I'm beginner here. Could you please guide me?
What to learn?

[EmaSuriano]

I'm taking this issue thank you @coco98 for the help to understand what was exactly to do 👏

@supriyanta you could ask for help in the discord channel of hasura.

[jasonmorganson]

For reference, from the docs:

Graphcool: marmelab/ra-data-graphcool. A provider for GraphQL servers following the Graphcool convention. Incidentally, this package builds up on marmelab/ra-data-graphql, which lets you develop providers for other GraphQL conventions.

The react-admin ra-data-graphql package is maintained by the react-admin team as a basis for building other adapters off of.

They have a couple implementations which might be useful to look at:

• ra-data-graphql-simple -
  A GraphQL data provider for react-admin built with Apollo and tailored to target a simple GraphQL implementation.
• ra-data-graphcool -
  A GraphQL data provider for react-admin built with Apollo and tailored to target the GraphCool service.

[evcodes]

Is this issue closed?

[praveenweb]

@edv1297 - It is still open.

@EmaSuriano - Any updates from your side on this?

[EmaSuriano]

Hi @praveenweb, I'm having lots of problems to find some time to continue it. So if @edv1297 want to take it, please be my guest. I really wanted to contribute to this project but unfortunately, I can't for now.

[mnlbox]

Guys any update on this feature request?

[EmaSuriano]

I couldn't continue working on it. Also, I think I'll drop it because I don't think I will be able to work on this for about 1 month or maybe more.

[eaverdeja]

Hey @EmaSuriano ! I've been using react-admin for the past few months and just found out about Hasura yesterday. Seems like a perfect match :)
I would love to work on this, but I have never contributed with a PR. Any tips?

[shahidhk]

Hi @eaverdeja, the easiest way to checkout the grammar would be to create a Heroku app, create some tables and try out some graphql queries. We have not written the grammar anywhere down, I guess, maybe this is the time do so.

Let us know if you're taking this up :smile:

[ptrobert]

Hi Guys,

Any progress on this?

[shahidhk]

Nothing yet @ptrobert. @coco98 Can you provide some info?

[pomazanbohdan]

Hello
I just consider the react-admin as admin interface to hasura.

I have a need for an application prototype in which the users associated with the organization, which should be many, add entries to the first entity.

And there is somebody who wants to help, then we will try to "write" the interface to the react-admin for testing the functional and put it as a sample of the ties of hasaur and react-admin.

[pomazanbohdan]

https://hasura-react-admin-demo-api.herokuapp.com/

query selectdataset1 {
dataset1 {
id
createby
createon
userBycreateby {nickname}
organizationid
organizationByorganizationid {name}

value1
value2

}
}

[shahidhk]

@supriyanta @EmaSuriano @jasonmorganson @evcodes @Pomazan-Bogdan @ptrobert @eaverdeja @mnlbox We have released the react-admin data provider for Hasura. You can find it as ra-data-hasura on npm. The source code is at https://github.com/hasura/graphql-engine/tree/master/community/tools/ra-data-hasura

[lukasender]

@shahidhk @praveenweb Thanks for the awesome work! I've been waiting and watching for this as well! 😃

I'm currently testing your new ra-data-hasura release and it works pretty well so far! Congrats! 🎉

However, I think I've encountered a bug in the GET_MANY_REFERNECE case.

Issue

I'm trying to use the <ReferenceManyField> and get the following error:

index.js:1452 Warning: Missing translation for key: "Cannot read property 'args' of undefined"

Debugging Info

Looking through the source code, I think there is an issue in this line (index.js#L106).

The variable finalSelectQuery (and finalCountQuery) seems to be undefined in this particular case. It is only initialised in index.js#L22.

Can anyone verify this as well?

Thanks in advance and keep up the awesome work! 👍 🚀

[praveenweb]

@lumannnn - Hey, thanks for reporting the issue. Will fix it asap and release an updated version.

[praveenweb]

@lumannnn - Fixed the issue. Released version 0.0.2 on npm. Please update and let us know.

[lukasender]

@praveenweb Thanks for the quick response! Seems to be working now 👍

[AdamNowaczyk]

Hi @praveenweb,

This is an awesome job, but as I understand it's using /v1/query and SQL based approach, right?

Do you think it would be possible to create GraphQL based version of the provider? Otherwise react-admin basically cannot handle many to many relations without using custom code. Just wondering :D. It's quite interesting as I've found out both react-admin and hasura adapter just today. Quite a coincidence :D.

[praveenweb]

@AdamNowaczyk - Hi, we are using /v1/query, instead of GraphQL for convenience as it solves the full use case of react-admin.

Otherwise react-admin basically cannot handle many to many relations without using custom code.

/v1/query supports many to many relations. Can you give an example model which cannot be implemented using the current hasura provider? And by custom code you mean the react code?

[a613]

@praveenweb

Can you give an example model which cannot be implemented using the current hasura provider?

Any query that uses GraphQL relationships, for example

{
  user(id: 1) {
    name
    address {
      street
    }
  }
}

When this query is run in ra-data-hasura, the user data is loaded, but not the address data, as it's stored in a different postgres table and ra-data hasura always passes columns: ['*'], and it ignores any nested fields like this.