environment.js

import { Environment, Network, RecordSource, Store } from "relay-runtime";

const store = new Store(new RecordSource());

const network = Network.create((operation, variables) => {
  return fetch("http://127.0.0.1:8000/graphqlEndpoint/", {
    method: "POST",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json"
    },
    body: JSON.stringify({
      query: operation.text,
      variables
    })
  }).then(response => {
    return response.json();
  });
});

const environment = new Environment({
  network,
  store
});

export default environment;

useMutation.js

import { useState } from 'react';
import { commitMutation } from 'react-relay';

import environment from './environment';


function RootMutation(
  mutation,
  variables,
) {
  // Defining this state, I get https://reactjs.org/warnings/invalid-hook-call-warning.html
  // Without this line, my mutation works perfectly fine.
  const [data, setData] = useState(null);

  commitMutation(
    environment,
    {
      mutation,
      variables,
      onCompleted: (response, errors) => {
        console.log('Response received from server.');
        console.log(response)
        console.log(errors)
      },
      onError: err => console.error(err),
    },
  );
}

export default RootMutation