fix(call): add possibility to call user via context menu (#3484)

Satellite-im · Jun 10, 2022 · 6b96035 · 6b96035
1 parent 90327b0
commit 6b96035
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 14 deletions.
diff --git a/components/views/media/Media.vue b/components/views/media/Media.vue
@@ -52,7 +52,7 @@ export default Vue.extend({
     isActiveCall() {
       return (
         this.webrtc.activeCall &&
-        this.webrtc.activeCall.callId === this.conversation.id
+        this.webrtc.activeCall.peerId === this.conversation.id
       )
     },
     computedUsers() {

diff --git a/components/views/user/User.vue b/components/views/user/User.vue
@@ -14,6 +14,7 @@ import { MessagingTypesEnum } from '~/libraries/Enums/enums'
 import { RootState } from '~/types/store/store'
 import { toHTML } from '~/libraries/ui/Markdown'
 import { ContextMenuItem } from '~/store/ui/types'
+import { TrackKind } from '~/libraries/WebRTC/types'
 
 export default Vue.extend({
   components: {
@@ -51,15 +52,16 @@ export default Vue.extend({
       textilePubkey: (state) =>
         (state as RootState).accounts?.details?.textilePubkey ?? '',
       conversations: (state) => (state as RootState).textile?.conversations,
+      activeCall: (state) => (state as RootState).webrtc.activeCall,
     }),
     ...mapGetters('textile', ['getConversation']),
     ...mapGetters('settings', ['getTimestamp']),
     contextMenuValues(): ContextMenuItem[] {
-      return this.user.state === 'online'
+      return this.enableRTC
         ? [
             { text: this.$t('context.send'), func: this.navigateToUser },
-            { text: this.$t('context.voice'), func: this.testFunc },
-            { text: this.$t('context.video'), func: this.testFunc },
+            { text: this.$t('context.voice'), func: this.handleCall },
+            // { text: this.$t('context.video'), func: this.testFunc },
             // hide profile modal depend on this task AP-1717 (https://satellite-im.atlassian.net/browse/AP-1717)
             // { text: this.$t('context.profile'), func: this.handleShowProfile },
             { text: this.$t('context.remove'), func: this.removeUser },
@@ -101,6 +103,9 @@ export default Vue.extend({
         time: this.conversations[this.user.address]?.lastUpdate,
       })
     },
+    enableRTC(): boolean {
+      return this.user.state === 'online'
+    },
   },
   mounted() {
     Array.from(
@@ -120,8 +125,20 @@ export default Vue.extend({
     this.$store.commit('ui/toggleContextMenu', false)
   },
   methods: {
-    testFunc() {
-      this.$Logger.log('User Context', 'Test func')
+    async call(kinds: TrackKind[]) {
+      if (!this.enableRTC) {
+        return
+      }
+      await this.$store.dispatch('webrtc/call', {
+        kinds,
+      })
+    },
+    handleCall() {
+      if (!this.enableRTC || this.activeCall) {
+        return
+      }
+      this.navigateToUser()
+      this.call(['audio'])
     },
     async removeUser() {
       this.isLoading = true

diff --git a/store/conversation/actions.ts b/store/conversation/actions.ts
@@ -11,8 +11,8 @@ const actions = {
    * @example
    * store.dispatch('conversation/initialize');
    */
-  initialize(state: ActionsArguments<ConversationState>) {
-    state.commit('setConversation', {
+  initialize({ commit }: ActionsArguments<ConversationState>) {
+    commit('setConversation', {
       id: '',
       type: 'friend',
       calling: false,
@@ -26,24 +26,27 @@ const actions = {
    * store.dispatch('conversation/setConversation', conversation);
    */
   setConversation(
-    state: ActionsArguments<ConversationState>,
+    { commit }: ActionsArguments<ConversationState>,
     payload: {
       id: string
       type: 'friend' | 'group'
       calling?: boolean
       participants: Array<ConversationParticipant>
     },
   ) {
-    state.commit('setConversation', payload)
+    commit('setConversation', payload)
   },
   /**
    * @method setCalling
    * @description Set the calling state of the conversation
    * @example
    * store.dispatch('conversation/setCalling', true);
    */
-  setCalling(state: ActionsArguments<ConversationState>, calling: boolean) {
-    state.commit('setCalling', calling)
+  setCalling(
+    { commit }: ActionsArguments<ConversationState>,
+    calling: boolean,
+  ) {
+    commit('setCalling', calling)
   },
   /**
    * @method addParticipant

diff --git a/store/conversation/mutations.ts b/store/conversation/mutations.ts
@@ -1,6 +1,6 @@
 import { ConversationParticipant, ConversationState } from './types'
 
-const actions = {
+const mutations = {
   setConversation(
     state: ConversationState,
     payload: {
@@ -60,4 +60,4 @@ const actions = {
     })
   },
 }
-export default actions
+export default mutations