Relay/router login mutation?

519 views Asked by At

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
}
1

There are 1 answers

0
Brandon On

In the fatQuery, when you list a non-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.