diff --git a/client/react-native/common/components/Screens/Chats/Detail.js b/client/react-native/common/components/Screens/Chats/Detail.js index b1f88e6774..221b5f2996 100644 --- a/client/react-native/common/components/Screens/Chats/Detail.js +++ b/client/react-native/common/components/Screens/Chats/Detail.js @@ -4,7 +4,7 @@ import React, { PureComponent } from 'react' import { Pagination } from '../../../relay' import { Text, Flex, Screen, Header } from '../../Library' import { colors } from '../../../constants' -import { fragments, mutations, queries } from '../../../graphql' +import { fragments, mutations, queries, subscriptions } from '../../../graphql' import { merge } from '../../../helpers' import { shadow } from '../../../styles' import { conversation as utils } from '../../../utils' @@ -177,6 +177,7 @@ export default class Detail extends PureComponent { }, }, ])} + subscriptions={[subscriptions.conversationNewMessage(conversation)]} fragment={fragments.EventList.default} connection='EventList' renderItem={props => } diff --git a/client/react-native/common/graphql/subscriptions/ConversationNewMessage.js b/client/react-native/common/graphql/subscriptions/ConversationNewMessage.js index 84b31a098a..9c96830a87 100644 --- a/client/react-native/common/graphql/subscriptions/ConversationNewMessage.js +++ b/client/react-native/common/graphql/subscriptions/ConversationNewMessage.js @@ -1,9 +1,9 @@ import { fragments } from '..' import EventStream from './EventStream' -export default { +export default conversation => ({ ...EventStream, - subscribe: conversation => + subscribe: () => EventStream.subscribe({ updater: (store, data) => { console.log('RECEIVED_EVENT') @@ -22,4 +22,4 @@ export default { } }, }), -} +}) diff --git a/client/react-native/common/relay/Pagination.js b/client/react-native/common/relay/Pagination.js index 61d979f8a4..ccb6c52309 100644 --- a/client/react-native/common/relay/Pagination.js +++ b/client/react-native/common/relay/Pagination.js @@ -33,7 +33,7 @@ class PaginationContainer extends PureComponent { relay.refetchConnection(edges.length, err => err && console.error(err)) } - keyExtractor = item => item.cursor + keyExtractor = item => item.node.id render () { const { data, connection, relay, renderItem, inverted } = this.props @@ -80,6 +80,15 @@ const createPagination = ({ }) export default class Pagination extends PureComponent { + componentDidMount () { + const { subscriptions = [] } = this.props + this.subscribers = subscriptions.map(s => s.subscribe()) + } + + componentWillUnmount () { + this.subscribers.forEach(s => s.unsubscribe()) + } + render () { const { query, variables } = this.props