feat: Voice Channel (#11602)
Enables agents to initiate outbound calls and receive incoming calls directly from the Chatwoot dashboard, with Twilio as the initial provider. Fixes: #11481 > This is an integration branch to ensure features works well and might be often broken on down merges, we will be extracting the functionalities via smaller PRs into develop - [x] https://github.com/chatwoot/chatwoot/pull/11775 - [x] https://github.com/chatwoot/chatwoot/pull/12218 - [x] https://github.com/chatwoot/chatwoot/pull/12243 - [x] https://github.com/chatwoot/chatwoot/pull/12268 - [x] https://github.com/chatwoot/chatwoot/pull/12361 - [x] https://github.com/chatwoot/chatwoot/pull/12782 - [x] #13064 - [ ] Ability for agents to join the inbound calls ( included in this PR ) --------- Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com> Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> Co-authored-by: iamsivin <iamsivin@gmail.com> Co-authored-by: Pranav <pranav@chatwoot.com>
This commit is contained in:
59
app/javascript/dashboard/stores/calls.js
Normal file
59
app/javascript/dashboard/stores/calls.js
Normal file
@@ -0,0 +1,59 @@
|
||||
import { defineStore } from 'pinia';
|
||||
import TwilioVoiceClient from 'dashboard/api/channel/voice/twilioVoiceClient';
|
||||
import { TERMINAL_STATUSES } from 'dashboard/helper/voice';
|
||||
|
||||
export const useCallsStore = defineStore('calls', {
|
||||
state: () => ({
|
||||
calls: [],
|
||||
}),
|
||||
|
||||
getters: {
|
||||
activeCall: state => state.calls.find(call => call.isActive) || null,
|
||||
hasActiveCall: state => state.calls.some(call => call.isActive),
|
||||
incomingCalls: state => state.calls.filter(call => !call.isActive),
|
||||
hasIncomingCall: state => state.calls.some(call => !call.isActive),
|
||||
},
|
||||
|
||||
actions: {
|
||||
handleCallStatusChanged({ callSid, status }) {
|
||||
if (TERMINAL_STATUSES.includes(status)) {
|
||||
this.removeCall(callSid);
|
||||
}
|
||||
},
|
||||
|
||||
addCall(callData) {
|
||||
if (!callData?.callSid) return;
|
||||
const exists = this.calls.some(call => call.callSid === callData.callSid);
|
||||
if (exists) return;
|
||||
|
||||
this.calls.push({
|
||||
...callData,
|
||||
isActive: false,
|
||||
});
|
||||
},
|
||||
|
||||
removeCall(callSid) {
|
||||
const callToRemove = this.calls.find(c => c.callSid === callSid);
|
||||
if (callToRemove?.isActive) {
|
||||
TwilioVoiceClient.endClientCall();
|
||||
}
|
||||
this.calls = this.calls.filter(c => c.callSid !== callSid);
|
||||
},
|
||||
|
||||
setCallActive(callSid) {
|
||||
this.calls = this.calls.map(call => ({
|
||||
...call,
|
||||
isActive: call.callSid === callSid,
|
||||
}));
|
||||
},
|
||||
|
||||
clearActiveCall() {
|
||||
TwilioVoiceClient.endClientCall();
|
||||
this.calls = this.calls.filter(call => !call.isActive);
|
||||
},
|
||||
|
||||
dismissCall(callSid) {
|
||||
this.calls = this.calls.filter(call => call.callSid !== callSid);
|
||||
},
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user