CODEWITHSUNDEEP
relayjsgraphql-js
Christine
Christine

Reputation: 3064

Multiple Mutations on a single object

I try to have a addColumn and a removeColumn mutation on a Chart component.

But when I call

Relay.Store.commitUpdate(new RemoveChartColumnMutation({
  chart: this.props.viewer.chart,
  column: this.props.viewer.chart.columns[0]
})

I get this error

"Fragment \"F2\" cannot be spread here as objects of type "AddChartColumnPayload\" can never be of type \"RemoveChartColumnPayload\"."

What am I doing wrong here?

export default Relay.createContainer(Home, {
  fragments: {
    viewer: () => Relay.QL`
      fragment on User {
        chart {
          columns
          ${AddChartColumnMutation.getFragment('chart')}
          ${RemoveChartColumnMutation.getFragment('chart')}
        }
      }`
  }
});

With these mutations

class AddChartColumnMutation extends Relay.Mutation {
  getMutation() {
    return Relay.QL`mutation {addChartColumn}`;
  }
  getVariables() {
    return {
      id: this.props.chart.id,
      key: this.props.key,
      aggregation: this.props.aggregation
    };
  }
  getFatQuery() {
    return Relay.QL`
      fragment on AddChartColumnPayload {
        chart {
          columns
        }
      }
    `;
  }
  getConfigs() {
    return [{
      type: 'FIELDS_CHANGE',
      fieldIDs: {
        chart: this.props.chart.id
      }
    }];
  }
  static fragments = {
    chart: () => Relay.QL`
      fragment on Chart {
        id
        type
      }
    `
  };
}

and

class RemoveChartColumnMutation extends Relay.Mutation {
  getMutation() {
    return Relay.QL`mutation {addChartColumn}`;
  }
  getVariables() {
    return {
      chartId: this.props.chart.id,
      columnId: this.props.column.id
    };
  }
  getFatQuery() {
    return Relay.QL`
      fragment on RemoveChartColumnPayload {
        chart {
          columns
        }
      }
    `;
  }
  getConfigs() {
    return [{
      type: 'FIELDS_CHANGE',
      fieldIDs: {
        chart: this.props.chart.id
      }
    }];
  }
  static fragments = {
    chart: () => Relay.QL`
      fragment on Chart {
        id
        type
      }
    `
  };
}

Upvotes: 1

Views: 395

Answers (1)

Ryan
Ryan

Reputation: 7957

I think you've just got a typo in your code. Looks like both mutations are calling the addChartColumn mutation, which would explain the error expecting the remove chart column payload.

Upvotes: 2

Related Questions