I'm trying to implement a mutation for login. The mutation validates the provided id_token and logs the user in via sessions. The mutation itself works (verified with GraphiQL), but I'm having issues integrating it with Relay.
When a user logs in, the entire Relay store is possibly altered since "viewer" is the root query. But I don't want to list out my entire query tree in the fat query. It would be nice to be able to clear the entire store somehow, but I don't see a way of doing that with react-router-relay
.
Relay mutation:
export default class LoginMutation extends Relay.Mutation {
getMutation() {
return Relay.QL`mutation {login}`;
}
getVariables() {
return {
id_token: this.props.id_token
};
}
getFatQuery() {
// TODO: list everything?
return Relay.QL`
fragment on LoginPayload {
viewer
}
`;
}
getConfigs() {
return []; // TODO: not sure what to return...
}
}
Usage:
Relay.Store.commitUpdate(new LoginMutation({id_token}), {
onSuccess: (resp) => {
history.push('/');
}
});
GraphQL schema:
input LoginInput {
id_token: String!
clientMutationId: String!
}
type LoginPayload {
viewer: Viewer
clientMutationId: String!
}
type Mutation {
login(input: LoginInput!): LoginPayload
}
interface Node {
id: ID!
}
type Query {
viewer: Viewer
node(id: ID!): Node
}
type Viewer implements Node {
id: ID!
user: User
ships: [Ship]
ship(id: ID!): Ship
}
schema {
query: Query
mutation: Mutation
}
In the
fatQuery
, when you list anon-scalar
field, Relay will assume that any connected field may have updated. In certain fields that require arguments (eg,(first: n)
), you can use@relay(pattern: true)
to bypass this requirement. This SO question discusses the feature.