fix(chat): is_typing indicator (#3668)

Satellite-im · Jun 22, 2022 · b035633 · b035633
1 parent 9355fea
commit b035633
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 33 deletions.
diff --git a/components/views/chat/chatbar/Chatbar.vue b/components/views/chat/chatbar/Chatbar.vue
@@ -172,23 +172,12 @@ export default Vue.extend({
     })
   },
   methods: {
-    /**
-     * @method typingNotifHandler
-     * @description Wraps the event handler for dispatching typing notifications
-     * TODO: Right now this is hard coded to the WebRTC Data method, in the future this should be
-     * agnostic and the method should be passed to chatbar so we can support group, and direct messages.
-     */
-    typingNotifHandler(
-      state: PropCommonEnum.TYPING | PropCommonEnum.NOT_TYPING,
-    ) {
-      // TODO use conversation participants
-    },
     /**
      * @method throttleTyping
      * @description Throttles the typing event so that we only send the typing once every two seconds
      */
     throttleTyping: throttle(function (ctx) {
-      ctx.typingNotifHandler(PropCommonEnum.TYPING)
+      ctx.$store.dispatch('webrtc/sendTyping')
     }, Config.chat.typingInputThrottle),
     /**
      * @method smartTypingStart

diff --git a/store/conversation/actions.test.ts b/store/conversation/actions.test.ts
@@ -323,6 +323,7 @@ describe('misc', () => {
       profilePicture: 'profilePicture2',
       state: 'DISCONNECTED',
       textilePubkey: 'https://accounts.google.com/o/oauth2/revoke?token=%s',
+      activity: ConversationActivity.NOT_TYPING,
     })
   })
   test.skip('actions.default.addParticipant no peer id', () => {

diff --git a/store/conversation/actions.ts b/store/conversation/actions.ts
@@ -1,7 +1,11 @@
 import { PublicKey } from '@solana/web3.js'
-import { createFromPubKey } from 'peer-id'
 import { keys } from 'libp2p-crypto'
-import { ConversationParticipant, ConversationState } from './types'
+import { createFromPubKey } from 'peer-id'
+import {
+  ConversationActivity,
+  ConversationParticipant,
+  ConversationState,
+} from './types'
 import { ActionsArguments } from '~/types/store/store'
 
 const actions = {
@@ -83,6 +87,7 @@ const actions = {
           : 'DISCONNECTED'
         : participant?.state || 'DISCONNECTED',
       profilePicture: participant?.profilePicture,
+      activity: ConversationActivity.NOT_TYPING,
     }
 
     commit(

diff --git a/store/webrtc/actions.ts b/store/webrtc/actions.ts
@@ -1,20 +1,22 @@
-import Vue from 'vue'
 import type { SignalData } from 'simple-peer'
-import { ConversationParticipant } from '../conversation/types'
+import Vue from 'vue'
+import {
+  ConversationActivity,
+  ConversationParticipant,
+} from '../conversation/types'
 import { WebRTCState } from './types'
-
-import { ActionsArguments } from '~/types/store/store'
-import { $WebRTC } from '~/libraries/WebRTC/WebRTC'
-import Logger from '~/utilities/Logger'
-import { TrackKind } from '~/libraries/WebRTC/types'
 import { Config } from '~/config'
-import { PropCommonEnum } from '~/libraries/Enums/enums'
-import { Peer2Peer, PublicKeyInfo } from '~/libraries/WebRTC/Libp2p'
+import { Sounds } from '~/libraries/SoundManager/SoundManager'
 import { CallPeerDescriptor } from '~/libraries/WebRTC/Call'
+import { Peer2Peer, PrivateKeyInfo } from '~/libraries/WebRTC/Libp2p'
+import { TrackKind } from '~/libraries/WebRTC/types'
+import { $WebRTC } from '~/libraries/WebRTC/WebRTC'
+import { ActionsArguments } from '~/types/store/store'
 import { Friend } from '~/types/ui/friends'
-import { Sounds } from '~/libraries/SoundManager/SoundManager'
+import Logger from '~/utilities/Logger'
 
 const announceFrequency = 5000
+
 const webRTCActions = {
   /**
    * @method initialized
@@ -161,14 +163,12 @@ const webRTCActions = {
 
     const timeoutMap: { [key: string]: ReturnType<typeof setTimeout> } = {}
     $Peer2Peer.on('peer:typing', ({ peerId }) => {
-      const typingFriend = rootState.friends.all.find(
-        (friend) => friend.peerId === peerId.toB58String(),
-      )
-      if (!typingFriend) return
-
       commit(
-        'friends/setTyping',
-        { id: typingFriend.address, typingState: PropCommonEnum.TYPING },
+        'conversation/updateParticipant',
+        {
+          peerId: peerId.toB58String(),
+          activity: ConversationActivity.TYPING,
+        },
         { root: true },
       )
 
@@ -177,8 +177,11 @@ const webRTCActions = {
 
       timeoutMap[peerId.toB58String()] = setTimeout(() => {
         commit(
-          'friends/setTyping',
-          { id: typingFriend.address, typingState: PropCommonEnum.NOT_TYPING },
+          'conversation/updateParticipant',
+          {
+            peerId: peerId.toB58String(),
+            activity: ConversationActivity.NOT_TYPING,
+          },
           { root: true },
         )
       }, Config.chat.typingInputThrottle * 3)
@@ -286,7 +289,26 @@ const webRTCActions = {
 
     commit('setInitialized', { initialized: true, originator })
   },
+  /**
+   * @method sendTyping
+   * @description - send the TYPING event to the other conversation participants
+   */
+  sendTyping({ commit, rootState, dispatch }: ActionsArguments<WebRTCState>) {
+    const $Peer2Peer = Peer2Peer.getInstance()
 
+    rootState.conversation?.participants
+      .filter((p) => p.peerId && p.peerId !== $Peer2Peer.id)
+      .forEach((p) => {
+        $Peer2Peer.sendMessage(
+          {
+            type: 'TYPING_STATE',
+            payload: null,
+            sentAt: Date.now().valueOf(),
+          },
+          p.peerId as string,
+        )
+      })
+  },
   /**
    * @method toggleMute
    * @description - Turn on/off mute for the given stream in the active call