From 5d09a046d3d561496a2b985fec5dec1c208d2926 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Wed, 10 Jan 2024 16:50:20 +0530
Subject: [PATCH] fix: added makeCall & is twilio enabled in global store

---
 frontend/src/components/CallUI.vue | 16 ++++++++--------
 frontend/src/pages/Lead.vue        |  2 +-
 frontend/src/stores/global.js      | 21 ++++++++++++++++++++-
 3 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/CallUI.vue b/frontend/src/components/CallUI.vue
index 2de01dff..6797fc05 100644
--- a/frontend/src/components/CallUI.vue
+++ b/frontend/src/components/CallUI.vue
@@ -183,11 +183,13 @@ import CountUpTimer from '@/components/CountUpTimer.vue'
 import NoteModal from '@/components/Modals/NoteModal.vue'
 import { Device } from '@twilio/voice-sdk'
 import { useDraggable, useWindowSize } from '@vueuse/core'
+import { globalStore } from '@/stores/global'
 import { contactsStore } from '@/stores/contacts'
 import { Avatar, call } from 'frappe-ui'
-import { onMounted, ref, watch, getCurrentInstance } from 'vue'
+import { onMounted, ref, watch } from 'vue'
 
 const { getContact } = contactsStore()
+const { setMakeCall, setTwilioEnabled } = globalStore()
 
 let device = ''
 let log = ref('Connecting...')
@@ -197,7 +199,6 @@ const contact = ref({
   mobile_no: '',
 })
 
-let enabled = ref(false)
 let showCallPopup = ref(false)
 let showSmallCallWindow = ref(false)
 let onCall = ref(false)
@@ -475,8 +476,11 @@ function toggleCallWindow() {
 }
 
 onMounted(async () => {
-  enabled.value = await is_twilio_enabled()
-  enabled.value && startupClient()
+  let enabled = await is_twilio_enabled()
+  setTwilioEnabled(enabled)
+  enabled && startupClient()
+
+  setMakeCall(makeOutgoingCall)
 })
 
 watch(
@@ -486,10 +490,6 @@ watch(
   },
   { immediate: true }
 )
-
-const app = getCurrentInstance()
-app.appContext.config.globalProperties.makeCall = makeOutgoingCall
-app.appContext.config.globalProperties.is_twilio_enabled = enabled.value
 </script>
 
 <style scoped>
diff --git a/frontend/src/pages/Lead.vue b/frontend/src/pages/Lead.vue
index c00df248..faaba7d9 100644
--- a/frontend/src/pages/Lead.vue
+++ b/frontend/src/pages/Lead.vue
@@ -275,7 +275,7 @@ import {
 import { ref, computed } from 'vue'
 import { useRouter } from 'vue-router'
 
-const { $dialog } = globalStore()
+const { $dialog, makeCall } = globalStore()
 const { getContactByName, contacts } = contactsStore()
 const { organizations } = organizationsStore()
 const { statusOptions, getLeadStatus } = statusesStore()
diff --git a/frontend/src/stores/global.js b/frontend/src/stores/global.js
index 65394d21..953493e8 100644
--- a/frontend/src/stores/global.js
+++ b/frontend/src/stores/global.js
@@ -1,11 +1,30 @@
 import { defineStore } from 'pinia'
-import { getCurrentInstance } from 'vue'
+import { getCurrentInstance, ref } from 'vue'
 
 export const globalStore = defineStore('crm-global', () => {
   const app = getCurrentInstance()
   const { $dialog } = app.appContext.config.globalProperties
 
+  let twilioEnabled = ref(false)
+  let callMethod = () => {}
+
+  function setTwilioEnabled(value) {
+    twilioEnabled.value = value
+  }
+
+  function setMakeCall(value) {
+    callMethod = value
+  }
+
+  function makeCall(number) {
+    callMethod(number)
+  }
+
   return {
     $dialog,
+    twilioEnabled,
+    makeCall,
+    setTwilioEnabled,
+    setMakeCall,
   }
 })