I'm building an app as my first real foray into React, Relay and GraphQL, using Relay Modern.
The basic case is, I have a login form component that doesn't really need any data; that is to say, the component renders a form, and has a corresponding mutation, but doesn't need to query anything.
It seems that providing a Relay style query fragment is a necessity when calling createFragmentContainer, which in turn ensures that the this.props.relay will not be null in the context of the component.
Right now, I'm using a standard (non-Relay) React component for the login form, but as a result I'm unable to access the Relay environment to pass it through to the mutation.
My question - is there a way to essentially pass an "empty" Relay fragment? Or is there some better idiom that is recommended in this case?
You actually just use a normal component then create a mutation file with the mutation in it. Run the relay compiler to create the graphql fragment for the mutation and then call on the mutation in the form submit. The mutation does need your environment. Here is the relay modern docs:
https://facebook.github.io/relay/docs/mutations.html
You will need to store the result of the mutation somewhere and then append the auth token to your next requests, but that shouldn't be terribly hard to do. Just onCompleted and store the result somewhere.
Your environment should be a seperate file that you import for mutations and query renders. Only paginationContainer inherits encironment from a queryRenderer.