ra-data-hasura-graphql icon indicating copy to clipboard operation
ra-data-hasura-graphql copied to clipboard

ReferenceManyField implementation

Open baskin opened this issue 4 years ago • 10 comments

Hi @Steams Just got started with this project. Looks great till now. Many thanks :).

I came to a point where I used a ReferenceManyField in list view. This component fetches a list of referenced records by reverse lookup of the current record.id in other resource (dataProvider.getManyReference()).

Looking at the n/w calls, it seems like the implementation is making 1 call for each (current) record in the list. I think it can be collapsed to a single call by using the 'in' operator. Can you kindly take a look?

Thanks

baskin avatar Apr 10 '20 22:04 baskin

Hi there! Is this to support many-to-many relationships? If you have a working example (even if slow), great if you could share some code. I am having trouble with this particular step :) Thx!

lapidus avatar Apr 16 '20 15:04 lapidus

@lapidus for a simple and slow example you could

      <ReferenceManyField
        label="Labels"
        reference="locals_labels"
        target="local_id"
        source="id"
      >
        <SingleFieldList>
          <ReferenceField source="label_id" reference="labels" target="id">
            <TextField source="label" />
          </ReferenceField>
        </SingleFieldList>
      </ReferenceManyField>

make sure to also export the many_to_many Resource, btw. you can export an array

export default [
  <Resource key="locals" name="locals" />,
  <Resource key="locals_labels" name="locals_labels" />
]

webdeb avatar Apr 16 '20 16:04 webdeb

Thanks, great! Will try when I get past the initial hurdle of "buildHasuraProvider". It's giving me a bit of a hard time ... 😅

lapidus avatar Apr 16 '20 16:04 lapidus

Hm, can't get it to work exactly. If I am trying to display topics for blog posts and the "bridge table" looks like this, what should I do? Thx!

blog_post_topic blog_post_id | topic_id

Also, why do I need to export those Resources and where? I basically just want to add the many-to-many items in my listing view and edit view.

lapidus avatar Apr 16 '20 17:04 lapidus

In my example above I am rendering a query which would look like

locals {
  locals_labels {
     label {
       label
    }
  }
}

the dataProvider will load the glueing part, and then the corresponding label / topic.. You have to export blog_post_topic Resource otherwise the dataprovider will complain.

webdeb avatar Apr 16 '20 17:04 webdeb

Thanks for all the help, now it works with the display!

Do you by any chance have experience with the AutoComplete?

From a topic edit view, I can get it to display my articles. But I can't:

  1. Get it to show the selected ones from the complete list
  2. Save the changes

My current implementation looks something like this:

<ReferenceManyField reference="article_topic" target="topic_id">
  <ReferenceArrayInput
    source="article_id"
    reference="article"
   >
      <AutocompleteArrayInput
          optionText="name"
      /> 
  </ReferenceArrayInput>
</ReferenceManyField>

lapidus avatar Apr 17 '20 11:04 lapidus

I am looking a fix for this because but we shouldn't use it the ReferenceManyField + RefenceField on that way, it makes a tons of request for a data grid. if we have defined a many-to-many relationship in our schema, it should build only one query for this.

something like this: e.g: users -> users_roles -> roles

query MyQuery {
  users(limit: 10) {
    id
    name
    user_roles  {
      role {
        name
      }
    }
  }
}

gengue avatar Apr 23 '20 06:04 gengue

Great! Thanks! Might also simplify this? https://github.com/Steams/ra-data-hasura-graphql/issues/33

lapidus avatar Apr 23 '20 06:04 lapidus

The solution is described in the documentation: https://github.com/Steams/ra-data-hasura-graphql#example-query-related-entities

But those functions aren't exported in the library :( should create a issue about it?

gengue avatar Apr 27 '20 19:04 gengue

Hi @baskin!

Please check my comment here on how I worked on this use case.

jasper95 avatar Nov 29 '20 01:11 jasper95