fix(rn): conversation read

Signed-off-by: Godefroy Ponsinet <godefroy.ponsinet@outlook.com>
berty · Dec 11, 2018 · d1bf266 · d1bf266
1 parent 5ad485c
commit d1bf266
Show file tree

Hide file tree

Showing 31 changed files with 831 additions and 125 deletions.
diff --git a/client/react-native/common/components/Screens/Chats/Add.js b/client/react-native/common/components/Screens/Chats/Add.js
@@ -156,7 +156,6 @@ export default class ListScreen extends Component {
               <Item
                 {...props}
                 onPress={() => {
-                  console.log(props)
                   const index = contactsID.lastIndexOf(props.data.id)
                   index < 0
                     ? contactsID.push(props.data.id)

diff --git a/client/react-native/common/components/Screens/Chats/Detail.js b/client/react-native/common/components/Screens/Chats/Detail.js
@@ -13,31 +13,10 @@ import { parseEmbedded } from '../../../helpers/json'
 class Message extends React.PureComponent {
   static contextType = RelayContext
 
-  async componentDidMount () {
-    const conversation = this.props.navigation.getParam('conversation')
-    const contactId = this.props.data.senderId
-    const isMyself =
-      conversation.members.find(m => m.contactId === contactId).contact
-        .status === 42
-
-    if (isMyself || this.props.data.seenAt !== null) {
-      return
-    }
-
+  messageSeen = async () => {
     await this.props.screenProps.context.mutations.eventSeen({
       id: this.props.data.id,
     })
-    await this.props.screenProps.context.mutations.conversationRead({
-      id: conversation.id,
-    })
-  }
-
-  async componentDidUpdate (prevProps) {
-    if (prevProps.data.id === this.props.data.id) {
-      return
-    }
-
-    await this.componentDidMount()
   }
 
   render () {
@@ -49,6 +28,10 @@ class Message extends React.PureComponent {
 
     const { data } = this.props
 
+    // TODO: implement message seen
+    // if (new Date(this.props.data.seenAt).getTime() <= 0) {
+    //   this.messageSeen()
+    // }
     return (
       <Flex.Rows
         align={isMyself ? 'end' : 'start'}
@@ -85,9 +68,15 @@ class Message extends React.PureComponent {
         >
           {new Date(data.createdAt).toTimeString()}{' '}
           {isMyself ? (
-            <Icon name={data.ackedAt ? 'check-circle' : 'circle'} />
+            <Icon
+              name={
+                new Date(data.ackedAt).getTime() > 0 ? 'check-circle' : 'circle'
+              }
+            />
           ) : null}{' '}
-          <Icon name={data.seenAt ? 'eye' : 'eye-off'} />{' '}
+          <Icon
+            name={new Date(data.seenAt).getTime() > 0 ? 'eye' : 'eye-off'}
+          />{' '}
           {/* TODO: used for debugging, remove me */}
         </Text>
       </Flex.Rows>
@@ -112,12 +101,18 @@ class Input extends PureComponent {
     })
   }
 
+  async componentWillUnmount () {
+    const conversation = this.props.navigation.getParam('conversation')
+    await this.props.screenProps.context.mutations.conversationRead({
+      id: conversation.id,
+    })
+  }
+
   onSubmit = () => {
     const { input } = this.state
     this.setState({ input: '' }, async () => {
       try {
         const conversation = this.props.navigation.getParam('conversation')
-        console.log('conversation', conversation)
         await this.props.screenProps.context.mutations.conversationAddMessage({
           conversation: {
             id: conversation.id,
@@ -231,7 +226,7 @@ export default class Detail extends PureComponent {
               },
             },
           ])}
-          subscriptions={[subscriptions.conversationNewMessage]}
+          subscriptions={[subscriptions.newMessage]}
           fragment={fragments.EventList}
           alias='EventList'
           renderItem={props => (

diff --git a/client/react-native/common/components/Screens/Chats/List.js b/client/react-native/common/components/Screens/Chats/List.js
@@ -11,7 +11,7 @@ import { conversation as utils } from '../../../utils'
 const Item = fragments.Conversation(({ data, navigation }) => {
   const { id, updatedAt, readAt } = data
   const isRead = new Date(readAt).getTime() > 0
-  const isInvite = new Date(updatedAt).getTime() > 0 && !isRead
+  const isInvite = !isRead && new Date(updatedAt).getTime() <= 0
   return (
     <Flex.Cols
       align='center'
@@ -31,10 +31,10 @@ const Item = fragments.Conversation(({ data, navigation }) => {
           {utils.getTitle(data)}
         </Text>
         <Text color={colors.subtleGrey} tiny middle left bold={!isRead}>
-          {isInvite
-            ? 'New conversation'
-            : isRead
-              ? 'No new message'
+          {isRead
+            ? 'No new message'
+            : isInvite
+              ? 'New conversation'
               : 'You have a new message'}
         </Text>
       </Flex.Rows>
@@ -81,7 +81,11 @@ export default class ListScreen extends PureComponent {
           variables={queries.ConversationList.defaultVariables}
           fragment={fragments.ConversationList}
           alias='ConversationList'
-          subscriptions={[subscriptions.conversationInvite]}
+          subscriptions={[
+            subscriptions.conversationInvite,
+            subscriptions.conversationNewMessage,
+            subscriptions.conversationRead,
+          ]}
           renderItem={props => <Item {...props} navigation={navigation} />}
         />
       </Screen>

diff --git a/client/react-native/common/components/Screens/Contacts/Detail/PublicKey.js b/client/react-native/common/components/Screens/Contacts/Detail/PublicKey.js
@@ -16,7 +16,6 @@ export default class DetailPublicKey extends PureComponent {
   })
 
   render () {
-    console.log(this.props)
     const id = this.props.navigation.getParam('id')
     const displayName = this.props.navigation.getParam('displayName')
 

diff --git a/client/react-native/common/components/Screens/Contacts/List.js b/client/react-native/common/components/Screens/Contacts/List.js
@@ -76,7 +76,6 @@ export default class ContactList extends PureComponent {
         context: { queries, subscriptions },
       },
     } = this.props
-    console.log(this.context)
     return (
       <Screen style={{ backgroundColor: colors.white }}>
         <Pagination

diff --git a/client/react-native/common/components/Screens/Settings/Devtools/DeviceInfos.js b/client/react-native/common/components/Screens/Settings/Devtools/DeviceInfos.js
@@ -35,7 +35,6 @@ export default class DeviceInfos extends PureComponent {
       },
     } = this.props
     this.setState({ refreshing: true }, async () => {
-      console.log(queries)
       const data = await queries.DeviceInfos.fetch()
       this.setState({ infos: data.infos, refreshing: false })
     })

diff --git a/client/react-native/common/graphql/enums.gen.js b/client/react-native/common/graphql/enums.gen.js
@@ -205,12 +205,14 @@ export const BertyP2pKindInputKind = {
   Sent: 101,
   Ack: 102,
   Ping: 103,
+  Seen: 104,
   ContactRequest: 201,
   ContactRequestAccepted: 202,
   ContactShareMe: 203,
   ContactShare: 204,
   ConversationInvite: 301,
   ConversationNewMessage: 302,
+  ConversationRead: 303,
   DevtoolsMapset: 401,
   SenderAliasUpdate: 501,
   Node: 99,
@@ -221,12 +223,14 @@ export const ValueBertyP2pKindInputKind = {
   101: 'Sent',
   102: 'Ack',
   103: 'Ping',
+  104: 'Seen',
   201: 'ContactRequest',
   202: 'ContactRequestAccepted',
   203: 'ContactShareMe',
   204: 'ContactShare',
   301: 'ConversationInvite',
   302: 'ConversationNewMessage',
+  303: 'ConversationRead',
   401: 'DevtoolsMapset',
   501: 'SenderAliasUpdate',
   99: 'Node',

diff --git a/client/react-native/common/graphql/mutations/ConversationCreate.js b/client/react-native/common/graphql/mutations/ConversationCreate.js
@@ -55,7 +55,6 @@ export default context => (input, configs) =>
     input,
     {
       updater: (store, data) =>
-        console.log('ConversationCreate', data) ||
         context.updaters.conversationList.forEach(updater =>
           updater(store, data.ConversationCreate)
         ),

diff --git a/client/react-native/common/graphql/queries/Conversation.js b/client/react-native/common/graphql/queries/Conversation.js
@@ -71,5 +71,5 @@ export default context => ({
       context.environment,
       query,
       merge([defaultVariables, variables])
-    )).GetConversation,
+    )).Conversation,
 })
diff --git a/client/react-native/common/graphql/subscriptions/ContactRequest.js b/client/react-native/common/graphql/subscriptions/ContactRequest.js
@@ -12,7 +12,6 @@ export default context => ({
         (async (store, data) => {
           if (data.EventStream.kind === 201) {
             const attributes = parseEmbedded(data.EventStream.attributes)
-            console.log(attributes)
             const id = btoa('contact:' + attributes.me.id)
             updater(store, { id })
             await context.queries.Contact.fetch({

diff --git a/client/react-native/common/graphql/subscriptions/ConversationNewMessage.js b/client/react-native/common/graphql/subscriptions/ConversationNewMessage.js
@@ -8,7 +8,6 @@ export default context => ({
         updater &&
         (async (store, data) => {
           if (data.EventStream.kind === 302) {
-            updater(store, data.EventStream)
             await context.queries.Conversation.fetch({
               id: data.EventStream.conversationId,
             })

diff --git a/client/react-native/common/graphql/subscriptions/ConversationRead.js b/client/react-native/common/graphql/subscriptions/ConversationRead.js
@@ -0,0 +1,23 @@
+import EventStream from './EventStream'
+
+export default context => ({
+  ...EventStream(context),
+  subscribe: ({ updater }) =>
+    EventStream(context).subscribe({
+      updater:
+        updater &&
+        (async (store, data) => {
+          if (data.EventStream.kind === 303) {
+            await context.queries.Conversation.fetch({
+              id: data.EventStream.conversationId,
+            })
+            await context.queries.EventList.fetch({
+              filter: {
+                conversationId: data.EventStream.conversationId,
+                kind: 302,
+              },
+            })
+          }
+        }),
+    }),
+})
diff --git a/client/react-native/common/graphql/subscriptions/EventSeen.js b/client/react-native/common/graphql/subscriptions/EventSeen.js
@@ -0,0 +1,39 @@
+import { parseEmbedded } from '../../helpers/json'
+import EventStream from './EventStream'
+
+export default context => ({
+  ...EventStream(context),
+  subscribe: ({ updater }) =>
+    EventStream(context).subscribe({
+      updater:
+        updater &&
+        (async (store, data) => {
+          if (data.EventStream.kind === 104) {
+            const attributes = parseEmbedded(data.EventStream.attributes)
+
+            // update all messages
+            const events = []
+            attributes.ids &&
+              attributes.ids.forEach(async id => {
+                try {
+                  events.push(await context.queries.Event.fetch({ id }))
+                } catch (err) {
+                  console.warn(err)
+                }
+              })
+
+            // update all conversations
+            events.reduce((conversations, event) => {
+              if (conversations[event.conversationId]) {
+                return conversations
+              }
+              const promise = context.queries.Conversation.fetch({
+                id: data.EventStream.conversationId,
+              })
+              conversations[event.conversationId] = promise
+              return conversations
+            }, {})
+          }
+        }),
+    }),
+})
diff --git a/client/react-native/common/graphql/subscriptions/EventStream.js b/client/react-native/common/graphql/subscriptions/EventStream.js
@@ -25,11 +25,10 @@ const EventStream = graphql`
   }
 `
 
-let _context = null
 let _subscriber = null
 
 export default context => {
-  if (subscriber === null || context !== _context) {
+  if (_subscriber === null) {
     _subscriber = subscriber({
       environment: context.environment,
       subscription: EventStream,

diff --git a/client/react-native/common/graphql/subscriptions/NewMessage.js b/client/react-native/common/graphql/subscriptions/NewMessage.js
@@ -0,0 +1,15 @@
+import EventStream from './EventStream'
+
+export default context => ({
+  ...EventStream(context),
+  subscribe: ({ updater }) =>
+    EventStream(context).subscribe({
+      updater:
+        updater &&
+        (async (store, data) => {
+          if (data.EventStream.kind === 302) {
+            updater(store, data.EventStream)
+          }
+        }),
+    }),
+})
diff --git a/client/react-native/common/graphql/subscriptions/index.js b/client/react-native/common/graphql/subscriptions/index.js
@@ -1,7 +1,10 @@
 export eventStream from './EventStream'
+export eventSeen from './EventSeen'
 export contactRequest from './ContactRequest'
 export contactRequestAccepted from './ContactRequestAccepted'
 export conversationInvite from './ConversationInvite'
 export conversationNewMessage from './ConversationNewMessage'
+export conversationRead from './ConversationRead'
+export newMessage from './NewMessage'
 export monitorPeers from './MonitorPeers'
 export logStream from './LogStream'
diff --git a/client/react-native/common/relay/RelayContext.js b/client/react-native/common/relay/RelayContext.js
@@ -31,5 +31,4 @@ export const contextValue = ({
 }
 
 const RelayContext = React.createContext()
-console.log(RelayContext)
 export default RelayContext
diff --git a/client/react-native/common/relay/environment.js b/client/react-native/common/relay/environment.js
@@ -111,8 +111,6 @@ const setupMiddlewares = async ({ getIp, getPort }) => [
 ]
 
 export const setup = async ({ getIp, getPort }) => {
-  const store = new Store(new RecordSource())
-  console.log(store, store.getSource())
   return new Environment({
     network: new RelayNetworkLayer(await setupMiddlewares({ getIp, getPort }), {
       subscribeFn: setupSubscription({

diff --git a/client/react-native/common/relay/genericUpdater.js b/client/react-native/common/relay/genericUpdater.js
@@ -33,7 +33,6 @@ export default (fragment, alias, args) => {
   return (store, data, deletion) => {
     const helper = new FragmentHelper(fragment)
     const connectionHelper = helper.getConnection(alias)
-    console.log(alias, data, args)
 
     const root = store.getRoot()
 
@@ -76,11 +75,7 @@ export default (fragment, alias, args) => {
 
     if (
       edges.length > 0 &&
-      edges.some(
-        e =>
-          console.log(e.getLinkedRecord('node')) ||
-          e.getLinkedRecord('node').getValue('id') === data.id
-      )
+      edges.some(e => e.getLinkedRecord('node').getValue('id') === data.id)
     ) {
       // update
       return

diff --git a/client/react-native/common/schema.graphql b/client/react-native/common/schema.graphql