React-admin: ra-data-graphql-simple ReferenceManyField target Filter

Created on 22 Apr 2020  Â·  5Comments  Â·  Source: marmelab/react-admin

What you were expecting:
After making changes to the target parameter, I was finally able to remove another crutch. Thanks so much for this.

But there is one more problem.
Here is the request sent in List:

const DistrictFilter = (props) => (
    <Filter {...props}>
        <ReferenceInput source="gasRegion.id" reference="GasRegion" allowEmpty emptyText="ra.message.no">
            <AutocompleteInput optionText="name" />
        </ReferenceInput>
    </Filter>
);

==>

{operationName: "allGasDistricts",…}
operationName: "allGasDistricts"
query: "query allGasDistricts($page: Int, $perPage: Int, $sortField: String, $sortOrder: String, $filter: GasDistrictFilter) {↵  items: allGasDistricts(page: $page, perPage: $perPage, sortField: $sortField, sortOrder: $sortOrder, filter: $filter) {↵    id↵    name↵    description↵    createdAt↵    createdBy {↵      id↵      name↵      email↵      phone↵      __typename↵    }↵    updatedAt↵    deleted↵    gasRegion {↵      id↵      name↵      description↵      __typename↵    }↵    gasMeterPads {↵      id↵      name↵      description↵      __typename↵    }↵    reports {↵      id↵      name↵      description↵      type↵      template↵      __typename↵    }↵    tags {↵      id↵      name↵      description↵      color↵      resource↵      __typename↵    }↵    aisId↵    __typename↵  }↵  total: _allGasDistrictsMeta(page: $page, perPage: $perPage, filter: $filter) {↵    count↵    __typename↵  }↵}↵"
variables: {filter: {gasRegion: {id: "ck7omjmc40000pcurc9zc8usn"}}, page: 0, perPage: 10, sortField: "updatedAt",…}
filter: {gasRegion: {id: "ck7omjmc40000pcurc9zc8usn"}}
gasRegion: {id: "ck7omjmc40000pcurc9zc8usn"}
id: "ck7omjmc40000pcurc9zc8usn"
page: 0
perPage: 10
sortField: "updatedAt"
sortOrder: "DESC"

pay attention to the filter:

filter: {
    gasRegion: {
         id: "ck7omjmc40000pcurc9zc8usn"
     }
}

This is exactly what i expect to see. This is working correctly.

What happened instead:
However, if I want to get the same data with:

<ReferenceManyField 
                label="resources.GasRegion.fields.gasDistricts"
                reference="GasDistrict" 
                target="gasRegion.id" 
                sort={{ field: 'updatedAt', order: 'DESC' }}
                pagination={<Pagination />}
                perPage={25} 
            >
                <GasDistrictReferenceDatagrid />
            </ReferenceManyField>

such a request is sent:

{operationName: "allGasDistricts",…}
operationName: "allGasDistricts"
query: "query allGasDistricts($page: Int, $perPage: Int, $sortField: String, $sortOrder: String, $filter: GasDistrictFilter) {↵  items: allGasDistricts(page: $page, perPage: $perPage, sortField: $sortField, sortOrder: $sortOrder, filter: $filter) {↵    id↵    name↵    description↵    createdAt↵    createdBy {↵      id↵      name↵      email↵      phone↵      __typename↵    }↵    updatedAt↵    deleted↵    gasRegion {↵      id↵      name↵      description↵      __typename↵    }↵    gasMeterPads {↵      id↵      name↵      description↵      __typename↵    }↵    reports {↵      id↵      name↵      description↵      type↵      template↵      __typename↵    }↵    tags {↵      id↵      name↵      description↵      color↵      resource↵      __typename↵    }↵    aisId↵    __typename↵  }↵  total: _allGasDistrictsMeta(page: $page, perPage: $perPage, filter: $filter) {↵    count↵    __typename↵  }↵}↵"
variables: {filter: {gasRegion.id: "ck7omjmc40000pcurc9zc8usn"}, page: 0, perPage: 25, sortField: "updatedAt",…}
filter: {gasRegion.id: "ck7omjmc40000pcurc9zc8usn"}
gasRegion.id: "ck7omjmc40000pcurc9zc8usn"
page: 0
perPage: 25
sortField: "updatedAt"
sortOrder: "DESC"

filter: {gasRegion.id: "ck7omjmc40000pcurc9zc8usn"}

This is a mistake.

I expected that in both cases the same filter will be generated.

Environment

  • React-admin version: 3.4.2
bug

All 5 comments

Thanks for reporting

Experiencing the same issue - any resolution here?

you recently made a bug fix https://github.com/marmelab/react-admin/pull/5457
I think these are related problems. Will there be a fix for target as well?

Not sure the two are related - this issue is about the graphql data provider, not the core filter system.

definitely the wrong filter is sending ra-data-graph-simple, but as I mentioned earlier, it seems to me that the components:

<ReferenceInput resource="GasDistrict" source="gasRegion.id" reference="GasRegion">
    <AutocompleteInput optionText="name" />
</ReferenceInput>

and

<ReferenceManyField resource="GasRegion" reference="GasDistrict" target="gasRegion.id">
    <GasDistrictReferenceDatagrid />
</ReferenceManyField>

must send the identical request to the provider:

{
    query allGasDistricts(..., $filter: GasDistrictFilter) {
        items: allGasDistricts(..., filter: $filter) { id ...}
        total: _allGasDistrictsMeta(... , filter: $filter) { count ...}
    },
    variables: {
        filter: {
            gasRegion: {
                id: "ck7omjmc40000pcurc9zc8usn"
            }
        }, 
        …
    }
}

for source="gasRegion.id" a filter is sent to the dataProvider with {gasRegion: { id: "ck7omjmc40000pcurc9zc8usn"}}
for target="gasRegion.id a filter is sent to the dataProvider with {"gasRegion.id": "ck7omjmc40000pcurc9zc8usn"}}

but it doesn't. This allows us to conclude that parameters source="gasRegion.id" and target="gasRegion.id that are supposed to fulfill the same role work differently.
Please let me know if this is not the case.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Weakky picture Weakky  Â·  20Comments

olegweb picture olegweb  Â·  23Comments

fzaninotto picture fzaninotto  Â·  27Comments

fzaninotto picture fzaninotto  Â·  79Comments

Kmaschta picture Kmaschta  Â·  22Comments