1

For some reason, if I generate a root query which takes in parameters before injecting the child component, like so:

import Relay from 'react-relay';

export default {
  production: (Component) => Relay.QL`
    query {
      getProduction(id: $productionId) {
        ${Component.getFragment('production')}
      }
    }
  `
};

Relay originally generates this query:

query MyProductionDetailsQuery($id_0:ID!,$where_1:ProductionRoleWhereArgs!) {
  getProduction(id:$id_0) {
    id,
    ...F0
  }
}
fragment F0 on Production {
  id,
  ...
  _roles4oPiwv:roles(first:10,where:$where_1) {
    edges {
      node {
        id,
        ...
      },
      cursor
    },
    pageInfo {
      hasNextPage,
      hasPreviousPage
    }
  }
}

variables:

{id_0: "UHJvZHVjdGlvbjoxNg==", where_1: {archived: {eq: true}}}

However, If the Component's relay container has variables of its own, running this.props.relay.setVariables({...variables}) completely changes the request query generated by relay into something like this:

query My_production_details_page_ProductionRelayQL($id_0:ID!,$where_1:ProductionRoleWhereArgs!) {
  node(id:$id_0) {
    ...F0
  }
}
fragment F0 on Production {
  id,
  _roles6J5gK:roles(first:10,where:$where_1) {
    edges {
      node {
        id,
        ...
      },
      cursor
    },
    pageInfo {
      hasNextPage,
      hasPreviousPage
    }
  }
}

variables:

{id_0: "UHJvZHVjdGlvbjoxNg==", where_1: {archived: {eq: false}}}

However, setVariables works fine if I have a root query with no parameters:

import Relay from 'react-relay';

export default {
  viewer: (Component, variables) => Relay.QL`
    query {
      viewer {
        ${Component.getFragment('viewer', { ...variables })}
      }
    }
  `
};

Here's the generated query:

query ViewerQuery($where_0:ProductionWhereArgs!) {
  viewer {
    ...F0
  }
}
fragment F0 on Viewer {
  user {
    _productions2IPZAw:productions(first:10,where:$where_0) {
      edges {
        node {
          id,
          ...
        },
        cursor
      },
      pageInfo {
        hasNextPage,
        hasPreviousPage
      }
    },
    id
  }
}

variables:

{where_0: {expDate: {gt: "2016-11-04T16:29:11.677Z"}, archived: {eq: false}}}

After setVariables in the working setup:

query ViewerQuery($where_0:ProductionWhereArgs!) {
  viewer {
    ...F0
  }
}
fragment F0 on Viewer {
  user {
    _productions1CyNvL:productions(first:10,where:$where_0) {
      edges {
        node {
          id,
          ...
        },
        cursor
      },
      pageInfo {
        hasNextPage,
        hasPreviousPage
      }
    },
    id
  }
}

variables:

{where_0: {expDate: {lt: "2016-11-04T16:34:12.537Z"}, archived: {eq: false}}}

versions:

"react-relay": "^0.9.3",
"react-router-relay": "^0.13.5"

I'm not sure if I'm doing something wrong with the configuration, or if it's just a bug on Relay's end.

Does anyone know what might be causing this issue?

  • To improve the quality of your question, please describe your problem and ask a specific question, rather than mentioning it being asked somewhere else. For help, see “[How to Ask a Good Question](http://stackoverflow.com/help/how-to-ask)”. – jacefarm Nov 03 '16 at 02:55
  • Hi, my apologies! I just edited the post with some more information. I hope what I am asking is a little more clear now. – Rohit Ravikoti Nov 03 '16 at 23:03

1 Answers1

0

When you run setVariables it leads to refetching only necessary data. Relay looks which part of query could be affected by changing variable and requests from GraphQL server needed fragment. It is possible because of Node interface(i.e. fetching object by opaque Relay id). See more in documentation.

I think, in your case you should implement Node Interface for Production type on GraphQL server.

  • My Production type does implement Node Interface. The strange thing is that if I go through the viewer query (with no parameters in the root), and have parameters in the child component, Relay generates the correct query. – Rohit Ravikoti Nov 04 '16 at 16:16