Skip to content

Instantly share code, notes, and snippets.

@daqo
Last active August 3, 2018 01:46
Show Gist options
  • Save daqo/eff962ce70e35d55310949f092e76ac3 to your computer and use it in GitHub Desktop.
Save daqo/eff962ce70e35d55310949f092e76ac3 to your computer and use it in GitHub Desktop.
A sample React component that uses subscriptions along with Relay Modern
fragment Feed_item on Photo {
id
creator {
id
name
}
photoUrl
}
class Feed extends React.Component {
componentDidMount() {
const addItemSubscription = graphql`
subscription FeedAddSubscription { feedItemAdded { ...Feed_item } }
`;
requestSubscription(
environment, // The relay environment created earlier
{
subscription: addItemSubscription,
variables: null,
onNext: (response) => {},
onCompleted: () => {},
onError: error => console.error(error),
updater: (store) => {
// application specific logic goes here
const item = store.getRootField('feedItemAdded');
const me = store.getRoot().getLinkedRecord('me');
const feed = ConnectionHandler.getConnection(me, 'discover_feed');
const edge = ConnectionHandler.createEdge(
store,
feed,
item,
'PhotoEdge',
);
ConnectionHandler.insertEdgeBefore(feed, edge);
feed.setValue(feed.getValue('totalCount') + 1, 'totalCount');
},
}
);
}
renderContent() {
...
}
render() {
return this.renderContent();
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment