fix(rn): add subscription for chat detail

Signed-off-by: Godefroy Ponsinet <godefroy.ponsinet@outlook.com>

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 => <Message {...props} navigation={navigation} />}

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 {
         }
       },
     }),
-}
+})

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