A fun re-useable button for modifying Apollo state easily.

StateButton.js

export const StateButton = props => (
  <ApolloConsumer>
    {cache => {
      const { data } = props;
      return (
        <Button
          {...props}
          onClick={e => {
            e.preventDefault();
            cache.writeData({ data });
          }}
        >
          {props.children}
        </Button>
      );
    }}
  </ApolloConsumer>
);


// How to use
<StateButton data={{ isEditMode: true }}>Edit Mode</StateButton>