nextjs-apollo

Server side

new JsonWebToken(private or public keys, options)

const app = express();

const jwt = new JsonWebToken({
  apple: fs.readFileSync("apple.pem"),
  banana: fs.readFileSync("banana.pem"),
}, { toUser, onSignIn, onSignOut, onRenew });

jwt.applyMiddleware(app);

const apolloServer = new ApolloServer({
  typeDefs,
  resolvers,
  context: jwt.contextParser(),
});
apolloServer.applyMiddleware({ app });

// if you enabled subscription
const server = http.createServer(app);
apolloServer.installSubscriptionHandlers(server);
server.listen();

toUser()

function toUser({ ...user }) {
  return UserModel
}

• user is plain object from client access token by decode
• UserModel any type will assign to context.user

onSignIn()

function onSignIn({ correlationId, ...params }) {
  return { issuer, correlationId, isUnfamiliar, ...user };
}

• correlationId as http X-Correlation-ID is unique by all client
• params is plain object from client.signIn(params) is username and password generally
• issuer is name of private key (option, when single key)
• isUnfamiliar if is true when response correlationId and userData, but will not get new token
• user is plain object will encode to token

onSignOut()

function onSignIn({ correlationId, ...params }) {
  return { ... };
}

• correlationId as http X-Correlation-ID is unique by all client
• params is plain object from client.signOut(params)

onRenew()

function onRenew({ correlationId, user, issuer, ...params }) {
  return { correlationId, ...user };
}

• correlationId as http X-Correlation-ID is unique by all client
• user is plain object will encode to token
• issuer is name of private key (option, when single key)
• params is plain object from client.renew(params)

Client side

class App extends React.Component{ }
export default App |> withProvider({ uri, http, ws, auth, ...options });

• uri as URL.origin setup server address
• http is HttpLink options
  • path is ${url.origin}${path} default /graphql
  • ...option see apollo-link-http for the options
• ws
  • path is ${url.origin}${path} default /graphql
  • ...option see apollo-link-ws for the options
• auth
  • path is ${url.origin}${path} default /auth
  • params is plain object will default to signIn, signOut and renew (option)
  • headers is plain object (option)
• ...option see apollo-client

withConsumer()

withQuery()

class Component extends React.Component {
  static propTypes = {
    results: PropTypes.shape({
      [name]: PropTypes.shape(),
    }),
    [name]: PropTypes.shape(),
    loading: PropTypes.bool,
    ...props,
  }
}
const query =  gql`query { node { id value } }`;
export default Component |> withQuery(name, query);

withConnection()

withConnection(name, query);

withCursorPagination()

withCursorPagination(name, query);

withOffsetPagination()

withOffsetPagination(name, query);

withMutation()

class Component extends React.Component {
  static propTypes = {
    results: PropTypes.shape({
      [name]: PropTypes.shape(),
    }),
    [name]: PropTypes.func,
    ...props,
  }
  onClick = async () => {
    const { [name] } = this.props;
    await [name](input, options);
  }
  render() {
    return <button onClick={this.onClick} />
  }
}
const mutation =  gql`
  mutation($input: AddPostInput) {
    addPost(input: $input) { post: { id } }
  }
`;
export default Component |> withMutation(name, mutation);

withSubscription()

class Component extends React.Component {
  static propTypes = {
    results: PropTypes.shape({
      [name]: PropTypes.shape(),
    }),
    [name]: PropTypes.shape(),
    loading: PropTypes.bool,
    ...props,
  }
}
const subscription =  gql`subscription { onAddPost { id } }`;
export default Component |> withSubscription(name, subscription);

withAuthorized()

class Component extends React.Component { }
export default Component |> withAuthorized(redirect, { disabled });