call-control-sdk 6.4.7 → 6.4.9-dev.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/incoming-4WP3FJI4.mp3 +0 -0
- package/dist/incoming.mp3 +0 -0
- package/dist/index.js +3885 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +3901 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +5 -5
package/dist/index.js
CHANGED
|
@@ -1,2 +1,3886 @@
|
|
|
1
|
-
"use strict";var dn=Object.create;var Ie=Object.defineProperty,un=Object.defineProperties,gn=Object.getOwnPropertyDescriptor,fn=Object.getOwnPropertyDescriptors,mn=Object.getOwnPropertyNames,qo=Object.getOwnPropertySymbols,xn=Object.getPrototypeOf,Fo=Object.prototype.hasOwnProperty,Cn=Object.prototype.propertyIsEnumerable;var Ve=(e,o,t)=>o in e?Ie(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,d=(e,o)=>{for(var t in o||(o={}))Fo.call(o,t)&&Ve(e,t,o[t]);if(qo)for(var t of qo(o))Cn.call(o,t)&&Ve(e,t,o[t]);return e},W=(e,o)=>un(e,fn(o));var bn=(e,o)=>{for(var t in o)Ie(e,t,{get:o[t],enumerable:!0})},Ko=(e,o,t,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of mn(o))!Fo.call(e,r)&&r!==t&&Ie(e,r,{get:()=>o[r],enumerable:!(l=gn(o,r))||l.enumerable});return e};var yn=(e,o,t)=>(t=e!=null?dn(xn(e)):{},Ko(o||!e||!e.__esModule?Ie(t,"default",{value:e,enumerable:!0}):t,e)),En=e=>Ko(Ie({},"__esModule",{value:!0}),e);var le=(e,o,t)=>Ve(e,typeof o!="symbol"?o+"":o,t);var Mn={};bn(Mn,{CallControlPanel:()=>st,getSDKVersion:()=>On,initSDK:()=>kn,isSDKInitialized:()=>Pn,useClickToCall:()=>Jo,useEndCall:()=>Xo,useGetAuthorizationToken:()=>Zo,useGetCallerData:()=>Vo,useLogout:()=>jo});module.exports=En(Mn);var Fe="cti.aighospitals.com",$=`https://${Fe}:8095`,hn=`wss://${Fe}:8095`,G={v1:"/api/v1"},R={LOGIN:`${$}${G.v1}/cti/login?provider=convox`,READY_AGENT:`${$}${G.v1}/cti/ready-agent?provider=convox`,UPDATE_AGENT_BREAK:`${$}${G.v1}/cti/update-agent-status?provider=convox`,CLICK_TO_CALL:`${$}${G.v1}/cti/calls?provider=convox`,HOLD_CALL:`${$}${G.v1}/cti/calls/hold?provider=convox`,MUTE_CALL:`${$}${G.v1}/cti/calls/mute?provider=convox`,UNMUTE_CALL:`${$}${G.v1}/cti/unmute-call?provider=convox`,END_CALL:`${$}${G.v1}/cti/calls/end?provider=convox`,LOGOUT:`${$}${G.v1}/cti/logout?provider=convox`,CONFERENCE_CALL:`${$}${G.v1}/cti/calls/conference?provider=convox`,CONFERENCE_CALL_HOLD_OR_UN_HOLD:`${$}${G.v1}/cti/calls/conference/hold?provider=convox`,CONFERENCE_CALL_MUTE_OT_UN_MUTE:`${$}${G.v1}/cti/calls/conference/mute?provider=convox`,CONFERENCE_CALL_END:`${$}${G.v1}/cti/calls/conference/hangup?provider=convox`,CONFERENCE_CALL_END_ALL:`${$}${G.v1}/cti/calls/conference/hangup/all?provider=convox`,TRANSFER_CALL:`${$}${G.v1}/cti/calls/transfer?provider=convox`,AGENTS_LIST:`${$}${G.v1}/cti/users`,PROCESS_LIST:`${$}${G.v1}/cti/processes-list`,TRANSFER_TO_DETAILS:`${$}${G.v1}/cti/transfer-to-details?provider=convox`,CALL_HISTORY:`${$}${G.v1}/dashboard/call-history`,SENTIMENTAL_ANALYSIS:`${$}${G.v1}/users/get_sentiment_analysis`},Wo={WS:`${hn}${G.v1}/cti/ws`},fe="call-control-sdk-state";var Ze=class{constructor(){le(this,"state");le(this,"listeners",[]);le(this,"STORAGE_KEY",fe);le(this,"apiKey");le(this,"tenantId");this.state=this.getInitialState(),this.loadFromStorage()}getInitialState(){return{authorization:void 0,process:null,agentId:"",openConferenceDialog:!1,openCallTransferDialog:!1,isInitialized:!1,sdkConfig:{disableEndCallButton:!1,disabledDialButton:!1,disableCallTransferButton:!1,isDraggable:!0,disableSoftPhone:!1,disableConferenceButton:!1,disabled:{},enabled:{},outlined:{}},isHolding:!1,isMuted:!1,status:"idle",callStartTime:null,controlPanelPosition:{x:10,y:10},iframePosition:{x:10,y:80},callData:{agent_id:"",status:"",type:"",event_time:"",phone_number:""},conferenceLine:[{line:1,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1},{line:2,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1},{line:3,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1},{line:4,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1},{line:5,status:"IDLE",type:"",phone:"",isMute:!1,isHold:!1,isCallStart:!1,isMergeCall:!1}]}}loadFromStorage(){try{let o=localStorage.getItem(this.STORAGE_KEY);if(o){let t=JSON.parse(o);this.state=W(d({},this.state),{agentId:t.agentId||"",authorization:t.authorization||void 0,process:t.process||null,openConferenceDialog:(t==null?void 0:t.openConferenceDialog)||!1,openCallTransferDialog:(t==null?void 0:t.openCallTransferDialog)||!1,isInitialized:t.isInitialized||!1,sdkConfig:t.sdkConfig||{disableEndCallButton:!1,disabledDialButton:!1,disableCallTransferButton:!1,isDraggable:!0,disableSoftPhone:!1,disableConferenceButton:!1,disabled:{},enabled:{},outlined:{}},isHolding:t.isHolding||!1,isMuted:t.isMuted||!1,status:t.status||"idle",callStartTime:t.callStartTime||null,controlPanelPosition:t.controlPanelPosition||{x:10,y:10},iframePosition:t.iframePosition||{x:10,y:80},callData:t.callData||{mobileNumber:"",callReferenceId:"",agent_id:"",status:"",type:"",event_time:"",phone_number:""},conferenceLine:t.conferenceLine&&Array.isArray(t.conferenceLine)&&t.conferenceLine.length>0?t.conferenceLine:this.state.conferenceLine})}}catch(o){console.warn("Failed to load SDK state from localStorage:",o)}}saveToStorage(){try{let o={agentId:this.state.agentId,authorization:this.state.authorization,process:this.state.process,isInitialized:this.state.isInitialized,openConferenceDialog:this.state.openConferenceDialog,openCallTransferDialog:this.state.openCallTransferDialog,sdkConfig:this.state.sdkConfig,isHolding:this.state.isHolding,isMuted:this.state.isMuted,status:this.state.status,callStartTime:this.state.callStartTime,controlPanelPosition:this.state.controlPanelPosition,iframePosition:this.state.iframePosition,callData:this.state.callData,conferenceLine:this.state.conferenceLine};localStorage.setItem(this.STORAGE_KEY,JSON.stringify(o))}catch(o){console.warn("Failed to save SDK state to localStorage:",o)}}notifyListeners(){this.listeners.forEach(o=>o())}validateCredentials(o,t){if(!o||typeof o!="string"||o.trim().length===0)throw new Error("API key not available");if(!t||typeof t!="string"||t.trim().length===0)throw new Error("Tenant ID not available");this.apiKey=o.trim(),this.tenantId=t.trim()}initialize(o,t,l,r,a){if(this.validateCredentials(o,t),!l||typeof l!="string"||l.trim().length===0)throw new Error("Agent ID not available");this.state.agentId=l,this.state.openConferenceDialog=!1,this.state.openCallTransferDialog=!1,this.state.authorization=a,this.state.sdkConfig=d({disableEndCallButton:!1,disabledDialButton:!1,disableCallTransferButton:!1,isDraggable:!0,disableSoftPhone:!1,disableConferenceButton:!1,disabled:{},enabled:{},outlined:{}},r),this.state.isInitialized=!0,this.saveToStorage(),this.notifyListeners()}getState(){return d({},this.state)}getCredentials(){return{apiKey:this.apiKey,tenantId:this.tenantId}}getSdkAuthToken(){var o;return(o=this.state.authorization)==null?void 0:o.accessToken}subscribe(o){return this.listeners.push(o),()=>{let t=this.listeners.indexOf(o);t>-1&&this.listeners.splice(t,1)}}setHolding(o){this.state.isHolding=o,this.saveToStorage(),this.notifyListeners()}setMuted(o){this.state.isMuted=o,this.saveToStorage(),this.notifyListeners()}setStatus(o){this.state.status=o,this.saveToStorage(),this.notifyListeners()}setProcess(o){this.state.process=o,this.saveToStorage(),this.notifyListeners()}setControlPanelPosition(o){this.state.controlPanelPosition=o,this.saveToStorage(),this.notifyListeners()}setIframePosition(o){this.state.iframePosition=o,this.saveToStorage(),this.notifyListeners()}startCall(){this.state.callStartTime=Date.now(),this.state.status="on call",this.saveToStorage(),this.notifyListeners()}endCall(){this.state.callStartTime=null,this.state.status="idle",this.state.isHolding=!1,this.state.isMuted=!1,this.saveToStorage(),this.notifyListeners()}setInitCheck(){this.state.isInitialized=!1,this.saveToStorage(),this.notifyListeners()}setOpenConferenceDialog(o){this.state.openConferenceDialog=o,this.saveToStorage(),this.notifyListeners()}setOpenCallTransferDialog(o){this.state.openCallTransferDialog=o,this.saveToStorage(),this.notifyListeners()}updateCallData(o){this.state.callData=d(d({},this.state.callData),o),this.saveToStorage(),this.notifyListeners()}updateConferenceData(o){this.state.conferenceLine=[...o],this.saveToStorage(),this.notifyListeners()}setConferenceLine(o){var l;(!this.state.conferenceLine||!Array.isArray(this.state.conferenceLine))&&(console.warn("Conference line data corrupted, resetting to initial state"),this.state.conferenceLine=this.getInitialState().conferenceLine);let t=(l=this.state.conferenceLine)==null?void 0:l.map(r=>r.line===o.line?o:r);this.state.conferenceLine=t,this.saveToStorage(),this.notifyListeners()}resetConferenceLines(){this.state.conferenceLine=this.getInitialState().conferenceLine,this.saveToStorage(),this.notifyListeners()}clearStorageAndReset(){try{localStorage.removeItem(this.STORAGE_KEY),this.state=this.getInitialState(),this.notifyListeners()}catch(o){console.warn("Failed to clear localStorage:",o)}}debugStorage(){try{let o=localStorage.getItem(this.STORAGE_KEY);console.log("Current localStorage data:",o),o&&console.log("Parsed localStorage data:",JSON.parse(o)),console.log("Current state:",this.state)}catch(o){console.error("Error debugging storage:",o)}}getConferenceLines(){return this.state.conferenceLine||[]}},C=new Ze;var Qe=class{constructor(){le(this,"config",null);le(this,"ticketId",null);le(this,"baseUrl","");le(this,"eventQueue",[]);le(this,"flushTimer",null)}async init(o){this.config=d({autoTrack:!0,retryAttempts:3,queueSize:100,flushInterval:5e3},o),this.baseUrl=o.baseUrl||(typeof window!="undefined"?window.location.origin:""),this.setupNetworkDetection();let t=await this.createTicket();return this.startPeriodicFlush(),console.log("EventTracker SDK initialized successfully"),t}isInitialized(){return this.config!==null&&this.ticketId!==null}getConfig(){return this.config}getTicketId(){return this.ticketId}async createTicket(){if(!this.config)throw new Error("EventTracker not initialized");try{let o=await this.makeRequest("/api/v1/et/init",{method:"POST",headers:{"Content-Type":"application/json","X-API-Key":this.config.apiKey},body:JSON.stringify({agentId:this.config.agentId,sessionId:this.config.sessionId})});if(!o.ok)throw C.setInitCheck(),new Error(`Failed to initialize: ${o.status} ${o.statusText}`);let t=await o.json();return this.ticketId=t.ticketId,this.config.autoTrack&&this.setupAutoTracking(),t}catch(o){throw console.error("EventTracker initialization failed:",o),o}}async logEvent(o,t){if(!this.config||!this.ticketId){console.warn("EventTracker not initialized, skipping event:",o);return}let l={eventType:o,eventData:t,timestamp:Date.now()};this.eventQueue.push(l),this.eventQueue.length>(this.config.queueSize||100)&&this.eventQueue.shift()}async makeRequest(o,t){var a;let l=`${this.baseUrl}${o}`,r=((a=this.config)==null?void 0:a.retryAttempts)||3;for(let c=1;c<=r;c++)try{return await fetch(l,t)}catch(x){if(c===r)throw x;let E=Math.min(1e3*Math.pow(2,c-1),1e4);await new Promise(b=>setTimeout(b,E))}throw new Error("Max retries exceeded")}setupAutoTracking(){var l;if(typeof window=="undefined"||!((l=this.config)!=null&&l.autoTrack))return;let o=this.config.autoTrack===!0?{}:this.config.autoTrack;if(o.pageVisits!==!1&&this.logEvent("pageVisit",{url:window.location.href,title:document.title,referrer:document.referrer,userAgent:navigator.userAgent,viewport:{width:window.innerWidth,height:window.innerHeight},timestamp:new Date().toISOString()}).catch(r=>console.warn("Failed to track page visit:",r)),o.clicks!==!1&&document.addEventListener("click",r=>{var c;let a=r.target;(a.tagName==="BUTTON"||a.tagName==="A"||a.onclick||a.getAttribute("role")==="button"||a instanceof HTMLButtonElement&&a.type==="button")&&this.logEvent("click",{element:a.tagName,text:(c=a.textContent)==null?void 0:c.trim().substring(0,100),href:a.getAttribute("href"),id:a.id,className:a.className,role:a.getAttribute("role"),position:{x:r.clientX,y:r.clientY},timestamp:new Date().toISOString()}).catch(x=>console.warn("Failed to track click:",x))}),o.forms!==!1&&document.addEventListener("submit",r=>{let a=r.target,c=new FormData(a),x={};c.forEach((E,b)=>{x[b]=E.toString()}),this.logEvent("formSubmission",{formId:a.id,action:a.action,method:a.method,fields:Object.keys(x),fieldCount:Object.keys(x).length,timestamp:new Date().toISOString()}).catch(E=>console.warn("Failed to track form submission:",E))}),o.inputs!==!1){let r;document.addEventListener("input",a=>{let c=a.target;(c.tagName==="INPUT"||c.tagName==="TEXTAREA"||c.tagName==="SELECT")&&(clearTimeout(r),r=setTimeout(()=>{var x;this.logEvent("fieldChange",{element:c.tagName,type:c.getAttribute("type"),name:c.getAttribute("name"),id:c.id,valueLength:((x=c.value)==null?void 0:x.length)||0,timestamp:new Date().toISOString()}).catch(E=>console.warn("Failed to track field change:",E))},1e3))})}let t=Date.now();window.addEventListener("beforeunload",()=>{let r=Date.now()-t;this.logEvent("pageUnload",{url:window.location.href,sessionDuration:r,timestamp:new Date().toISOString()})}),o.visibility!==!1&&document.addEventListener("visibilitychange",()=>{this.logEvent("visibilityChange",{hidden:document.hidden,visibilityState:document.visibilityState,timestamp:new Date().toISOString()})}),o.errors!==!1&&(window.addEventListener("error",r=>{this.logEvent("jsError",{message:r.message,filename:r.filename,lineno:r.lineno,colno:r.colno,timestamp:new Date().toISOString()})}),window.addEventListener("unhandledrejection",r=>{var a;this.logEvent("unhandledRejection",{reason:(a=r.reason)==null?void 0:a.toString(),timestamp:new Date().toISOString()})})),o.performance!==!1&&typeof window.performance!="undefined"&&window.performance.navigation&&window.addEventListener("load",()=>{setTimeout(()=>{let r=window.performance.navigation,a=window.performance.timing;this.logEvent("performanceMetrics",{navigationTime:a.navigationStart,loadTime:a.loadEventEnd-a.navigationStart,domReady:a.domContentLoadedEventEnd-a.navigationStart,renderTime:a.loadEventEnd-a.domContentLoadedEventEnd,navigationType:r.type,redirectCount:r.redirectCount,timestamp:new Date().toISOString()})},1e3)})}setupNetworkDetection(){typeof window!="undefined"&&(window.addEventListener("online",()=>{console.log("EventTracker: Back online, flushing queued events")}),window.addEventListener("offline",()=>{console.log("EventTracker: Offline, queueing events")}))}startPeriodicFlush(){this.flushTimer&&clearInterval(this.flushTimer)}},et=new Qe;typeof window!="undefined"&&(window.EventTracker=et);var me=require("react");var Yo=yn(require("axios"));var Go,Sn=(Go=C.getSdkAuthToken())!=null?Go:"",Tn=6e4;function vn(){var e;return(e=C.getSdkAuthToken())!=null?e:""}function Dn(){var o,t,l,r;let e=Yo.default.create({baseURL:$,headers:{"Content-Type":"application/json",Accept:"application/json","x-tenant-id":(t=(o=C.getCredentials())==null?void 0:o.tenantId)!=null?t:"","x-api-key":(r=(l=C.getCredentials())==null?void 0:l.apiKey)!=null?r:"",Authorization:`${Sn}`},timeout:Tn,withCredentials:!1});return e.interceptors.request.use(a=>{let c=vn();return c&&a.headers&&(a.headers.Authorization=`${c}`),a.metadata={startTime:new Date().getTime()},a},a=>(console.error("Request interceptor error:",a),Promise.reject(a))),e.interceptors.response.use(a=>{var E;let c=new Date().getTime(),x=(E=a.config.metadata)==null?void 0:E.startTime;return x&&console.log(`Request to ${a.config.url} took ${c-x}ms`),a},async a=>{var x;let c=a.config;return((x=a.response)==null?void 0:x.status)===401&&!c._retry&&(C.setInitCheck(),console.warn("Unauthorized request, attempting retry...")),a.response||(console.error("Network error:",a.message),a.message="Network error: Please check your internet connection"),a.response&&a.response.status>=500&&(console.error("Server error:",a.response.status,a.response.data),a.message="Server error: Please try again later"),Promise.reject(a)}),e}var Ln=Dn(),oe=Ln;var jo=()=>{let[e,o]=(0,me.useState)(!1),[t,l]=(0,me.useState)(!1),[r,a]=(0,me.useState)(!1),[c,x]=(0,me.useState)(null),[E,b]=(0,me.useState)(null);return{logout:(0,me.useCallback)(async()=>{var y;let u=JSON.parse((y=localStorage.getItem(fe))!=null?y:"");o(!0);let g={action:"LOGOUTUSER",userId:u.agentId||""};return oe.post(R.LOGOUT,g).then(m=>(C.clearStorageAndReset(),localStorage.clear(),sessionStorage.clear(),b(m==null?void 0:m.data),l(!0),m==null?void 0:m.data)).catch(m=>{var h;return a(!0),x(m),(h=m==null?void 0:m.response)==null?void 0:h.data}).finally(()=>{o(!1)})},[]),isLoading:e,isSuccess:t,isError:r,error:c,data:E}};var xe=require("react");var Xo=()=>{let[e,o]=(0,xe.useState)(!1),[t,l]=(0,xe.useState)(!1),[r,a]=(0,xe.useState)(!1),[c,x]=(0,xe.useState)(null),[E,b]=(0,xe.useState)(null);return{handleEndCall:(0,xe.useCallback)(async u=>{var m,h,N,U,H,M,q,te,K,O,T,D,ne,se,I;let g=JSON.parse((m=localStorage.getItem(fe))!=null?m:"");o(!0);let y={action:"ENDCALL",userId:g==null?void 0:g.agentId,processid:(U=(N=(h=g==null?void 0:g.process)==null?void 0:h.process_id)==null?void 0:N.toString())!=null?U:"",process_name:(M=(H=g==null?void 0:g.process)==null?void 0:H.process_name)!=null?M:"",callreferenceid:(te=(q=g==null?void 0:g.callData)==null?void 0:q.convox_id)!=null?te:"",mobile_number:(O=(K=g==null?void 0:g.callData)==null?void 0:K.phone_number)!=null?O:"",disposition:(T=u==null?void 0:u.disposition)!=null?T:"RES",set_followUp:(D=u==null?void 0:u.followUp)!=null?D:"N",callback_date:(ne=u==null?void 0:u.callbackDate)!=null?ne:"",callback_hrs:(se=u==null?void 0:u.callbackHrs)!=null?se:"",callback_mins:(I=u==null?void 0:u.callbackMins)!=null?I:"",endcall_type:"CLOSE"};return oe.post(R.END_CALL,y).then(v=>(C.endCall(),b(v==null?void 0:v.data),l(!0),v==null?void 0:v.data)).catch(v=>{var P;return a(!0),x(v),(P=v==null?void 0:v.response)==null?void 0:P.data}).finally(()=>{o(!1)})},[]),isLoading:e,isSuccess:t,isError:r,error:c,data:E}};var Ce=require("react");var Jo=()=>{let[e,o]=(0,Ce.useState)(!1),[t,l]=(0,Ce.useState)(!1),[r,a]=(0,Ce.useState)(!1),[c,x]=(0,Ce.useState)(null),[E,b]=(0,Ce.useState)(null);return{handleStartCall:(0,Ce.useCallback)(async u=>{var y,m,h,N,U,H,M,q,te;let g=JSON.parse((y=localStorage.getItem(fe))!=null?y:"");if(o(!0),((m=g==null?void 0:g.callData)==null?void 0:m.status)==="IDLE"){let K={action:"CALL",userId:g==null?void 0:g.agentId,phone_number:u==null?void 0:u.mobileNumber};return oe.post(R.CLICK_TO_CALL,K).then(O=>(b(O==null?void 0:O.data),l(!0),O==null?void 0:O.data)).catch(O=>{var T;return a(!0),x(O),(T=O==null?void 0:O.response)==null?void 0:T.data}).finally(()=>{o(!1)})}else if(((h=g==null?void 0:g.callData)==null?void 0:h.status)==="ONCALL"){let K=(U=(N=g==null?void 0:g.conferenceLine)==null?void 0:N.filter(T=>T.line!==1))==null?void 0:U.find(T=>T.status==="IDLE"&&!(T!=null&&T.isCallStart)),O={action:"EXTERNAL_CONFERENCE",operation:`CALL${K.line}`,line_used:String(K.line),thirdparty_no:u==null?void 0:u.mobileNumber,userid:(M=(H=g.callData)==null?void 0:H.agent_id)!=null?M:"",process:(te=(q=g.callData)==null?void 0:q.process_name)!=null?te:""};return oe.post(R.CONFERENCE_CALL,O).then(T=>(b(T==null?void 0:T.data),l(!0),C.setConferenceLine(W(d({},K),{isCallStart:!0,status:"ONCALL",phone:u==null?void 0:u.mobileNumber})),C.setOpenConferenceDialog(!0),T==null?void 0:T.data)).catch(T=>{var D;return a(!0),x(T),(D=T==null?void 0:T.response)==null?void 0:D.data}).finally(()=>{o(!1)})}else alert("Agent is not ready")},[]),isLoading:e,isSuccess:t,isError:r,error:c,data:E}};var Ke=require("react");var Vo=()=>{let{process_id:e,process_name:o,status:t,phone_number:l,agent_id:r,convox_id:a}=C.getState().callData,c={phone_number:l,status:t,callReferenceId:a,agent_id:r,process_id:e,process_name:o},[x,E]=(0,Ke.useState)(c);return(0,Ke.useEffect)(()=>C.subscribe(()=>{let{process_id:w,process_name:u,status:g,phone_number:y,agent_id:m,convox_id:h}=C.getState().callData;E({phone_number:y,status:g,callReferenceId:h,agent_id:m,process_id:w,process_name:u})}),[]),x};var We=require("react");var Zo=()=>{let[e,o]=(0,We.useState)(C.getSdkAuthToken());return(0,We.useEffect)(()=>C.subscribe(()=>{o(C.getSdkAuthToken())}),[]),e};var Je=require("react");var L=require("@mui/icons-material"),f=require("@mui/material"),ee=require("react");var re=require("react");function tt(e,o){let[t,l]=(0,re.useState)(e),[r,a]=(0,re.useState)(!1),c=(0,re.useRef)(),x=(0,re.useRef)({x:0,y:0}),E=(0,re.useRef)({x:0,y:0}),b=(0,re.useCallback)(y=>{let m=c.current;if(!m)return;let h=m.getBoundingClientRect(),N=window.innerWidth,U=window.innerHeight,H={x:Math.max(0,Math.min(y.x,N-h.width)),y:Math.max(0,Math.min(y.y,U-h.height))};l(H),o==null||o(H)},[o]),w=(0,re.useCallback)((y,m)=>{a(!0),x.current={x:y,y:m},E.current=t;let h=(M,q)=>{let te=M-x.current.x,K=q-x.current.y;b({x:E.current.x+te,y:E.current.y+K})},N=M=>{M.preventDefault(),h(M.clientX,M.clientY)},U=M=>{M.preventDefault();let q=M.touches[0];q&&h(q.clientX,q.clientY)},H=()=>{a(!1),document.removeEventListener("mousemove",N),document.removeEventListener("mouseup",H),document.removeEventListener("touchmove",U),document.removeEventListener("touchend",H)};document.addEventListener("mousemove",N),document.addEventListener("mouseup",H),document.addEventListener("touchmove",U,{passive:!1}),document.addEventListener("touchend",H)},[t,b]),u=(0,re.useCallback)(y=>{y.preventDefault(),w(y.clientX,y.clientY)},[w]),g=(0,re.useCallback)(y=>{y.preventDefault();let m=y.touches[0];m&&w(m.clientX,m.clientY)},[w]);return{position:t,isDragging:r,dragRef:c,handleMouseDown:u,handleTouchStart:g}}var Ge=require("react");function he(){let[e,o]=(0,Ge.useState)(C.getState());return(0,Ge.useEffect)(()=>C.subscribe(()=>{o(C.getState())}),[]),e}var je=require("react");var be=require("react"),Ye=require("@mui/material"),Re=require("react/jsx-runtime"),Qo=(0,be.createContext)(void 0),Ee=()=>{let e=(0,be.useContext)(Qo);if(!e)throw new Error("useToast must be used inside ToastProvider");return e},en=({children:e})=>{let[o,t]=(0,be.useState)(!1),[l,r]=(0,be.useState)(""),[a,c]=(0,be.useState)("info"),x=(E,b="info")=>{r(E),c(b),t(!0)};return(0,Re.jsxs)(Qo.Provider,{value:{showToast:x},children:[e,(0,Re.jsx)(Ye.Snackbar,{open:o,color:a,autoHideDuration:3e3,onClose:()=>t(!1),anchorOrigin:{vertical:"top",horizontal:"right"},children:(0,Re.jsx)(Ye.Alert,{variant:"filled",severity:a,onClose:()=>t(!1),sx:{width:"100%"},children:l})})]})};var _n={isLoading:!1,isSuccess:!1,isError:!1,error:null,data:null},In=(e,o)=>{if(o.type==="isLoading")return W(d({},e),{isLoading:o.payload});if(o.type==="isSuccess")return W(d({},e),{isSuccess:!0,data:o.payload});if(o.type==="isError")return W(d({},e),{isError:!0,error:o.payload});if(o.type==="reset")return{isLoading:!1,isSuccess:!1,isError:!1,error:null,data:null};throw Error("Unknown action.")};var ce=(e={})=>{let{onSuccess:o=null,onError:t=null,disabledSuccessToast:l=!1}=e,{showToast:r}=Ee(),[a,c]=(0,je.useReducer)(In,_n);return[(0,je.useCallback)((E,b,w={})=>{c({type:"isLoading",payload:!0}),oe.post(E,b,w).then(u=>{var g,y;c({type:"isSuccess",payload:u.data}),o==null||o(u.data,b),console.log((g=u.data)==null?void 0:g.message,"res45"),l||r((y=u.data)==null?void 0:y.message,"success")}).catch(u=>{var y,m,h,N,U,H,M,q,te,K,O,T;let g={status:(m=(y=u.response)==null?void 0:y.status)!=null?m:500,message:((N=(h=u.response)==null?void 0:h.data)==null?void 0:N.detail)||((H=(U=u.response)==null?void 0:U.data)==null?void 0:H.message)||u.message||"An unknown error occurred",data:(q=(M=u.response)==null?void 0:M.data)!=null?q:null,statusText:(K=(te=u.response)==null?void 0:te.statusText)!=null?K:"",code:(O=u==null?void 0:u.code)!=null?O:"",name:(T=u==null?void 0:u.name)!=null?T:""};r(g.message,"error"),c({type:"isError",payload:g}),t==null||t(g,b)}).finally(()=>{c({type:"isLoading",payload:!1})})},[o,t,r]),a]};var A=require("@mui/icons-material"),s=require("@mui/material"),pe=require("react");var tn=require("@mui/material");var Rn=({disabled:e,enabled:o,outlined:t})=>{let l=(0,tn.useTheme)();return{disabled:d({padding:"0px",margin:"0px",minWidth:"40px !important",borderRadius:"16px",border:"1px solid rgb(206, 204, 204)",height:"40px","&:hover":{boxShadow:" 0px 2px 2px rgba(0, 0, 0, 0.79)",border:`1px solid ${l.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${l.palette.primary.light}`}},e),enabled:d({padding:"0px",margin:"0px",minWidth:"40px !important",borderRadius:"16px",boxShadow:" 0px 2px 1px rgba(0, 0, 0, 0.507)",border:`1px solid ${l.palette.primary.main}`,height:"40px","&:hover":{boxShadow:" 0px 2px 1px rgba(0, 0, 0, 0.507)",border:`1px solid ${l.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${l.palette.primary.light}`}},o),outlined:d({padding:"0px",margin:"0px",minWidth:"40px !important",borderRadius:"16px",backgroundColor:l.palette.grey[200],boxShadow:`0px 2px 1px ${l.palette.primary.light}`,border:`0px solid ${l.palette.primary.main}`,height:"40px","&:hover":{boxShadow:`0px 2px 1px ${l.palette.primary.main}`,border:`0px solid ${l.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${l.palette.primary.light}`}},t)}},Xe=Rn;var n=require("react/jsx-runtime"),An=({each:e})=>{var O,T,D,ne,se;let o=he(),{showToast:t}=Ee(),{disabled:l,enabled:r,outlined:a}=Xe({disabled:((O=o.sdkConfig)==null?void 0:O.disabled)||{},enabled:((T=o.sdkConfig)==null?void 0:T.enabled)||{},outlined:((D=o.sdkConfig)==null?void 0:D.outlined)||{}}),c=(0,s.useTheme)(),[x,E]=(0,pe.useState)(!1),[b,w]=(0,pe.useState)(!1),[u,g]=(0,pe.useState)(!1),[y,m]=(0,pe.useState)(!1),[h,N]=(0,pe.useState)(!1),U=(I,v)=>{C.setConferenceLine(d(d({},I),v))},H=(I,v)=>{var j,z,J,V;let P=d(d({},I),v);E(!0);let Y={action:"EXTERNAL_CONFERENCE",operation:`CALL${P.line}`,line_used:String(P.line),thirdparty_no:P.phone,userid:(z=(j=o.callData)==null?void 0:j.agent_id)!=null?z:"",process:(V=(J=o.callData)==null?void 0:J.process_name)!=null?V:""};oe.post(R.CONFERENCE_CALL,Y).then(k=>{var _;t((_=k.data)==null?void 0:_.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(k=>{var F,Z,Q,X;let _=((Z=(F=k.response)==null?void 0:F.data)==null?void 0:Z.detail)||((X=(Q=k.response)==null?void 0:Q.data)==null?void 0:X.message)||k.message||"An unknown error occurred";t(_,"error")}).finally(()=>{E(!1)})},M=(I,v)=>{var j,z,J,V;let P=d(d({},I),v);w(!0);let Y={action:"EXTERNAL_CONFERENCE",operation:"CONFERENCE",line_used:String(P.line),thirdparty_no:P.phone,userid:(z=(j=o.callData)==null?void 0:j.agent_id)!=null?z:"",process:(V=(J=o.callData)==null?void 0:J.process_name)!=null?V:""};oe.post(R.CONFERENCE_CALL,Y).then(k=>{var _;t((_=k.data)==null?void 0:_.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(k=>{var F,Z,Q,X;let _=((Z=(F=k.response)==null?void 0:F.data)==null?void 0:Z.detail)||((X=(Q=k.response)==null?void 0:Q.data)==null?void 0:X.message)||k.message||"An unknown error occurred";t(_,"error")}).finally(()=>{w(!1)})},q=(I,v,P)=>{var z,J,V,k;let Y=d(d({},I),v);g(!0);let j={action:"EXTERNAL_CONFERENCE",operation:P,hold_channel_no:P==="HOLDUSER"?`hold${Y.line}`:`unhold${Y.line}`,userid:(J=(z=o.callData)==null?void 0:z.agent_id)!=null?J:"",process:(k=(V=o.callData)==null?void 0:V.process_name)!=null?k:""};oe.post(R.CONFERENCE_CALL_HOLD_OR_UN_HOLD,j).then(_=>{var F;t((F=_.data)==null?void 0:F.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(_=>{var Z,Q,X,de;let F=((Q=(Z=_.response)==null?void 0:Z.data)==null?void 0:Q.detail)||((de=(X=_.response)==null?void 0:X.data)==null?void 0:de.message)||_.message||"An unknown error occurred";t(F,"error")}).finally(()=>{g(!1)})},te=(I,v,P)=>{var z,J,V,k;let Y=d(d({},I),v);m(!0);let j={action:"EXTERNAL_CONFERENCE",operation:P,channel_no:P==="MUTEUSER"?`mute${Y.line}`:`play${Y.line}`,userid:(J=(z=o.callData)==null?void 0:z.agent_id)!=null?J:"",thirdparty_no:Y.phone,process:(k=(V=o.callData)==null?void 0:V.process_name)!=null?k:""};oe.post(R.CONFERENCE_CALL_MUTE_OT_UN_MUTE,j).then(_=>{var F;t((F=_.data)==null?void 0:F.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(_=>{var Z,Q,X,de;let F=((Q=(Z=_.response)==null?void 0:Z.data)==null?void 0:Q.detail)||((de=(X=_.response)==null?void 0:X.data)==null?void 0:de.message)||_.message||"An unknown error occurred";t(F,"error")}).finally(()=>{m(!1)})},K=(I,v)=>{var j,z,J,V;let P=d(d({},I),v);N(!0);let Y={action:"EXTERNAL_CONFERENCE",operation:"HANGUP_CHANNEL",line_used:String(P.line-1),user_type:`THIRDPARTY${P.line-1}`,thirdparty_no:P.phone,userid:(z=(j=o.callData)==null?void 0:j.agent_id)!=null?z:"",process:(V=(J=o.callData)==null?void 0:J.process_name)!=null?V:""};oe.post(R.CONFERENCE_CALL_END,Y).then(k=>{var _;t((_=k.data)==null?void 0:_.message,"success"),C.setConferenceLine(d(d({},I),v))}).catch(k=>{var F,Z,Q,X;let _=((Z=(F=k.response)==null?void 0:F.data)==null?void 0:Z.detail)||((X=(Q=k.response)==null?void 0:Q.data)==null?void 0:X.message)||k.message||"An unknown error occurred";t(_,"error")}).finally(()=>{N(!1)})};return(0,n.jsxs)(s.TableRow,{sx:{border:"2px solid #fff"},children:[(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsxs)(s.Typography,{children:["Line ",(ne=e==null?void 0:e.line)!=null?ne:"",". "]})}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsx)(s.Typography,{variant:"body2",sx:{px:1,borderRadius:"10px"},children:(se=e==null?void 0:e.status)!=null?se:""})}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsx)(s.Button,{sx:{textTransform:"capitalize"},size:"small",children:(0,n.jsx)(s.Typography,{variant:"body2",children:(e==null?void 0:e.line)===1?"Internal":"External"})})}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsx)(s.TextField,{size:"small",placeholder:"Phone Number",fullWidth:!0,value:(e==null?void 0:e.phone)||"",disabled:(e==null?void 0:e.line)===1||(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="DISCONNECTED"||(e==null?void 0:e.status)==="CONFERENCE",onChange:I=>{U(e,{phone:I.target.value})}})}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:(0,n.jsxs)(s.Box,{sx:{display:"flex",alignItems:"center",justifyContent:"space-around"},children:[e.line!==1&&(0,n.jsx)(s.Tooltip,{title:"Call",children:(0,n.jsx)(s.Button,{variant:(e==null?void 0:e.status)!=="IDLE"?"outlined":"contained",color:"success",sx:(e==null?void 0:e.status)!=="IDLE"?d({},l):W(d({},r),{border:`0px solid ${c.palette.success.light}`,"&:hover":{bgcolor:"success.light",boxShadow:`0px 2px 1px ${c.palette.success.light}`,border:`0px solid ${c.palette.success.light}`},"&:active":{bgcolor:"success.light",boxShadow:`inset 1px -2px 4px ${c.palette.primary.light}`}}),onClick:()=>{H(e,{})},disabled:(e==null?void 0:e.status)!=="IDLE",children:x?(0,n.jsx)(s.CircularProgress,{size:"20px",color:"success"}):(0,n.jsx)(A.Call,{sx:{color:(e==null?void 0:e.status)!=="IDLE"?"default":"#f3f2f2"}})})}),e.line===1&&(0,n.jsx)(s.Tooltip,{title:"Merge Call",children:(0,n.jsxs)(s.Button,{variant:e!=null&&e.isMergeCall&&(e==null?void 0:e.status)==="ONCALL"?"contained":"outlined",sx:e!=null&&e.isMergeCall&&(e==null?void 0:e.status)==="ONCALL"?W(d({},l),{padding:"0px 16px"}):(e==null?void 0:e.status)==="ONCALL"?W(d({},a),{padding:"0px 16px"}):W(d({},l),{padding:"0px 16px"}),onClick:()=>{M(e,{isMergeCall:!0})},disabled:(e==null?void 0:e.status)!=="ONCALL"||b,children:[e!=null&&e.isMergeCall?"Merged":"Merge",b?(0,n.jsx)(s.CircularProgress,{size:"20px"}):(0,n.jsx)(A.CallSplit,{})]})}),(0,n.jsx)(s.Tooltip,{title:e.isHold?"Hold":"Un Hold",children:(0,n.jsx)(s.Button,{variant:e!=null&&e.isHold?"contained":"outlined",sx:e!=null&&e.isHold&&(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"?d({},l):(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"?d({},a):d({},l),onClick:()=>{e.isHold?q(e,{isHold:!1},"UNHOLDUSER"):q(e,{isHold:!0},"HOLDUSER")},disabled:(e==null?void 0:e.status)!=="ONCALL"&&(e==null?void 0:e.status)!=="CONFERENCE"||u,children:u?(0,n.jsx)(s.CircularProgress,{size:"20px",sx:{color:c.palette.primary.main}}):e.isHold?(0,n.jsx)(A.PlayArrow,{}):(0,n.jsx)(A.Pause,{})})}),(0,n.jsx)(s.Tooltip,{title:e.isMute?"Mute":"Un Mute",children:(0,n.jsx)(s.Button,{variant:e!=null&&e.isMute?"contained":"outlined",sx:e!=null&&e.isMute&&(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"?d({},l):(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"?d({},a):d({},l),onClick:()=>{e.isMute?te(e,{isMute:!1},"PLAYUSER"):te(e,{isMute:!0},"MUTEUSER")},disabled:(e==null?void 0:e.status)!=="ONCALL"&&(e==null?void 0:e.status)!=="CONFERENCE"||y,children:y?(0,n.jsx)(s.CircularProgress,{size:"20px",sx:{color:c.palette.primary.main}}):e.isMute?(0,n.jsx)(A.MicOff,{}):(0,n.jsx)(A.Mic,{})})}),(e==null?void 0:e.line)!==1?(0,n.jsx)(s.Tooltip,{title:"End Call",children:(0,n.jsx)(s.Button,{variant:(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"||(e==null?void 0:e.status)==="DIALING"?"contained":"outlined",color:"error",sx:(e==null?void 0:e.status)==="ONCALL"||(e==null?void 0:e.status)==="CONFERENCE"||(e==null?void 0:e.status)==="DIALING"?W(d({},r),{border:`0px solid ${c.palette.error.light}`,"&:hover":{bgcolor:"error.light",boxShadow:`0px 2px 1px ${c.palette.error.light}`,border:`0px solid ${c.palette.error.light}`},"&:active":{bgcolor:"error.light",boxShadow:`inset 1px -2px 4px ${c.palette.primary.light}`}}):d({},l),onClick:()=>{K(e,{isCallStart:!1,isMergeCall:!1,isMute:!1,isHold:!1})},disabled:(e==null?void 0:e.status)!=="ONCALL"&&(e==null?void 0:e.status)!=="CONFERENCE"&&(e==null?void 0:e.status)!=="DIALING"||h,children:h?(0,n.jsx)(s.CircularProgress,{size:"20px",color:"error"}):(0,n.jsx)(A.CallEnd,{})})}):(0,n.jsx)(s.Button,{variant:e!=null&&e.isCallStart?"contained":"outlined",color:"error",sx:{display:"none"},onClick:()=>{K(e,{isCallStart:!1,isMergeCall:!1,isMute:!1,isHold:!1})},disabled:!(e!=null&&e.isCallStart)||h,children:h?(0,n.jsx)(s.CircularProgress,{size:"20px",color:"error"}):(0,n.jsx)(A.CallEnd,{})})]})})]},e.line)};function on(){var c;let e=he(),{showToast:o}=Ee(),[t,l]=(0,pe.useState)(!1),r=()=>{C.setOpenConferenceDialog(!1)},a=()=>{var E,b,w,u;l(!0);let x={action:"EXTERNAL_CONFERENCE",operation:"ENDCONFERENCE",userid:(b=(E=e.callData)==null?void 0:E.agent_id)!=null?b:"",process:(u=(w=e.callData)==null?void 0:w.process_name)!=null?u:""};oe.post(R.CONFERENCE_CALL_END_ALL,x).then(g=>{var y;o((y=g.data)==null?void 0:y.message,"success"),C.resetConferenceLines(),r()}).catch(g=>{var m,h,N,U;let y=((h=(m=g.response)==null?void 0:m.data)==null?void 0:h.detail)||((U=(N=g.response)==null?void 0:N.data)==null?void 0:U.message)||g.message||"An unknown error occurred";o(y,"error")}).finally(()=>{l(!1)})};return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e.openConferenceDialog,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"10px 16px"},children:[(0,n.jsxs)(s.Typography,{variant:"body1",children:[(c=e==null?void 0:e.agentId)!=null?c:""," conference"]}),(0,n.jsx)(s.IconButton,{onClick:r,children:(0,n.jsx)(A.Close,{})})]}),(0,n.jsx)(s.Box,{sx:{boxShadow:"1px 1px 2px #e7e5e5ff",margin:"0px 15px",borderRadius:"20px"},children:(0,n.jsx)(s.TableContainer,{component:s.Paper,sx:{outline:"0px solid gray !important",boxShadow:"1px 1px 6px #e7e5e5ff"},children:(0,n.jsxs)(s.Table,{sx:{border:"4px solid #ffffff !important"},children:[(0,n.jsx)(s.TableHead,{children:(0,n.jsxs)(s.TableRow,{sx:{border:"2px solid #f3f3f3ff !important"},children:[(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Line"}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Status"}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Call Type"}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Mobile Number"}),(0,n.jsx)(s.TableCell,{sx:{padding:"6px"},children:"Call Actions"})]})}),(0,n.jsx)(s.TableBody,{children:e==null?void 0:e.conferenceLine.map(x=>(0,n.jsx)(An,{each:x}))})]})})}),(0,n.jsx)(s.Box,{textAlign:"center",m:2,children:(0,n.jsxs)(s.Button,{variant:"outlined",color:"error",size:"large",onClick:a,disabled:t,sx:{px:2,borderRadius:"20px",textTransform:"capitalize"},children:[t?(0,n.jsx)(s.CircularProgress,{size:"20px",color:"error",sx:{marginRight:"8px"}}):(0,n.jsx)(s.IconButton,{sx:{bgcolor:"error.main","&:hover":{bgcolor:"error.dark"},marginRight:"8px",width:"28px",height:"28px",fontSize:"12px",fontWeight:"600",lineHeight:"16px",letterSpacing:"0.02em",textTransform:"capitalize",color:"white",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"50%"},children:(0,n.jsx)(A.PhoneDisabled,{sx:{color:"white",fontSize:"16px",fontWeight:"600"}})}),"End Conference"]})})]})})})}function nn({open:e}){var y,m,h,N,U,H,M,q,te,K,O,T;let o=he(),[t]=ce({onSuccess:()=>{C.setOpenCallTransferDialog(!1)}}),[l,r]=(0,pe.useState)("process"),[a,{data:c,isLoading:x}]=ce({disabledSuccessToast:!0}),[E,{data:b,isLoading:w}]=ce({disabledSuccessToast:!0}),u=()=>{C.setOpenCallTransferDialog(!1)},g=(D,ne)=>{var se,I,v,P,Y,j,z,J,V,k,_,F,Z,Q,X,de,Se,Ae,Te,we,Ne,ke,ve,Oe,Pe,Me,De,Ue,Be,He,ze,$e,qe;if(console.log(D,"data34"),ne==="PROCESS"){let ye={mobile_number:(I=(se=o.callData)==null?void 0:se.phone_number)!=null?I:"",userid:(P=(v=o.callData)==null?void 0:v.agent_id)!=null?P:"",type:"PROCESS",transfer_to:(Y=D==null?void 0:D.process_name)!=null?Y:"",callreferenceid:(z=(j=o.callData)==null?void 0:j.convox_id)!=null?z:"",processid:String((V=(J=o.callData)==null?void 0:J.process_id)!=null?V:""),process_name:(_=(k=o.callData)==null?void 0:k.process_name)!=null?_:""};t(R.TRANSFER_CALL,ye)}else if(ne==="QUEUE"){let ye={mobile_number:(Z=(F=o.callData)==null?void 0:F.phone_number)!=null?Z:"",userid:(X=(Q=o.callData)==null?void 0:Q.agent_id)!=null?X:"",type:"QUEUE",transfer_to:(de=D==null?void 0:D.queue_name)!=null?de:"",callreferenceid:(Ae=(Se=o.callData)==null?void 0:Se.convox_id)!=null?Ae:"",processid:String((we=(Te=o.callData)==null?void 0:Te.process_id)!=null?we:""),process_name:(ke=(Ne=o.callData)==null?void 0:Ne.process_name)!=null?ke:""};t(R.TRANSFER_CALL,ye)}else if(ne==="AGENT"){let ye={mobile_number:(Oe=(ve=o.callData)==null?void 0:ve.phone_number)!=null?Oe:"",userid:(Me=(Pe=o.callData)==null?void 0:Pe.agent_id)!=null?Me:"",type:"AGENT",transfer_to:(De=D==null?void 0:D.user_id)!=null?De:"",callreferenceid:(Be=(Ue=o.callData)==null?void 0:Ue.convox_id)!=null?Be:"",processid:String((ze=(He=o.callData)==null?void 0:He.process_id)!=null?ze:""),process_name:(qe=($e=o.callData)==null?void 0:$e.process_name)!=null?qe:""};t(R.TRANSFER_CALL,ye)}};return(0,pe.useEffect)(()=>{a(R.AGENTS_LIST,{status:"IDLE",active:!0}),E(R.TRANSFER_TO_DETAILS,{status:"ACTIVE",active:!0})},[]),(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,n.jsx)(s.Typography,{variant:"body1",children:" Call Transfer"}),(0,n.jsx)(s.IconButton,{onClick:u,children:(0,n.jsx)(A.Close,{})})]}),(0,n.jsxs)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px 10px",margin:"10px",borderRadius:"10px"},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",gap:1},children:[(0,n.jsx)(s.Button,{variant:l==="process"?"contained":"outlined",onClick:()=>{r("process"),E(R.TRANSFER_TO_DETAILS,{status:"ACTIVE",active:!0})},children:"Process"}),(0,n.jsx)(s.Button,{variant:l==="queues"?"contained":"outlined",onClick:()=>{r("queues"),E(R.TRANSFER_TO_DETAILS,{status:"ACTIVE",active:!0})},children:"Queues"}),(0,n.jsx)(s.Button,{variant:l==="agents"?"contained":"outlined",onClick:()=>{r("agents"),a(R.AGENTS_LIST,{status:"IDLE",active:!0})},children:"Agents"})]}),(w||x)&&(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",height:"80px"},children:[(0,n.jsx)(s.CircularProgress,{})," "]}),!w&&!x&&l==="process"&&(0,n.jsx)(s.Box,{sx:{display:"flex",gap:1,flexWrap:"wrap"},children:(y=b==null?void 0:b.data)!=null&&y.process&&((h=(m=b==null?void 0:b.data)==null?void 0:m.process)==null?void 0:h.length)>0?(U=(N=b==null?void 0:b.data)==null?void 0:N.process)==null?void 0:U.map((D,ne)=>(0,n.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,n.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,n.jsx)(A.SupportAgent,{sx:{marginRight:"4px"}}),D.process_name]}),(0,n.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{g(D,"PROCESS")},children:(0,n.jsx)(A.Call,{})})]},ne)):(0,n.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"16px",letterSpacing:"0.02em",textTransform:"capitalize",display:"flex",alignItems:"center",justifyContent:"center",width:"100%",margin:"10px 0px",color:"gray",height:"60px"},children:"No Process Found"})}),!w&&!x&&l==="queues"&&(0,n.jsx)(s.Box,{sx:{display:"flex",gap:1,flexWrap:"wrap"},children:(H=b==null?void 0:b.data)!=null&&H.queue&&((q=(M=b==null?void 0:b.data)==null?void 0:M.queue)==null?void 0:q.length)>0?(K=(te=b==null?void 0:b.data)==null?void 0:te.queue)==null?void 0:K.map((D,ne)=>{var se,I,v,P,Y,j;return(0,n.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,n.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,n.jsx)(A.SupportAgent,{sx:{marginRight:"4px"}}),D.queue_name,(v=(I=(se=b==null?void 0:b.data)==null?void 0:se.process)==null?void 0:I.find(z=>z.process_id===D.process_id))!=null&&v.process_name?(0,n.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"12px",fontWeight:"600",letterSpacing:"0.02em",textTransform:"capitalize",color:"gray"},children:"("+((j=(Y=(P=b==null?void 0:b.data)==null?void 0:P.process)==null?void 0:Y.find(z=>z.process_id===D.process_id))==null?void 0:j.process_name)+")"}):""]}),(0,n.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{g(D,"QUEUE")},children:(0,n.jsx)(A.Call,{})})]},ne)}):(0,n.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"16px",letterSpacing:"0.02em",textTransform:"capitalize",display:"flex",alignItems:"center",justifyContent:"center",width:"100%",margin:"10px 0px",color:"gray",height:"60px"},children:"No Queues Found"})}),!w&&!x&&l==="agents"&&(0,n.jsx)(s.Box,{sx:{display:"flex",gap:1,flexWrap:"wrap"},children:c!=null&&c.data&&((O=c==null?void 0:c.data)==null?void 0:O.length)>0?(T=c==null?void 0:c.data)==null?void 0:T.map((D,ne)=>(0,n.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,n.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,n.jsx)(A.SupportAgent,{sx:{marginRight:"4px"}}),D.name]}),(0,n.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{g(D,"AGENT")},children:(0,n.jsx)(A.Call,{})})]},ne)):(0,n.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"16px",letterSpacing:"0.02em",textTransform:"capitalize",display:"flex",alignItems:"center",justifyContent:"center",width:"100%",margin:"10px 0px",color:"gray",height:"60px"},children:"No Agents Found"})})]})]})})})}function sn({open:e,setOpen:o,onSubmitDisposition:t}){var w,u,g,y;let[l,r]=(0,pe.useState)({disposition:{label:"Resolved",value:"RES"},followUp:{label:"No",value:"N"},callbackDate:"",callbackHrs:"",callbackMins:""}),a=[{label:"Not Interested",value:"NI"},{label:"Resolved",value:"RES"}],c=[{label:"Yes",value:"Y"},{label:"No",value:"N"}],x=(m,h)=>{r(N=>W(d({},N),{[m]:h}))},E=()=>{r({disposition:{label:"Resolved",value:"RES"},followUp:{label:"No",value:"N"},callbackDate:"",callbackHrs:"",callbackMins:""})},b=()=>{E(),o(!1)};return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"xs",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsx)(s.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:(0,n.jsxs)(s.Typography,{variant:"body1",m:1,children:[" ","Call Disposition"]})}),(0,n.jsxs)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"10px",margin:"10px",borderRadius:"10px"},children:[(0,n.jsxs)(s.Box,{display:"flex",gap:2,children:[(0,n.jsx)(s.Autocomplete,{value:l.disposition,options:a,getOptionLabel:m=>m.label,onChange:(m,h)=>x("disposition",h),size:"small",renderInput:m=>(0,n.jsx)(s.TextField,W(d({},m),{label:"Disposition",fullWidth:!0})),sx:{flex:1}}),(0,n.jsx)(s.Autocomplete,{options:c,getOptionLabel:m=>m.label,value:l.followUp,onChange:(m,h)=>x("followUp",h),size:"small",renderInput:m=>(0,n.jsx)(s.TextField,W(d({},m),{label:"Follow Up",fullWidth:!0})),sx:{flex:1}})]}),((u=(w=l==null?void 0:l.followUp)==null?void 0:w.label)==null?void 0:u.toLowerCase())==="yes"&&(0,n.jsxs)(s.Box,{display:"flex",gap:2,mt:2,children:[(0,n.jsx)(s.TextField,{size:"small",label:"Callback Date",type:"date",slotProps:{inputLabel:{shrink:!0}},value:l.callbackDate,onChange:m=>x("callbackDate",m.target.value),fullWidth:!0,sx:{flex:1}}),(0,n.jsx)(s.TextField,{size:"small",label:"Hours (0-23)",type:"text",value:l.callbackHrs,onChange:m=>x("callbackHrs",m.target.value),fullWidth:!0,sx:{flex:1}})]}),((y=(g=l==null?void 0:l.followUp)==null?void 0:g.label)==null?void 0:y.toLowerCase())==="yes"&&(0,n.jsxs)(s.Box,{display:"flex",gap:2,mt:2,children:[(0,n.jsx)(s.TextField,{size:"small",label:"Minutes (0-59)",type:"text",value:l.callbackMins,onChange:m=>x("callbackMins",m.target.value),fullWidth:!0,sx:{flex:1}}),(0,n.jsx)(s.Box,{sx:{flex:1}})]})]}),(0,n.jsxs)(s.Box,{textAlign:"right",m:2,children:[(0,n.jsx)(s.Button,{variant:"outlined",color:"error",size:"large",onClick:b,sx:{px:2,mx:1,borderRadius:"10px",textTransform:"capitalize"},children:"cancel"}),(0,n.jsx)(s.Button,{variant:"contained",color:"primary",size:"large",onClick:()=>t(l),sx:{px:2,borderRadius:"10px",textTransform:"capitalize"},children:"Submit"})]})]})})})}function an({open:e,setOpen:o,processList:t=null,handleSelectedProcessor:l}){return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",maxWidth:"xs",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,n.jsx)(s.Typography,{variant:"body1",children:" Process List"}),(0,n.jsx)(s.IconButton,{onClick:()=>{o(!1)},children:(0,n.jsx)(A.Close,{})})]}),(0,n.jsx)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px 10px",margin:"10px",borderRadius:"10px"},children:t.length>0?t==null?void 0:t.map((a,c)=>(0,n.jsx)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",margin:"10px 0px",borderRadius:"10px",cursor:"pointer","&:hover":{bgcolor:"action.selected"}},onClick:()=>{l(a)},children:(0,n.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,n.jsx)(A.SupportAgent,{sx:{marginRight:"4px"}}),a.process_name]})},c)):null})]})})})}function ln({open:e,setOpen:o}){return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Dialog,{open:e,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,n.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,n.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,n.jsx)(s.Typography,{variant:"body1",children:" Call History"}),(0,n.jsx)(s.IconButton,{onClick:()=>{o(!1)},children:(0,n.jsx)(A.Close,{})})]}),(0,n.jsx)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",margin:"10px",borderRadius:"10px",textAlign:"center",fontSize:"16px",fontWeight:"bold"},p:6,children:"Coming Soon..."})]})})})}var p=require("react/jsx-runtime"),wn=(e,o,t)=>e.map(r=>{var a,c,x;if((r==null?void 0:r.line)===1)return{line:1,status:(a=t==null?void 0:t.status)!=null?a:"",type:"internal",phone:(c=t==null?void 0:t.phone_number)!=null?c:"",isMute:!1,isHold:!1,isMergeCall:!1,isCallStart:!0};{let E=`line_${r.line}_status`,b=`line_${r.line}_phonenumber`;return W(d({},r),{status:(x=o[E])!=null?x:"IDLE",phone:o[b]!=="0"?o[b]:""})}}),Nn=e=>{let o=Math.floor(e/60),t=e%60;return`${o.toString().padStart(2,"0")}:${t.toString().padStart(2,"0")}`};function rn({onDataChange:e}){var at,it,lt,rt,ct,pt,dt,ut,gt,ft,mt,xt,Ct,bt,yt,Et,ht,St,Tt,vt,Dt,Lt,_t,It,Rt,At,wt,Nt,kt,Ot,Pt,Mt,Ut,Bt,Ht,zt,$t,qt,Ft,Kt,Wt,Gt,Yt,jt,Xt,Jt,Vt,Zt,Qt,eo,to,oo,no,so,ao,io,lo,ro,co,po,uo,go,fo,mo,xo,Co,bo,yo,Eo,ho,So,To,vo,Do,Lo,_o,Io,Ro,Ao,wo,No;let o=(0,f.useTheme)(),t=he(),{showToast:l}=Ee(),{disabled:r,enabled:a,outlined:c}=Xe({disabled:((at=t.sdkConfig)==null?void 0:at.disabled)||{},enabled:((it=t.sdkConfig)==null?void 0:it.enabled)||{},outlined:((lt=t.sdkConfig)==null?void 0:lt.outlined)||{}}),x=(0,ee.useRef)(null),[E,b]=(0,ee.useState)(null),[w,u]=(0,ee.useState)(!0),[g,y]=(0,ee.useState)(null),[m,h]=(0,ee.useState)(null),[N,U]=(0,ee.useState)(!1),[H,M]=(0,ee.useState)(!1),[q,te]=(0,ee.useState)(!1),[K,O]=(0,ee.useState)(null),[T,D]=(0,ee.useState)(""),[ne,se]=(0,ee.useState)(0),{position:I,isDragging:v,dragRef:P,handleMouseDown:Y,handleTouchStart:j}=tt(t.controlPanelPosition,i=>C.setControlPanelPosition(i)),{position:z,isDragging:J,dragRef:V,handleMouseDown:k,handleTouchStart:_}=tt(t.iframePosition,i=>C.setIframePosition(i)),[F,{isLoading:Z}]=ce({onSuccess:()=>{D(""),h(null)}}),[Q,{isLoading:X}]=ce({onSuccess:()=>{C.setHolding(!t.isHolding)},onError:i=>{console.log("\u274C Hold operation error:",i)}}),[de,{isLoading:Se}]=ce({onSuccess:()=>{C.setMuted(!t.isMuted)},onError:i=>{console.log("\u274C Mute operation error:",i)}}),[Ae,{isLoading:Te}]=ce(),[we,{isLoading:Ne}]=ce(),[ke,{isLoading:ve}]=ce(),Oe=()=>{b(null)},Pe=i=>{u(!0),h(i.currentTarget),C.setStatus("dial")},Me=()=>{t.status!=="on call"&&C.setStatus("idle"),h(null)},De=i=>{y(i.currentTarget)},Ue=()=>{y(null)},Be=()=>{let i={action:"READYAGENT",userId:t.agentId};Ae(R.READY_AGENT,i)},He=i=>{y(null);let S={action:"AGENTBREAK",break_type:i,userId:t.agentId};we(R.UPDATE_AGENT_BREAK,S)},ze=i=>{if(i.length!==10)l("Invalid phone number","error");else if(!/^\d+$/.test(i))l("Invalid phone number","error");else{let S={action:"CALL",phone_number:i,userId:t.agentId};F(R.CLICK_TO_CALL,S)}},$e=()=>{let i={action:t.isHolding?"UNHOLD":"HOLD",userId:t.agentId};Q(R.HOLD_CALL,i)},qe=()=>{let i={action:t.isMuted?"UNMUTE":"MUTE",userId:t.agentId};de(R.MUTE_CALL,i)},ye=i=>{var B,ae,ie,ue,ge,Le,_e,ko,Oo,Po,Mo,Uo,Bo,Ho,zo,$o;console.log("data",i);let S={action:"ENDCALL",userId:t.agentId,processid:(ie=(ae=(B=t.process)==null?void 0:B.process_id)==null?void 0:ae.toString())!=null?ie:"",process_name:(ge=(ue=t.process)==null?void 0:ue.process_name)!=null?ge:"",callreferenceid:(_e=(Le=t.callData)==null?void 0:Le.convox_id)!=null?_e:"",mobile_number:(Oo=(ko=t.callData)==null?void 0:ko.phone_number)!=null?Oo:"",disposition:(Mo=(Po=i==null?void 0:i.disposition)==null?void 0:Po.value)!=null?Mo:"",set_followUp:(Bo=(Uo=i==null?void 0:i.followUp)==null?void 0:Uo.value)!=null?Bo:"",callback_date:(Ho=i==null?void 0:i.callbackDate)!=null?Ho:"",callback_hrs:(zo=i==null?void 0:i.callbackHrs)!=null?zo:"",callback_mins:($o=i==null?void 0:i.callbackMins)!=null?$o:"",endcall_type:"CLOSE"};D(""),ke(R.END_CALL,S),C.endCall(),U(!1)};return(0,ee.useEffect)(()=>{let i=S=>{S.preventDefault()};return window.addEventListener("beforeunload",i),()=>{window.removeEventListener("beforeunload",i)}},[]),(0,ee.useEffect)(()=>{let i;return t.callData.status&&t.callData.status==="ONCALL"?i=setInterval(()=>{let S=Math.floor((Date.now()-t.callStartTime)/1e3);se(S)},1e3):se(0),()=>{i&&clearInterval(i)}},[t.callData.status]),(0,ee.useEffect)(()=>{if(e&&t.callData){let{process_id:i,process_name:S,status:B,phone_number:ae,agent_id:ie,convox_id:ue}=t.callData;e({phone_number:ae,status:B,callReferenceId:ue,agent_id:ie,process_id:i,process_name:S})}},[t.callData,e]),(0,ee.useEffect)(()=>{t.agentId?oe.post(R.PROCESS_LIST,{userId:t.agentId,action:"GETAGENTPROCESSLIST",refno:"1234221233"}).then(i=>{var S,B;console.log(i.data.data,"res4"),i&&i.data&&((S=i==null?void 0:i.data)==null?void 0:S.length)>1?(O(i.data.data),M(!0)):(C.setProcess((B=i==null?void 0:i.data)==null?void 0:B.data[0]),M(!1))}).catch(i=>{l(i.response.data.message,"error")}):console.log("No agentId available, skipping API call")},[t.agentId]),(0,ee.useEffect)(()=>(t.agentId&&(x.current=new WebSocket(`${Wo.WS}?agent_id=${t.agentId}`),x.current.onopen=()=>{console.log("\u{1F310} WebSocket connection established")},x.current.onmessage=i=>{try{let S=JSON.parse(i.data),B=wn(t==null?void 0:t.conferenceLine,S==null?void 0:S.conferencestatus,S);console.log(B,"\u{1F4CA} Parsed JSON:",S),C.updateCallData(S),C.updateConferenceData([...B]),S.status==="ONCALL"&&(C.startCall(),w||u(!0)),S.status==="WRAPUP"&&C.endCall()}catch(S){console.log("\u{1F4E8} Raw message:",i.data)}},x.current.onclose=()=>{console.log("\u{1F50C} WebSocket connection closed")},x.current.onerror=i=>{console.error("\u274C WebSocket error:",i)}),()=>{var i;(i=x.current)==null||i.close()}),[t.agentId]),!t.isInitialized||!t.process?(0,p.jsx)(f.Box,{children:!!H&&(0,p.jsx)(an,{processList:K,open:H,setOpen:M,handleSelectedProcessor:i=>{C.setProcess(i)}})}):(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(f.Box,{children:(0,p.jsx)(f.Fade,{in:!0,timeout:300,children:(0,p.jsx)(f.Paper,{ref:(rt=t.sdkConfig)!=null&&rt.isDraggable?P:null,elevation:v?4:(ct=t.sdkConfig)!=null&&ct.isDraggable?1:0,sx:{position:(pt=t.sdkConfig)!=null&&pt.isDraggable?"fixed":"relative",left:(dt=t.sdkConfig)!=null&&dt.isDraggable?I.x:"auto",top:(ut=t.sdkConfig)!=null&&ut.isDraggable?I.y:"auto",display:"inline-block",width:"auto",flexShrink:0,whiteSpace:"nowrap",p:.5,borderRadius:3,bgcolor:"background.paper",zIndex:(gt=t.sdkConfig)!=null&>.isDraggable?Number.MAX_SAFE_INTEGER:0,transition:o.transitions.create(["box-shadow","transform"],{duration:o.transitions.duration.short}),userSelect:"none"},children:(0,p.jsxs)(f.Box,{sx:{display:"flex",alignItems:"center"},children:[(0,p.jsxs)(f.Box,{sx:{display:"flex",alignItems:"center",gap:1,margin:"0px 10px"},children:[((ft=t.sdkConfig)==null?void 0:ft.isDraggable)&&(0,p.jsxs)(f.IconButton,{component:"div",size:"small",sx:{cursor:"all-scroll"},onMouseDown:Y,onTouchStart:j,children:[(0,p.jsx)(L.DragIndicator,{})," "]}),(0,p.jsx)(f.Box,{children:!((mt=t.sdkConfig)!=null&&mt.disabledDialButton)&&(0,p.jsx)(f.Tooltip,{title:"Dial",children:(0,p.jsx)(f.IconButton,{size:"small",onClick:i=>{var S,B,ae,ie,ue,ge,Le,_e;((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())!=="ONCALL"&&((ie=(ae=t.callData)==null?void 0:ae.status)==null?void 0:ie.toUpperCase())!=="BREAK"&&((ge=(ue=t.callData)==null?void 0:ue.status)==null?void 0:ge.toUpperCase())!=="RINGING"&&((_e=(Le=t.callData)==null?void 0:Le.status)==null?void 0:_e.toUpperCase())!=="WRAPUP"&&Pe(i)},sx:{bgcolor:"action.hover","&:hover":{bgcolor:"warning"}},children:(0,p.jsx)(L.WifiCalling3,{sx:{color:((Ct=(xt=t.callData)==null?void 0:xt.status)==null?void 0:Ct.toUpperCase())==="ONCALL"||((yt=(bt=t.callData)==null?void 0:bt.status)==null?void 0:yt.toUpperCase())==="BREAK"||((ht=(Et=t.callData)==null?void 0:Et.status)==null?void 0:ht.toUpperCase())==="RINGING"||((Tt=(St=t.callData)==null?void 0:St.status)==null?void 0:Tt.toUpperCase())==="WRAPUP"?"action.selected":"success.main"}})})})}),(0,p.jsx)(f.Typography,{sx:{color:"success.main",width:"40px",marginRight:"10px",fontSize:"18px",fontWeight:"600"},children:Nn(ne)}),(0,p.jsx)(f.Chip,{sx:{padding:"18px 0px"},label:Ne||Te?(0,p.jsx)(f.Box,{sx:{fontWeight:"bold",width:"60px",display:"flex",alignItems:"center",justifyContent:"center"},children:(0,p.jsx)(f.CircularProgress,{size:"20px"})}):(0,p.jsx)(f.Typography,{variant:"body2",sx:{fontWeight:"bold",width:"60px",textAlign:"center"},children:(Lt=(Dt=(vt=t.callData)==null?void 0:vt.status)==null?void 0:Dt.toUpperCase())!=null?Lt:"N/A"}),onClick:De,deleteIcon:(0,p.jsx)(L.KeyboardArrowDown,{color:"primary"}),onDelete:De})]}),(0,p.jsxs)(f.Box,{sx:{display:"flex",gap:1,justifyContent:"center",alignItems:"center"},children:[(0,p.jsx)(f.Tooltip,{title:"Agent Ready",children:(0,p.jsx)(f.Button,{variant:((It=(_t=t.callData)==null?void 0:_t.status)==null?void 0:It.toUpperCase())==="BREAK"||((At=(Rt=t.callData)==null?void 0:Rt.status)==null?void 0:At.toUpperCase())==="MISSED"?"outlined":"contained",onClick:i=>{var S,B,ae,ie;(((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())==="BREAK"||((ie=(ae=t.callData)==null?void 0:ae.status)==null?void 0:ie.toUpperCase())==="MISSED")&&(i.stopPropagation(),Be())},classes:{root:((Nt=(wt=t.callData)==null?void 0:wt.status)==null?void 0:Nt.toUpperCase())==="BREAK"||((Ot=(kt=t.callData)==null?void 0:kt.status)==null?void 0:Ot.toUpperCase())==="MISSED"?"outlined":"enabled"},sx:d({},((Mt=(Pt=t.callData)==null?void 0:Pt.status)==null?void 0:Mt.toUpperCase())==="BREAK"||((Bt=(Ut=t.callData)==null?void 0:Ut.status)==null?void 0:Bt.toUpperCase())==="MISSED"?c:a),disabled:Te,children:(0,p.jsx)(L.SupportAgent,{})})}),(0,p.jsx)(f.Tooltip,{title:t.isHolding?"Resume":"Hold",children:(0,p.jsx)(f.Button,{variant:t.isHolding&&((zt=(Ht=t.callData)==null?void 0:Ht.status)==null?void 0:zt.toUpperCase())==="ONCALL"?"contained":"outlined",onClick:i=>{i.stopPropagation(),$e()},sx:t.isHolding&&((qt=($t=t.callData)==null?void 0:$t.status)==null?void 0:qt.toUpperCase())==="ONCALL"?d({},a):((Kt=(Ft=t.callData)==null?void 0:Ft.status)==null?void 0:Kt.toUpperCase())==="ONCALL"?d({},c):d({},r),disabled:((Gt=(Wt=t.callData)==null?void 0:Wt.status)==null?void 0:Gt.toUpperCase())!=="ONCALL"&&!t.isHolding||X,children:X?(0,p.jsx)(f.CircularProgress,{size:"20px",sx:{color:o.palette.primary.main}}):t.isHolding?(0,p.jsx)(L.PlayArrow,{}):(0,p.jsx)(L.Pause,{})})}),(0,p.jsx)(f.Tooltip,{title:t.isMuted?"Unmute":"Mute",children:(0,p.jsx)(f.Button,{variant:t.isMuted&&((jt=(Yt=t.callData)==null?void 0:Yt.status)==null?void 0:jt.toUpperCase())==="ONCALL"?"contained":"outlined",onClick:i=>{i.stopPropagation(),qe()},sx:t.isMuted&&((Jt=(Xt=t.callData)==null?void 0:Xt.status)==null?void 0:Jt.toUpperCase())==="ONCALL"?d({},a):((Zt=(Vt=t.callData)==null?void 0:Vt.status)==null?void 0:Zt.toUpperCase())==="ONCALL"?d({},c):d({},r),disabled:((eo=(Qt=t.callData)==null?void 0:Qt.status)==null?void 0:eo.toUpperCase())!=="ONCALL"&&!t.isMuted||Se,children:Se?(0,p.jsx)(f.CircularProgress,{size:"20px",sx:{color:o.palette.primary.main}}):t.isMuted?(0,p.jsx)(L.MicOff,{}):(0,p.jsx)(L.Mic,{})})}),!((to=t.sdkConfig)!=null&&to.disableCallTransferButton)&&(0,p.jsx)(f.Tooltip,{title:"Transfer Call",children:(0,p.jsx)(f.Button,{variant:t.openCallTransferDialog?"contained":"outlined",onClick:i=>{var S,B;((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())==="ONCALL"&&(i.stopPropagation(),C.setOpenCallTransferDialog(!0))},sx:t.openCallTransferDialog?d({},a):((no=(oo=t.callData)==null?void 0:oo.status)==null?void 0:no.toUpperCase())==="ONCALL"?d({},c):d({},r),disabled:((ao=(so=t.callData)==null?void 0:so.status)==null?void 0:ao.toUpperCase())!=="ONCALL",children:(0,p.jsx)(L.TransferWithinAStation,{})})}),!((io=t.sdkConfig)!=null&&io.disableConferenceButton)&&(0,p.jsx)(f.Tooltip,{title:"Conference Call",children:(0,p.jsx)(f.Button,{variant:t.openConferenceDialog?"contained":"outlined",onClick:i=>{var S,B;((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())==="ONCALL"&&(i.stopPropagation(),C.setOpenConferenceDialog(!0))},sx:t.openConferenceDialog?d({},a):((ro=(lo=t.callData)==null?void 0:lo.status)==null?void 0:ro.toUpperCase())==="ONCALL"?d({},c):d({},r),disabled:((po=(co=t.callData)==null?void 0:co.status)==null?void 0:po.toUpperCase())!=="ONCALL",children:(0,p.jsx)(L.Group,{})})}),!((uo=t.sdkConfig)!=null&&uo.disableEndCallButton)&&(0,p.jsx)(f.Tooltip,{title:"End Call",children:(0,p.jsx)(f.Button,{variant:((fo=(go=t.callData)==null?void 0:go.status)==null?void 0:fo.toUpperCase())==="ONCALL"||((xo=(mo=t.callData)==null?void 0:mo.status)==null?void 0:xo.toUpperCase())==="RINGING"||((bo=(Co=t.callData)==null?void 0:Co.status)==null?void 0:bo.toUpperCase())==="WRAPUP"?"contained":"outlined",onClick:i=>{var S,B,ae,ie,ue,ge;(((B=(S=t.callData)==null?void 0:S.status)==null?void 0:B.toUpperCase())==="ONCALL"||((ie=(ae=t.callData)==null?void 0:ae.status)==null?void 0:ie.toUpperCase())==="RINGING"||((ge=(ue=t.callData)==null?void 0:ue.status)==null?void 0:ge.toUpperCase())==="WRAPUP")&&(i.stopPropagation(),U(!0))},sx:((Eo=(yo=t.callData)==null?void 0:yo.status)==null?void 0:Eo.toUpperCase())==="ONCALL"||((So=(ho=t.callData)==null?void 0:ho.status)==null?void 0:So.toUpperCase())==="RINGING"||((vo=(To=t.callData)==null?void 0:To.status)==null?void 0:vo.toUpperCase())==="WRAPUP"?W(d({},a),{borderRight:"1px",backgroundColor:"error.main",minWidth:"60px !important",boxShadow:" 0px 2px 1px #5f3f3f",border:`1px solid ${o.palette.error.light}`,height:"40px","&:hover":{bgcolor:"error.light",boxShadow:" 0px 2px 1px #5f3f3f",border:`0px solid ${o.palette.error.light}`},"&:active":{bgcolor:"error.light",boxShadow:`inset 1px -2px 4px ${o.palette.primary.light}`}}):W(d({},r),{minWidth:"60px !important"}),disabled:((Lo=(Do=t.callData)==null?void 0:Do.status)==null?void 0:Lo.toUpperCase())!=="ONCALL"&&((Io=(_o=t.callData)==null?void 0:_o.status)==null?void 0:Io.toUpperCase())!=="RINGING"&&((Ao=(Ro=t.callData)==null?void 0:Ro.status)==null?void 0:Ao.toUpperCase())!=="WRAPUP"||ve,children:ve?(0,p.jsx)(f.CircularProgress,{size:"20px",color:"error"}):(0,p.jsx)(L.CallEnd,{})})})]})]})})})}),(0,p.jsx)(f.Fade,{in:!0,timeout:300,children:(0,p.jsxs)(f.Paper,{ref:V,elevation:J?4:1,sx:{position:"absolute",left:z.x,top:z.y,borderRadius:2,bgcolor:"background.paper",zIndex:Number.MAX_SAFE_INTEGER,transition:o.transitions.create(["box-shadow","transform"],{duration:o.transitions.duration.short}),visibility:w&&!((wo=t.sdkConfig)!=null&&wo.disableSoftPhone)?"visible":"hidden",userSelect:"none"},children:[(0,p.jsxs)(f.Box,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",cursor:"all-scroll",padding:"0px 10px"},onMouseDown:k,onTouchStart:_,children:[(0,p.jsx)(L.DragIndicator,{sx:{transform:"rotate(90deg)",color:"#7b7b7b"}})," ",(0,p.jsx)(f.IconButton,{onClick:()=>u(!1),children:(0,p.jsx)(L.Close,{})})]}),(0,p.jsx)(f.Box,{children:(0,p.jsx)("iframe",{src:`https://${Fe}/ConVoxCCS/iframe?agent_id=${t.agentId}&process_id=${(No=t.process)==null?void 0:No.process_id}`,height:380,width:420,allow:"camera; microphone; autoplay",style:{border:"none"}})})]})}),(0,p.jsx)(f.Menu,{anchorEl:m,open:!!m,onClose:Me,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:(0,p.jsxs)(f.Box,{sx:{all:"unset",padding:"10px","&hover":{backgroundColor:"white"}},children:[(0,p.jsx)(f.TextField,{size:"small",value:T,placeholder:"Enter Mobile No.",onChange:i=>{D(i.target.value)}}),(0,p.jsx)(f.IconButton,{color:"info",onClick:()=>{ze(T)},children:Z?(0,p.jsx)(f.CircularProgress,{size:"20px",sx:{color:o.palette.success.main}}):(0,p.jsx)(L.Phone,{color:"success"})})]})}),(0,p.jsx)(f.Menu,{anchorEl:g,open:!!g,onClose:Ue,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:(0,p.jsx)(f.MenuItem,{onClick:()=>He("Lunch"),children:"- Break"})}),(0,p.jsx)(f.Menu,{anchorEl:E,open:!!E,onClose:Oe,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:(0,p.jsxs)(f.Box,{sx:{display:"flex",justifyContent:"flex-start",flexDirection:"column",padding:"0px 10px","&hover":{backgroundColor:"white"}},children:[(0,p.jsx)(f.Chip,{icon:(0,p.jsx)(L.Layers,{color:"secondary"}),variant:"outlined",label:"Waiting - 25",sx:{margin:"4px 2px"}}),(0,p.jsx)(f.Chip,{icon:(0,p.jsx)(L.Pending,{color:"info"}),label:"Pending - 99+",variant:"outlined",sx:{margin:"4px 2px"}}),(0,p.jsx)(f.Chip,{icon:(0,p.jsx)(L.Upcoming,{color:"success"}),variant:"outlined",label:"Upcoming - 66",sx:{margin:"4px 2px"}})]})}),!!t.openConferenceDialog&&(0,p.jsx)(on,{}),!!t.openCallTransferDialog&&(0,p.jsx)(nn,{open:t.openCallTransferDialog}),!!N&&(0,p.jsx)(sn,{open:N,setOpen:U,onSubmitDisposition:ye}),!!q&&(0,p.jsx)(ln,{open:q,setOpen:te})]})}var cn=require("react");var pn=require("react/jsx-runtime"),ot=(0,cn.memo)(({children:e})=>(0,pn.jsx)(en,{children:e}));ot.displayName="SDKProvider";var nt=require("react/jsx-runtime"),st=(0,Je.memo)(({onDataChange:e})=>{let o=(0,Je.useCallback)(t=>{try{e&&typeof e=="function"&&e(t)}catch(l){console.error("Error in CallControlPanel data change handler:",l)}},[e]);return(0,nt.jsx)(ot,{children:(0,nt.jsx)(rn,{onDataChange:o})})});st.displayName="CallControlPanel";async function kn({apiKey:e,tenantId:o,agentId:t,sdkConfig:l}){if(!e||typeof e!="string"||e.trim().length===0)throw new Error("SDK initialization failed: API key is required and must be a non-empty string");if(!o||typeof o!="string"||o.trim().length===0)throw new Error("SDK initialization failed: Tenant ID is required and must be a non-empty string");if(!t||typeof t!="string"||t.trim().length===0)throw new Error("SDK initialization failed: Agent ID is required and must be a non-empty string");try{let r=await et.init({apiKey:e.trim(),tenantId:o.trim(),agentId:t.trim(),baseUrl:$});if(r)console.log("SDK initialized successfully"),C.initialize(e.trim(),o.trim(),t.trim(),l,r);else throw console.error("SDK initialization failed: Event tracker initialization returned false"),C.setInitCheck(),new Error("SDK initialization failed: Unable to establish connection with the CTI system")}catch(r){throw console.error("SDK initialization error:",r),C.setInitCheck(),r instanceof Error?r:new Error(`SDK initialization failed: ${String(r)}`)}}function On(){return"6.x.x"}function Pn(){return C.getState().isInitialized}0&&(module.exports={CallControlPanel,getSDKVersion,initSDK,isSDKInitialized,useClickToCall,useEndCall,useGetAuthorizationToken,useGetCallerData,useLogout});
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __defProps = Object.defineProperties;
|
|
5
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
10
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
+
var __spreadValues = (a, b) => {
|
|
14
|
+
for (var prop in b || (b = {}))
|
|
15
|
+
if (__hasOwnProp.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
if (__getOwnPropSymbols)
|
|
18
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
+
if (__propIsEnum.call(b, prop))
|
|
20
|
+
__defNormalProp(a, prop, b[prop]);
|
|
21
|
+
}
|
|
22
|
+
return a;
|
|
23
|
+
};
|
|
24
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
+
var __export = (target, all) => {
|
|
26
|
+
for (var name in all)
|
|
27
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
28
|
+
};
|
|
29
|
+
var __copyProps = (to, from, except, desc) => {
|
|
30
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
31
|
+
for (let key of __getOwnPropNames(from))
|
|
32
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
33
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
34
|
+
}
|
|
35
|
+
return to;
|
|
36
|
+
};
|
|
37
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
38
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
39
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
40
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
41
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
42
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
43
|
+
mod
|
|
44
|
+
));
|
|
45
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
46
|
+
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
47
|
+
|
|
48
|
+
// call-control-sdk/index.ts
|
|
49
|
+
var index_exports = {};
|
|
50
|
+
__export(index_exports, {
|
|
51
|
+
CallControlPanel: () => CallControlPanel,
|
|
52
|
+
getSDKVersion: () => getSDKVersion,
|
|
53
|
+
initSDK: () => initSDK,
|
|
54
|
+
isSDKInitialized: () => isSDKInitialized,
|
|
55
|
+
useClickToCall: () => useClickToCall,
|
|
56
|
+
useEndCall: () => useEndCall,
|
|
57
|
+
useGetAuthorizationToken: () => useGetAuthorizationToken,
|
|
58
|
+
useGetCallerData: () => useGetCallerData,
|
|
59
|
+
useLogout: () => useLogout
|
|
60
|
+
});
|
|
61
|
+
module.exports = __toCommonJS(index_exports);
|
|
62
|
+
|
|
63
|
+
// call-control-sdk/lib/services/endPoint.ts
|
|
64
|
+
var IP = "uat-cti.aighospitals.com";
|
|
65
|
+
var BASE_URL = `https://${IP}:8095`;
|
|
66
|
+
var WS_BASE_URL = `wss://${IP}:8095`;
|
|
67
|
+
var VERSION = {
|
|
68
|
+
v1: "/api/v1"
|
|
69
|
+
};
|
|
70
|
+
var END_POINT = {
|
|
71
|
+
LOGIN: `${BASE_URL}${VERSION.v1}/cti/login?provider=convox`,
|
|
72
|
+
READY_AGENT: `${BASE_URL}${VERSION.v1}/cti/ready-agent?provider=convox`,
|
|
73
|
+
UPDATE_AGENT_BREAK: `${BASE_URL}${VERSION.v1}/cti/update-agent-status?provider=convox`,
|
|
74
|
+
CLICK_TO_CALL: `${BASE_URL}${VERSION.v1}/cti/calls?provider=convox`,
|
|
75
|
+
HOLD_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/hold?provider=convox`,
|
|
76
|
+
MUTE_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/mute?provider=convox`,
|
|
77
|
+
UNMUTE_CALL: `${BASE_URL}${VERSION.v1}/cti/unmute-call?provider=convox`,
|
|
78
|
+
END_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/end?provider=convox`,
|
|
79
|
+
LOGOUT: `${BASE_URL}${VERSION.v1}/cti/logout?provider=convox`,
|
|
80
|
+
CONFERENCE_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/conference?provider=convox`,
|
|
81
|
+
CONFERENCE_CALL_HOLD_OR_UN_HOLD: `${BASE_URL}${VERSION.v1}/cti/calls/conference/hold?provider=convox`,
|
|
82
|
+
CONFERENCE_CALL_MUTE_OT_UN_MUTE: `${BASE_URL}${VERSION.v1}/cti/calls/conference/mute?provider=convox`,
|
|
83
|
+
CONFERENCE_CALL_END: `${BASE_URL}${VERSION.v1}/cti/calls/conference/hangup?provider=convox`,
|
|
84
|
+
CONFERENCE_CALL_END_ALL: `${BASE_URL}${VERSION.v1}/cti/calls/conference/hangup/all?provider=convox`,
|
|
85
|
+
TRANSFER_CALL: `${BASE_URL}${VERSION.v1}/cti/calls/transfer?provider=convox`,
|
|
86
|
+
AGENTS_LIST: `${BASE_URL}${VERSION.v1}/cti/users`,
|
|
87
|
+
PROCESS_LIST: `${BASE_URL}${VERSION.v1}/cti/processes-list`,
|
|
88
|
+
TRANSFER_TO_DETAILS: `${BASE_URL}${VERSION.v1}/cti/transfer-to-details?provider=convox`,
|
|
89
|
+
CALL_HISTORY: `${BASE_URL}${VERSION.v1}/dashboard/call-history`,
|
|
90
|
+
SENTIMENTAL_ANALYSIS: `${BASE_URL}${VERSION.v1}/users/get_sentiment_analysis`
|
|
91
|
+
};
|
|
92
|
+
var WS_END_POINT = {
|
|
93
|
+
WS: `${WS_BASE_URL}${VERSION.v1}/cti/ws`
|
|
94
|
+
};
|
|
95
|
+
var STORAGE_KEY = "call-control-sdk-state";
|
|
96
|
+
|
|
97
|
+
// call-control-sdk/lib/hooks/sdk-state.ts
|
|
98
|
+
var SDKStateManager = class {
|
|
99
|
+
constructor() {
|
|
100
|
+
__publicField(this, "state");
|
|
101
|
+
__publicField(this, "listeners", []);
|
|
102
|
+
__publicField(this, "STORAGE_KEY", STORAGE_KEY);
|
|
103
|
+
__publicField(this, "apiKey");
|
|
104
|
+
__publicField(this, "tenantId");
|
|
105
|
+
this.state = this.getInitialState();
|
|
106
|
+
this.loadFromStorage();
|
|
107
|
+
}
|
|
108
|
+
getInitialState() {
|
|
109
|
+
return {
|
|
110
|
+
authorization: void 0,
|
|
111
|
+
process: null,
|
|
112
|
+
agentId: "",
|
|
113
|
+
openConferenceDialog: false,
|
|
114
|
+
openCallTransferDialog: false,
|
|
115
|
+
isInitialized: false,
|
|
116
|
+
sdkConfig: {
|
|
117
|
+
disableEndCallButton: false,
|
|
118
|
+
disabledDialButton: false,
|
|
119
|
+
disableCallTransferButton: false,
|
|
120
|
+
isDraggable: true,
|
|
121
|
+
disableSoftPhone: false,
|
|
122
|
+
disableConferenceButton: false,
|
|
123
|
+
disabled: {},
|
|
124
|
+
enabled: {},
|
|
125
|
+
outlined: {}
|
|
126
|
+
},
|
|
127
|
+
isHolding: false,
|
|
128
|
+
isMuted: false,
|
|
129
|
+
status: "idle",
|
|
130
|
+
callStartTime: null,
|
|
131
|
+
controlPanelPosition: { x: 10, y: 10 },
|
|
132
|
+
iframePosition: { x: 10, y: 80 },
|
|
133
|
+
callData: {
|
|
134
|
+
agent_id: "",
|
|
135
|
+
hold: 0,
|
|
136
|
+
mute: 0,
|
|
137
|
+
status: "",
|
|
138
|
+
type: "",
|
|
139
|
+
event_time: "",
|
|
140
|
+
phone_number: ""
|
|
141
|
+
},
|
|
142
|
+
conferenceLine: [
|
|
143
|
+
{
|
|
144
|
+
line: 1,
|
|
145
|
+
status: "IDLE",
|
|
146
|
+
type: "",
|
|
147
|
+
phone: "",
|
|
148
|
+
isMute: false,
|
|
149
|
+
isHold: false,
|
|
150
|
+
isCallStart: false,
|
|
151
|
+
isMergeCall: false
|
|
152
|
+
},
|
|
153
|
+
{
|
|
154
|
+
line: 2,
|
|
155
|
+
status: "IDLE",
|
|
156
|
+
type: "",
|
|
157
|
+
phone: "",
|
|
158
|
+
isMute: false,
|
|
159
|
+
isHold: false,
|
|
160
|
+
isCallStart: false,
|
|
161
|
+
isMergeCall: false
|
|
162
|
+
},
|
|
163
|
+
{
|
|
164
|
+
line: 3,
|
|
165
|
+
status: "IDLE",
|
|
166
|
+
type: "",
|
|
167
|
+
phone: "",
|
|
168
|
+
isMute: false,
|
|
169
|
+
isHold: false,
|
|
170
|
+
isCallStart: false,
|
|
171
|
+
isMergeCall: false
|
|
172
|
+
},
|
|
173
|
+
{
|
|
174
|
+
line: 4,
|
|
175
|
+
status: "IDLE",
|
|
176
|
+
type: "",
|
|
177
|
+
phone: "",
|
|
178
|
+
isMute: false,
|
|
179
|
+
isHold: false,
|
|
180
|
+
isCallStart: false,
|
|
181
|
+
isMergeCall: false
|
|
182
|
+
},
|
|
183
|
+
{
|
|
184
|
+
line: 5,
|
|
185
|
+
status: "IDLE",
|
|
186
|
+
type: "",
|
|
187
|
+
phone: "",
|
|
188
|
+
isMute: false,
|
|
189
|
+
isHold: false,
|
|
190
|
+
isCallStart: false,
|
|
191
|
+
isMergeCall: false
|
|
192
|
+
}
|
|
193
|
+
],
|
|
194
|
+
hold: 0,
|
|
195
|
+
mute: 0
|
|
196
|
+
};
|
|
197
|
+
}
|
|
198
|
+
loadFromStorage() {
|
|
199
|
+
try {
|
|
200
|
+
const stored = localStorage.getItem(this.STORAGE_KEY);
|
|
201
|
+
if (stored) {
|
|
202
|
+
const parsedState = JSON.parse(stored);
|
|
203
|
+
this.state = __spreadProps(__spreadValues({}, this.state), {
|
|
204
|
+
agentId: parsedState.agentId || "",
|
|
205
|
+
authorization: parsedState.authorization || void 0,
|
|
206
|
+
process: parsedState.process || null,
|
|
207
|
+
openConferenceDialog: (parsedState == null ? void 0 : parsedState.openConferenceDialog) || false,
|
|
208
|
+
openCallTransferDialog: (parsedState == null ? void 0 : parsedState.openCallTransferDialog) || false,
|
|
209
|
+
isInitialized: parsedState.isInitialized || false,
|
|
210
|
+
sdkConfig: parsedState.sdkConfig || {
|
|
211
|
+
disableEndCallButton: false,
|
|
212
|
+
disabledDialButton: false,
|
|
213
|
+
disableCallTransferButton: false,
|
|
214
|
+
isDraggable: true,
|
|
215
|
+
disableSoftPhone: false,
|
|
216
|
+
disableConferenceButton: false,
|
|
217
|
+
disabled: {},
|
|
218
|
+
enabled: {},
|
|
219
|
+
outlined: {}
|
|
220
|
+
},
|
|
221
|
+
isHolding: parsedState.isHolding || false,
|
|
222
|
+
isMuted: parsedState.isMuted || false,
|
|
223
|
+
status: parsedState.status || "idle",
|
|
224
|
+
callStartTime: parsedState.callStartTime || null,
|
|
225
|
+
controlPanelPosition: parsedState.controlPanelPosition || {
|
|
226
|
+
x: 10,
|
|
227
|
+
y: 10
|
|
228
|
+
},
|
|
229
|
+
iframePosition: parsedState.iframePosition || { x: 10, y: 80 },
|
|
230
|
+
callData: parsedState.callData || {
|
|
231
|
+
mobileNumber: "",
|
|
232
|
+
callReferenceId: "",
|
|
233
|
+
agent_id: "",
|
|
234
|
+
status: "",
|
|
235
|
+
type: "",
|
|
236
|
+
event_time: "",
|
|
237
|
+
phone_number: ""
|
|
238
|
+
},
|
|
239
|
+
// Fix: Properly handle conferenceLine with fallback to initial state
|
|
240
|
+
conferenceLine: parsedState.conferenceLine && Array.isArray(parsedState.conferenceLine) && parsedState.conferenceLine.length > 0 ? parsedState.conferenceLine : this.state.conferenceLine
|
|
241
|
+
});
|
|
242
|
+
}
|
|
243
|
+
} catch (error) {
|
|
244
|
+
console.warn("Failed to load SDK state from localStorage:", error);
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
saveToStorage() {
|
|
248
|
+
try {
|
|
249
|
+
const persistentState = {
|
|
250
|
+
agentId: this.state.agentId,
|
|
251
|
+
authorization: this.state.authorization,
|
|
252
|
+
process: this.state.process,
|
|
253
|
+
isInitialized: this.state.isInitialized,
|
|
254
|
+
openConferenceDialog: this.state.openConferenceDialog,
|
|
255
|
+
openCallTransferDialog: this.state.openCallTransferDialog,
|
|
256
|
+
sdkConfig: this.state.sdkConfig,
|
|
257
|
+
isHolding: this.state.isHolding,
|
|
258
|
+
isMuted: this.state.isMuted,
|
|
259
|
+
status: this.state.status,
|
|
260
|
+
callStartTime: this.state.callStartTime,
|
|
261
|
+
controlPanelPosition: this.state.controlPanelPosition,
|
|
262
|
+
iframePosition: this.state.iframePosition,
|
|
263
|
+
callData: this.state.callData,
|
|
264
|
+
conferenceLine: this.state.conferenceLine
|
|
265
|
+
};
|
|
266
|
+
localStorage.setItem(this.STORAGE_KEY, JSON.stringify(persistentState));
|
|
267
|
+
} catch (error) {
|
|
268
|
+
console.warn("Failed to save SDK state to localStorage:", error);
|
|
269
|
+
}
|
|
270
|
+
}
|
|
271
|
+
notifyListeners() {
|
|
272
|
+
this.listeners.forEach((listener) => listener());
|
|
273
|
+
}
|
|
274
|
+
validateCredentials(apiKey, tenantId) {
|
|
275
|
+
if (!apiKey || typeof apiKey !== "string" || apiKey.trim().length === 0) {
|
|
276
|
+
throw new Error("API key not available");
|
|
277
|
+
}
|
|
278
|
+
if (!tenantId || typeof tenantId !== "string" || tenantId.trim().length === 0) {
|
|
279
|
+
throw new Error("Tenant ID not available");
|
|
280
|
+
}
|
|
281
|
+
this.apiKey = apiKey.trim();
|
|
282
|
+
this.tenantId = tenantId.trim();
|
|
283
|
+
}
|
|
284
|
+
initialize(apiKey, tenantId, agentId, sdkConfig, initResult) {
|
|
285
|
+
this.validateCredentials(apiKey, tenantId);
|
|
286
|
+
if (!agentId || typeof agentId !== "string" || agentId.trim().length === 0) {
|
|
287
|
+
throw new Error("Agent ID not available");
|
|
288
|
+
} else {
|
|
289
|
+
this.state.agentId = agentId;
|
|
290
|
+
this.state.openConferenceDialog = false;
|
|
291
|
+
this.state.openCallTransferDialog = false;
|
|
292
|
+
this.state.authorization = initResult;
|
|
293
|
+
this.state.sdkConfig = __spreadValues({
|
|
294
|
+
disableEndCallButton: false,
|
|
295
|
+
disabledDialButton: false,
|
|
296
|
+
disableCallTransferButton: false,
|
|
297
|
+
isDraggable: true,
|
|
298
|
+
disableSoftPhone: false,
|
|
299
|
+
disableConferenceButton: false,
|
|
300
|
+
disabled: {},
|
|
301
|
+
enabled: {},
|
|
302
|
+
outlined: {}
|
|
303
|
+
}, sdkConfig);
|
|
304
|
+
this.state.isInitialized = true;
|
|
305
|
+
this.saveToStorage();
|
|
306
|
+
this.notifyListeners();
|
|
307
|
+
}
|
|
308
|
+
}
|
|
309
|
+
getState() {
|
|
310
|
+
return __spreadValues({}, this.state);
|
|
311
|
+
}
|
|
312
|
+
getCredentials() {
|
|
313
|
+
return { apiKey: this.apiKey, tenantId: this.tenantId };
|
|
314
|
+
}
|
|
315
|
+
getSdkAuthToken() {
|
|
316
|
+
var _a2;
|
|
317
|
+
return (_a2 = this.state.authorization) == null ? void 0 : _a2.accessToken;
|
|
318
|
+
}
|
|
319
|
+
subscribe(listener) {
|
|
320
|
+
this.listeners.push(listener);
|
|
321
|
+
return () => {
|
|
322
|
+
const index = this.listeners.indexOf(listener);
|
|
323
|
+
if (index > -1) {
|
|
324
|
+
this.listeners.splice(index, 1);
|
|
325
|
+
}
|
|
326
|
+
};
|
|
327
|
+
}
|
|
328
|
+
setHolding(isHolding) {
|
|
329
|
+
this.state.isHolding = isHolding;
|
|
330
|
+
this.saveToStorage();
|
|
331
|
+
this.notifyListeners();
|
|
332
|
+
}
|
|
333
|
+
setMuted(isMuted) {
|
|
334
|
+
this.state.isMuted = isMuted;
|
|
335
|
+
this.saveToStorage();
|
|
336
|
+
this.notifyListeners();
|
|
337
|
+
}
|
|
338
|
+
setStatus(status) {
|
|
339
|
+
this.state.status = status;
|
|
340
|
+
this.saveToStorage();
|
|
341
|
+
this.notifyListeners();
|
|
342
|
+
}
|
|
343
|
+
setProcess(process) {
|
|
344
|
+
this.state.process = process;
|
|
345
|
+
this.saveToStorage();
|
|
346
|
+
this.notifyListeners();
|
|
347
|
+
}
|
|
348
|
+
setControlPanelPosition(position) {
|
|
349
|
+
this.state.controlPanelPosition = position;
|
|
350
|
+
this.saveToStorage();
|
|
351
|
+
this.notifyListeners();
|
|
352
|
+
}
|
|
353
|
+
setIframePosition(position) {
|
|
354
|
+
this.state.iframePosition = position;
|
|
355
|
+
this.saveToStorage();
|
|
356
|
+
this.notifyListeners();
|
|
357
|
+
}
|
|
358
|
+
startCall() {
|
|
359
|
+
this.state.callStartTime = Date.now();
|
|
360
|
+
this.state.status = "on call";
|
|
361
|
+
this.saveToStorage();
|
|
362
|
+
this.notifyListeners();
|
|
363
|
+
}
|
|
364
|
+
endCall() {
|
|
365
|
+
this.state.callStartTime = null;
|
|
366
|
+
this.state.status = "idle";
|
|
367
|
+
this.state.isHolding = false;
|
|
368
|
+
this.state.isMuted = false;
|
|
369
|
+
this.saveToStorage();
|
|
370
|
+
this.notifyListeners();
|
|
371
|
+
}
|
|
372
|
+
setInitCheck() {
|
|
373
|
+
this.state.isInitialized = false;
|
|
374
|
+
this.saveToStorage();
|
|
375
|
+
this.notifyListeners();
|
|
376
|
+
}
|
|
377
|
+
setOpenConferenceDialog(open) {
|
|
378
|
+
this.state.openConferenceDialog = open;
|
|
379
|
+
this.saveToStorage();
|
|
380
|
+
this.notifyListeners();
|
|
381
|
+
}
|
|
382
|
+
setOpenCallTransferDialog(open) {
|
|
383
|
+
this.state.openCallTransferDialog = open;
|
|
384
|
+
this.saveToStorage();
|
|
385
|
+
this.notifyListeners();
|
|
386
|
+
}
|
|
387
|
+
updateCallData(data) {
|
|
388
|
+
this.state.callData = __spreadValues(__spreadValues({}, this.state.callData), data);
|
|
389
|
+
this.saveToStorage();
|
|
390
|
+
this.notifyListeners();
|
|
391
|
+
}
|
|
392
|
+
updateConferenceData(data) {
|
|
393
|
+
this.state.conferenceLine = [...data];
|
|
394
|
+
this.saveToStorage();
|
|
395
|
+
this.notifyListeners();
|
|
396
|
+
}
|
|
397
|
+
setConferenceLine(line) {
|
|
398
|
+
var _a2;
|
|
399
|
+
if (!this.state.conferenceLine || !Array.isArray(this.state.conferenceLine)) {
|
|
400
|
+
console.warn("Conference line data corrupted, resetting to initial state");
|
|
401
|
+
this.state.conferenceLine = this.getInitialState().conferenceLine;
|
|
402
|
+
}
|
|
403
|
+
const conferenceLineData = (_a2 = this.state.conferenceLine) == null ? void 0 : _a2.map((each) => {
|
|
404
|
+
if (each.line === line.line) {
|
|
405
|
+
return line;
|
|
406
|
+
}
|
|
407
|
+
return each;
|
|
408
|
+
});
|
|
409
|
+
this.state.conferenceLine = conferenceLineData;
|
|
410
|
+
this.saveToStorage();
|
|
411
|
+
this.notifyListeners();
|
|
412
|
+
}
|
|
413
|
+
resetConferenceLines() {
|
|
414
|
+
this.state.conferenceLine = [
|
|
415
|
+
{
|
|
416
|
+
line: 1,
|
|
417
|
+
status: "IDLE",
|
|
418
|
+
type: "",
|
|
419
|
+
phone: "",
|
|
420
|
+
isMute: false,
|
|
421
|
+
isHold: false,
|
|
422
|
+
isCallStart: false,
|
|
423
|
+
isMergeCall: false
|
|
424
|
+
},
|
|
425
|
+
{
|
|
426
|
+
line: 2,
|
|
427
|
+
status: "IDLE",
|
|
428
|
+
type: "",
|
|
429
|
+
phone: "",
|
|
430
|
+
isMute: false,
|
|
431
|
+
isHold: false,
|
|
432
|
+
isCallStart: false,
|
|
433
|
+
isMergeCall: false
|
|
434
|
+
},
|
|
435
|
+
{
|
|
436
|
+
line: 3,
|
|
437
|
+
status: "IDLE",
|
|
438
|
+
type: "",
|
|
439
|
+
phone: "",
|
|
440
|
+
isMute: false,
|
|
441
|
+
isHold: false,
|
|
442
|
+
isCallStart: false,
|
|
443
|
+
isMergeCall: false
|
|
444
|
+
},
|
|
445
|
+
{
|
|
446
|
+
line: 4,
|
|
447
|
+
status: "IDLE",
|
|
448
|
+
type: "",
|
|
449
|
+
phone: "",
|
|
450
|
+
isMute: false,
|
|
451
|
+
isHold: false,
|
|
452
|
+
isCallStart: false,
|
|
453
|
+
isMergeCall: false
|
|
454
|
+
},
|
|
455
|
+
{
|
|
456
|
+
line: 5,
|
|
457
|
+
status: "IDLE",
|
|
458
|
+
type: "",
|
|
459
|
+
phone: "",
|
|
460
|
+
isMute: false,
|
|
461
|
+
isHold: false,
|
|
462
|
+
isCallStart: false,
|
|
463
|
+
isMergeCall: false
|
|
464
|
+
}
|
|
465
|
+
];
|
|
466
|
+
this.saveToStorage();
|
|
467
|
+
this.notifyListeners();
|
|
468
|
+
}
|
|
469
|
+
clearStorageAndReset() {
|
|
470
|
+
try {
|
|
471
|
+
localStorage.removeItem(this.STORAGE_KEY);
|
|
472
|
+
this.state = this.getInitialState();
|
|
473
|
+
this.notifyListeners();
|
|
474
|
+
} catch (error) {
|
|
475
|
+
console.warn("Failed to clear localStorage:", error);
|
|
476
|
+
}
|
|
477
|
+
}
|
|
478
|
+
debugStorage() {
|
|
479
|
+
try {
|
|
480
|
+
const stored = localStorage.getItem(this.STORAGE_KEY);
|
|
481
|
+
console.log("Current localStorage data:", stored);
|
|
482
|
+
if (stored) {
|
|
483
|
+
console.log("Parsed localStorage data:", JSON.parse(stored));
|
|
484
|
+
}
|
|
485
|
+
console.log("Current state:", this.state);
|
|
486
|
+
} catch (error) {
|
|
487
|
+
console.error("Error debugging storage:", error);
|
|
488
|
+
}
|
|
489
|
+
}
|
|
490
|
+
getConferenceLines() {
|
|
491
|
+
return this.state.conferenceLine || [];
|
|
492
|
+
}
|
|
493
|
+
};
|
|
494
|
+
var sdkStateManager = new SDKStateManager();
|
|
495
|
+
|
|
496
|
+
// call-control-sdk/lib/hooks/eventsTracker.ts
|
|
497
|
+
var EventTrackerSDK = class {
|
|
498
|
+
constructor() {
|
|
499
|
+
__publicField(this, "config", null);
|
|
500
|
+
__publicField(this, "ticketId", null);
|
|
501
|
+
__publicField(this, "baseUrl", "");
|
|
502
|
+
__publicField(this, "eventQueue", []);
|
|
503
|
+
// private isOnline: boolean = true;
|
|
504
|
+
// private retryQueue: Array<() => Promise<void>> = [];
|
|
505
|
+
__publicField(this, "flushTimer", null);
|
|
506
|
+
}
|
|
507
|
+
async init(config) {
|
|
508
|
+
this.config = __spreadValues({
|
|
509
|
+
autoTrack: true,
|
|
510
|
+
retryAttempts: 3,
|
|
511
|
+
queueSize: 100,
|
|
512
|
+
flushInterval: 5e3
|
|
513
|
+
}, config);
|
|
514
|
+
this.baseUrl = config.baseUrl || (typeof window !== "undefined" ? window.location.origin : "");
|
|
515
|
+
this.setupNetworkDetection();
|
|
516
|
+
const ticket = await this.createTicket();
|
|
517
|
+
this.startPeriodicFlush();
|
|
518
|
+
console.log("EventTracker SDK initialized successfully");
|
|
519
|
+
return ticket;
|
|
520
|
+
}
|
|
521
|
+
isInitialized() {
|
|
522
|
+
return this.config !== null && this.ticketId !== null;
|
|
523
|
+
}
|
|
524
|
+
getConfig() {
|
|
525
|
+
return this.config;
|
|
526
|
+
}
|
|
527
|
+
getTicketId() {
|
|
528
|
+
return this.ticketId;
|
|
529
|
+
}
|
|
530
|
+
async createTicket() {
|
|
531
|
+
if (!this.config) {
|
|
532
|
+
throw new Error("EventTracker not initialized");
|
|
533
|
+
}
|
|
534
|
+
try {
|
|
535
|
+
const response = await this.makeRequest("/api/v1/et/init", {
|
|
536
|
+
method: "POST",
|
|
537
|
+
headers: {
|
|
538
|
+
"Content-Type": "application/json",
|
|
539
|
+
"X-API-Key": this.config.apiKey
|
|
540
|
+
},
|
|
541
|
+
body: JSON.stringify({
|
|
542
|
+
agentId: this.config.agentId,
|
|
543
|
+
sessionId: this.config.sessionId
|
|
544
|
+
})
|
|
545
|
+
});
|
|
546
|
+
if (!response.ok) {
|
|
547
|
+
sdkStateManager.setInitCheck();
|
|
548
|
+
throw new Error(`Failed to initialize: ${response.status} ${response.statusText}`);
|
|
549
|
+
}
|
|
550
|
+
const data = await response.json();
|
|
551
|
+
this.ticketId = data.ticketId;
|
|
552
|
+
if (this.config.autoTrack) {
|
|
553
|
+
this.setupAutoTracking();
|
|
554
|
+
}
|
|
555
|
+
return data;
|
|
556
|
+
} catch (error) {
|
|
557
|
+
console.error("EventTracker initialization failed:", error);
|
|
558
|
+
throw error;
|
|
559
|
+
}
|
|
560
|
+
}
|
|
561
|
+
async logEvent(eventType, eventData) {
|
|
562
|
+
if (!this.config || !this.ticketId) {
|
|
563
|
+
console.warn("EventTracker not initialized, skipping event:", eventType);
|
|
564
|
+
return;
|
|
565
|
+
}
|
|
566
|
+
const event = {
|
|
567
|
+
eventType,
|
|
568
|
+
eventData,
|
|
569
|
+
timestamp: Date.now()
|
|
570
|
+
};
|
|
571
|
+
this.eventQueue.push(event);
|
|
572
|
+
if (this.eventQueue.length > (this.config.queueSize || 100)) {
|
|
573
|
+
this.eventQueue.shift();
|
|
574
|
+
}
|
|
575
|
+
}
|
|
576
|
+
// private async sendEvent(event: {
|
|
577
|
+
// eventType: string;
|
|
578
|
+
// eventData?: EventData;
|
|
579
|
+
// timestamp: number;
|
|
580
|
+
// }): Promise<void> {
|
|
581
|
+
// if (!this.config || !this.ticketId) return;
|
|
582
|
+
// try {
|
|
583
|
+
// const response = await this.makeRequest("/api/v1/et/event", {
|
|
584
|
+
// method: "POST",
|
|
585
|
+
// headers: {
|
|
586
|
+
// "Content-Type": "application/json",
|
|
587
|
+
// "X-API-Key": this.config.apiKey,
|
|
588
|
+
// },
|
|
589
|
+
// body: JSON.stringify({
|
|
590
|
+
// ticketId: this.ticketId,
|
|
591
|
+
// eventType: event.eventType,
|
|
592
|
+
// eventData: event.eventData,
|
|
593
|
+
// }),
|
|
594
|
+
// });
|
|
595
|
+
// if (!response.ok) {
|
|
596
|
+
// throw new Error(`Failed to log event: ${response.status} ${response.statusText}`);
|
|
597
|
+
// }
|
|
598
|
+
// const index = this.eventQueue.findIndex((e) => e.timestamp === event.timestamp);
|
|
599
|
+
// if (index > -1) {
|
|
600
|
+
// this.eventQueue.splice(index, 1);
|
|
601
|
+
// }
|
|
602
|
+
// } catch (error) {
|
|
603
|
+
// console.error("Event logging failed:", error);
|
|
604
|
+
// // this.retryQueue.push(() => this.sendEvent(event));
|
|
605
|
+
// }
|
|
606
|
+
// }
|
|
607
|
+
// async closeTicket(): Promise<void> {
|
|
608
|
+
// if (!this.config || !this.ticketId) {
|
|
609
|
+
// throw new Error("EventTracker not initialized");
|
|
610
|
+
// }
|
|
611
|
+
// await this.flush();
|
|
612
|
+
// try {
|
|
613
|
+
// const response = await this.makeRequest("/api/v1/et/close", {
|
|
614
|
+
// method: "POST",
|
|
615
|
+
// headers: {
|
|
616
|
+
// "Content-Type": "application/json",
|
|
617
|
+
// "X-API-Key": this.config.apiKey,
|
|
618
|
+
// },
|
|
619
|
+
// body: JSON.stringify({
|
|
620
|
+
// ticketId: this.ticketId,
|
|
621
|
+
// }),
|
|
622
|
+
// });
|
|
623
|
+
// if (!response.ok) {
|
|
624
|
+
// throw new Error(`Failed to close ticket: ${response.status} ${response.statusText}`);
|
|
625
|
+
// }
|
|
626
|
+
// this.ticketId = null;
|
|
627
|
+
// this.stopPeriodicFlush();
|
|
628
|
+
// console.log("Ticket closed successfully");
|
|
629
|
+
// } catch (error) {
|
|
630
|
+
// console.error("Ticket close failed:", error);
|
|
631
|
+
// throw error;
|
|
632
|
+
// }
|
|
633
|
+
// }
|
|
634
|
+
// async flush(): Promise<void> {
|
|
635
|
+
// if (!this.isOnline || this.eventQueue.length === 0) return;
|
|
636
|
+
// // const eventsToFlush = [...this.eventQueue];
|
|
637
|
+
// // for (const event of eventsToFlush) {
|
|
638
|
+
// // await this.sendEvent(event);
|
|
639
|
+
// // }
|
|
640
|
+
// const retryItems = [...this.retryQueue];
|
|
641
|
+
// this.retryQueue = [];
|
|
642
|
+
// for (const retryFn of retryItems) {
|
|
643
|
+
// try {
|
|
644
|
+
// await retryFn();
|
|
645
|
+
// } catch (error) {
|
|
646
|
+
// console.error("Retry failed:", error);
|
|
647
|
+
// }
|
|
648
|
+
// }
|
|
649
|
+
// }
|
|
650
|
+
async makeRequest(url, options) {
|
|
651
|
+
var _a2;
|
|
652
|
+
const fullUrl = `${this.baseUrl}${url}`;
|
|
653
|
+
const maxRetries = ((_a2 = this.config) == null ? void 0 : _a2.retryAttempts) || 3;
|
|
654
|
+
for (let attempt = 1; attempt <= maxRetries; attempt++) {
|
|
655
|
+
try {
|
|
656
|
+
const response = await fetch(fullUrl, options);
|
|
657
|
+
return response;
|
|
658
|
+
} catch (error) {
|
|
659
|
+
if (attempt === maxRetries) {
|
|
660
|
+
throw error;
|
|
661
|
+
}
|
|
662
|
+
const delay = Math.min(1e3 * Math.pow(2, attempt - 1), 1e4);
|
|
663
|
+
await new Promise((resolve) => setTimeout(resolve, delay));
|
|
664
|
+
}
|
|
665
|
+
}
|
|
666
|
+
throw new Error("Max retries exceeded");
|
|
667
|
+
}
|
|
668
|
+
setupAutoTracking() {
|
|
669
|
+
var _a2;
|
|
670
|
+
if (typeof window === "undefined" || !((_a2 = this.config) == null ? void 0 : _a2.autoTrack)) return;
|
|
671
|
+
const autoTrackConfig = this.config.autoTrack === true ? {} : this.config.autoTrack;
|
|
672
|
+
if (autoTrackConfig.pageVisits !== false) {
|
|
673
|
+
this.logEvent("pageVisit", {
|
|
674
|
+
url: window.location.href,
|
|
675
|
+
title: document.title,
|
|
676
|
+
referrer: document.referrer,
|
|
677
|
+
userAgent: navigator.userAgent,
|
|
678
|
+
viewport: {
|
|
679
|
+
width: window.innerWidth,
|
|
680
|
+
height: window.innerHeight
|
|
681
|
+
},
|
|
682
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
683
|
+
}).catch((error) => console.warn("Failed to track page visit:", error));
|
|
684
|
+
}
|
|
685
|
+
if (autoTrackConfig.clicks !== false) {
|
|
686
|
+
document.addEventListener("click", (event) => {
|
|
687
|
+
var _a3;
|
|
688
|
+
const target = event.target;
|
|
689
|
+
if (target.tagName === "BUTTON" || target.tagName === "A" || target.onclick || target.getAttribute("role") === "button" || target instanceof HTMLButtonElement && target.type === "button") {
|
|
690
|
+
this.logEvent("click", {
|
|
691
|
+
element: target.tagName,
|
|
692
|
+
text: (_a3 = target.textContent) == null ? void 0 : _a3.trim().substring(0, 100),
|
|
693
|
+
href: target.getAttribute("href"),
|
|
694
|
+
id: target.id,
|
|
695
|
+
className: target.className,
|
|
696
|
+
role: target.getAttribute("role"),
|
|
697
|
+
position: {
|
|
698
|
+
x: event.clientX,
|
|
699
|
+
y: event.clientY
|
|
700
|
+
},
|
|
701
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
702
|
+
}).catch((error) => console.warn("Failed to track click:", error));
|
|
703
|
+
}
|
|
704
|
+
});
|
|
705
|
+
}
|
|
706
|
+
if (autoTrackConfig.forms !== false) {
|
|
707
|
+
document.addEventListener("submit", (event) => {
|
|
708
|
+
const target = event.target;
|
|
709
|
+
const formData = new FormData(target);
|
|
710
|
+
const formFields = {};
|
|
711
|
+
formData.forEach((value, key) => {
|
|
712
|
+
formFields[key] = value.toString();
|
|
713
|
+
});
|
|
714
|
+
this.logEvent("formSubmission", {
|
|
715
|
+
formId: target.id,
|
|
716
|
+
action: target.action,
|
|
717
|
+
method: target.method,
|
|
718
|
+
fields: Object.keys(formFields),
|
|
719
|
+
fieldCount: Object.keys(formFields).length,
|
|
720
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
721
|
+
}).catch((error) => console.warn("Failed to track form submission:", error));
|
|
722
|
+
});
|
|
723
|
+
}
|
|
724
|
+
if (autoTrackConfig.inputs !== false) {
|
|
725
|
+
let inputTimer;
|
|
726
|
+
document.addEventListener("input", (event) => {
|
|
727
|
+
const target = event.target;
|
|
728
|
+
if (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT") {
|
|
729
|
+
clearTimeout(inputTimer);
|
|
730
|
+
inputTimer = setTimeout(() => {
|
|
731
|
+
var _a3;
|
|
732
|
+
this.logEvent("fieldChange", {
|
|
733
|
+
element: target.tagName,
|
|
734
|
+
type: target.getAttribute("type"),
|
|
735
|
+
name: target.getAttribute("name"),
|
|
736
|
+
id: target.id,
|
|
737
|
+
valueLength: ((_a3 = target.value) == null ? void 0 : _a3.length) || 0,
|
|
738
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
739
|
+
}).catch((error) => console.warn("Failed to track field change:", error));
|
|
740
|
+
}, 1e3);
|
|
741
|
+
}
|
|
742
|
+
});
|
|
743
|
+
}
|
|
744
|
+
const sessionStartTime = Date.now();
|
|
745
|
+
window.addEventListener("beforeunload", () => {
|
|
746
|
+
const sessionDuration = Date.now() - sessionStartTime;
|
|
747
|
+
this.logEvent("pageUnload", {
|
|
748
|
+
url: window.location.href,
|
|
749
|
+
sessionDuration,
|
|
750
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
751
|
+
});
|
|
752
|
+
});
|
|
753
|
+
if (autoTrackConfig.visibility !== false) {
|
|
754
|
+
document.addEventListener("visibilitychange", () => {
|
|
755
|
+
this.logEvent("visibilityChange", {
|
|
756
|
+
hidden: document.hidden,
|
|
757
|
+
visibilityState: document.visibilityState,
|
|
758
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
759
|
+
});
|
|
760
|
+
});
|
|
761
|
+
}
|
|
762
|
+
if (autoTrackConfig.errors !== false) {
|
|
763
|
+
window.addEventListener("error", (event) => {
|
|
764
|
+
this.logEvent("jsError", {
|
|
765
|
+
message: event.message,
|
|
766
|
+
filename: event.filename,
|
|
767
|
+
lineno: event.lineno,
|
|
768
|
+
colno: event.colno,
|
|
769
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
770
|
+
});
|
|
771
|
+
});
|
|
772
|
+
window.addEventListener("unhandledrejection", (event) => {
|
|
773
|
+
var _a3;
|
|
774
|
+
this.logEvent("unhandledRejection", {
|
|
775
|
+
reason: (_a3 = event.reason) == null ? void 0 : _a3.toString(),
|
|
776
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
777
|
+
});
|
|
778
|
+
});
|
|
779
|
+
}
|
|
780
|
+
if (autoTrackConfig.performance !== false && typeof window.performance !== "undefined" && window.performance.navigation) {
|
|
781
|
+
window.addEventListener("load", () => {
|
|
782
|
+
setTimeout(() => {
|
|
783
|
+
const navigation = window.performance.navigation;
|
|
784
|
+
const timing = window.performance.timing;
|
|
785
|
+
this.logEvent("performanceMetrics", {
|
|
786
|
+
navigationTime: timing.navigationStart,
|
|
787
|
+
loadTime: timing.loadEventEnd - timing.navigationStart,
|
|
788
|
+
domReady: timing.domContentLoadedEventEnd - timing.navigationStart,
|
|
789
|
+
renderTime: timing.loadEventEnd - timing.domContentLoadedEventEnd,
|
|
790
|
+
navigationType: navigation.type,
|
|
791
|
+
redirectCount: navigation.redirectCount,
|
|
792
|
+
timestamp: (/* @__PURE__ */ new Date()).toISOString()
|
|
793
|
+
});
|
|
794
|
+
}, 1e3);
|
|
795
|
+
});
|
|
796
|
+
}
|
|
797
|
+
}
|
|
798
|
+
setupNetworkDetection() {
|
|
799
|
+
if (typeof window === "undefined") return;
|
|
800
|
+
window.addEventListener("online", () => {
|
|
801
|
+
console.log("EventTracker: Back online, flushing queued events");
|
|
802
|
+
});
|
|
803
|
+
window.addEventListener("offline", () => {
|
|
804
|
+
console.log("EventTracker: Offline, queueing events");
|
|
805
|
+
});
|
|
806
|
+
}
|
|
807
|
+
startPeriodicFlush() {
|
|
808
|
+
if (this.flushTimer) {
|
|
809
|
+
clearInterval(this.flushTimer);
|
|
810
|
+
}
|
|
811
|
+
}
|
|
812
|
+
// private stopPeriodicFlush(): void {
|
|
813
|
+
// if (this.flushTimer) {
|
|
814
|
+
// clearInterval(this.flushTimer);
|
|
815
|
+
// this.flushTimer = null;
|
|
816
|
+
// }
|
|
817
|
+
// }
|
|
818
|
+
};
|
|
819
|
+
var eventTracker = new EventTrackerSDK();
|
|
820
|
+
if (typeof window !== "undefined") {
|
|
821
|
+
window.EventTracker = eventTracker;
|
|
822
|
+
}
|
|
823
|
+
|
|
824
|
+
// call-control-sdk/lib/hooks/useLogout.ts
|
|
825
|
+
var import_react = require("react");
|
|
826
|
+
|
|
827
|
+
// call-control-sdk/lib/services/axios.ts
|
|
828
|
+
var import_axios = __toESM(require("axios"));
|
|
829
|
+
var _a;
|
|
830
|
+
var DEFAULT_TOKEN = (_a = sdkStateManager.getSdkAuthToken()) != null ? _a : "";
|
|
831
|
+
var REQUEST_TIMEOUT = 6e4;
|
|
832
|
+
function getAuthToken() {
|
|
833
|
+
var _a2;
|
|
834
|
+
return (_a2 = sdkStateManager.getSdkAuthToken()) != null ? _a2 : "";
|
|
835
|
+
}
|
|
836
|
+
function createAxiosInstance() {
|
|
837
|
+
var _a2, _b, _c, _d;
|
|
838
|
+
const instance = import_axios.default.create({
|
|
839
|
+
baseURL: BASE_URL,
|
|
840
|
+
headers: {
|
|
841
|
+
"Content-Type": "application/json",
|
|
842
|
+
Accept: "application/json",
|
|
843
|
+
"x-tenant-id": (_b = (_a2 = sdkStateManager.getCredentials()) == null ? void 0 : _a2.tenantId) != null ? _b : "",
|
|
844
|
+
"x-api-key": (_d = (_c = sdkStateManager.getCredentials()) == null ? void 0 : _c.apiKey) != null ? _d : "",
|
|
845
|
+
Authorization: `${DEFAULT_TOKEN}`
|
|
846
|
+
},
|
|
847
|
+
timeout: REQUEST_TIMEOUT,
|
|
848
|
+
withCredentials: false
|
|
849
|
+
});
|
|
850
|
+
instance.interceptors.request.use(
|
|
851
|
+
(config) => {
|
|
852
|
+
const token = getAuthToken();
|
|
853
|
+
if (token && config.headers) {
|
|
854
|
+
config.headers.Authorization = `${token}`;
|
|
855
|
+
}
|
|
856
|
+
config.metadata = { startTime: (/* @__PURE__ */ new Date()).getTime() };
|
|
857
|
+
return config;
|
|
858
|
+
},
|
|
859
|
+
(error) => {
|
|
860
|
+
console.error("Request interceptor error:", error);
|
|
861
|
+
return Promise.reject(error);
|
|
862
|
+
}
|
|
863
|
+
);
|
|
864
|
+
instance.interceptors.response.use(
|
|
865
|
+
(response) => {
|
|
866
|
+
var _a3;
|
|
867
|
+
const endTime = (/* @__PURE__ */ new Date()).getTime();
|
|
868
|
+
const startTime = (_a3 = response.config.metadata) == null ? void 0 : _a3.startTime;
|
|
869
|
+
if (startTime) {
|
|
870
|
+
console.log(`Request to ${response.config.url} took ${endTime - startTime}ms`);
|
|
871
|
+
}
|
|
872
|
+
return response;
|
|
873
|
+
},
|
|
874
|
+
async (error) => {
|
|
875
|
+
var _a3;
|
|
876
|
+
const originalRequest = error.config;
|
|
877
|
+
if (((_a3 = error.response) == null ? void 0 : _a3.status) === 401 && !originalRequest._retry) {
|
|
878
|
+
sdkStateManager.setInitCheck();
|
|
879
|
+
console.warn("Unauthorized request, attempting retry...");
|
|
880
|
+
}
|
|
881
|
+
if (!error.response) {
|
|
882
|
+
console.error("Network error:", error.message);
|
|
883
|
+
error.message = "Network error: Please check your internet connection";
|
|
884
|
+
}
|
|
885
|
+
if (error.response && error.response.status >= 500) {
|
|
886
|
+
console.error("Server error:", error.response.status, error.response.data);
|
|
887
|
+
error.message = "Server error: Please try again later";
|
|
888
|
+
}
|
|
889
|
+
return Promise.reject(error);
|
|
890
|
+
}
|
|
891
|
+
);
|
|
892
|
+
return instance;
|
|
893
|
+
}
|
|
894
|
+
var axiosInstance = createAxiosInstance();
|
|
895
|
+
var axios_default = axiosInstance;
|
|
896
|
+
|
|
897
|
+
// call-control-sdk/lib/hooks/useLogout.ts
|
|
898
|
+
var useLogout = () => {
|
|
899
|
+
const [loading, setLoading] = (0, import_react.useState)(false);
|
|
900
|
+
const [success, setSuccess] = (0, import_react.useState)(false);
|
|
901
|
+
const [isError, setIsError] = (0, import_react.useState)(false);
|
|
902
|
+
const [error, setError] = (0, import_react.useState)(null);
|
|
903
|
+
const [data, setData] = (0, import_react.useState)(null);
|
|
904
|
+
const handleLogout = (0, import_react.useCallback)(async () => {
|
|
905
|
+
var _a2;
|
|
906
|
+
const state = JSON.parse((_a2 = localStorage.getItem(STORAGE_KEY)) != null ? _a2 : "");
|
|
907
|
+
setLoading(true);
|
|
908
|
+
const payload = {
|
|
909
|
+
action: "LOGOUTUSER",
|
|
910
|
+
userId: state.agentId || ""
|
|
911
|
+
};
|
|
912
|
+
return axios_default.post(END_POINT.LOGOUT, payload).then((res) => {
|
|
913
|
+
sdkStateManager.clearStorageAndReset();
|
|
914
|
+
localStorage.clear();
|
|
915
|
+
sessionStorage.clear();
|
|
916
|
+
setData(res == null ? void 0 : res.data);
|
|
917
|
+
setSuccess(true);
|
|
918
|
+
return res == null ? void 0 : res.data;
|
|
919
|
+
}).catch((err) => {
|
|
920
|
+
var _a3;
|
|
921
|
+
setIsError(true);
|
|
922
|
+
setError(err);
|
|
923
|
+
return (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data;
|
|
924
|
+
}).finally(() => {
|
|
925
|
+
setLoading(false);
|
|
926
|
+
});
|
|
927
|
+
}, []);
|
|
928
|
+
return {
|
|
929
|
+
logout: handleLogout,
|
|
930
|
+
isLoading: loading,
|
|
931
|
+
isSuccess: success,
|
|
932
|
+
isError,
|
|
933
|
+
error,
|
|
934
|
+
data
|
|
935
|
+
};
|
|
936
|
+
};
|
|
937
|
+
|
|
938
|
+
// call-control-sdk/lib/hooks/useEndCall.ts
|
|
939
|
+
var import_react2 = require("react");
|
|
940
|
+
var useEndCall = () => {
|
|
941
|
+
const [loading, setLoading] = (0, import_react2.useState)(false);
|
|
942
|
+
const [success, setSuccess] = (0, import_react2.useState)(false);
|
|
943
|
+
const [isError, setIsError] = (0, import_react2.useState)(false);
|
|
944
|
+
const [error, setError] = (0, import_react2.useState)(null);
|
|
945
|
+
const [data, setData] = (0, import_react2.useState)(null);
|
|
946
|
+
const handleEndCall = (0, import_react2.useCallback)(
|
|
947
|
+
async (data2) => {
|
|
948
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
|
|
949
|
+
const state = JSON.parse((_a2 = localStorage.getItem(STORAGE_KEY)) != null ? _a2 : "");
|
|
950
|
+
setLoading(true);
|
|
951
|
+
const payload = {
|
|
952
|
+
action: "ENDCALL",
|
|
953
|
+
userId: state == null ? void 0 : state.agentId,
|
|
954
|
+
processid: (_d = (_c = (_b = state == null ? void 0 : state.process) == null ? void 0 : _b.process_id) == null ? void 0 : _c.toString()) != null ? _d : "",
|
|
955
|
+
process_name: (_f = (_e = state == null ? void 0 : state.process) == null ? void 0 : _e.process_name) != null ? _f : "",
|
|
956
|
+
callreferenceid: (_h = (_g = state == null ? void 0 : state.callData) == null ? void 0 : _g.convox_id) != null ? _h : "",
|
|
957
|
+
mobile_number: (_j = (_i = state == null ? void 0 : state.callData) == null ? void 0 : _i.phone_number) != null ? _j : "",
|
|
958
|
+
disposition: (_k = data2 == null ? void 0 : data2.disposition) != null ? _k : "RES",
|
|
959
|
+
set_followUp: (_l = data2 == null ? void 0 : data2.followUp) != null ? _l : "N",
|
|
960
|
+
callback_date: (_m = data2 == null ? void 0 : data2.callbackDate) != null ? _m : "",
|
|
961
|
+
callback_hrs: (_n = data2 == null ? void 0 : data2.callbackHrs) != null ? _n : "",
|
|
962
|
+
callback_mins: (_o = data2 == null ? void 0 : data2.callbackMins) != null ? _o : "",
|
|
963
|
+
endcall_type: "CLOSE"
|
|
964
|
+
};
|
|
965
|
+
return axios_default.post(END_POINT.END_CALL, payload).then((res) => {
|
|
966
|
+
sdkStateManager.resetConferenceLines();
|
|
967
|
+
sdkStateManager.endCall();
|
|
968
|
+
setData(res == null ? void 0 : res.data);
|
|
969
|
+
setSuccess(true);
|
|
970
|
+
return res == null ? void 0 : res.data;
|
|
971
|
+
}).catch((err) => {
|
|
972
|
+
var _a3;
|
|
973
|
+
setIsError(true);
|
|
974
|
+
setError(err);
|
|
975
|
+
return (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data;
|
|
976
|
+
}).finally(() => {
|
|
977
|
+
setLoading(false);
|
|
978
|
+
});
|
|
979
|
+
},
|
|
980
|
+
[]
|
|
981
|
+
);
|
|
982
|
+
return {
|
|
983
|
+
handleEndCall,
|
|
984
|
+
isLoading: loading,
|
|
985
|
+
isSuccess: success,
|
|
986
|
+
isError,
|
|
987
|
+
error,
|
|
988
|
+
data
|
|
989
|
+
};
|
|
990
|
+
};
|
|
991
|
+
|
|
992
|
+
// call-control-sdk/lib/hooks/useClickToCall.ts
|
|
993
|
+
var import_react3 = require("react");
|
|
994
|
+
var useClickToCall = () => {
|
|
995
|
+
const [loading, setLoading] = (0, import_react3.useState)(false);
|
|
996
|
+
const [success, setSuccess] = (0, import_react3.useState)(false);
|
|
997
|
+
const [isError, setIsError] = (0, import_react3.useState)(false);
|
|
998
|
+
const [error, setError] = (0, import_react3.useState)(null);
|
|
999
|
+
const [data, setData] = (0, import_react3.useState)(null);
|
|
1000
|
+
const handleStartCall = (0, import_react3.useCallback)(async (data2) => {
|
|
1001
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
1002
|
+
const state = JSON.parse((_a2 = localStorage.getItem(STORAGE_KEY)) != null ? _a2 : "");
|
|
1003
|
+
setLoading(true);
|
|
1004
|
+
if (((_b = state == null ? void 0 : state.callData) == null ? void 0 : _b.status) === "IDLE") {
|
|
1005
|
+
const payload = {
|
|
1006
|
+
action: "CALL",
|
|
1007
|
+
userId: state == null ? void 0 : state.agentId,
|
|
1008
|
+
phone_number: data2 == null ? void 0 : data2.mobileNumber
|
|
1009
|
+
};
|
|
1010
|
+
return axios_default.post(END_POINT.CLICK_TO_CALL, payload).then((res) => {
|
|
1011
|
+
sdkStateManager.resetConferenceLines();
|
|
1012
|
+
setData(res == null ? void 0 : res.data);
|
|
1013
|
+
setSuccess(true);
|
|
1014
|
+
return res == null ? void 0 : res.data;
|
|
1015
|
+
}).catch((err) => {
|
|
1016
|
+
var _a3;
|
|
1017
|
+
setIsError(true);
|
|
1018
|
+
setError(err);
|
|
1019
|
+
return (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data;
|
|
1020
|
+
}).finally(() => {
|
|
1021
|
+
setLoading(false);
|
|
1022
|
+
});
|
|
1023
|
+
} else if (((_c = state == null ? void 0 : state.callData) == null ? void 0 : _c.status) === "ONCALL") {
|
|
1024
|
+
const line_used = (_e = (_d = state == null ? void 0 : state.conferenceLine) == null ? void 0 : _d.filter((each) => each.line !== 1)) == null ? void 0 : _e.find((each) => each.status === "IDLE" && !(each == null ? void 0 : each.isCallStart));
|
|
1025
|
+
const payload = {
|
|
1026
|
+
action: "EXTERNAL_CONFERENCE",
|
|
1027
|
+
operation: `CALL${line_used.line}`,
|
|
1028
|
+
line_used: String(line_used.line),
|
|
1029
|
+
thirdparty_no: data2 == null ? void 0 : data2.mobileNumber,
|
|
1030
|
+
userid: (_g = (_f = state.callData) == null ? void 0 : _f.agent_id) != null ? _g : "",
|
|
1031
|
+
process: (_i = (_h = state.callData) == null ? void 0 : _h.process_name) != null ? _i : ""
|
|
1032
|
+
};
|
|
1033
|
+
return axios_default.post(END_POINT.CONFERENCE_CALL, payload).then((res) => {
|
|
1034
|
+
setData(res == null ? void 0 : res.data);
|
|
1035
|
+
setSuccess(true);
|
|
1036
|
+
sdkStateManager.setConferenceLine(__spreadProps(__spreadValues({}, line_used), {
|
|
1037
|
+
isCallStart: true,
|
|
1038
|
+
status: "ONCALL",
|
|
1039
|
+
phone: data2 == null ? void 0 : data2.mobileNumber
|
|
1040
|
+
}));
|
|
1041
|
+
sdkStateManager.setOpenConferenceDialog(true);
|
|
1042
|
+
return res == null ? void 0 : res.data;
|
|
1043
|
+
}).catch((err) => {
|
|
1044
|
+
var _a3;
|
|
1045
|
+
setIsError(true);
|
|
1046
|
+
setError(err);
|
|
1047
|
+
return (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data;
|
|
1048
|
+
}).finally(() => {
|
|
1049
|
+
setLoading(false);
|
|
1050
|
+
});
|
|
1051
|
+
} else {
|
|
1052
|
+
alert("Agent is not ready");
|
|
1053
|
+
}
|
|
1054
|
+
}, []);
|
|
1055
|
+
return {
|
|
1056
|
+
handleStartCall,
|
|
1057
|
+
isLoading: loading,
|
|
1058
|
+
isSuccess: success,
|
|
1059
|
+
isError,
|
|
1060
|
+
error,
|
|
1061
|
+
data
|
|
1062
|
+
};
|
|
1063
|
+
};
|
|
1064
|
+
|
|
1065
|
+
// call-control-sdk/lib/hooks/useGetCallerData.ts
|
|
1066
|
+
var import_react4 = require("react");
|
|
1067
|
+
var useGetCallerData = () => {
|
|
1068
|
+
const { process_id, process_name, status, phone_number, agent_id, convox_id } = sdkStateManager.getState().callData;
|
|
1069
|
+
const initialCallData = {
|
|
1070
|
+
phone_number,
|
|
1071
|
+
status,
|
|
1072
|
+
callReferenceId: convox_id,
|
|
1073
|
+
agent_id,
|
|
1074
|
+
process_id,
|
|
1075
|
+
process_name
|
|
1076
|
+
};
|
|
1077
|
+
const [callData, setCallData] = (0, import_react4.useState)(initialCallData);
|
|
1078
|
+
(0, import_react4.useEffect)(() => {
|
|
1079
|
+
const unsubscribe = sdkStateManager.subscribe(() => {
|
|
1080
|
+
const { process_id: process_id2, process_name: process_name2, status: status2, phone_number: phone_number2, agent_id: agent_id2, convox_id: convox_id2 } = sdkStateManager.getState().callData;
|
|
1081
|
+
const currentCallData = {
|
|
1082
|
+
phone_number: phone_number2,
|
|
1083
|
+
status: status2,
|
|
1084
|
+
callReferenceId: convox_id2,
|
|
1085
|
+
agent_id: agent_id2,
|
|
1086
|
+
process_id: process_id2,
|
|
1087
|
+
process_name: process_name2
|
|
1088
|
+
};
|
|
1089
|
+
setCallData(currentCallData);
|
|
1090
|
+
});
|
|
1091
|
+
return unsubscribe;
|
|
1092
|
+
}, []);
|
|
1093
|
+
return callData;
|
|
1094
|
+
};
|
|
1095
|
+
|
|
1096
|
+
// call-control-sdk/lib/hooks/useGetAuthorizationToken.ts
|
|
1097
|
+
var import_react5 = require("react");
|
|
1098
|
+
var useGetAuthorizationToken = () => {
|
|
1099
|
+
const [token, setToken] = (0, import_react5.useState)(sdkStateManager.getSdkAuthToken());
|
|
1100
|
+
(0, import_react5.useEffect)(() => {
|
|
1101
|
+
const unsubscribe = sdkStateManager.subscribe(() => {
|
|
1102
|
+
setToken(sdkStateManager.getSdkAuthToken());
|
|
1103
|
+
});
|
|
1104
|
+
return unsubscribe;
|
|
1105
|
+
}, []);
|
|
1106
|
+
return token;
|
|
1107
|
+
};
|
|
1108
|
+
|
|
1109
|
+
// call-control-sdk/lib/components/callControlPanel.tsx
|
|
1110
|
+
var import_react13 = require("react");
|
|
1111
|
+
|
|
1112
|
+
// call-control-sdk/lib/components/callControls.tsx
|
|
1113
|
+
var import_icons_material2 = require("@mui/icons-material");
|
|
1114
|
+
var import_material4 = require("@mui/material");
|
|
1115
|
+
var import_react11 = require("react");
|
|
1116
|
+
|
|
1117
|
+
// call-control-sdk/lib/hooks/useDraggable.ts
|
|
1118
|
+
var import_react6 = require("react");
|
|
1119
|
+
function useDraggable(initialPosition, onPositionChange) {
|
|
1120
|
+
const [position, setPosition] = (0, import_react6.useState)(initialPosition);
|
|
1121
|
+
const [isDragging, setIsDragging] = (0, import_react6.useState)(false);
|
|
1122
|
+
const dragRef = (0, import_react6.useRef)();
|
|
1123
|
+
const dragStart = (0, import_react6.useRef)({ x: 0, y: 0 });
|
|
1124
|
+
const elementStart = (0, import_react6.useRef)({ x: 0, y: 0 });
|
|
1125
|
+
const updatePosition = (0, import_react6.useCallback)(
|
|
1126
|
+
(newPosition) => {
|
|
1127
|
+
const element = dragRef.current;
|
|
1128
|
+
if (!element) return;
|
|
1129
|
+
const rect = element.getBoundingClientRect();
|
|
1130
|
+
const viewportWidth = window.innerWidth;
|
|
1131
|
+
const viewportHeight = window.innerHeight;
|
|
1132
|
+
const constrainedPosition = {
|
|
1133
|
+
x: Math.max(0, Math.min(newPosition.x, viewportWidth - rect.width)),
|
|
1134
|
+
y: Math.max(0, Math.min(newPosition.y, viewportHeight - rect.height))
|
|
1135
|
+
};
|
|
1136
|
+
setPosition(constrainedPosition);
|
|
1137
|
+
onPositionChange == null ? void 0 : onPositionChange(constrainedPosition);
|
|
1138
|
+
},
|
|
1139
|
+
[onPositionChange]
|
|
1140
|
+
);
|
|
1141
|
+
const handleStart = (0, import_react6.useCallback)(
|
|
1142
|
+
(clientX, clientY) => {
|
|
1143
|
+
setIsDragging(true);
|
|
1144
|
+
dragStart.current = { x: clientX, y: clientY };
|
|
1145
|
+
elementStart.current = position;
|
|
1146
|
+
const handleMove = (moveClientX, moveClientY) => {
|
|
1147
|
+
const deltaX = moveClientX - dragStart.current.x;
|
|
1148
|
+
const deltaY = moveClientY - dragStart.current.y;
|
|
1149
|
+
updatePosition({
|
|
1150
|
+
x: elementStart.current.x + deltaX,
|
|
1151
|
+
y: elementStart.current.y + deltaY
|
|
1152
|
+
});
|
|
1153
|
+
};
|
|
1154
|
+
const handleMouseMove = (e) => {
|
|
1155
|
+
e.preventDefault();
|
|
1156
|
+
handleMove(e.clientX, e.clientY);
|
|
1157
|
+
};
|
|
1158
|
+
const handleTouchMove = (e) => {
|
|
1159
|
+
e.preventDefault();
|
|
1160
|
+
const touch = e.touches[0];
|
|
1161
|
+
if (touch) {
|
|
1162
|
+
handleMove(touch.clientX, touch.clientY);
|
|
1163
|
+
}
|
|
1164
|
+
};
|
|
1165
|
+
const handleEnd = () => {
|
|
1166
|
+
setIsDragging(false);
|
|
1167
|
+
document.removeEventListener("mousemove", handleMouseMove);
|
|
1168
|
+
document.removeEventListener("mouseup", handleEnd);
|
|
1169
|
+
document.removeEventListener("touchmove", handleTouchMove);
|
|
1170
|
+
document.removeEventListener("touchend", handleEnd);
|
|
1171
|
+
};
|
|
1172
|
+
document.addEventListener("mousemove", handleMouseMove);
|
|
1173
|
+
document.addEventListener("mouseup", handleEnd);
|
|
1174
|
+
document.addEventListener("touchmove", handleTouchMove, {
|
|
1175
|
+
passive: false
|
|
1176
|
+
});
|
|
1177
|
+
document.addEventListener("touchend", handleEnd);
|
|
1178
|
+
},
|
|
1179
|
+
[position, updatePosition]
|
|
1180
|
+
);
|
|
1181
|
+
const handleMouseDown = (0, import_react6.useCallback)(
|
|
1182
|
+
(e) => {
|
|
1183
|
+
e.preventDefault();
|
|
1184
|
+
handleStart(e.clientX, e.clientY);
|
|
1185
|
+
},
|
|
1186
|
+
[handleStart]
|
|
1187
|
+
);
|
|
1188
|
+
const handleTouchStart = (0, import_react6.useCallback)(
|
|
1189
|
+
(e) => {
|
|
1190
|
+
e.preventDefault();
|
|
1191
|
+
const touch = e.touches[0];
|
|
1192
|
+
if (touch) {
|
|
1193
|
+
handleStart(touch.clientX, touch.clientY);
|
|
1194
|
+
}
|
|
1195
|
+
},
|
|
1196
|
+
[handleStart]
|
|
1197
|
+
);
|
|
1198
|
+
return {
|
|
1199
|
+
position,
|
|
1200
|
+
isDragging,
|
|
1201
|
+
dragRef,
|
|
1202
|
+
handleMouseDown,
|
|
1203
|
+
handleTouchStart
|
|
1204
|
+
};
|
|
1205
|
+
}
|
|
1206
|
+
|
|
1207
|
+
// call-control-sdk/lib/hooks/useSDKState.ts
|
|
1208
|
+
var import_react7 = require("react");
|
|
1209
|
+
function useSDKState() {
|
|
1210
|
+
const [state, setState] = (0, import_react7.useState)(sdkStateManager.getState());
|
|
1211
|
+
(0, import_react7.useEffect)(() => {
|
|
1212
|
+
const unsubscribe = sdkStateManager.subscribe(() => {
|
|
1213
|
+
setState(sdkStateManager.getState());
|
|
1214
|
+
});
|
|
1215
|
+
return unsubscribe;
|
|
1216
|
+
}, []);
|
|
1217
|
+
return state;
|
|
1218
|
+
}
|
|
1219
|
+
|
|
1220
|
+
// call-control-sdk/lib/services/request.ts
|
|
1221
|
+
var import_react9 = require("react");
|
|
1222
|
+
|
|
1223
|
+
// call-control-sdk/lib/services/toastMessage.tsx
|
|
1224
|
+
var import_react8 = require("react");
|
|
1225
|
+
var import_material = require("@mui/material");
|
|
1226
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
1227
|
+
var ToastContext = (0, import_react8.createContext)(void 0);
|
|
1228
|
+
var useToast = () => {
|
|
1229
|
+
const ctx = (0, import_react8.useContext)(ToastContext);
|
|
1230
|
+
if (!ctx) throw new Error("useToast must be used inside ToastProvider");
|
|
1231
|
+
return ctx;
|
|
1232
|
+
};
|
|
1233
|
+
var ToastProvider = ({ children }) => {
|
|
1234
|
+
const [open, setOpen] = (0, import_react8.useState)(false);
|
|
1235
|
+
const [message, setMessage] = (0, import_react8.useState)("");
|
|
1236
|
+
const [severity, setSeverity] = (0, import_react8.useState)("info");
|
|
1237
|
+
const showToast = (msg, sev = "info") => {
|
|
1238
|
+
setMessage(msg);
|
|
1239
|
+
setSeverity(sev);
|
|
1240
|
+
setOpen(true);
|
|
1241
|
+
};
|
|
1242
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(ToastContext.Provider, { value: { showToast }, children: [
|
|
1243
|
+
children,
|
|
1244
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
1245
|
+
import_material.Snackbar,
|
|
1246
|
+
{
|
|
1247
|
+
open,
|
|
1248
|
+
color: severity,
|
|
1249
|
+
autoHideDuration: 3e3,
|
|
1250
|
+
onClose: () => setOpen(false),
|
|
1251
|
+
anchorOrigin: { vertical: "top", horizontal: "right" },
|
|
1252
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
1253
|
+
import_material.Alert,
|
|
1254
|
+
{
|
|
1255
|
+
variant: "filled",
|
|
1256
|
+
severity,
|
|
1257
|
+
onClose: () => setOpen(false),
|
|
1258
|
+
sx: { width: "100%" },
|
|
1259
|
+
children: message
|
|
1260
|
+
}
|
|
1261
|
+
)
|
|
1262
|
+
}
|
|
1263
|
+
)
|
|
1264
|
+
] });
|
|
1265
|
+
};
|
|
1266
|
+
|
|
1267
|
+
// call-control-sdk/lib/services/request.ts
|
|
1268
|
+
var initialState = {
|
|
1269
|
+
isLoading: false,
|
|
1270
|
+
isSuccess: false,
|
|
1271
|
+
isError: false,
|
|
1272
|
+
error: null,
|
|
1273
|
+
data: null
|
|
1274
|
+
};
|
|
1275
|
+
var reducer = (state, action) => {
|
|
1276
|
+
if (action.type === "isLoading") {
|
|
1277
|
+
return __spreadProps(__spreadValues({}, state), {
|
|
1278
|
+
isLoading: action.payload
|
|
1279
|
+
});
|
|
1280
|
+
} else if (action.type === "isSuccess") {
|
|
1281
|
+
return __spreadProps(__spreadValues({}, state), {
|
|
1282
|
+
isSuccess: true,
|
|
1283
|
+
data: action.payload
|
|
1284
|
+
});
|
|
1285
|
+
} else if (action.type === "isError") {
|
|
1286
|
+
return __spreadProps(__spreadValues({}, state), {
|
|
1287
|
+
isError: true,
|
|
1288
|
+
error: action.payload
|
|
1289
|
+
});
|
|
1290
|
+
} else if (action.type === "reset") {
|
|
1291
|
+
return {
|
|
1292
|
+
isLoading: false,
|
|
1293
|
+
isSuccess: false,
|
|
1294
|
+
isError: false,
|
|
1295
|
+
error: null,
|
|
1296
|
+
data: null
|
|
1297
|
+
};
|
|
1298
|
+
}
|
|
1299
|
+
throw Error("Unknown action.");
|
|
1300
|
+
};
|
|
1301
|
+
var usePostRequest = (props = {}) => {
|
|
1302
|
+
const { onSuccess = null, onError = null, disabledSuccessToast = false } = props;
|
|
1303
|
+
const { showToast } = useToast();
|
|
1304
|
+
const [state, dispatch] = (0, import_react9.useReducer)(reducer, initialState);
|
|
1305
|
+
const postRequest = (0, import_react9.useCallback)(
|
|
1306
|
+
(url, payload, config = {}) => {
|
|
1307
|
+
dispatch({
|
|
1308
|
+
type: "isLoading",
|
|
1309
|
+
payload: true
|
|
1310
|
+
});
|
|
1311
|
+
axios_default.post(url, payload, config).then((res) => {
|
|
1312
|
+
var _a2;
|
|
1313
|
+
dispatch({
|
|
1314
|
+
type: "isSuccess",
|
|
1315
|
+
payload: res.data
|
|
1316
|
+
});
|
|
1317
|
+
onSuccess == null ? void 0 : onSuccess(res.data, payload);
|
|
1318
|
+
if (!disabledSuccessToast) {
|
|
1319
|
+
showToast((_a2 = res.data) == null ? void 0 : _a2.message, "success");
|
|
1320
|
+
}
|
|
1321
|
+
}).catch((err) => {
|
|
1322
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
|
|
1323
|
+
const error = {
|
|
1324
|
+
status: (_b = (_a2 = err.response) == null ? void 0 : _a2.status) != null ? _b : 500,
|
|
1325
|
+
message: ((_d = (_c = err.response) == null ? void 0 : _c.data) == null ? void 0 : _d.detail) || ((_f = (_e = err.response) == null ? void 0 : _e.data) == null ? void 0 : _f.message) || err.message || "An unknown error occurred",
|
|
1326
|
+
data: (_h = (_g = err.response) == null ? void 0 : _g.data) != null ? _h : null,
|
|
1327
|
+
statusText: (_j = (_i = err.response) == null ? void 0 : _i.statusText) != null ? _j : "",
|
|
1328
|
+
code: (_k = err == null ? void 0 : err.code) != null ? _k : "",
|
|
1329
|
+
name: (_l = err == null ? void 0 : err.name) != null ? _l : ""
|
|
1330
|
+
};
|
|
1331
|
+
showToast(error.message, "error");
|
|
1332
|
+
dispatch({
|
|
1333
|
+
type: "isError",
|
|
1334
|
+
payload: error
|
|
1335
|
+
});
|
|
1336
|
+
onError == null ? void 0 : onError(error, payload);
|
|
1337
|
+
}).finally(() => {
|
|
1338
|
+
dispatch({
|
|
1339
|
+
type: "isLoading",
|
|
1340
|
+
payload: false
|
|
1341
|
+
});
|
|
1342
|
+
});
|
|
1343
|
+
},
|
|
1344
|
+
[onSuccess, onError, showToast]
|
|
1345
|
+
);
|
|
1346
|
+
return [postRequest, state];
|
|
1347
|
+
};
|
|
1348
|
+
|
|
1349
|
+
// call-control-sdk/lib/components/dialog.tsx
|
|
1350
|
+
var import_icons_material = require("@mui/icons-material");
|
|
1351
|
+
var import_material3 = require("@mui/material");
|
|
1352
|
+
var import_react10 = require("react");
|
|
1353
|
+
|
|
1354
|
+
// call-control-sdk/lib/components/styles.ts
|
|
1355
|
+
var import_material2 = require("@mui/material");
|
|
1356
|
+
var useStyles = ({
|
|
1357
|
+
disabled,
|
|
1358
|
+
enabled,
|
|
1359
|
+
outlined
|
|
1360
|
+
}) => {
|
|
1361
|
+
const theme = (0, import_material2.useTheme)();
|
|
1362
|
+
return {
|
|
1363
|
+
disabled: __spreadValues({
|
|
1364
|
+
padding: "0px",
|
|
1365
|
+
margin: "0px",
|
|
1366
|
+
minWidth: "40px !important",
|
|
1367
|
+
borderRadius: "16px",
|
|
1368
|
+
border: `1px solid rgb(206, 204, 204)`,
|
|
1369
|
+
height: "40px",
|
|
1370
|
+
"&:hover": {
|
|
1371
|
+
boxShadow: " 0px 2px 2px rgba(0, 0, 0, 0.79)",
|
|
1372
|
+
border: `1px solid ${theme.palette.primary.main}`
|
|
1373
|
+
},
|
|
1374
|
+
"&:active": {
|
|
1375
|
+
bgcolor: "primary.main",
|
|
1376
|
+
boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
|
|
1377
|
+
}
|
|
1378
|
+
}, disabled),
|
|
1379
|
+
enabled: __spreadValues({
|
|
1380
|
+
padding: "0px",
|
|
1381
|
+
margin: "0px",
|
|
1382
|
+
minWidth: "40px !important",
|
|
1383
|
+
borderRadius: "16px",
|
|
1384
|
+
boxShadow: " 0px 2px 1px rgba(0, 0, 0, 0.507)",
|
|
1385
|
+
border: `1px solid ${theme.palette.primary.main}`,
|
|
1386
|
+
height: "40px",
|
|
1387
|
+
"&:hover": {
|
|
1388
|
+
boxShadow: " 0px 2px 1px rgba(0, 0, 0, 0.507)",
|
|
1389
|
+
border: `1px solid ${theme.palette.primary.main}`
|
|
1390
|
+
},
|
|
1391
|
+
"&:active": {
|
|
1392
|
+
bgcolor: "primary.main",
|
|
1393
|
+
boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
|
|
1394
|
+
}
|
|
1395
|
+
}, enabled),
|
|
1396
|
+
outlined: __spreadValues({
|
|
1397
|
+
padding: "0px",
|
|
1398
|
+
margin: "0px",
|
|
1399
|
+
minWidth: "40px !important",
|
|
1400
|
+
borderRadius: "16px",
|
|
1401
|
+
backgroundColor: theme.palette.grey[200],
|
|
1402
|
+
boxShadow: `0px 2px 1px ${theme.palette.primary.light}`,
|
|
1403
|
+
border: `0px solid ${theme.palette.primary.main}`,
|
|
1404
|
+
height: "40px",
|
|
1405
|
+
"&:hover": {
|
|
1406
|
+
boxShadow: `0px 2px 1px ${theme.palette.primary.main}`,
|
|
1407
|
+
border: `0px solid ${theme.palette.primary.main}`
|
|
1408
|
+
},
|
|
1409
|
+
"&:active": {
|
|
1410
|
+
bgcolor: "primary.main",
|
|
1411
|
+
boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
|
|
1412
|
+
}
|
|
1413
|
+
}, outlined)
|
|
1414
|
+
};
|
|
1415
|
+
};
|
|
1416
|
+
var styles_default = useStyles;
|
|
1417
|
+
|
|
1418
|
+
// call-control-sdk/lib/components/dialog.tsx
|
|
1419
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
1420
|
+
var ConferenceTableRow = ({ each }) => {
|
|
1421
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t;
|
|
1422
|
+
const state = useSDKState();
|
|
1423
|
+
const { showToast } = useToast();
|
|
1424
|
+
const { disabled, enabled, outlined } = styles_default({
|
|
1425
|
+
disabled: ((_a2 = state.sdkConfig) == null ? void 0 : _a2.disabled) || {},
|
|
1426
|
+
enabled: ((_b = state.sdkConfig) == null ? void 0 : _b.enabled) || {},
|
|
1427
|
+
outlined: ((_c = state.sdkConfig) == null ? void 0 : _c.outlined) || {}
|
|
1428
|
+
});
|
|
1429
|
+
const theme = (0, import_material3.useTheme)();
|
|
1430
|
+
const [conferenceCallStart, setConferenceCallStart] = (0, import_react10.useState)(false);
|
|
1431
|
+
const [conferenceCallMerge, setConferenceCallMerge] = (0, import_react10.useState)(false);
|
|
1432
|
+
const [conferenceCallHoldOrUnHold, setConferenceCallHoldOrUnHold] = (0, import_react10.useState)(false);
|
|
1433
|
+
const [conferenceCallEnd, setConferenceCallEnd] = (0, import_react10.useState)(false);
|
|
1434
|
+
const onConferenceLineUpdate = (line, data) => {
|
|
1435
|
+
sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
|
|
1436
|
+
};
|
|
1437
|
+
const onConferenceCallStart = (line, data) => {
|
|
1438
|
+
var _a3, _b2, _c2, _d2;
|
|
1439
|
+
const line_used = __spreadValues(__spreadValues({}, line), data);
|
|
1440
|
+
setConferenceCallStart(true);
|
|
1441
|
+
const payload = {
|
|
1442
|
+
action: "EXTERNAL_CONFERENCE",
|
|
1443
|
+
operation: `CALL${line_used.line}`,
|
|
1444
|
+
line_used: String(line_used.line),
|
|
1445
|
+
thirdparty_no: line_used.phone,
|
|
1446
|
+
userid: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b2 : "",
|
|
1447
|
+
process: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.process_name) != null ? _d2 : ""
|
|
1448
|
+
};
|
|
1449
|
+
axios_default.post(END_POINT.CONFERENCE_CALL, payload).then((res) => {
|
|
1450
|
+
var _a4;
|
|
1451
|
+
showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
|
|
1452
|
+
sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
|
|
1453
|
+
}).catch((err) => {
|
|
1454
|
+
var _a4, _b3, _c3, _d3;
|
|
1455
|
+
const message = ((_b3 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b3.detail) || ((_d3 = (_c3 = err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || err.message || "An unknown error occurred";
|
|
1456
|
+
showToast(message, "error");
|
|
1457
|
+
}).finally(() => {
|
|
1458
|
+
setConferenceCallStart(false);
|
|
1459
|
+
});
|
|
1460
|
+
};
|
|
1461
|
+
const onMergeConferenceCall = (line, data) => {
|
|
1462
|
+
var _a3, _b2, _c2, _d2;
|
|
1463
|
+
const line_used = __spreadValues(__spreadValues({}, line), data);
|
|
1464
|
+
setConferenceCallMerge(true);
|
|
1465
|
+
const payload = {
|
|
1466
|
+
action: "EXTERNAL_CONFERENCE",
|
|
1467
|
+
operation: `CONFERENCE`,
|
|
1468
|
+
line_used: String(line_used.line),
|
|
1469
|
+
thirdparty_no: line_used.phone,
|
|
1470
|
+
userid: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b2 : "",
|
|
1471
|
+
process: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.process_name) != null ? _d2 : ""
|
|
1472
|
+
};
|
|
1473
|
+
axios_default.post(END_POINT.CONFERENCE_CALL, payload).then((res) => {
|
|
1474
|
+
var _a4;
|
|
1475
|
+
showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
|
|
1476
|
+
sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
|
|
1477
|
+
}).catch((err) => {
|
|
1478
|
+
var _a4, _b3, _c3, _d3;
|
|
1479
|
+
const message = ((_b3 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b3.detail) || ((_d3 = (_c3 = err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || err.message || "An unknown error occurred";
|
|
1480
|
+
showToast(message, "error");
|
|
1481
|
+
}).finally(() => {
|
|
1482
|
+
setConferenceCallMerge(false);
|
|
1483
|
+
});
|
|
1484
|
+
};
|
|
1485
|
+
const onHoldOrUnHoldConferenceCall = (line, data, type) => {
|
|
1486
|
+
var _a3, _b2, _c2, _d2;
|
|
1487
|
+
const line_used = __spreadValues(__spreadValues({}, line), data);
|
|
1488
|
+
setConferenceCallHoldOrUnHold(true);
|
|
1489
|
+
const payload = {
|
|
1490
|
+
action: "EXTERNAL_CONFERENCE",
|
|
1491
|
+
operation: type,
|
|
1492
|
+
hold_channel_no: type === "HOLDUSER" ? `hold${line_used.line}` : `unhold${line_used.line}`,
|
|
1493
|
+
userid: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b2 : "",
|
|
1494
|
+
process: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.process_name) != null ? _d2 : ""
|
|
1495
|
+
};
|
|
1496
|
+
axios_default.post(END_POINT.CONFERENCE_CALL_HOLD_OR_UN_HOLD, payload).then((res) => {
|
|
1497
|
+
var _a4;
|
|
1498
|
+
showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
|
|
1499
|
+
sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
|
|
1500
|
+
}).catch((err) => {
|
|
1501
|
+
var _a4, _b3, _c3, _d3;
|
|
1502
|
+
const message = ((_b3 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b3.detail) || ((_d3 = (_c3 = err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || err.message || "An unknown error occurred";
|
|
1503
|
+
showToast(message, "error");
|
|
1504
|
+
}).finally(() => {
|
|
1505
|
+
setConferenceCallHoldOrUnHold(false);
|
|
1506
|
+
});
|
|
1507
|
+
};
|
|
1508
|
+
const onEndConferenceCall = (line, data) => {
|
|
1509
|
+
var _a3, _b2, _c2, _d2;
|
|
1510
|
+
const line_used = __spreadValues(__spreadValues({}, line), data);
|
|
1511
|
+
setConferenceCallEnd(true);
|
|
1512
|
+
const payload = {
|
|
1513
|
+
action: "EXTERNAL_CONFERENCE",
|
|
1514
|
+
operation: "HANGUP_CHANNEL",
|
|
1515
|
+
line_used: String(line_used.line),
|
|
1516
|
+
user_type: `THIRDPARTY${line_used.line - 1}`,
|
|
1517
|
+
thirdparty_no: line_used.phone,
|
|
1518
|
+
userid: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b2 : "",
|
|
1519
|
+
process: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.process_name) != null ? _d2 : ""
|
|
1520
|
+
};
|
|
1521
|
+
axios_default.post(END_POINT.CONFERENCE_CALL_END, payload).then((res) => {
|
|
1522
|
+
var _a4;
|
|
1523
|
+
showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
|
|
1524
|
+
sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
|
|
1525
|
+
}).catch((err) => {
|
|
1526
|
+
var _a4, _b3, _c3, _d3;
|
|
1527
|
+
const message = ((_b3 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b3.detail) || ((_d3 = (_c3 = err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || err.message || "An unknown error occurred";
|
|
1528
|
+
showToast(message, "error");
|
|
1529
|
+
}).finally(() => {
|
|
1530
|
+
setConferenceCallEnd(false);
|
|
1531
|
+
});
|
|
1532
|
+
};
|
|
1533
|
+
const [holdOrUnHold, { isLoading: holdOrUnHoldLoading }] = usePostRequest({
|
|
1534
|
+
onSuccess: () => {
|
|
1535
|
+
sdkStateManager.setHolding(!state.isHolding);
|
|
1536
|
+
},
|
|
1537
|
+
onError: (error) => {
|
|
1538
|
+
console.log("\u274C Hold operation error:", error);
|
|
1539
|
+
}
|
|
1540
|
+
});
|
|
1541
|
+
const [muteOrUnMute, { isLoading: muteOrUnMuteLoading }] = usePostRequest({
|
|
1542
|
+
onSuccess: () => {
|
|
1543
|
+
sdkStateManager.setMuted(!state.isMuted);
|
|
1544
|
+
},
|
|
1545
|
+
onError: (error) => {
|
|
1546
|
+
console.log("\u274C Mute operation error:", error);
|
|
1547
|
+
}
|
|
1548
|
+
});
|
|
1549
|
+
const handleHoldToggle = () => {
|
|
1550
|
+
var _a3;
|
|
1551
|
+
const payload = {
|
|
1552
|
+
action: ((_a3 = state.callData) == null ? void 0 : _a3.hold) === 1 ? "UNHOLD" : "HOLD",
|
|
1553
|
+
userId: state.agentId
|
|
1554
|
+
};
|
|
1555
|
+
holdOrUnHold(END_POINT.HOLD_CALL, payload);
|
|
1556
|
+
};
|
|
1557
|
+
const handleMuteToggle = () => {
|
|
1558
|
+
var _a3;
|
|
1559
|
+
const payload = {
|
|
1560
|
+
action: ((_a3 = state.callData) == null ? void 0 : _a3.mute) === 1 ? "UNMUTE" : "MUTE",
|
|
1561
|
+
userId: state.agentId
|
|
1562
|
+
};
|
|
1563
|
+
muteOrUnMute(END_POINT.MUTE_CALL, payload);
|
|
1564
|
+
};
|
|
1565
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
1566
|
+
import_material3.TableRow,
|
|
1567
|
+
{
|
|
1568
|
+
sx: {
|
|
1569
|
+
border: "2px solid #fff"
|
|
1570
|
+
},
|
|
1571
|
+
children: [
|
|
1572
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1573
|
+
import_material3.TableCell,
|
|
1574
|
+
{
|
|
1575
|
+
sx: {
|
|
1576
|
+
padding: "6px",
|
|
1577
|
+
flex: 1,
|
|
1578
|
+
width: "100px"
|
|
1579
|
+
},
|
|
1580
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Typography, { children: [
|
|
1581
|
+
"Line ",
|
|
1582
|
+
(_d = each == null ? void 0 : each.line) != null ? _d : "",
|
|
1583
|
+
". "
|
|
1584
|
+
] })
|
|
1585
|
+
}
|
|
1586
|
+
),
|
|
1587
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1588
|
+
import_material3.TableCell,
|
|
1589
|
+
{
|
|
1590
|
+
sx: {
|
|
1591
|
+
padding: "6px",
|
|
1592
|
+
width: "100px"
|
|
1593
|
+
},
|
|
1594
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1595
|
+
import_material3.Typography,
|
|
1596
|
+
{
|
|
1597
|
+
variant: "body2",
|
|
1598
|
+
sx: {
|
|
1599
|
+
px: 1,
|
|
1600
|
+
borderRadius: "10px",
|
|
1601
|
+
flex: 1
|
|
1602
|
+
},
|
|
1603
|
+
children: (_e = each == null ? void 0 : each.status) != null ? _e : ""
|
|
1604
|
+
}
|
|
1605
|
+
)
|
|
1606
|
+
}
|
|
1607
|
+
),
|
|
1608
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1609
|
+
import_material3.TableCell,
|
|
1610
|
+
{
|
|
1611
|
+
sx: {
|
|
1612
|
+
padding: "6px",
|
|
1613
|
+
flex: 1
|
|
1614
|
+
},
|
|
1615
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1616
|
+
import_material3.TextField,
|
|
1617
|
+
{
|
|
1618
|
+
size: "small",
|
|
1619
|
+
placeholder: "Phone Number",
|
|
1620
|
+
fullWidth: true,
|
|
1621
|
+
value: (each == null ? void 0 : each.phone) || "",
|
|
1622
|
+
disabled: (each == null ? void 0 : each.line) === 1 || (each == null ? void 0 : each.status) === "ONCALL" || (each == null ? void 0 : each.status) === "DISCONNECTED" || (each == null ? void 0 : each.status) === "CONFERENCE" || (each == null ? void 0 : each.status) === "HOLD" || (each == null ? void 0 : each.status) === "MUTE" || (each == null ? void 0 : each.status) === "DIALING" || (each == null ? void 0 : each.status) === "RINGING",
|
|
1623
|
+
onChange: (e) => {
|
|
1624
|
+
onConferenceLineUpdate(each, { phone: e.target.value });
|
|
1625
|
+
}
|
|
1626
|
+
}
|
|
1627
|
+
)
|
|
1628
|
+
}
|
|
1629
|
+
),
|
|
1630
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1631
|
+
import_material3.TableCell,
|
|
1632
|
+
{
|
|
1633
|
+
sx: {
|
|
1634
|
+
padding: "6px",
|
|
1635
|
+
// width: "200px",
|
|
1636
|
+
flex: 1
|
|
1637
|
+
},
|
|
1638
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
1639
|
+
import_material3.Box,
|
|
1640
|
+
{
|
|
1641
|
+
sx: {
|
|
1642
|
+
width: "100%",
|
|
1643
|
+
display: "flex",
|
|
1644
|
+
alignItems: "center",
|
|
1645
|
+
justifyContent: "flex-start",
|
|
1646
|
+
gap: "10px"
|
|
1647
|
+
},
|
|
1648
|
+
children: [
|
|
1649
|
+
(each == null ? void 0 : each.line) === 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: ((_f = state.callData) == null ? void 0 : _f.hold) === 1 ? "Resume" : "Hold", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1650
|
+
import_material3.Button,
|
|
1651
|
+
{
|
|
1652
|
+
variant: ((_g = state.callData) == null ? void 0 : _g.hold) === 1 && ((_i = (_h = state.callData) == null ? void 0 : _h.status) == null ? void 0 : _i.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
|
|
1653
|
+
onClick: (e) => {
|
|
1654
|
+
e.stopPropagation();
|
|
1655
|
+
handleHoldToggle();
|
|
1656
|
+
},
|
|
1657
|
+
sx: ((_j = state.callData) == null ? void 0 : _j.hold) === 1 && ((_l = (_k = state.callData) == null ? void 0 : _k.status) == null ? void 0 : _l.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_n = (_m = state.callData) == null ? void 0 : _m.status) == null ? void 0 : _n.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
|
|
1658
|
+
disabled: ((_p = (_o = state.callData) == null ? void 0 : _o.status) == null ? void 0 : _p.toUpperCase()) !== "ONCALL" && ((_q = state.callData) == null ? void 0 : _q.hold) !== 1 || holdOrUnHoldLoading,
|
|
1659
|
+
children: ((_r = state.callData) == null ? void 0 : _r.hold) === 1 ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
1660
|
+
import_material3.Box,
|
|
1661
|
+
{
|
|
1662
|
+
sx: {
|
|
1663
|
+
display: "flex",
|
|
1664
|
+
alignItems: "center",
|
|
1665
|
+
justifyContent: "center",
|
|
1666
|
+
gap: "5px",
|
|
1667
|
+
width: "98px"
|
|
1668
|
+
},
|
|
1669
|
+
children: [
|
|
1670
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1671
|
+
import_material3.Typography,
|
|
1672
|
+
{
|
|
1673
|
+
variant: "body2",
|
|
1674
|
+
sx: {
|
|
1675
|
+
fontSize: "12px",
|
|
1676
|
+
color: ((_s = state.callData) == null ? void 0 : _s.hold) === 1 ? "#fff" : "initial"
|
|
1677
|
+
},
|
|
1678
|
+
children: "Unhold"
|
|
1679
|
+
}
|
|
1680
|
+
),
|
|
1681
|
+
holdOrUnHoldLoading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1682
|
+
import_material3.CircularProgress,
|
|
1683
|
+
{
|
|
1684
|
+
size: "16px",
|
|
1685
|
+
sx: {
|
|
1686
|
+
color: theme.palette.primary.main
|
|
1687
|
+
}
|
|
1688
|
+
}
|
|
1689
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.PlayArrow, {})
|
|
1690
|
+
]
|
|
1691
|
+
}
|
|
1692
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
1693
|
+
import_material3.Box,
|
|
1694
|
+
{
|
|
1695
|
+
sx: {
|
|
1696
|
+
display: "flex",
|
|
1697
|
+
alignItems: "center",
|
|
1698
|
+
justifyContent: "center",
|
|
1699
|
+
gap: "5px",
|
|
1700
|
+
width: "98px"
|
|
1701
|
+
},
|
|
1702
|
+
children: [
|
|
1703
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1704
|
+
import_material3.Typography,
|
|
1705
|
+
{
|
|
1706
|
+
variant: "body2",
|
|
1707
|
+
sx: {
|
|
1708
|
+
color: ((_t = state.callData) == null ? void 0 : _t.hold) === 1 ? "#fff" : "#000",
|
|
1709
|
+
fontSize: "12px"
|
|
1710
|
+
},
|
|
1711
|
+
children: "Hold"
|
|
1712
|
+
}
|
|
1713
|
+
),
|
|
1714
|
+
holdOrUnHoldLoading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1715
|
+
import_material3.CircularProgress,
|
|
1716
|
+
{
|
|
1717
|
+
size: "16px",
|
|
1718
|
+
sx: {
|
|
1719
|
+
color: theme.palette.primary.main
|
|
1720
|
+
}
|
|
1721
|
+
}
|
|
1722
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Pause, {})
|
|
1723
|
+
]
|
|
1724
|
+
}
|
|
1725
|
+
)
|
|
1726
|
+
}
|
|
1727
|
+
) }),
|
|
1728
|
+
(each == null ? void 0 : each.line) !== 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "Call", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1729
|
+
import_material3.Button,
|
|
1730
|
+
{
|
|
1731
|
+
variant: (each == null ? void 0 : each.status) !== "IDLE" ? "outlined" : "contained",
|
|
1732
|
+
color: "success",
|
|
1733
|
+
sx: (each == null ? void 0 : each.status) !== "IDLE" ? __spreadValues({}, disabled) : __spreadProps(__spreadValues({}, enabled), {
|
|
1734
|
+
border: `0px solid ${theme.palette.success.light}`,
|
|
1735
|
+
"&:hover": {
|
|
1736
|
+
bgcolor: "success.light",
|
|
1737
|
+
boxShadow: `0px 2px 1px ${theme.palette.success.light}`,
|
|
1738
|
+
border: `0px solid ${theme.palette.success.light}`
|
|
1739
|
+
},
|
|
1740
|
+
"&:active": {
|
|
1741
|
+
bgcolor: "success.light",
|
|
1742
|
+
boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
|
|
1743
|
+
}
|
|
1744
|
+
}),
|
|
1745
|
+
onClick: () => {
|
|
1746
|
+
onConferenceCallStart(each, {});
|
|
1747
|
+
},
|
|
1748
|
+
disabled: (each == null ? void 0 : each.status) !== "IDLE",
|
|
1749
|
+
children: conferenceCallStart ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1750
|
+
import_material3.CircularProgress,
|
|
1751
|
+
{
|
|
1752
|
+
size: "20px",
|
|
1753
|
+
color: "success"
|
|
1754
|
+
}
|
|
1755
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1756
|
+
import_icons_material.Call,
|
|
1757
|
+
{
|
|
1758
|
+
sx: {
|
|
1759
|
+
color: (each == null ? void 0 : each.status) !== "IDLE" ? "default" : "#f3f2f2"
|
|
1760
|
+
}
|
|
1761
|
+
}
|
|
1762
|
+
)
|
|
1763
|
+
}
|
|
1764
|
+
) }),
|
|
1765
|
+
(each == null ? void 0 : each.line) !== 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "Merge Call", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1766
|
+
import_material3.Button,
|
|
1767
|
+
{
|
|
1768
|
+
variant: (each == null ? void 0 : each.status) === "ONCALL" ? "contained" : "outlined",
|
|
1769
|
+
sx: (each == null ? void 0 : each.status) === "ONCALL" ? __spreadValues({}, enabled) : __spreadValues({}, disabled),
|
|
1770
|
+
onClick: () => {
|
|
1771
|
+
onMergeConferenceCall(each, {
|
|
1772
|
+
isMergeCall: true
|
|
1773
|
+
});
|
|
1774
|
+
},
|
|
1775
|
+
disabled: (each == null ? void 0 : each.status) !== "ONCALL",
|
|
1776
|
+
children: conferenceCallMerge ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.CircularProgress, { size: "20px" }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.CallSplit, {})
|
|
1777
|
+
}
|
|
1778
|
+
) }),
|
|
1779
|
+
(each == null ? void 0 : each.line) !== 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: (each == null ? void 0 : each.status) !== "HOLD" ? "Hold" : "Un Hold", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1780
|
+
import_material3.Button,
|
|
1781
|
+
{
|
|
1782
|
+
variant: (each == null ? void 0 : each.status) === "HOLD" ? "contained" : "outlined",
|
|
1783
|
+
sx: (each == null ? void 0 : each.status) === "CONFERENCE" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
|
|
1784
|
+
onClick: () => {
|
|
1785
|
+
if (each.status === "HOLD") {
|
|
1786
|
+
onHoldOrUnHoldConferenceCall(each, { isHold: false }, "UNHOLDUSER");
|
|
1787
|
+
} else {
|
|
1788
|
+
onHoldOrUnHoldConferenceCall(each, { isHold: true }, "HOLDUSER");
|
|
1789
|
+
}
|
|
1790
|
+
},
|
|
1791
|
+
disabled: (each == null ? void 0 : each.status) !== "CONFERENCE" && (each == null ? void 0 : each.status) !== "HOLD" || // each?.status === "IDLE" ||
|
|
1792
|
+
// each?.status === "ONCALL" ||
|
|
1793
|
+
// each?.status === "DIALING" ||
|
|
1794
|
+
// each?.status === "RINGING" ||
|
|
1795
|
+
conferenceCallHoldOrUnHold,
|
|
1796
|
+
children: conferenceCallHoldOrUnHold ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1797
|
+
import_material3.CircularProgress,
|
|
1798
|
+
{
|
|
1799
|
+
size: "20px",
|
|
1800
|
+
sx: {
|
|
1801
|
+
color: theme.palette.primary.main
|
|
1802
|
+
}
|
|
1803
|
+
}
|
|
1804
|
+
) : each.status === "HOLD" ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.PlayArrow, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Pause, {})
|
|
1805
|
+
}
|
|
1806
|
+
) }),
|
|
1807
|
+
(each == null ? void 0 : each.line) !== 1 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "End Call", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1808
|
+
import_material3.Button,
|
|
1809
|
+
{
|
|
1810
|
+
variant: (each == null ? void 0 : each.status) !== "IDLE" && (each == null ? void 0 : each.status) !== "DISCONNECTED" ? "contained" : "outlined",
|
|
1811
|
+
color: "error",
|
|
1812
|
+
sx: (each == null ? void 0 : each.status) !== "IDLE" && (each == null ? void 0 : each.status) !== "DISCONNECTED" ? __spreadProps(__spreadValues({}, enabled), {
|
|
1813
|
+
border: `0px solid ${theme.palette.error.light}`,
|
|
1814
|
+
"&:hover": {
|
|
1815
|
+
bgcolor: "error.light",
|
|
1816
|
+
boxShadow: `0px 2px 1px ${theme.palette.error.light}`,
|
|
1817
|
+
border: `0px solid ${theme.palette.error.light}`
|
|
1818
|
+
},
|
|
1819
|
+
"&:active": {
|
|
1820
|
+
bgcolor: "error.light",
|
|
1821
|
+
boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
|
|
1822
|
+
}
|
|
1823
|
+
}) : __spreadValues({}, disabled),
|
|
1824
|
+
onClick: () => {
|
|
1825
|
+
onEndConferenceCall(each, {
|
|
1826
|
+
isCallStart: false,
|
|
1827
|
+
isMergeCall: false,
|
|
1828
|
+
isMute: false,
|
|
1829
|
+
isHold: false
|
|
1830
|
+
});
|
|
1831
|
+
},
|
|
1832
|
+
disabled: (each == null ? void 0 : each.status) === "IDLE" || (each == null ? void 0 : each.status) === "DISCONNECTED" || conferenceCallEnd,
|
|
1833
|
+
children: conferenceCallEnd ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1834
|
+
import_material3.CircularProgress,
|
|
1835
|
+
{
|
|
1836
|
+
size: "20px",
|
|
1837
|
+
color: "error"
|
|
1838
|
+
}
|
|
1839
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.CallEnd, {})
|
|
1840
|
+
}
|
|
1841
|
+
) })
|
|
1842
|
+
]
|
|
1843
|
+
}
|
|
1844
|
+
)
|
|
1845
|
+
}
|
|
1846
|
+
)
|
|
1847
|
+
]
|
|
1848
|
+
},
|
|
1849
|
+
each.line
|
|
1850
|
+
);
|
|
1851
|
+
};
|
|
1852
|
+
function ConferenceDialog() {
|
|
1853
|
+
var _a2;
|
|
1854
|
+
const state = useSDKState();
|
|
1855
|
+
const { showToast } = useToast();
|
|
1856
|
+
const [conferenceCallEndAll, setConferenceCallEndAll] = (0, import_react10.useState)(false);
|
|
1857
|
+
const handleClose = () => {
|
|
1858
|
+
sdkStateManager.setOpenConferenceDialog(false);
|
|
1859
|
+
};
|
|
1860
|
+
const onEndAllConferenceCalls = () => {
|
|
1861
|
+
var _a3, _b, _c, _d;
|
|
1862
|
+
setConferenceCallEndAll(true);
|
|
1863
|
+
const payload = {
|
|
1864
|
+
action: "EXTERNAL_CONFERENCE",
|
|
1865
|
+
operation: "ENDCONFERENCE",
|
|
1866
|
+
userid: (_b = (_a3 = state.callData) == null ? void 0 : _a3.agent_id) != null ? _b : "",
|
|
1867
|
+
process: (_d = (_c = state.callData) == null ? void 0 : _c.process_name) != null ? _d : ""
|
|
1868
|
+
};
|
|
1869
|
+
axios_default.post(END_POINT.CONFERENCE_CALL_END_ALL, payload).then((res) => {
|
|
1870
|
+
var _a4;
|
|
1871
|
+
showToast((_a4 = res.data) == null ? void 0 : _a4.message, "success");
|
|
1872
|
+
sdkStateManager.resetConferenceLines();
|
|
1873
|
+
handleClose();
|
|
1874
|
+
}).catch((err) => {
|
|
1875
|
+
var _a4, _b2, _c2, _d2;
|
|
1876
|
+
const message = ((_b2 = (_a4 = err.response) == null ? void 0 : _a4.data) == null ? void 0 : _b2.detail) || ((_d2 = (_c2 = err.response) == null ? void 0 : _c2.data) == null ? void 0 : _d2.message) || err.message || "An unknown error occurred";
|
|
1877
|
+
showToast(message, "error");
|
|
1878
|
+
}).finally(() => {
|
|
1879
|
+
setConferenceCallEndAll(false);
|
|
1880
|
+
});
|
|
1881
|
+
};
|
|
1882
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1883
|
+
import_material3.Dialog,
|
|
1884
|
+
{
|
|
1885
|
+
open: state.openConferenceDialog,
|
|
1886
|
+
"aria-labelledby": "alert-dialog-title",
|
|
1887
|
+
"aria-describedby": "alert-dialog-description",
|
|
1888
|
+
maxWidth: "md",
|
|
1889
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
|
|
1890
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
1891
|
+
import_material3.Box,
|
|
1892
|
+
{
|
|
1893
|
+
sx: {
|
|
1894
|
+
display: "flex",
|
|
1895
|
+
justifyContent: "space-between",
|
|
1896
|
+
alignItems: "center",
|
|
1897
|
+
padding: "10px 16px"
|
|
1898
|
+
},
|
|
1899
|
+
children: [
|
|
1900
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Typography, { variant: "body1", children: [
|
|
1901
|
+
(_a2 = state == null ? void 0 : state.agentId) != null ? _a2 : "",
|
|
1902
|
+
" conference"
|
|
1903
|
+
] }),
|
|
1904
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
|
|
1905
|
+
]
|
|
1906
|
+
}
|
|
1907
|
+
),
|
|
1908
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1909
|
+
import_material3.Box,
|
|
1910
|
+
{
|
|
1911
|
+
sx: {
|
|
1912
|
+
boxShadow: "1px 1px 2px #e7e5e5ff",
|
|
1913
|
+
margin: "0px 15px",
|
|
1914
|
+
borderRadius: "20px"
|
|
1915
|
+
},
|
|
1916
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1917
|
+
import_material3.TableContainer,
|
|
1918
|
+
{
|
|
1919
|
+
component: import_material3.Paper,
|
|
1920
|
+
sx: {
|
|
1921
|
+
outline: "0px solid gray !important",
|
|
1922
|
+
boxShadow: "1px 1px 6px #e7e5e5ff"
|
|
1923
|
+
},
|
|
1924
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
1925
|
+
import_material3.Table,
|
|
1926
|
+
{
|
|
1927
|
+
sx: {
|
|
1928
|
+
border: "4px solid #ffffff !important"
|
|
1929
|
+
},
|
|
1930
|
+
children: [
|
|
1931
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
1932
|
+
import_material3.TableRow,
|
|
1933
|
+
{
|
|
1934
|
+
sx: {
|
|
1935
|
+
border: "2px solid #f3f3f3ff !important"
|
|
1936
|
+
},
|
|
1937
|
+
children: [
|
|
1938
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1939
|
+
import_material3.TableCell,
|
|
1940
|
+
{
|
|
1941
|
+
sx: {
|
|
1942
|
+
padding: "6px"
|
|
1943
|
+
},
|
|
1944
|
+
children: "Line"
|
|
1945
|
+
}
|
|
1946
|
+
),
|
|
1947
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1948
|
+
import_material3.TableCell,
|
|
1949
|
+
{
|
|
1950
|
+
sx: {
|
|
1951
|
+
padding: "6px"
|
|
1952
|
+
},
|
|
1953
|
+
children: "Status"
|
|
1954
|
+
}
|
|
1955
|
+
),
|
|
1956
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1957
|
+
import_material3.TableCell,
|
|
1958
|
+
{
|
|
1959
|
+
sx: {
|
|
1960
|
+
padding: "6px"
|
|
1961
|
+
},
|
|
1962
|
+
children: "Mobile Number"
|
|
1963
|
+
}
|
|
1964
|
+
),
|
|
1965
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1966
|
+
import_material3.TableCell,
|
|
1967
|
+
{
|
|
1968
|
+
sx: {
|
|
1969
|
+
padding: "6px"
|
|
1970
|
+
},
|
|
1971
|
+
children: "Call Actions"
|
|
1972
|
+
}
|
|
1973
|
+
)
|
|
1974
|
+
]
|
|
1975
|
+
}
|
|
1976
|
+
) }),
|
|
1977
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.TableBody, { children: state == null ? void 0 : state.conferenceLine.map((each) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ConferenceTableRow, { each })) })
|
|
1978
|
+
]
|
|
1979
|
+
}
|
|
1980
|
+
)
|
|
1981
|
+
}
|
|
1982
|
+
)
|
|
1983
|
+
}
|
|
1984
|
+
),
|
|
1985
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
1986
|
+
import_material3.Box,
|
|
1987
|
+
{
|
|
1988
|
+
textAlign: "center",
|
|
1989
|
+
m: 2,
|
|
1990
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
1991
|
+
import_material3.Button,
|
|
1992
|
+
{
|
|
1993
|
+
variant: "outlined",
|
|
1994
|
+
color: "error",
|
|
1995
|
+
size: "large",
|
|
1996
|
+
onClick: onEndAllConferenceCalls,
|
|
1997
|
+
disabled: conferenceCallEndAll,
|
|
1998
|
+
sx: { px: 2, borderRadius: "20px", textTransform: "capitalize" },
|
|
1999
|
+
children: [
|
|
2000
|
+
conferenceCallEndAll ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2001
|
+
import_material3.CircularProgress,
|
|
2002
|
+
{
|
|
2003
|
+
size: "20px",
|
|
2004
|
+
color: "error",
|
|
2005
|
+
sx: {
|
|
2006
|
+
marginRight: "8px"
|
|
2007
|
+
}
|
|
2008
|
+
}
|
|
2009
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2010
|
+
import_material3.IconButton,
|
|
2011
|
+
{
|
|
2012
|
+
sx: {
|
|
2013
|
+
bgcolor: "error.main",
|
|
2014
|
+
"&:hover": { bgcolor: "error.dark" },
|
|
2015
|
+
marginRight: "8px",
|
|
2016
|
+
width: "28px",
|
|
2017
|
+
height: "28px",
|
|
2018
|
+
fontSize: "12px",
|
|
2019
|
+
fontWeight: "600",
|
|
2020
|
+
lineHeight: "16px",
|
|
2021
|
+
letterSpacing: "0.02em",
|
|
2022
|
+
textTransform: "capitalize",
|
|
2023
|
+
color: "white",
|
|
2024
|
+
display: "flex",
|
|
2025
|
+
alignItems: "center",
|
|
2026
|
+
justifyContent: "center",
|
|
2027
|
+
borderRadius: "50%"
|
|
2028
|
+
},
|
|
2029
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2030
|
+
import_icons_material.PhoneDisabled,
|
|
2031
|
+
{
|
|
2032
|
+
sx: {
|
|
2033
|
+
color: "white",
|
|
2034
|
+
fontSize: "16px",
|
|
2035
|
+
fontWeight: "600"
|
|
2036
|
+
}
|
|
2037
|
+
}
|
|
2038
|
+
)
|
|
2039
|
+
}
|
|
2040
|
+
),
|
|
2041
|
+
"End Conference"
|
|
2042
|
+
]
|
|
2043
|
+
}
|
|
2044
|
+
)
|
|
2045
|
+
}
|
|
2046
|
+
)
|
|
2047
|
+
] })
|
|
2048
|
+
}
|
|
2049
|
+
) });
|
|
2050
|
+
}
|
|
2051
|
+
function CallTransferDialog({ open }) {
|
|
2052
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
|
|
2053
|
+
const state = useSDKState();
|
|
2054
|
+
const [transferCall] = usePostRequest({
|
|
2055
|
+
onSuccess: () => {
|
|
2056
|
+
sdkStateManager.setOpenCallTransferDialog(false);
|
|
2057
|
+
}
|
|
2058
|
+
});
|
|
2059
|
+
const [currentselecteTab, setCurrentselecteTab] = (0, import_react10.useState)("process");
|
|
2060
|
+
const [getIdelAgentsList, { data: idleAgentsList, isLoading: isIdleAgentsListLoading }] = usePostRequest({
|
|
2061
|
+
disabledSuccessToast: true
|
|
2062
|
+
});
|
|
2063
|
+
const [
|
|
2064
|
+
getProcessAndQueuesList,
|
|
2065
|
+
{ data: processAndQueuesList, isLoading: isProcessAndQueuesListLoading }
|
|
2066
|
+
] = usePostRequest({
|
|
2067
|
+
disabledSuccessToast: true
|
|
2068
|
+
});
|
|
2069
|
+
const handleClose = () => {
|
|
2070
|
+
sdkStateManager.setOpenCallTransferDialog(false);
|
|
2071
|
+
};
|
|
2072
|
+
const handleTransferCall = (data, type) => {
|
|
2073
|
+
var _a3, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G;
|
|
2074
|
+
if (type === "PROCESS") {
|
|
2075
|
+
const payload = {
|
|
2076
|
+
mobile_number: (_b2 = (_a3 = state.callData) == null ? void 0 : _a3.phone_number) != null ? _b2 : "",
|
|
2077
|
+
userid: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.agent_id) != null ? _d2 : "",
|
|
2078
|
+
type: "PROCESS",
|
|
2079
|
+
transfer_to: (_e2 = data == null ? void 0 : data.process_name) != null ? _e2 : "",
|
|
2080
|
+
callreferenceid: (_g2 = (_f2 = state.callData) == null ? void 0 : _f2.convox_id) != null ? _g2 : "",
|
|
2081
|
+
processid: String((_i2 = (_h2 = state.callData) == null ? void 0 : _h2.process_id) != null ? _i2 : ""),
|
|
2082
|
+
process_name: (_k2 = (_j2 = state.callData) == null ? void 0 : _j2.process_name) != null ? _k2 : ""
|
|
2083
|
+
};
|
|
2084
|
+
transferCall(END_POINT.TRANSFER_CALL, payload);
|
|
2085
|
+
} else if (type === "QUEUE") {
|
|
2086
|
+
const payload = {
|
|
2087
|
+
mobile_number: (_m = (_l2 = state.callData) == null ? void 0 : _l2.phone_number) != null ? _m : "",
|
|
2088
|
+
userid: (_o = (_n = state.callData) == null ? void 0 : _n.agent_id) != null ? _o : "",
|
|
2089
|
+
type: "QUEUE",
|
|
2090
|
+
transfer_to: (_p = data == null ? void 0 : data.queue_name) != null ? _p : "",
|
|
2091
|
+
callreferenceid: (_r = (_q = state.callData) == null ? void 0 : _q.convox_id) != null ? _r : "",
|
|
2092
|
+
processid: String((_t = (_s = state.callData) == null ? void 0 : _s.process_id) != null ? _t : ""),
|
|
2093
|
+
process_name: (_v = (_u = state.callData) == null ? void 0 : _u.process_name) != null ? _v : ""
|
|
2094
|
+
};
|
|
2095
|
+
transferCall(END_POINT.TRANSFER_CALL, payload);
|
|
2096
|
+
} else if (type === "AGENT") {
|
|
2097
|
+
const payload = {
|
|
2098
|
+
mobile_number: (_x = (_w = state.callData) == null ? void 0 : _w.phone_number) != null ? _x : "",
|
|
2099
|
+
userid: (_z = (_y = state.callData) == null ? void 0 : _y.agent_id) != null ? _z : "",
|
|
2100
|
+
type: "AGENT",
|
|
2101
|
+
transfer_to: (_A = data == null ? void 0 : data.user_id) != null ? _A : "",
|
|
2102
|
+
callreferenceid: (_C = (_B = state.callData) == null ? void 0 : _B.convox_id) != null ? _C : "",
|
|
2103
|
+
processid: String((_E = (_D = state.callData) == null ? void 0 : _D.process_id) != null ? _E : ""),
|
|
2104
|
+
process_name: (_G = (_F = state.callData) == null ? void 0 : _F.process_name) != null ? _G : ""
|
|
2105
|
+
};
|
|
2106
|
+
transferCall(END_POINT.TRANSFER_CALL, payload);
|
|
2107
|
+
}
|
|
2108
|
+
};
|
|
2109
|
+
(0, import_react10.useEffect)(() => {
|
|
2110
|
+
getIdelAgentsList(END_POINT.AGENTS_LIST, {
|
|
2111
|
+
status: "IDLE",
|
|
2112
|
+
active: true
|
|
2113
|
+
});
|
|
2114
|
+
getProcessAndQueuesList(END_POINT.TRANSFER_TO_DETAILS, {
|
|
2115
|
+
status: "ACTIVE",
|
|
2116
|
+
active: true
|
|
2117
|
+
});
|
|
2118
|
+
}, []);
|
|
2119
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2120
|
+
import_material3.Dialog,
|
|
2121
|
+
{
|
|
2122
|
+
open,
|
|
2123
|
+
"aria-labelledby": "alert-dialog-title",
|
|
2124
|
+
"aria-describedby": "alert-dialog-description",
|
|
2125
|
+
fullWidth: true,
|
|
2126
|
+
maxWidth: "md",
|
|
2127
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
|
|
2128
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2129
|
+
import_material3.Box,
|
|
2130
|
+
{
|
|
2131
|
+
sx: {
|
|
2132
|
+
display: "flex",
|
|
2133
|
+
justifyContent: "space-between",
|
|
2134
|
+
alignItems: "center",
|
|
2135
|
+
padding: "4px 16px",
|
|
2136
|
+
boxShadow: "0px 1px 2px #f5f5f5ff"
|
|
2137
|
+
},
|
|
2138
|
+
children: [
|
|
2139
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Call Transfer" }),
|
|
2140
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
|
|
2141
|
+
]
|
|
2142
|
+
}
|
|
2143
|
+
),
|
|
2144
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2145
|
+
import_material3.Box,
|
|
2146
|
+
{
|
|
2147
|
+
sx: {
|
|
2148
|
+
boxShadow: "1px 1px 4px #d3d3d3ff",
|
|
2149
|
+
padding: "6px 10px",
|
|
2150
|
+
margin: "10px",
|
|
2151
|
+
borderRadius: "10px"
|
|
2152
|
+
},
|
|
2153
|
+
children: [
|
|
2154
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Box, { sx: { display: "flex", gap: 1 }, children: [
|
|
2155
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2156
|
+
import_material3.Button,
|
|
2157
|
+
{
|
|
2158
|
+
variant: currentselecteTab === "process" ? "contained" : "outlined",
|
|
2159
|
+
onClick: () => {
|
|
2160
|
+
setCurrentselecteTab("process");
|
|
2161
|
+
getProcessAndQueuesList(END_POINT.TRANSFER_TO_DETAILS, {
|
|
2162
|
+
status: "ACTIVE",
|
|
2163
|
+
active: true
|
|
2164
|
+
});
|
|
2165
|
+
},
|
|
2166
|
+
children: "Process"
|
|
2167
|
+
}
|
|
2168
|
+
),
|
|
2169
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2170
|
+
import_material3.Button,
|
|
2171
|
+
{
|
|
2172
|
+
variant: currentselecteTab === "queues" ? "contained" : "outlined",
|
|
2173
|
+
onClick: () => {
|
|
2174
|
+
setCurrentselecteTab("queues");
|
|
2175
|
+
getProcessAndQueuesList(END_POINT.TRANSFER_TO_DETAILS, {
|
|
2176
|
+
status: "ACTIVE",
|
|
2177
|
+
active: true
|
|
2178
|
+
});
|
|
2179
|
+
},
|
|
2180
|
+
children: "Queues"
|
|
2181
|
+
}
|
|
2182
|
+
),
|
|
2183
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2184
|
+
import_material3.Button,
|
|
2185
|
+
{
|
|
2186
|
+
variant: currentselecteTab === "agents" ? "contained" : "outlined",
|
|
2187
|
+
onClick: () => {
|
|
2188
|
+
setCurrentselecteTab("agents");
|
|
2189
|
+
getIdelAgentsList(END_POINT.AGENTS_LIST, {
|
|
2190
|
+
status: "IDLE",
|
|
2191
|
+
active: true
|
|
2192
|
+
});
|
|
2193
|
+
},
|
|
2194
|
+
children: "Agents"
|
|
2195
|
+
}
|
|
2196
|
+
)
|
|
2197
|
+
] }),
|
|
2198
|
+
(isProcessAndQueuesListLoading || isIdleAgentsListLoading) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2199
|
+
import_material3.Box,
|
|
2200
|
+
{
|
|
2201
|
+
sx: {
|
|
2202
|
+
display: "flex",
|
|
2203
|
+
justifyContent: "center",
|
|
2204
|
+
alignItems: "center",
|
|
2205
|
+
height: "80px"
|
|
2206
|
+
},
|
|
2207
|
+
children: [
|
|
2208
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.CircularProgress, {}),
|
|
2209
|
+
" "
|
|
2210
|
+
]
|
|
2211
|
+
}
|
|
2212
|
+
),
|
|
2213
|
+
!isProcessAndQueuesListLoading && !isIdleAgentsListLoading && currentselecteTab === "process" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1, flexWrap: "wrap" }, children: ((_a2 = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _a2.process) && ((_c = (_b = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _b.process) == null ? void 0 : _c.length) > 0 ? (_e = (_d = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _d.process) == null ? void 0 : _e.map((process, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2214
|
+
import_material3.Box,
|
|
2215
|
+
{
|
|
2216
|
+
sx: {
|
|
2217
|
+
p: 1,
|
|
2218
|
+
display: "flex",
|
|
2219
|
+
alignItems: "center",
|
|
2220
|
+
boxShadow: "1px 1px 4px #d3d3d3ff",
|
|
2221
|
+
padding: "6px",
|
|
2222
|
+
borderRadius: "10px",
|
|
2223
|
+
"&:hover": { bgcolor: "action.selected" }
|
|
2224
|
+
},
|
|
2225
|
+
children: [
|
|
2226
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2227
|
+
import_material3.Typography,
|
|
2228
|
+
{
|
|
2229
|
+
variant: "body1",
|
|
2230
|
+
sx: {
|
|
2231
|
+
mx: 1,
|
|
2232
|
+
width: "200px",
|
|
2233
|
+
maxWidth: "250px",
|
|
2234
|
+
display: "flex",
|
|
2235
|
+
alignItems: "center"
|
|
2236
|
+
},
|
|
2237
|
+
children: [
|
|
2238
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
|
|
2239
|
+
process.process_name
|
|
2240
|
+
]
|
|
2241
|
+
}
|
|
2242
|
+
),
|
|
2243
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2244
|
+
import_material3.IconButton,
|
|
2245
|
+
{
|
|
2246
|
+
color: "success",
|
|
2247
|
+
sx: {
|
|
2248
|
+
bgcolor: "action.hover",
|
|
2249
|
+
"&:hover": { bgcolor: "action.selected" }
|
|
2250
|
+
},
|
|
2251
|
+
onClick: () => {
|
|
2252
|
+
handleTransferCall(process, "PROCESS");
|
|
2253
|
+
},
|
|
2254
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
|
|
2255
|
+
}
|
|
2256
|
+
)
|
|
2257
|
+
]
|
|
2258
|
+
},
|
|
2259
|
+
index
|
|
2260
|
+
)) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2261
|
+
import_material3.Typography,
|
|
2262
|
+
{
|
|
2263
|
+
variant: "body1",
|
|
2264
|
+
sx: {
|
|
2265
|
+
fontSize: "16px",
|
|
2266
|
+
letterSpacing: "0.02em",
|
|
2267
|
+
textTransform: "capitalize",
|
|
2268
|
+
display: "flex",
|
|
2269
|
+
alignItems: "center",
|
|
2270
|
+
justifyContent: "center",
|
|
2271
|
+
width: "100%",
|
|
2272
|
+
margin: "10px 0px",
|
|
2273
|
+
color: "gray",
|
|
2274
|
+
height: "60px"
|
|
2275
|
+
},
|
|
2276
|
+
children: "No Process Found"
|
|
2277
|
+
}
|
|
2278
|
+
) }),
|
|
2279
|
+
!isProcessAndQueuesListLoading && !isIdleAgentsListLoading && currentselecteTab === "queues" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1, flexWrap: "wrap" }, children: ((_f = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _f.queue) && ((_h = (_g = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _g.queue) == null ? void 0 : _h.length) > 0 ? (_j = (_i = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _i.queue) == null ? void 0 : _j.map((queue, index) => {
|
|
2280
|
+
var _a3, _b2, _c2, _d2, _e2, _f2;
|
|
2281
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2282
|
+
import_material3.Box,
|
|
2283
|
+
{
|
|
2284
|
+
sx: {
|
|
2285
|
+
p: 1,
|
|
2286
|
+
display: "flex",
|
|
2287
|
+
alignItems: "center",
|
|
2288
|
+
boxShadow: "1px 1px 4px #d3d3d3ff",
|
|
2289
|
+
padding: "6px",
|
|
2290
|
+
borderRadius: "10px",
|
|
2291
|
+
"&:hover": { bgcolor: "action.selected" }
|
|
2292
|
+
},
|
|
2293
|
+
children: [
|
|
2294
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2295
|
+
import_material3.Typography,
|
|
2296
|
+
{
|
|
2297
|
+
variant: "body1",
|
|
2298
|
+
sx: {
|
|
2299
|
+
mx: 1,
|
|
2300
|
+
width: "200px",
|
|
2301
|
+
maxWidth: "250px",
|
|
2302
|
+
display: "flex",
|
|
2303
|
+
alignItems: "center"
|
|
2304
|
+
},
|
|
2305
|
+
children: [
|
|
2306
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
|
|
2307
|
+
queue.queue_name,
|
|
2308
|
+
((_c2 = (_b2 = (_a3 = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _a3.process) == null ? void 0 : _b2.find(
|
|
2309
|
+
(process) => process.process_id === queue.process_id
|
|
2310
|
+
)) == null ? void 0 : _c2.process_name) ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2311
|
+
import_material3.Typography,
|
|
2312
|
+
{
|
|
2313
|
+
variant: "body1",
|
|
2314
|
+
sx: {
|
|
2315
|
+
fontSize: "12px",
|
|
2316
|
+
fontWeight: "600",
|
|
2317
|
+
letterSpacing: "0.02em",
|
|
2318
|
+
textTransform: "capitalize",
|
|
2319
|
+
color: "gray"
|
|
2320
|
+
},
|
|
2321
|
+
children: "(" + ((_f2 = (_e2 = (_d2 = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _d2.process) == null ? void 0 : _e2.find(
|
|
2322
|
+
(process) => process.process_id === queue.process_id
|
|
2323
|
+
)) == null ? void 0 : _f2.process_name) + ")"
|
|
2324
|
+
}
|
|
2325
|
+
) : ""
|
|
2326
|
+
]
|
|
2327
|
+
}
|
|
2328
|
+
),
|
|
2329
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2330
|
+
import_material3.IconButton,
|
|
2331
|
+
{
|
|
2332
|
+
color: "success",
|
|
2333
|
+
sx: {
|
|
2334
|
+
bgcolor: "action.hover",
|
|
2335
|
+
"&:hover": { bgcolor: "action.selected" }
|
|
2336
|
+
},
|
|
2337
|
+
onClick: () => {
|
|
2338
|
+
handleTransferCall(queue, "QUEUE");
|
|
2339
|
+
},
|
|
2340
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
|
|
2341
|
+
}
|
|
2342
|
+
)
|
|
2343
|
+
]
|
|
2344
|
+
},
|
|
2345
|
+
index
|
|
2346
|
+
);
|
|
2347
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2348
|
+
import_material3.Typography,
|
|
2349
|
+
{
|
|
2350
|
+
variant: "body1",
|
|
2351
|
+
sx: {
|
|
2352
|
+
fontSize: "16px",
|
|
2353
|
+
letterSpacing: "0.02em",
|
|
2354
|
+
textTransform: "capitalize",
|
|
2355
|
+
display: "flex",
|
|
2356
|
+
alignItems: "center",
|
|
2357
|
+
justifyContent: "center",
|
|
2358
|
+
width: "100%",
|
|
2359
|
+
margin: "10px 0px",
|
|
2360
|
+
color: "gray",
|
|
2361
|
+
height: "60px"
|
|
2362
|
+
},
|
|
2363
|
+
children: "No Queues Found"
|
|
2364
|
+
}
|
|
2365
|
+
) }),
|
|
2366
|
+
!isProcessAndQueuesListLoading && !isIdleAgentsListLoading && currentselecteTab === "agents" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1, flexWrap: "wrap" }, children: (idleAgentsList == null ? void 0 : idleAgentsList.data) && ((_k = idleAgentsList == null ? void 0 : idleAgentsList.data) == null ? void 0 : _k.length) > 0 ? (_l = idleAgentsList == null ? void 0 : idleAgentsList.data) == null ? void 0 : _l.map((agent, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2367
|
+
import_material3.Box,
|
|
2368
|
+
{
|
|
2369
|
+
sx: {
|
|
2370
|
+
p: 1,
|
|
2371
|
+
display: "flex",
|
|
2372
|
+
alignItems: "center",
|
|
2373
|
+
boxShadow: "1px 1px 4px #d3d3d3ff",
|
|
2374
|
+
padding: "6px",
|
|
2375
|
+
borderRadius: "10px",
|
|
2376
|
+
"&:hover": { bgcolor: "action.selected" }
|
|
2377
|
+
},
|
|
2378
|
+
children: [
|
|
2379
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2380
|
+
import_material3.Typography,
|
|
2381
|
+
{
|
|
2382
|
+
variant: "body1",
|
|
2383
|
+
sx: {
|
|
2384
|
+
mx: 1,
|
|
2385
|
+
width: "200px",
|
|
2386
|
+
maxWidth: "250px",
|
|
2387
|
+
display: "flex",
|
|
2388
|
+
alignItems: "center"
|
|
2389
|
+
},
|
|
2390
|
+
children: [
|
|
2391
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
|
|
2392
|
+
agent.name
|
|
2393
|
+
]
|
|
2394
|
+
}
|
|
2395
|
+
),
|
|
2396
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2397
|
+
import_material3.IconButton,
|
|
2398
|
+
{
|
|
2399
|
+
color: "success",
|
|
2400
|
+
sx: {
|
|
2401
|
+
bgcolor: "action.hover",
|
|
2402
|
+
"&:hover": { bgcolor: "action.selected" }
|
|
2403
|
+
},
|
|
2404
|
+
onClick: () => {
|
|
2405
|
+
handleTransferCall(agent, "AGENT");
|
|
2406
|
+
},
|
|
2407
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
|
|
2408
|
+
}
|
|
2409
|
+
)
|
|
2410
|
+
]
|
|
2411
|
+
},
|
|
2412
|
+
index
|
|
2413
|
+
)) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2414
|
+
import_material3.Typography,
|
|
2415
|
+
{
|
|
2416
|
+
variant: "body1",
|
|
2417
|
+
sx: {
|
|
2418
|
+
fontSize: "16px",
|
|
2419
|
+
letterSpacing: "0.02em",
|
|
2420
|
+
textTransform: "capitalize",
|
|
2421
|
+
display: "flex",
|
|
2422
|
+
alignItems: "center",
|
|
2423
|
+
justifyContent: "center",
|
|
2424
|
+
width: "100%",
|
|
2425
|
+
margin: "10px 0px",
|
|
2426
|
+
color: "gray",
|
|
2427
|
+
height: "60px"
|
|
2428
|
+
},
|
|
2429
|
+
children: "No Agents Found"
|
|
2430
|
+
}
|
|
2431
|
+
) })
|
|
2432
|
+
]
|
|
2433
|
+
}
|
|
2434
|
+
)
|
|
2435
|
+
] })
|
|
2436
|
+
}
|
|
2437
|
+
) });
|
|
2438
|
+
}
|
|
2439
|
+
function EndCallDispositionDialog({ open, setOpen, onSubmitDisposition }) {
|
|
2440
|
+
var _a2, _b, _c, _d;
|
|
2441
|
+
const [formData, setFormData] = (0, import_react10.useState)({
|
|
2442
|
+
disposition: { label: "Resolved", value: "RES" },
|
|
2443
|
+
followUp: { label: "No", value: "N" },
|
|
2444
|
+
callbackDate: "",
|
|
2445
|
+
callbackHrs: "",
|
|
2446
|
+
callbackMins: ""
|
|
2447
|
+
});
|
|
2448
|
+
const dispositionOptions = [
|
|
2449
|
+
{ label: "Not Interested", value: "NI" },
|
|
2450
|
+
{ label: "Resolved", value: "RES" }
|
|
2451
|
+
];
|
|
2452
|
+
const followUpOptions = [
|
|
2453
|
+
{ label: "Yes", value: "Y" },
|
|
2454
|
+
{ label: "No", value: "N" }
|
|
2455
|
+
];
|
|
2456
|
+
const handleChange = (field, value) => {
|
|
2457
|
+
setFormData((prev) => __spreadProps(__spreadValues({}, prev), { [field]: value }));
|
|
2458
|
+
};
|
|
2459
|
+
const handleReset = () => {
|
|
2460
|
+
setFormData({
|
|
2461
|
+
disposition: { label: "Resolved", value: "RES" },
|
|
2462
|
+
followUp: { label: "No", value: "N" },
|
|
2463
|
+
callbackDate: "",
|
|
2464
|
+
callbackHrs: "",
|
|
2465
|
+
callbackMins: ""
|
|
2466
|
+
});
|
|
2467
|
+
};
|
|
2468
|
+
const handleClose = () => {
|
|
2469
|
+
handleReset();
|
|
2470
|
+
setOpen(false);
|
|
2471
|
+
};
|
|
2472
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2473
|
+
import_material3.Dialog,
|
|
2474
|
+
{
|
|
2475
|
+
open,
|
|
2476
|
+
"aria-labelledby": "alert-dialog-title",
|
|
2477
|
+
"aria-describedby": "alert-dialog-description",
|
|
2478
|
+
fullWidth: true,
|
|
2479
|
+
maxWidth: "xs",
|
|
2480
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
|
|
2481
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2482
|
+
import_material3.Box,
|
|
2483
|
+
{
|
|
2484
|
+
sx: {
|
|
2485
|
+
display: "flex",
|
|
2486
|
+
justifyContent: "center",
|
|
2487
|
+
alignItems: "center",
|
|
2488
|
+
padding: "4px 16px",
|
|
2489
|
+
boxShadow: "0px 1px 2px #f5f5f5ff"
|
|
2490
|
+
},
|
|
2491
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2492
|
+
import_material3.Typography,
|
|
2493
|
+
{
|
|
2494
|
+
variant: "body1",
|
|
2495
|
+
m: 1,
|
|
2496
|
+
children: [
|
|
2497
|
+
" ",
|
|
2498
|
+
"Call Disposition"
|
|
2499
|
+
]
|
|
2500
|
+
}
|
|
2501
|
+
)
|
|
2502
|
+
}
|
|
2503
|
+
),
|
|
2504
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2505
|
+
import_material3.Box,
|
|
2506
|
+
{
|
|
2507
|
+
sx: {
|
|
2508
|
+
boxShadow: "1px 1px 4px #d3d3d3ff",
|
|
2509
|
+
padding: "10px",
|
|
2510
|
+
margin: "10px",
|
|
2511
|
+
borderRadius: "10px"
|
|
2512
|
+
},
|
|
2513
|
+
children: [
|
|
2514
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2515
|
+
import_material3.Box,
|
|
2516
|
+
{
|
|
2517
|
+
display: "flex",
|
|
2518
|
+
gap: 2,
|
|
2519
|
+
children: [
|
|
2520
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2521
|
+
import_material3.Autocomplete,
|
|
2522
|
+
{
|
|
2523
|
+
value: formData.disposition,
|
|
2524
|
+
options: dispositionOptions,
|
|
2525
|
+
getOptionLabel: (opt) => opt.label,
|
|
2526
|
+
onChange: (_, val) => handleChange("disposition", val),
|
|
2527
|
+
size: "small",
|
|
2528
|
+
renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2529
|
+
import_material3.TextField,
|
|
2530
|
+
__spreadProps(__spreadValues({}, params), {
|
|
2531
|
+
label: "Disposition",
|
|
2532
|
+
fullWidth: true
|
|
2533
|
+
})
|
|
2534
|
+
),
|
|
2535
|
+
sx: { flex: 1 }
|
|
2536
|
+
}
|
|
2537
|
+
),
|
|
2538
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2539
|
+
import_material3.Autocomplete,
|
|
2540
|
+
{
|
|
2541
|
+
options: followUpOptions,
|
|
2542
|
+
getOptionLabel: (opt) => opt.label,
|
|
2543
|
+
value: formData.followUp,
|
|
2544
|
+
onChange: (_, val) => handleChange("followUp", val),
|
|
2545
|
+
size: "small",
|
|
2546
|
+
renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2547
|
+
import_material3.TextField,
|
|
2548
|
+
__spreadProps(__spreadValues({}, params), {
|
|
2549
|
+
label: "Follow Up",
|
|
2550
|
+
fullWidth: true
|
|
2551
|
+
})
|
|
2552
|
+
),
|
|
2553
|
+
sx: { flex: 1 }
|
|
2554
|
+
}
|
|
2555
|
+
)
|
|
2556
|
+
]
|
|
2557
|
+
}
|
|
2558
|
+
),
|
|
2559
|
+
((_b = (_a2 = formData == null ? void 0 : formData.followUp) == null ? void 0 : _a2.label) == null ? void 0 : _b.toLowerCase()) === "yes" && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2560
|
+
import_material3.Box,
|
|
2561
|
+
{
|
|
2562
|
+
display: "flex",
|
|
2563
|
+
gap: 2,
|
|
2564
|
+
mt: 2,
|
|
2565
|
+
children: [
|
|
2566
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2567
|
+
import_material3.TextField,
|
|
2568
|
+
{
|
|
2569
|
+
size: "small",
|
|
2570
|
+
label: "Callback Date",
|
|
2571
|
+
type: "date",
|
|
2572
|
+
slotProps: {
|
|
2573
|
+
inputLabel: { shrink: true }
|
|
2574
|
+
},
|
|
2575
|
+
value: formData.callbackDate,
|
|
2576
|
+
onChange: (e) => handleChange("callbackDate", e.target.value),
|
|
2577
|
+
fullWidth: true,
|
|
2578
|
+
sx: { flex: 1 }
|
|
2579
|
+
}
|
|
2580
|
+
),
|
|
2581
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2582
|
+
import_material3.TextField,
|
|
2583
|
+
{
|
|
2584
|
+
size: "small",
|
|
2585
|
+
label: "Hours (0-23)",
|
|
2586
|
+
type: "text",
|
|
2587
|
+
value: formData.callbackHrs,
|
|
2588
|
+
onChange: (e) => handleChange("callbackHrs", e.target.value),
|
|
2589
|
+
fullWidth: true,
|
|
2590
|
+
sx: { flex: 1 }
|
|
2591
|
+
}
|
|
2592
|
+
)
|
|
2593
|
+
]
|
|
2594
|
+
}
|
|
2595
|
+
),
|
|
2596
|
+
((_d = (_c = formData == null ? void 0 : formData.followUp) == null ? void 0 : _c.label) == null ? void 0 : _d.toLowerCase()) === "yes" && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2597
|
+
import_material3.Box,
|
|
2598
|
+
{
|
|
2599
|
+
display: "flex",
|
|
2600
|
+
gap: 2,
|
|
2601
|
+
mt: 2,
|
|
2602
|
+
children: [
|
|
2603
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2604
|
+
import_material3.TextField,
|
|
2605
|
+
{
|
|
2606
|
+
size: "small",
|
|
2607
|
+
label: "Minutes (0-59)",
|
|
2608
|
+
type: "text",
|
|
2609
|
+
value: formData.callbackMins,
|
|
2610
|
+
onChange: (e) => handleChange("callbackMins", e.target.value),
|
|
2611
|
+
fullWidth: true,
|
|
2612
|
+
sx: { flex: 1 }
|
|
2613
|
+
}
|
|
2614
|
+
),
|
|
2615
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { flex: 1 } })
|
|
2616
|
+
]
|
|
2617
|
+
}
|
|
2618
|
+
)
|
|
2619
|
+
]
|
|
2620
|
+
}
|
|
2621
|
+
),
|
|
2622
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2623
|
+
import_material3.Box,
|
|
2624
|
+
{
|
|
2625
|
+
textAlign: "right",
|
|
2626
|
+
m: 2,
|
|
2627
|
+
children: [
|
|
2628
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2629
|
+
import_material3.Button,
|
|
2630
|
+
{
|
|
2631
|
+
variant: "outlined",
|
|
2632
|
+
color: "error",
|
|
2633
|
+
size: "large",
|
|
2634
|
+
onClick: handleClose,
|
|
2635
|
+
sx: {
|
|
2636
|
+
px: 2,
|
|
2637
|
+
mx: 1,
|
|
2638
|
+
borderRadius: "10px",
|
|
2639
|
+
textTransform: "capitalize"
|
|
2640
|
+
},
|
|
2641
|
+
children: "cancel"
|
|
2642
|
+
}
|
|
2643
|
+
),
|
|
2644
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2645
|
+
import_material3.Button,
|
|
2646
|
+
{
|
|
2647
|
+
variant: "contained",
|
|
2648
|
+
color: "primary",
|
|
2649
|
+
size: "large",
|
|
2650
|
+
onClick: () => onSubmitDisposition(formData),
|
|
2651
|
+
sx: { px: 2, borderRadius: "10px", textTransform: "capitalize" },
|
|
2652
|
+
children: "Submit"
|
|
2653
|
+
}
|
|
2654
|
+
)
|
|
2655
|
+
]
|
|
2656
|
+
}
|
|
2657
|
+
)
|
|
2658
|
+
] })
|
|
2659
|
+
}
|
|
2660
|
+
) });
|
|
2661
|
+
}
|
|
2662
|
+
function ProcessorListDialog({
|
|
2663
|
+
open,
|
|
2664
|
+
setOpen,
|
|
2665
|
+
processList = null,
|
|
2666
|
+
handleSelectedProcessor
|
|
2667
|
+
}) {
|
|
2668
|
+
const handleClose = () => {
|
|
2669
|
+
setOpen(false);
|
|
2670
|
+
};
|
|
2671
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2672
|
+
import_material3.Dialog,
|
|
2673
|
+
{
|
|
2674
|
+
open,
|
|
2675
|
+
"aria-labelledby": "alert-dialog-title",
|
|
2676
|
+
"aria-describedby": "alert-dialog-description",
|
|
2677
|
+
maxWidth: "xs",
|
|
2678
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
|
|
2679
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2680
|
+
import_material3.Box,
|
|
2681
|
+
{
|
|
2682
|
+
sx: {
|
|
2683
|
+
display: "flex",
|
|
2684
|
+
justifyContent: "space-between",
|
|
2685
|
+
alignItems: "center",
|
|
2686
|
+
padding: "4px 16px",
|
|
2687
|
+
boxShadow: "0px 1px 2px #f5f5f5ff"
|
|
2688
|
+
},
|
|
2689
|
+
children: [
|
|
2690
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Process List" }),
|
|
2691
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
|
|
2692
|
+
]
|
|
2693
|
+
}
|
|
2694
|
+
),
|
|
2695
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2696
|
+
import_material3.Box,
|
|
2697
|
+
{
|
|
2698
|
+
sx: {
|
|
2699
|
+
boxShadow: "1px 1px 4px #d3d3d3ff",
|
|
2700
|
+
padding: "6px 10px",
|
|
2701
|
+
margin: "10px",
|
|
2702
|
+
borderRadius: "10px"
|
|
2703
|
+
},
|
|
2704
|
+
children: processList.length > 0 ? processList == null ? void 0 : processList.map((process, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2705
|
+
import_material3.Box,
|
|
2706
|
+
{
|
|
2707
|
+
sx: {
|
|
2708
|
+
p: 1,
|
|
2709
|
+
display: "flex",
|
|
2710
|
+
alignItems: "center",
|
|
2711
|
+
boxShadow: "1px 1px 4px #d3d3d3ff",
|
|
2712
|
+
padding: "6px",
|
|
2713
|
+
margin: "10px 0px",
|
|
2714
|
+
borderRadius: "10px",
|
|
2715
|
+
cursor: "pointer",
|
|
2716
|
+
"&:hover": { bgcolor: "action.selected" }
|
|
2717
|
+
},
|
|
2718
|
+
onClick: () => {
|
|
2719
|
+
handleSelectedProcessor(process);
|
|
2720
|
+
},
|
|
2721
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2722
|
+
import_material3.Typography,
|
|
2723
|
+
{
|
|
2724
|
+
variant: "body1",
|
|
2725
|
+
sx: {
|
|
2726
|
+
mx: 1,
|
|
2727
|
+
width: "200px",
|
|
2728
|
+
maxWidth: "250px",
|
|
2729
|
+
display: "flex",
|
|
2730
|
+
alignItems: "center"
|
|
2731
|
+
},
|
|
2732
|
+
children: [
|
|
2733
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
|
|
2734
|
+
process.process_name
|
|
2735
|
+
]
|
|
2736
|
+
}
|
|
2737
|
+
)
|
|
2738
|
+
},
|
|
2739
|
+
index
|
|
2740
|
+
)) : null
|
|
2741
|
+
}
|
|
2742
|
+
)
|
|
2743
|
+
] })
|
|
2744
|
+
}
|
|
2745
|
+
) });
|
|
2746
|
+
}
|
|
2747
|
+
function CallHistoryDialog({ open, setOpen }) {
|
|
2748
|
+
const handleClose = () => {
|
|
2749
|
+
setOpen(false);
|
|
2750
|
+
};
|
|
2751
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2752
|
+
import_material3.Dialog,
|
|
2753
|
+
{
|
|
2754
|
+
open,
|
|
2755
|
+
"aria-labelledby": "alert-dialog-title",
|
|
2756
|
+
"aria-describedby": "alert-dialog-description",
|
|
2757
|
+
fullWidth: true,
|
|
2758
|
+
maxWidth: "md",
|
|
2759
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
|
|
2760
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
2761
|
+
import_material3.Box,
|
|
2762
|
+
{
|
|
2763
|
+
sx: {
|
|
2764
|
+
display: "flex",
|
|
2765
|
+
justifyContent: "space-between",
|
|
2766
|
+
alignItems: "center",
|
|
2767
|
+
padding: "4px 16px",
|
|
2768
|
+
boxShadow: "0px 1px 2px #f5f5f5ff"
|
|
2769
|
+
},
|
|
2770
|
+
children: [
|
|
2771
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Call History" }),
|
|
2772
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
|
|
2773
|
+
]
|
|
2774
|
+
}
|
|
2775
|
+
),
|
|
2776
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
2777
|
+
import_material3.Box,
|
|
2778
|
+
{
|
|
2779
|
+
sx: {
|
|
2780
|
+
boxShadow: "1px 1px 4px #d3d3d3ff",
|
|
2781
|
+
margin: "10px",
|
|
2782
|
+
borderRadius: "10px",
|
|
2783
|
+
textAlign: "center",
|
|
2784
|
+
fontSize: "16px",
|
|
2785
|
+
fontWeight: "bold"
|
|
2786
|
+
},
|
|
2787
|
+
p: 6,
|
|
2788
|
+
children: "Coming Soon..."
|
|
2789
|
+
}
|
|
2790
|
+
)
|
|
2791
|
+
] })
|
|
2792
|
+
}
|
|
2793
|
+
) });
|
|
2794
|
+
}
|
|
2795
|
+
|
|
2796
|
+
// call-control-sdk/lib/utils/audioLoader.ts
|
|
2797
|
+
var import_incoming = __toESM(require("./incoming-4WP3FJI4.mp3"));
|
|
2798
|
+
var audioBlobUrl = null;
|
|
2799
|
+
var audioBuffer = null;
|
|
2800
|
+
async function loadAudioAsBlob() {
|
|
2801
|
+
if (audioBlobUrl) {
|
|
2802
|
+
return audioBlobUrl;
|
|
2803
|
+
}
|
|
2804
|
+
if (import_incoming.default.startsWith("data:") || import_incoming.default.startsWith("http://") || import_incoming.default.startsWith("https://") || import_incoming.default.startsWith("blob:")) {
|
|
2805
|
+
return import_incoming.default;
|
|
2806
|
+
}
|
|
2807
|
+
try {
|
|
2808
|
+
const response = await fetch(import_incoming.default);
|
|
2809
|
+
if (!response.ok) {
|
|
2810
|
+
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
|
|
2811
|
+
}
|
|
2812
|
+
const blob = await response.blob();
|
|
2813
|
+
if (blob.size === 0) {
|
|
2814
|
+
throw new Error("Empty blob");
|
|
2815
|
+
}
|
|
2816
|
+
audioBlobUrl = URL.createObjectURL(blob);
|
|
2817
|
+
return audioBlobUrl;
|
|
2818
|
+
} catch (error) {
|
|
2819
|
+
console.warn("Could not create blob URL, using direct URL:", error);
|
|
2820
|
+
return import_incoming.default;
|
|
2821
|
+
}
|
|
2822
|
+
}
|
|
2823
|
+
async function createAudioElement() {
|
|
2824
|
+
const audio = new Audio();
|
|
2825
|
+
audio.loop = true;
|
|
2826
|
+
audio.volume = 0.7;
|
|
2827
|
+
audio.preload = "auto";
|
|
2828
|
+
let audioUrl = "";
|
|
2829
|
+
try {
|
|
2830
|
+
audioUrl = await loadAudioAsBlob();
|
|
2831
|
+
} catch (error) {
|
|
2832
|
+
console.warn("Failed to load audio as blob, trying direct URL:", error);
|
|
2833
|
+
audioUrl = import_incoming.default;
|
|
2834
|
+
}
|
|
2835
|
+
const tryLoadAudio = async (url) => {
|
|
2836
|
+
return new Promise((resolve) => {
|
|
2837
|
+
const checkCanPlay = () => {
|
|
2838
|
+
const canPlay = audio.readyState >= HTMLMediaElement.HAVE_FUTURE_DATA;
|
|
2839
|
+
if (canPlay) {
|
|
2840
|
+
resolve(true);
|
|
2841
|
+
return;
|
|
2842
|
+
}
|
|
2843
|
+
if (audio.error) {
|
|
2844
|
+
resolve(false);
|
|
2845
|
+
return;
|
|
2846
|
+
}
|
|
2847
|
+
setTimeout(checkCanPlay, 100);
|
|
2848
|
+
};
|
|
2849
|
+
audio.addEventListener("canplay", () => resolve(true), { once: true });
|
|
2850
|
+
audio.addEventListener("error", () => resolve(false), { once: true });
|
|
2851
|
+
audio.src = url;
|
|
2852
|
+
audio.load();
|
|
2853
|
+
setTimeout(() => resolve(false), 2e3);
|
|
2854
|
+
});
|
|
2855
|
+
};
|
|
2856
|
+
let loaded = await tryLoadAudio(audioUrl);
|
|
2857
|
+
if (!loaded && audioUrl !== import_incoming.default) {
|
|
2858
|
+
console.log("Primary URL failed, trying original import URL:", import_incoming.default);
|
|
2859
|
+
loaded = await tryLoadAudio(import_incoming.default);
|
|
2860
|
+
if (loaded) {
|
|
2861
|
+
audioUrl = import_incoming.default;
|
|
2862
|
+
}
|
|
2863
|
+
}
|
|
2864
|
+
if (!loaded) {
|
|
2865
|
+
console.error("Failed to load audio with all methods. URL:", audioUrl);
|
|
2866
|
+
}
|
|
2867
|
+
return audio;
|
|
2868
|
+
}
|
|
2869
|
+
function cleanupAudioResources() {
|
|
2870
|
+
if (audioBlobUrl) {
|
|
2871
|
+
URL.revokeObjectURL(audioBlobUrl);
|
|
2872
|
+
audioBlobUrl = null;
|
|
2873
|
+
}
|
|
2874
|
+
audioBuffer = null;
|
|
2875
|
+
}
|
|
2876
|
+
|
|
2877
|
+
// call-control-sdk/lib/components/callControls.tsx
|
|
2878
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
2879
|
+
var getCombineConfrenceData = (localState, apiData) => {
|
|
2880
|
+
const localConfrenceData = localState == null ? void 0 : localState.conferenceLine;
|
|
2881
|
+
const apiConferenceData = apiData == null ? void 0 : apiData.conferencestatus;
|
|
2882
|
+
const updatedConferenceData = localConfrenceData.map((item) => {
|
|
2883
|
+
var _a2, _b, _c, _d, _e;
|
|
2884
|
+
if ((item == null ? void 0 : item.line) === 1) {
|
|
2885
|
+
const statusKey = `line_${item.line}_status`;
|
|
2886
|
+
return __spreadProps(__spreadValues({}, item), {
|
|
2887
|
+
line: 1,
|
|
2888
|
+
status: (_b = apiConferenceData[statusKey]) != null ? _b : (_a2 = localState == null ? void 0 : localState.callData) == null ? void 0 : _a2.status,
|
|
2889
|
+
phone: (_d = (_c = localState == null ? void 0 : localState.callData) == null ? void 0 : _c.phone_number) != null ? _d : ""
|
|
2890
|
+
});
|
|
2891
|
+
} else {
|
|
2892
|
+
const statusKey = `line_${item.line}_status`;
|
|
2893
|
+
const phoneKey = `line_${item.line}_phonenumber`;
|
|
2894
|
+
return __spreadProps(__spreadValues({}, item), {
|
|
2895
|
+
status: (_e = apiConferenceData[statusKey]) != null ? _e : item.status,
|
|
2896
|
+
phone: apiConferenceData[phoneKey] === null || apiConferenceData[phoneKey] === "0" ? item.phone : apiConferenceData[phoneKey]
|
|
2897
|
+
});
|
|
2898
|
+
}
|
|
2899
|
+
});
|
|
2900
|
+
return updatedConferenceData;
|
|
2901
|
+
};
|
|
2902
|
+
var formatDuration = (seconds) => {
|
|
2903
|
+
const mins = Math.floor(seconds / 60);
|
|
2904
|
+
const secs = seconds % 60;
|
|
2905
|
+
return `${mins.toString().padStart(2, "0")}:${secs.toString().padStart(2, "0")}`;
|
|
2906
|
+
};
|
|
2907
|
+
function CallControls({ onDataChange }) {
|
|
2908
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra, _sa, _ta, _ua, _va, _wa, _xa, _ya, _za, _Aa, _Ba, _Ca, _Da, _Ea, _Fa, _Ga, _Ha, _Ia, _Ja, _Ka, _La, _Ma;
|
|
2909
|
+
const theme = (0, import_material4.useTheme)();
|
|
2910
|
+
const state = useSDKState();
|
|
2911
|
+
const { showToast } = useToast();
|
|
2912
|
+
const { disabled, enabled, outlined } = styles_default({
|
|
2913
|
+
disabled: ((_a2 = state.sdkConfig) == null ? void 0 : _a2.disabled) || {},
|
|
2914
|
+
enabled: ((_b = state.sdkConfig) == null ? void 0 : _b.enabled) || {},
|
|
2915
|
+
outlined: ((_c = state.sdkConfig) == null ? void 0 : _c.outlined) || {}
|
|
2916
|
+
});
|
|
2917
|
+
const webSocketRef = (0, import_react11.useRef)(null);
|
|
2918
|
+
const audioRef = (0, import_react11.useRef)(null);
|
|
2919
|
+
const reconnectTimeoutRef = (0, import_react11.useRef)(null);
|
|
2920
|
+
const pingIntervalRef = (0, import_react11.useRef)(null);
|
|
2921
|
+
const reconnectAttemptsRef = (0, import_react11.useRef)(0);
|
|
2922
|
+
const maxReconnectAttempts = 60;
|
|
2923
|
+
const baseReconnectDelay = 2e3;
|
|
2924
|
+
const maxReconnectDelay = 3e4;
|
|
2925
|
+
const [anchorEl, setAnchorEl] = (0, import_react11.useState)(null);
|
|
2926
|
+
const [showIframe, setShowIframe] = (0, import_react11.useState)(true);
|
|
2927
|
+
const [statusAnchorEl, setStatusAnchorEl] = (0, import_react11.useState)(null);
|
|
2928
|
+
const [dialerAnchorEl, setDialerAnchorEl] = (0, import_react11.useState)(null);
|
|
2929
|
+
const [openCallDisposition, setOpenCallDisposition] = (0, import_react11.useState)(false);
|
|
2930
|
+
const [openProcessorDialog, setOpenProcessorDialog] = (0, import_react11.useState)(false);
|
|
2931
|
+
const [openCallHistoryDialog, setOpenCallHistoryDialog] = (0, import_react11.useState)(false);
|
|
2932
|
+
const [processList, setProcessList] = (0, import_react11.useState)(null);
|
|
2933
|
+
const [phoneNumber, setPhoneNumber] = (0, import_react11.useState)("");
|
|
2934
|
+
const [callDuration, setCallDuration] = (0, import_react11.useState)(0);
|
|
2935
|
+
const { position, isDragging, dragRef, handleMouseDown, handleTouchStart } = useDraggable(
|
|
2936
|
+
state.controlPanelPosition,
|
|
2937
|
+
(newPosition) => sdkStateManager.setControlPanelPosition(newPosition)
|
|
2938
|
+
);
|
|
2939
|
+
const {
|
|
2940
|
+
position: iframePosition,
|
|
2941
|
+
isDragging: iframeIsDragging,
|
|
2942
|
+
dragRef: iframeDragRef,
|
|
2943
|
+
handleMouseDown: iframeHandleMouseDown,
|
|
2944
|
+
handleTouchStart: iframeHandleTouchStart
|
|
2945
|
+
} = useDraggable(
|
|
2946
|
+
state.iframePosition,
|
|
2947
|
+
(newPosition) => sdkStateManager.setIframePosition(newPosition)
|
|
2948
|
+
);
|
|
2949
|
+
const [clickToCall, { isLoading: clickToCallLoading }] = usePostRequest({
|
|
2950
|
+
onSuccess: () => {
|
|
2951
|
+
setPhoneNumber("");
|
|
2952
|
+
setDialerAnchorEl(null);
|
|
2953
|
+
}
|
|
2954
|
+
});
|
|
2955
|
+
const [holdOrUnHold, { isLoading: holdOrUnHoldLoading }] = usePostRequest({
|
|
2956
|
+
onSuccess: () => {
|
|
2957
|
+
sdkStateManager.setHolding(!state.isHolding);
|
|
2958
|
+
},
|
|
2959
|
+
onError: (error) => {
|
|
2960
|
+
console.log("\u274C Hold operation error:", error);
|
|
2961
|
+
}
|
|
2962
|
+
});
|
|
2963
|
+
const [muteOrUnMute, { isLoading: muteOrUnMuteLoading }] = usePostRequest({
|
|
2964
|
+
onSuccess: () => {
|
|
2965
|
+
sdkStateManager.setMuted(!state.isMuted);
|
|
2966
|
+
},
|
|
2967
|
+
onError: (error) => {
|
|
2968
|
+
console.log("\u274C Mute operation error:", error);
|
|
2969
|
+
}
|
|
2970
|
+
});
|
|
2971
|
+
const [readyAgentStatus, { isLoading: agentReadyLoading }] = usePostRequest();
|
|
2972
|
+
const [updateAgentStatus, { isLoading }] = usePostRequest();
|
|
2973
|
+
const [endCall, { isLoading: endCallLoading }] = usePostRequest({
|
|
2974
|
+
onSuccess: () => {
|
|
2975
|
+
sdkStateManager.resetConferenceLines();
|
|
2976
|
+
}
|
|
2977
|
+
});
|
|
2978
|
+
const handleCloseQueueCounts = () => {
|
|
2979
|
+
setAnchorEl(null);
|
|
2980
|
+
};
|
|
2981
|
+
const handleOpenDialer = (event) => {
|
|
2982
|
+
setShowIframe(true);
|
|
2983
|
+
setDialerAnchorEl(event.currentTarget);
|
|
2984
|
+
sdkStateManager.setStatus("dial");
|
|
2985
|
+
};
|
|
2986
|
+
const handleCloseDialer = () => {
|
|
2987
|
+
if (state.status !== "on call") {
|
|
2988
|
+
sdkStateManager.setStatus("idle");
|
|
2989
|
+
}
|
|
2990
|
+
setDialerAnchorEl(null);
|
|
2991
|
+
};
|
|
2992
|
+
const handleOpenAgentStatus = (event) => {
|
|
2993
|
+
setStatusAnchorEl(event.currentTarget);
|
|
2994
|
+
};
|
|
2995
|
+
const handleCloseAgentStatus = () => {
|
|
2996
|
+
setStatusAnchorEl(null);
|
|
2997
|
+
};
|
|
2998
|
+
const handleAgentReady = () => {
|
|
2999
|
+
const payload = {
|
|
3000
|
+
action: "READYAGENT",
|
|
3001
|
+
userId: state.agentId
|
|
3002
|
+
};
|
|
3003
|
+
readyAgentStatus(END_POINT.READY_AGENT, payload);
|
|
3004
|
+
};
|
|
3005
|
+
const handleUpdateAgentStatus = (status) => {
|
|
3006
|
+
setStatusAnchorEl(null);
|
|
3007
|
+
const payload = {
|
|
3008
|
+
action: "AGENTBREAK",
|
|
3009
|
+
break_type: status,
|
|
3010
|
+
userId: state.agentId
|
|
3011
|
+
};
|
|
3012
|
+
updateAgentStatus(END_POINT.UPDATE_AGENT_BREAK, payload);
|
|
3013
|
+
};
|
|
3014
|
+
const handleStartCall = (number) => {
|
|
3015
|
+
if (number.length !== 10) {
|
|
3016
|
+
showToast("Invalid phone number", "error");
|
|
3017
|
+
} else if (!/^\d+$/.test(number)) {
|
|
3018
|
+
showToast("Invalid phone number", "error");
|
|
3019
|
+
} else {
|
|
3020
|
+
const payload = {
|
|
3021
|
+
action: "CALL",
|
|
3022
|
+
phone_number: number,
|
|
3023
|
+
userId: state.agentId
|
|
3024
|
+
};
|
|
3025
|
+
clickToCall(END_POINT.CLICK_TO_CALL, payload);
|
|
3026
|
+
}
|
|
3027
|
+
};
|
|
3028
|
+
const handleHoldToggle = () => {
|
|
3029
|
+
var _a3;
|
|
3030
|
+
const payload = {
|
|
3031
|
+
action: ((_a3 = state.callData) == null ? void 0 : _a3.hold) === 1 ? "UNHOLD" : "HOLD",
|
|
3032
|
+
userId: state.agentId
|
|
3033
|
+
};
|
|
3034
|
+
holdOrUnHold(END_POINT.HOLD_CALL, payload);
|
|
3035
|
+
};
|
|
3036
|
+
const handleMuteToggle = () => {
|
|
3037
|
+
var _a3;
|
|
3038
|
+
const payload = {
|
|
3039
|
+
action: ((_a3 = state.callData) == null ? void 0 : _a3.mute) === 1 ? "UNMUTE" : "MUTE",
|
|
3040
|
+
userId: state.agentId
|
|
3041
|
+
};
|
|
3042
|
+
muteOrUnMute(END_POINT.MUTE_CALL, payload);
|
|
3043
|
+
};
|
|
3044
|
+
const handleEndCall = (data) => {
|
|
3045
|
+
var _a3, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2;
|
|
3046
|
+
const payload = {
|
|
3047
|
+
action: "ENDCALL",
|
|
3048
|
+
userId: state.agentId,
|
|
3049
|
+
processid: (_c2 = (_b2 = (_a3 = state.process) == null ? void 0 : _a3.process_id) == null ? void 0 : _b2.toString()) != null ? _c2 : "",
|
|
3050
|
+
process_name: (_e2 = (_d2 = state.process) == null ? void 0 : _d2.process_name) != null ? _e2 : "",
|
|
3051
|
+
callreferenceid: (_g2 = (_f2 = state.callData) == null ? void 0 : _f2.convox_id) != null ? _g2 : "",
|
|
3052
|
+
mobile_number: (_i2 = (_h2 = state.callData) == null ? void 0 : _h2.phone_number) != null ? _i2 : "",
|
|
3053
|
+
disposition: (_k2 = (_j2 = data == null ? void 0 : data.disposition) == null ? void 0 : _j2.value) != null ? _k2 : "",
|
|
3054
|
+
set_followUp: (_m2 = (_l2 = data == null ? void 0 : data.followUp) == null ? void 0 : _l2.value) != null ? _m2 : "",
|
|
3055
|
+
callback_date: (_n2 = data == null ? void 0 : data.callbackDate) != null ? _n2 : "",
|
|
3056
|
+
callback_hrs: (_o2 = data == null ? void 0 : data.callbackHrs) != null ? _o2 : "",
|
|
3057
|
+
callback_mins: (_p2 = data == null ? void 0 : data.callbackMins) != null ? _p2 : "",
|
|
3058
|
+
endcall_type: "CLOSE"
|
|
3059
|
+
};
|
|
3060
|
+
setPhoneNumber("");
|
|
3061
|
+
endCall(END_POINT.END_CALL, payload);
|
|
3062
|
+
sdkStateManager.endCall();
|
|
3063
|
+
setOpenCallDisposition(false);
|
|
3064
|
+
};
|
|
3065
|
+
(0, import_react11.useEffect)(() => {
|
|
3066
|
+
const handleBeforeUnload = (e) => {
|
|
3067
|
+
e.preventDefault();
|
|
3068
|
+
};
|
|
3069
|
+
window.addEventListener("beforeunload", handleBeforeUnload);
|
|
3070
|
+
return () => {
|
|
3071
|
+
window.removeEventListener("beforeunload", handleBeforeUnload);
|
|
3072
|
+
};
|
|
3073
|
+
}, []);
|
|
3074
|
+
(0, import_react11.useEffect)(() => {
|
|
3075
|
+
let interval;
|
|
3076
|
+
if (state.callData.status && state.callData.status === "ONCALL") {
|
|
3077
|
+
interval = setInterval(() => {
|
|
3078
|
+
const elapsed = Math.floor((Date.now() - state.callStartTime) / 1e3);
|
|
3079
|
+
setCallDuration(elapsed);
|
|
3080
|
+
}, 1e3);
|
|
3081
|
+
} else {
|
|
3082
|
+
setCallDuration(0);
|
|
3083
|
+
}
|
|
3084
|
+
return () => {
|
|
3085
|
+
if (interval) clearInterval(interval);
|
|
3086
|
+
};
|
|
3087
|
+
}, [state.callData.status]);
|
|
3088
|
+
(0, import_react11.useEffect)(() => {
|
|
3089
|
+
createAudioElement().then((audio) => {
|
|
3090
|
+
audioRef.current = audio;
|
|
3091
|
+
}).catch((error) => {
|
|
3092
|
+
console.error("Failed to load audio element:", error);
|
|
3093
|
+
});
|
|
3094
|
+
return () => {
|
|
3095
|
+
if (audioRef.current) {
|
|
3096
|
+
audioRef.current.pause();
|
|
3097
|
+
audioRef.current.currentTime = 0;
|
|
3098
|
+
audioRef.current.src = "";
|
|
3099
|
+
audioRef.current = null;
|
|
3100
|
+
}
|
|
3101
|
+
cleanupAudioResources();
|
|
3102
|
+
};
|
|
3103
|
+
}, []);
|
|
3104
|
+
(0, import_react11.useEffect)(() => {
|
|
3105
|
+
if (onDataChange && state.callData) {
|
|
3106
|
+
const { process_id, process_name, status, phone_number, agent_id, convox_id } = state.callData;
|
|
3107
|
+
const callData = {
|
|
3108
|
+
phone_number,
|
|
3109
|
+
status,
|
|
3110
|
+
callReferenceId: convox_id,
|
|
3111
|
+
agent_id,
|
|
3112
|
+
process_id,
|
|
3113
|
+
process_name
|
|
3114
|
+
};
|
|
3115
|
+
onDataChange(callData);
|
|
3116
|
+
}
|
|
3117
|
+
}, [state.callData, onDataChange]);
|
|
3118
|
+
(0, import_react11.useEffect)(() => {
|
|
3119
|
+
if (state.agentId) {
|
|
3120
|
+
axios_default.post(END_POINT.PROCESS_LIST, {
|
|
3121
|
+
userId: state.agentId,
|
|
3122
|
+
action: "GETAGENTPROCESSLIST",
|
|
3123
|
+
refno: "1234221233"
|
|
3124
|
+
}).then((res) => {
|
|
3125
|
+
var _a3, _b2;
|
|
3126
|
+
if (res && res.data && ((_a3 = res == null ? void 0 : res.data) == null ? void 0 : _a3.length) > 1) {
|
|
3127
|
+
setProcessList(res.data.data);
|
|
3128
|
+
setOpenProcessorDialog(true);
|
|
3129
|
+
} else {
|
|
3130
|
+
sdkStateManager.setProcess((_b2 = res == null ? void 0 : res.data) == null ? void 0 : _b2.data[0]);
|
|
3131
|
+
setOpenProcessorDialog(false);
|
|
3132
|
+
}
|
|
3133
|
+
}).catch((err) => {
|
|
3134
|
+
showToast(err.response.data.message, "error");
|
|
3135
|
+
});
|
|
3136
|
+
} else {
|
|
3137
|
+
console.log("No agentId available, skipping API call");
|
|
3138
|
+
}
|
|
3139
|
+
}, [state.agentId]);
|
|
3140
|
+
const connectWebSocket = () => {
|
|
3141
|
+
if (!state.agentId) {
|
|
3142
|
+
console.log("No agentId available, cannot connect WebSocket");
|
|
3143
|
+
return;
|
|
3144
|
+
}
|
|
3145
|
+
if (reconnectTimeoutRef.current) {
|
|
3146
|
+
clearTimeout(reconnectTimeoutRef.current);
|
|
3147
|
+
reconnectTimeoutRef.current = null;
|
|
3148
|
+
}
|
|
3149
|
+
try {
|
|
3150
|
+
webSocketRef.current = new WebSocket(`${WS_END_POINT.WS}?agent_id=${state.agentId}`);
|
|
3151
|
+
webSocketRef.current.onopen = () => {
|
|
3152
|
+
console.log("\u{1F310} WebSocket connection established");
|
|
3153
|
+
reconnectAttemptsRef.current = 0;
|
|
3154
|
+
if (pingIntervalRef.current) {
|
|
3155
|
+
clearInterval(pingIntervalRef.current);
|
|
3156
|
+
}
|
|
3157
|
+
pingIntervalRef.current = setInterval(() => {
|
|
3158
|
+
if (webSocketRef.current && webSocketRef.current.readyState === WebSocket.OPEN) {
|
|
3159
|
+
try {
|
|
3160
|
+
webSocketRef.current.send(JSON.stringify({ type: "ping" }));
|
|
3161
|
+
console.log("\u{1F4E1} WebSocket ping sent");
|
|
3162
|
+
} catch (error) {
|
|
3163
|
+
console.error("Failed to send ping:", error);
|
|
3164
|
+
}
|
|
3165
|
+
}
|
|
3166
|
+
}, 3e4);
|
|
3167
|
+
};
|
|
3168
|
+
webSocketRef.current.onmessage = (event) => {
|
|
3169
|
+
try {
|
|
3170
|
+
const data = JSON.parse(event.data);
|
|
3171
|
+
if (data.type === "pong") {
|
|
3172
|
+
console.log("\u{1F4E1} WebSocket pong received");
|
|
3173
|
+
return;
|
|
3174
|
+
}
|
|
3175
|
+
const rls = localStorage.getItem("call-control-sdk-state");
|
|
3176
|
+
const confrence = getCombineConfrenceData(JSON.parse(rls || "{}"), data);
|
|
3177
|
+
sdkStateManager.updateCallData(data);
|
|
3178
|
+
sdkStateManager.updateConferenceData([...confrence]);
|
|
3179
|
+
if (data.status === "RINGING" || data.status === "DIALING") {
|
|
3180
|
+
if (audioRef.current) {
|
|
3181
|
+
audioRef.current.play().catch((error) => {
|
|
3182
|
+
console.error("Failed to play ringtone:", error);
|
|
3183
|
+
});
|
|
3184
|
+
}
|
|
3185
|
+
} else {
|
|
3186
|
+
if (audioRef.current) {
|
|
3187
|
+
audioRef.current.pause();
|
|
3188
|
+
audioRef.current.currentTime = 0;
|
|
3189
|
+
}
|
|
3190
|
+
}
|
|
3191
|
+
if (data.status === "ONCALL") {
|
|
3192
|
+
sdkStateManager.startCall();
|
|
3193
|
+
if (!showIframe) {
|
|
3194
|
+
setShowIframe(true);
|
|
3195
|
+
}
|
|
3196
|
+
}
|
|
3197
|
+
if (data.status === "WRAPUP") {
|
|
3198
|
+
sdkStateManager.endCall();
|
|
3199
|
+
}
|
|
3200
|
+
} catch (e) {
|
|
3201
|
+
console.log("\u{1F4E8} Raw message:", event.data);
|
|
3202
|
+
}
|
|
3203
|
+
};
|
|
3204
|
+
webSocketRef.current.onclose = (event) => {
|
|
3205
|
+
console.log("\u{1F50C} WebSocket connection closed", event.code, event.reason);
|
|
3206
|
+
if (pingIntervalRef.current) {
|
|
3207
|
+
clearInterval(pingIntervalRef.current);
|
|
3208
|
+
pingIntervalRef.current = null;
|
|
3209
|
+
}
|
|
3210
|
+
if (event.code !== 1e3 && reconnectAttemptsRef.current < maxReconnectAttempts) {
|
|
3211
|
+
reconnectAttemptsRef.current += 1;
|
|
3212
|
+
const delay = Math.min(
|
|
3213
|
+
baseReconnectDelay * Math.pow(2, reconnectAttemptsRef.current - 1),
|
|
3214
|
+
maxReconnectDelay
|
|
3215
|
+
);
|
|
3216
|
+
console.log(
|
|
3217
|
+
`\u{1F504} Attempting to reconnect WebSocket (attempt ${reconnectAttemptsRef.current}/${maxReconnectAttempts}) in ${delay}ms`
|
|
3218
|
+
);
|
|
3219
|
+
reconnectTimeoutRef.current = setTimeout(() => {
|
|
3220
|
+
connectWebSocket();
|
|
3221
|
+
}, delay);
|
|
3222
|
+
} else if (reconnectAttemptsRef.current >= maxReconnectAttempts) {
|
|
3223
|
+
console.error("\u274C Maximum reconnection attempts reached. Please refresh the page.");
|
|
3224
|
+
showToast("WebSocket connection failed. Please refresh the page.", "error");
|
|
3225
|
+
}
|
|
3226
|
+
};
|
|
3227
|
+
webSocketRef.current.onerror = (error) => {
|
|
3228
|
+
console.error("\u274C WebSocket error:", error);
|
|
3229
|
+
};
|
|
3230
|
+
} catch (error) {
|
|
3231
|
+
console.error("\u274C Failed to create WebSocket:", error);
|
|
3232
|
+
if (reconnectAttemptsRef.current < maxReconnectAttempts) {
|
|
3233
|
+
reconnectAttemptsRef.current += 1;
|
|
3234
|
+
const delay = Math.min(
|
|
3235
|
+
baseReconnectDelay * Math.pow(2, reconnectAttemptsRef.current - 1),
|
|
3236
|
+
maxReconnectDelay
|
|
3237
|
+
);
|
|
3238
|
+
reconnectTimeoutRef.current = setTimeout(() => {
|
|
3239
|
+
connectWebSocket();
|
|
3240
|
+
}, delay);
|
|
3241
|
+
}
|
|
3242
|
+
}
|
|
3243
|
+
};
|
|
3244
|
+
(0, import_react11.useEffect)(() => {
|
|
3245
|
+
if (state.agentId) {
|
|
3246
|
+
connectWebSocket();
|
|
3247
|
+
}
|
|
3248
|
+
return () => {
|
|
3249
|
+
if (reconnectTimeoutRef.current) {
|
|
3250
|
+
clearTimeout(reconnectTimeoutRef.current);
|
|
3251
|
+
reconnectTimeoutRef.current = null;
|
|
3252
|
+
}
|
|
3253
|
+
if (pingIntervalRef.current) {
|
|
3254
|
+
clearInterval(pingIntervalRef.current);
|
|
3255
|
+
pingIntervalRef.current = null;
|
|
3256
|
+
}
|
|
3257
|
+
if (webSocketRef.current) {
|
|
3258
|
+
webSocketRef.current.close(1e3, "Component unmounting");
|
|
3259
|
+
webSocketRef.current = null;
|
|
3260
|
+
}
|
|
3261
|
+
reconnectAttemptsRef.current = 0;
|
|
3262
|
+
};
|
|
3263
|
+
}, [state.agentId]);
|
|
3264
|
+
if (!state.isInitialized || !state.process) {
|
|
3265
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: Boolean(openProcessorDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3266
|
+
ProcessorListDialog,
|
|
3267
|
+
{
|
|
3268
|
+
processList,
|
|
3269
|
+
open: openProcessorDialog,
|
|
3270
|
+
setOpen: setOpenProcessorDialog,
|
|
3271
|
+
handleSelectedProcessor: (data) => {
|
|
3272
|
+
sdkStateManager.setProcess(data);
|
|
3273
|
+
}
|
|
3274
|
+
}
|
|
3275
|
+
) });
|
|
3276
|
+
}
|
|
3277
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
|
|
3278
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3279
|
+
import_material4.Fade,
|
|
3280
|
+
{
|
|
3281
|
+
in: true,
|
|
3282
|
+
timeout: 300,
|
|
3283
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3284
|
+
import_material4.Paper,
|
|
3285
|
+
{
|
|
3286
|
+
ref: ((_d = state.sdkConfig) == null ? void 0 : _d.isDraggable) ? dragRef : null,
|
|
3287
|
+
elevation: isDragging ? 4 : ((_e = state.sdkConfig) == null ? void 0 : _e.isDraggable) ? 1 : 0,
|
|
3288
|
+
sx: {
|
|
3289
|
+
position: ((_f = state.sdkConfig) == null ? void 0 : _f.isDraggable) ? "fixed" : "relative",
|
|
3290
|
+
left: ((_g = state.sdkConfig) == null ? void 0 : _g.isDraggable) ? position.x : "auto",
|
|
3291
|
+
top: ((_h = state.sdkConfig) == null ? void 0 : _h.isDraggable) ? position.y : "auto",
|
|
3292
|
+
display: "inline-block",
|
|
3293
|
+
width: "auto",
|
|
3294
|
+
flexShrink: 0,
|
|
3295
|
+
whiteSpace: "nowrap",
|
|
3296
|
+
p: 0.5,
|
|
3297
|
+
borderRadius: 3,
|
|
3298
|
+
bgcolor: "background.paper",
|
|
3299
|
+
zIndex: ((_i = state.sdkConfig) == null ? void 0 : _i.isDraggable) ? Number.MAX_SAFE_INTEGER : 0,
|
|
3300
|
+
transition: theme.transitions.create(["box-shadow", "transform"], {
|
|
3301
|
+
duration: theme.transitions.duration.short
|
|
3302
|
+
}),
|
|
3303
|
+
userSelect: "none"
|
|
3304
|
+
},
|
|
3305
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
3306
|
+
import_material4.Box,
|
|
3307
|
+
{
|
|
3308
|
+
sx: {
|
|
3309
|
+
display: "flex",
|
|
3310
|
+
alignItems: "center"
|
|
3311
|
+
},
|
|
3312
|
+
children: [
|
|
3313
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
3314
|
+
import_material4.Box,
|
|
3315
|
+
{
|
|
3316
|
+
sx: {
|
|
3317
|
+
display: "flex",
|
|
3318
|
+
alignItems: "center",
|
|
3319
|
+
gap: 1,
|
|
3320
|
+
margin: "0px 10px"
|
|
3321
|
+
},
|
|
3322
|
+
children: [
|
|
3323
|
+
((_j = state.sdkConfig) == null ? void 0 : _j.isDraggable) && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
3324
|
+
import_material4.IconButton,
|
|
3325
|
+
{
|
|
3326
|
+
component: "div",
|
|
3327
|
+
size: "small",
|
|
3328
|
+
sx: {
|
|
3329
|
+
cursor: "all-scroll"
|
|
3330
|
+
},
|
|
3331
|
+
onMouseDown: handleMouseDown,
|
|
3332
|
+
onTouchStart: handleTouchStart,
|
|
3333
|
+
children: [
|
|
3334
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.DragIndicator, {}),
|
|
3335
|
+
" "
|
|
3336
|
+
]
|
|
3337
|
+
}
|
|
3338
|
+
),
|
|
3339
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: !((_k = state.sdkConfig) == null ? void 0 : _k.disabledDialButton) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Dial", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3340
|
+
import_material4.IconButton,
|
|
3341
|
+
{
|
|
3342
|
+
size: "small",
|
|
3343
|
+
onClick: (e) => {
|
|
3344
|
+
var _a3, _b2, _c2, _d2, _e2, _f2, _g2, _h2;
|
|
3345
|
+
if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) !== "ONCALL" && ((_d2 = (_c2 = state.callData) == null ? void 0 : _c2.status) == null ? void 0 : _d2.toUpperCase()) !== "BREAK" && ((_f2 = (_e2 = state.callData) == null ? void 0 : _e2.status) == null ? void 0 : _f2.toUpperCase()) !== "RINGING" && ((_h2 = (_g2 = state.callData) == null ? void 0 : _g2.status) == null ? void 0 : _h2.toUpperCase()) !== "WRAPUP") {
|
|
3346
|
+
handleOpenDialer(e);
|
|
3347
|
+
}
|
|
3348
|
+
},
|
|
3349
|
+
sx: {
|
|
3350
|
+
bgcolor: "action.hover",
|
|
3351
|
+
"&:hover": {
|
|
3352
|
+
bgcolor: "warning"
|
|
3353
|
+
}
|
|
3354
|
+
},
|
|
3355
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3356
|
+
import_icons_material2.WifiCalling3,
|
|
3357
|
+
{
|
|
3358
|
+
sx: {
|
|
3359
|
+
color: ((_m = (_l = state.callData) == null ? void 0 : _l.status) == null ? void 0 : _m.toUpperCase()) === "ONCALL" || ((_o = (_n = state.callData) == null ? void 0 : _n.status) == null ? void 0 : _o.toUpperCase()) === "BREAK" || ((_q = (_p = state.callData) == null ? void 0 : _p.status) == null ? void 0 : _q.toUpperCase()) === "RINGING" || ((_s = (_r = state.callData) == null ? void 0 : _r.status) == null ? void 0 : _s.toUpperCase()) === "WRAPUP" ? "action.selected" : "success.main"
|
|
3360
|
+
}
|
|
3361
|
+
}
|
|
3362
|
+
)
|
|
3363
|
+
}
|
|
3364
|
+
) }) }),
|
|
3365
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3366
|
+
import_material4.Typography,
|
|
3367
|
+
{
|
|
3368
|
+
sx: {
|
|
3369
|
+
color: "success.main",
|
|
3370
|
+
width: "40px",
|
|
3371
|
+
marginRight: "10px",
|
|
3372
|
+
fontSize: "18px",
|
|
3373
|
+
fontWeight: "600"
|
|
3374
|
+
},
|
|
3375
|
+
children: formatDuration(callDuration)
|
|
3376
|
+
}
|
|
3377
|
+
),
|
|
3378
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3379
|
+
import_material4.Chip,
|
|
3380
|
+
{
|
|
3381
|
+
sx: {
|
|
3382
|
+
padding: "18px 0px"
|
|
3383
|
+
},
|
|
3384
|
+
label: isLoading || agentReadyLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3385
|
+
import_material4.Box,
|
|
3386
|
+
{
|
|
3387
|
+
sx: {
|
|
3388
|
+
fontWeight: "bold",
|
|
3389
|
+
width: "60px",
|
|
3390
|
+
display: "flex",
|
|
3391
|
+
alignItems: "center",
|
|
3392
|
+
justifyContent: "center"
|
|
3393
|
+
},
|
|
3394
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.CircularProgress, { size: "20px" })
|
|
3395
|
+
}
|
|
3396
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3397
|
+
import_material4.Typography,
|
|
3398
|
+
{
|
|
3399
|
+
variant: "body2",
|
|
3400
|
+
sx: {
|
|
3401
|
+
fontWeight: "bold",
|
|
3402
|
+
width: "60px",
|
|
3403
|
+
textAlign: "center"
|
|
3404
|
+
},
|
|
3405
|
+
children: (_v = (_u = (_t = state.callData) == null ? void 0 : _t.status) == null ? void 0 : _u.toUpperCase()) != null ? _v : "N/A"
|
|
3406
|
+
}
|
|
3407
|
+
),
|
|
3408
|
+
onClick: handleOpenAgentStatus,
|
|
3409
|
+
deleteIcon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.KeyboardArrowDown, { color: "primary" }),
|
|
3410
|
+
onDelete: handleOpenAgentStatus
|
|
3411
|
+
}
|
|
3412
|
+
)
|
|
3413
|
+
]
|
|
3414
|
+
}
|
|
3415
|
+
),
|
|
3416
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
3417
|
+
import_material4.Box,
|
|
3418
|
+
{
|
|
3419
|
+
sx: {
|
|
3420
|
+
display: "flex",
|
|
3421
|
+
gap: 1,
|
|
3422
|
+
justifyContent: "center",
|
|
3423
|
+
alignItems: "center"
|
|
3424
|
+
},
|
|
3425
|
+
children: [
|
|
3426
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Agent Ready", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3427
|
+
import_material4.Button,
|
|
3428
|
+
{
|
|
3429
|
+
variant: ((_x = (_w = state.callData) == null ? void 0 : _w.status) == null ? void 0 : _x.toUpperCase()) === "BREAK" || ((_z = (_y = state.callData) == null ? void 0 : _y.status) == null ? void 0 : _z.toUpperCase()) === "MISSED" ? "outlined" : "contained",
|
|
3430
|
+
onClick: (e) => {
|
|
3431
|
+
var _a3, _b2, _c2, _d2;
|
|
3432
|
+
if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) === "BREAK" || ((_d2 = (_c2 = state.callData) == null ? void 0 : _c2.status) == null ? void 0 : _d2.toUpperCase()) === "MISSED") {
|
|
3433
|
+
e.stopPropagation();
|
|
3434
|
+
handleAgentReady();
|
|
3435
|
+
}
|
|
3436
|
+
},
|
|
3437
|
+
classes: {
|
|
3438
|
+
root: ((_B = (_A = state.callData) == null ? void 0 : _A.status) == null ? void 0 : _B.toUpperCase()) === "BREAK" || ((_D = (_C = state.callData) == null ? void 0 : _C.status) == null ? void 0 : _D.toUpperCase()) === "MISSED" ? "outlined" : "enabled"
|
|
3439
|
+
},
|
|
3440
|
+
sx: __spreadValues({}, ((_F = (_E = state.callData) == null ? void 0 : _E.status) == null ? void 0 : _F.toUpperCase()) === "BREAK" || ((_H = (_G = state.callData) == null ? void 0 : _G.status) == null ? void 0 : _H.toUpperCase()) === "MISSED" ? outlined : enabled),
|
|
3441
|
+
disabled: agentReadyLoading,
|
|
3442
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.SupportAgent, {})
|
|
3443
|
+
}
|
|
3444
|
+
) }),
|
|
3445
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: ((_I = state.callData) == null ? void 0 : _I.hold) === 1 ? "Resume" : "Hold", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3446
|
+
import_material4.Button,
|
|
3447
|
+
{
|
|
3448
|
+
variant: ((_J = state.callData) == null ? void 0 : _J.hold) === 1 && ((_L = (_K = state.callData) == null ? void 0 : _K.status) == null ? void 0 : _L.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
|
|
3449
|
+
onClick: (e) => {
|
|
3450
|
+
e.stopPropagation();
|
|
3451
|
+
handleHoldToggle();
|
|
3452
|
+
},
|
|
3453
|
+
sx: ((_M = state.callData) == null ? void 0 : _M.hold) === 1 && ((_O = (_N = state.callData) == null ? void 0 : _N.status) == null ? void 0 : _O.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_Q = (_P = state.callData) == null ? void 0 : _P.status) == null ? void 0 : _Q.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
|
|
3454
|
+
disabled: ((_S = (_R = state.callData) == null ? void 0 : _R.status) == null ? void 0 : _S.toUpperCase()) !== "ONCALL" && ((_T = state.callData) == null ? void 0 : _T.hold) !== 1 || holdOrUnHoldLoading,
|
|
3455
|
+
children: holdOrUnHoldLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3456
|
+
import_material4.CircularProgress,
|
|
3457
|
+
{
|
|
3458
|
+
size: "20px",
|
|
3459
|
+
sx: {
|
|
3460
|
+
color: theme.palette.primary.main
|
|
3461
|
+
}
|
|
3462
|
+
}
|
|
3463
|
+
) : ((_U = state.callData) == null ? void 0 : _U.hold) === 1 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.PlayArrow, {}) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Pause, {})
|
|
3464
|
+
}
|
|
3465
|
+
) }),
|
|
3466
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: ((_V = state.callData) == null ? void 0 : _V.mute) === 1 ? "Unmute" : "Mute", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3467
|
+
import_material4.Button,
|
|
3468
|
+
{
|
|
3469
|
+
variant: state.isHolding ? "outlined" : ((_W = state.callData) == null ? void 0 : _W.mute) === 1 && ((_Y = (_X = state.callData) == null ? void 0 : _X.status) == null ? void 0 : _Y.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
|
|
3470
|
+
onClick: (e) => {
|
|
3471
|
+
e.stopPropagation();
|
|
3472
|
+
handleMuteToggle();
|
|
3473
|
+
},
|
|
3474
|
+
sx: ((_Z = state.callData) == null ? void 0 : _Z.hold) === 1 ? __spreadValues({}, disabled) : ((__ = state.callData) == null ? void 0 : __.mute) === 1 && ((_aa = (_$ = state.callData) == null ? void 0 : _$.status) == null ? void 0 : _aa.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_ca = (_ba = state.callData) == null ? void 0 : _ba.status) == null ? void 0 : _ca.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
|
|
3475
|
+
disabled: ((_ea = (_da = state.callData) == null ? void 0 : _da.status) == null ? void 0 : _ea.toUpperCase()) !== "ONCALL" && ((_fa = state.callData) == null ? void 0 : _fa.mute) !== 1 || muteOrUnMuteLoading || ((_ga = state.callData) == null ? void 0 : _ga.hold) === 1,
|
|
3476
|
+
children: muteOrUnMuteLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3477
|
+
import_material4.CircularProgress,
|
|
3478
|
+
{
|
|
3479
|
+
size: "20px",
|
|
3480
|
+
sx: {
|
|
3481
|
+
color: theme.palette.primary.main
|
|
3482
|
+
}
|
|
3483
|
+
}
|
|
3484
|
+
) : ((_ha = state.callData) == null ? void 0 : _ha.mute) === 1 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.MicOff, {}) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Mic, {})
|
|
3485
|
+
}
|
|
3486
|
+
) }),
|
|
3487
|
+
!((_ia = state.sdkConfig) == null ? void 0 : _ia.disableCallTransferButton) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Transfer Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3488
|
+
import_material4.Button,
|
|
3489
|
+
{
|
|
3490
|
+
variant: state.openCallTransferDialog ? "contained" : "outlined",
|
|
3491
|
+
onClick: (e) => {
|
|
3492
|
+
var _a3, _b2;
|
|
3493
|
+
if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) === "ONCALL") {
|
|
3494
|
+
e.stopPropagation();
|
|
3495
|
+
sdkStateManager.setOpenCallTransferDialog(true);
|
|
3496
|
+
}
|
|
3497
|
+
},
|
|
3498
|
+
sx: state.openCallTransferDialog ? __spreadValues({}, enabled) : ((_ka = (_ja = state.callData) == null ? void 0 : _ja.status) == null ? void 0 : _ka.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
|
|
3499
|
+
disabled: ((_ma = (_la = state.callData) == null ? void 0 : _la.status) == null ? void 0 : _ma.toUpperCase()) !== "ONCALL",
|
|
3500
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.TransferWithinAStation, {})
|
|
3501
|
+
}
|
|
3502
|
+
) }),
|
|
3503
|
+
!((_na = state.sdkConfig) == null ? void 0 : _na.disableConferenceButton) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Conference Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3504
|
+
import_material4.Button,
|
|
3505
|
+
{
|
|
3506
|
+
variant: state.openConferenceDialog ? "contained" : "outlined",
|
|
3507
|
+
onClick: (e) => {
|
|
3508
|
+
var _a3, _b2;
|
|
3509
|
+
if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) === "ONCALL") {
|
|
3510
|
+
e.stopPropagation();
|
|
3511
|
+
sdkStateManager.setOpenConferenceDialog(true);
|
|
3512
|
+
}
|
|
3513
|
+
},
|
|
3514
|
+
sx: state.openConferenceDialog ? __spreadValues({}, enabled) : ((_pa = (_oa = state.callData) == null ? void 0 : _oa.status) == null ? void 0 : _pa.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
|
|
3515
|
+
disabled: ((_ra = (_qa = state.callData) == null ? void 0 : _qa.status) == null ? void 0 : _ra.toUpperCase()) !== "ONCALL",
|
|
3516
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Group, {})
|
|
3517
|
+
}
|
|
3518
|
+
) }),
|
|
3519
|
+
!((_sa = state.sdkConfig) == null ? void 0 : _sa.disableEndCallButton) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "End Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3520
|
+
import_material4.Button,
|
|
3521
|
+
{
|
|
3522
|
+
variant: ((_ua = (_ta = state.callData) == null ? void 0 : _ta.status) == null ? void 0 : _ua.toUpperCase()) === "ONCALL" || ((_wa = (_va = state.callData) == null ? void 0 : _va.status) == null ? void 0 : _wa.toUpperCase()) === "RINGING" || ((_ya = (_xa = state.callData) == null ? void 0 : _xa.status) == null ? void 0 : _ya.toUpperCase()) === "WRAPUP" ? "contained" : "outlined",
|
|
3523
|
+
onClick: (e) => {
|
|
3524
|
+
var _a3, _b2, _c2, _d2, _e2, _f2;
|
|
3525
|
+
if (((_b2 = (_a3 = state.callData) == null ? void 0 : _a3.status) == null ? void 0 : _b2.toUpperCase()) === "ONCALL" || ((_d2 = (_c2 = state.callData) == null ? void 0 : _c2.status) == null ? void 0 : _d2.toUpperCase()) === "RINGING" || ((_f2 = (_e2 = state.callData) == null ? void 0 : _e2.status) == null ? void 0 : _f2.toUpperCase()) === "WRAPUP") {
|
|
3526
|
+
e.stopPropagation();
|
|
3527
|
+
setOpenCallDisposition(true);
|
|
3528
|
+
}
|
|
3529
|
+
},
|
|
3530
|
+
sx: ((_Aa = (_za = state.callData) == null ? void 0 : _za.status) == null ? void 0 : _Aa.toUpperCase()) === "ONCALL" || ((_Ca = (_Ba = state.callData) == null ? void 0 : _Ba.status) == null ? void 0 : _Ca.toUpperCase()) === "RINGING" || ((_Ea = (_Da = state.callData) == null ? void 0 : _Da.status) == null ? void 0 : _Ea.toUpperCase()) === "WRAPUP" ? __spreadProps(__spreadValues({}, enabled), {
|
|
3531
|
+
borderRight: "1px",
|
|
3532
|
+
backgroundColor: "error.main",
|
|
3533
|
+
minWidth: "60px !important",
|
|
3534
|
+
boxShadow: " 0px 2px 1px #5f3f3f",
|
|
3535
|
+
border: `1px solid ${theme.palette.error.light}`,
|
|
3536
|
+
height: "40px",
|
|
3537
|
+
"&:hover": {
|
|
3538
|
+
bgcolor: "error.light",
|
|
3539
|
+
boxShadow: " 0px 2px 1px #5f3f3f",
|
|
3540
|
+
border: `0px solid ${theme.palette.error.light}`
|
|
3541
|
+
},
|
|
3542
|
+
"&:active": {
|
|
3543
|
+
bgcolor: "error.light",
|
|
3544
|
+
boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
|
|
3545
|
+
}
|
|
3546
|
+
}) : __spreadProps(__spreadValues({}, disabled), {
|
|
3547
|
+
minWidth: "60px !important"
|
|
3548
|
+
}),
|
|
3549
|
+
disabled: ((_Ga = (_Fa = state.callData) == null ? void 0 : _Fa.status) == null ? void 0 : _Ga.toUpperCase()) !== "ONCALL" && ((_Ia = (_Ha = state.callData) == null ? void 0 : _Ha.status) == null ? void 0 : _Ia.toUpperCase()) !== "RINGING" && ((_Ka = (_Ja = state.callData) == null ? void 0 : _Ja.status) == null ? void 0 : _Ka.toUpperCase()) !== "WRAPUP" || endCallLoading,
|
|
3550
|
+
children: endCallLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3551
|
+
import_material4.CircularProgress,
|
|
3552
|
+
{
|
|
3553
|
+
size: "20px",
|
|
3554
|
+
color: "error"
|
|
3555
|
+
}
|
|
3556
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.CallEnd, {})
|
|
3557
|
+
}
|
|
3558
|
+
) })
|
|
3559
|
+
]
|
|
3560
|
+
}
|
|
3561
|
+
)
|
|
3562
|
+
]
|
|
3563
|
+
}
|
|
3564
|
+
)
|
|
3565
|
+
}
|
|
3566
|
+
)
|
|
3567
|
+
}
|
|
3568
|
+
) }),
|
|
3569
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3570
|
+
import_material4.Fade,
|
|
3571
|
+
{
|
|
3572
|
+
in: true,
|
|
3573
|
+
timeout: 300,
|
|
3574
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
3575
|
+
import_material4.Paper,
|
|
3576
|
+
{
|
|
3577
|
+
ref: iframeDragRef,
|
|
3578
|
+
elevation: iframeIsDragging ? 4 : 1,
|
|
3579
|
+
sx: {
|
|
3580
|
+
position: "absolute",
|
|
3581
|
+
left: iframePosition.x,
|
|
3582
|
+
top: iframePosition.y,
|
|
3583
|
+
borderRadius: 2,
|
|
3584
|
+
bgcolor: "background.paper",
|
|
3585
|
+
zIndex: Number.MAX_SAFE_INTEGER,
|
|
3586
|
+
transition: theme.transitions.create(["box-shadow", "transform"], {
|
|
3587
|
+
duration: theme.transitions.duration.short
|
|
3588
|
+
}),
|
|
3589
|
+
visibility: showIframe && !((_La = state.sdkConfig) == null ? void 0 : _La.disableSoftPhone) ? "visible" : "hidden",
|
|
3590
|
+
userSelect: "none"
|
|
3591
|
+
},
|
|
3592
|
+
children: [
|
|
3593
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
3594
|
+
import_material4.Box,
|
|
3595
|
+
{
|
|
3596
|
+
sx: {
|
|
3597
|
+
display: "flex",
|
|
3598
|
+
alignItems: "center",
|
|
3599
|
+
justifyContent: "space-between",
|
|
3600
|
+
cursor: "all-scroll",
|
|
3601
|
+
padding: "0px 10px"
|
|
3602
|
+
},
|
|
3603
|
+
onMouseDown: iframeHandleMouseDown,
|
|
3604
|
+
onTouchStart: iframeHandleTouchStart,
|
|
3605
|
+
children: [
|
|
3606
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3607
|
+
import_icons_material2.DragIndicator,
|
|
3608
|
+
{
|
|
3609
|
+
sx: {
|
|
3610
|
+
transform: "rotate(90deg)",
|
|
3611
|
+
color: "#7b7b7b"
|
|
3612
|
+
}
|
|
3613
|
+
}
|
|
3614
|
+
),
|
|
3615
|
+
" ",
|
|
3616
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.IconButton, { onClick: () => setShowIframe(false), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Close, {}) })
|
|
3617
|
+
]
|
|
3618
|
+
}
|
|
3619
|
+
),
|
|
3620
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3621
|
+
"iframe",
|
|
3622
|
+
{
|
|
3623
|
+
src: `https://${IP}/ConVoxCCS/iframe?agent_id=${state.agentId}&process_id=${(_Ma = state.process) == null ? void 0 : _Ma.process_id}`,
|
|
3624
|
+
height: 380,
|
|
3625
|
+
width: 420,
|
|
3626
|
+
allow: "camera; microphone; autoplay",
|
|
3627
|
+
style: {
|
|
3628
|
+
border: "none"
|
|
3629
|
+
}
|
|
3630
|
+
}
|
|
3631
|
+
) })
|
|
3632
|
+
]
|
|
3633
|
+
}
|
|
3634
|
+
)
|
|
3635
|
+
}
|
|
3636
|
+
),
|
|
3637
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3638
|
+
import_material4.Menu,
|
|
3639
|
+
{
|
|
3640
|
+
anchorEl: dialerAnchorEl,
|
|
3641
|
+
open: Boolean(dialerAnchorEl),
|
|
3642
|
+
onClose: handleCloseDialer,
|
|
3643
|
+
onClick: (e) => e.stopPropagation(),
|
|
3644
|
+
sx: {
|
|
3645
|
+
zIndex: 99999
|
|
3646
|
+
},
|
|
3647
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
3648
|
+
import_material4.Box,
|
|
3649
|
+
{
|
|
3650
|
+
sx: {
|
|
3651
|
+
all: "unset",
|
|
3652
|
+
padding: "10px",
|
|
3653
|
+
"&hover": {
|
|
3654
|
+
backgroundColor: "white"
|
|
3655
|
+
}
|
|
3656
|
+
},
|
|
3657
|
+
children: [
|
|
3658
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3659
|
+
import_material4.TextField,
|
|
3660
|
+
{
|
|
3661
|
+
size: "small",
|
|
3662
|
+
value: phoneNumber,
|
|
3663
|
+
placeholder: "Enter Mobile No.",
|
|
3664
|
+
onChange: (e) => {
|
|
3665
|
+
setPhoneNumber(e.target.value);
|
|
3666
|
+
}
|
|
3667
|
+
}
|
|
3668
|
+
),
|
|
3669
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3670
|
+
import_material4.IconButton,
|
|
3671
|
+
{
|
|
3672
|
+
color: "info",
|
|
3673
|
+
onClick: () => {
|
|
3674
|
+
handleStartCall(phoneNumber);
|
|
3675
|
+
},
|
|
3676
|
+
children: clickToCallLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3677
|
+
import_material4.CircularProgress,
|
|
3678
|
+
{
|
|
3679
|
+
size: "20px",
|
|
3680
|
+
sx: {
|
|
3681
|
+
color: theme.palette.success.main
|
|
3682
|
+
}
|
|
3683
|
+
}
|
|
3684
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Phone, { color: "success" })
|
|
3685
|
+
}
|
|
3686
|
+
)
|
|
3687
|
+
]
|
|
3688
|
+
}
|
|
3689
|
+
)
|
|
3690
|
+
}
|
|
3691
|
+
),
|
|
3692
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3693
|
+
import_material4.Menu,
|
|
3694
|
+
{
|
|
3695
|
+
anchorEl: statusAnchorEl,
|
|
3696
|
+
open: Boolean(statusAnchorEl),
|
|
3697
|
+
onClose: handleCloseAgentStatus,
|
|
3698
|
+
onClick: (e) => e.stopPropagation(),
|
|
3699
|
+
sx: {
|
|
3700
|
+
zIndex: 99999
|
|
3701
|
+
},
|
|
3702
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.MenuItem, { onClick: () => handleUpdateAgentStatus("Lunch"), children: "- Break" })
|
|
3703
|
+
}
|
|
3704
|
+
),
|
|
3705
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3706
|
+
import_material4.Menu,
|
|
3707
|
+
{
|
|
3708
|
+
anchorEl,
|
|
3709
|
+
open: Boolean(anchorEl),
|
|
3710
|
+
onClose: handleCloseQueueCounts,
|
|
3711
|
+
onClick: (e) => e.stopPropagation(),
|
|
3712
|
+
sx: {
|
|
3713
|
+
zIndex: 99999
|
|
3714
|
+
},
|
|
3715
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
3716
|
+
import_material4.Box,
|
|
3717
|
+
{
|
|
3718
|
+
sx: {
|
|
3719
|
+
display: "flex",
|
|
3720
|
+
justifyContent: "flex-start",
|
|
3721
|
+
flexDirection: "column",
|
|
3722
|
+
padding: "0px 10px",
|
|
3723
|
+
"&hover": {
|
|
3724
|
+
backgroundColor: "white"
|
|
3725
|
+
}
|
|
3726
|
+
},
|
|
3727
|
+
children: [
|
|
3728
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3729
|
+
import_material4.Chip,
|
|
3730
|
+
{
|
|
3731
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Layers, { color: "secondary" }),
|
|
3732
|
+
variant: "outlined",
|
|
3733
|
+
label: "Waiting - 25",
|
|
3734
|
+
sx: {
|
|
3735
|
+
margin: "4px 2px"
|
|
3736
|
+
}
|
|
3737
|
+
}
|
|
3738
|
+
),
|
|
3739
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3740
|
+
import_material4.Chip,
|
|
3741
|
+
{
|
|
3742
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Pending, { color: "info" }),
|
|
3743
|
+
label: "Pending - 99+",
|
|
3744
|
+
variant: "outlined",
|
|
3745
|
+
sx: {
|
|
3746
|
+
margin: "4px 2px"
|
|
3747
|
+
}
|
|
3748
|
+
}
|
|
3749
|
+
),
|
|
3750
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3751
|
+
import_material4.Chip,
|
|
3752
|
+
{
|
|
3753
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Upcoming, { color: "success" }),
|
|
3754
|
+
variant: "outlined",
|
|
3755
|
+
label: "Upcoming - 66",
|
|
3756
|
+
sx: {
|
|
3757
|
+
margin: "4px 2px"
|
|
3758
|
+
}
|
|
3759
|
+
}
|
|
3760
|
+
)
|
|
3761
|
+
]
|
|
3762
|
+
}
|
|
3763
|
+
)
|
|
3764
|
+
}
|
|
3765
|
+
),
|
|
3766
|
+
Boolean(state.openConferenceDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ConferenceDialog, {}),
|
|
3767
|
+
Boolean(state.openCallTransferDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CallTransferDialog, { open: state.openCallTransferDialog }),
|
|
3768
|
+
Boolean(openCallDisposition) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3769
|
+
EndCallDispositionDialog,
|
|
3770
|
+
{
|
|
3771
|
+
open: openCallDisposition,
|
|
3772
|
+
setOpen: setOpenCallDisposition,
|
|
3773
|
+
onSubmitDisposition: handleEndCall
|
|
3774
|
+
}
|
|
3775
|
+
),
|
|
3776
|
+
Boolean(openCallHistoryDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
3777
|
+
CallHistoryDialog,
|
|
3778
|
+
{
|
|
3779
|
+
open: openCallHistoryDialog,
|
|
3780
|
+
setOpen: setOpenCallHistoryDialog
|
|
3781
|
+
}
|
|
3782
|
+
)
|
|
3783
|
+
] });
|
|
3784
|
+
}
|
|
3785
|
+
|
|
3786
|
+
// call-control-sdk/lib/components/SDKProvider.tsx
|
|
3787
|
+
var import_react12 = require("react");
|
|
3788
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
3789
|
+
var SDKProvider = (0, import_react12.memo)(({ children }) => {
|
|
3790
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ToastProvider, { children });
|
|
3791
|
+
});
|
|
3792
|
+
SDKProvider.displayName = "SDKProvider";
|
|
3793
|
+
|
|
3794
|
+
// call-control-sdk/lib/components/callControlPanel.tsx
|
|
3795
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
3796
|
+
var CallControlPanel = (0, import_react13.memo)(({ onDataChange }) => {
|
|
3797
|
+
const handleDataChange = (0, import_react13.useCallback)(
|
|
3798
|
+
(data) => {
|
|
3799
|
+
try {
|
|
3800
|
+
if (onDataChange && typeof onDataChange === "function") {
|
|
3801
|
+
onDataChange(data);
|
|
3802
|
+
}
|
|
3803
|
+
} catch (error) {
|
|
3804
|
+
console.error("Error in CallControlPanel data change handler:", error);
|
|
3805
|
+
}
|
|
3806
|
+
},
|
|
3807
|
+
[onDataChange]
|
|
3808
|
+
);
|
|
3809
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SDKProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CallControls, { onDataChange: handleDataChange }) });
|
|
3810
|
+
});
|
|
3811
|
+
CallControlPanel.displayName = "CallControlPanel";
|
|
3812
|
+
|
|
3813
|
+
// call-control-sdk/index.ts
|
|
3814
|
+
async function initSDK({
|
|
3815
|
+
apiKey,
|
|
3816
|
+
tenantId,
|
|
3817
|
+
agentId,
|
|
3818
|
+
sdkConfig
|
|
3819
|
+
}) {
|
|
3820
|
+
if (!apiKey || typeof apiKey !== "string" || apiKey.trim().length === 0) {
|
|
3821
|
+
throw new Error(
|
|
3822
|
+
"SDK initialization failed: API key is required and must be a non-empty string"
|
|
3823
|
+
);
|
|
3824
|
+
}
|
|
3825
|
+
if (!tenantId || typeof tenantId !== "string" || tenantId.trim().length === 0) {
|
|
3826
|
+
throw new Error(
|
|
3827
|
+
"SDK initialization failed: Tenant ID is required and must be a non-empty string"
|
|
3828
|
+
);
|
|
3829
|
+
}
|
|
3830
|
+
if (!agentId || typeof agentId !== "string" || agentId.trim().length === 0) {
|
|
3831
|
+
throw new Error(
|
|
3832
|
+
"SDK initialization failed: Agent ID is required and must be a non-empty string"
|
|
3833
|
+
);
|
|
3834
|
+
}
|
|
3835
|
+
try {
|
|
3836
|
+
const initResult = await eventTracker.init({
|
|
3837
|
+
apiKey: apiKey.trim(),
|
|
3838
|
+
tenantId: tenantId.trim(),
|
|
3839
|
+
agentId: agentId.trim(),
|
|
3840
|
+
baseUrl: BASE_URL
|
|
3841
|
+
});
|
|
3842
|
+
if (initResult) {
|
|
3843
|
+
console.log("SDK initialized successfully");
|
|
3844
|
+
sdkStateManager.initialize(
|
|
3845
|
+
apiKey.trim(),
|
|
3846
|
+
tenantId.trim(),
|
|
3847
|
+
agentId.trim(),
|
|
3848
|
+
sdkConfig,
|
|
3849
|
+
initResult
|
|
3850
|
+
);
|
|
3851
|
+
} else {
|
|
3852
|
+
console.error("SDK initialization failed: Event tracker initialization returned false");
|
|
3853
|
+
sdkStateManager.setInitCheck();
|
|
3854
|
+
throw new Error(
|
|
3855
|
+
"SDK initialization failed: Unable to establish connection with the CTI system"
|
|
3856
|
+
);
|
|
3857
|
+
}
|
|
3858
|
+
} catch (error) {
|
|
3859
|
+
console.error("SDK initialization error:", error);
|
|
3860
|
+
sdkStateManager.setInitCheck();
|
|
3861
|
+
if (error instanceof Error) {
|
|
3862
|
+
throw error;
|
|
3863
|
+
} else {
|
|
3864
|
+
throw new Error(`SDK initialization failed: ${String(error)}`);
|
|
3865
|
+
}
|
|
3866
|
+
}
|
|
3867
|
+
}
|
|
3868
|
+
function getSDKVersion() {
|
|
3869
|
+
return "6.x.x";
|
|
3870
|
+
}
|
|
3871
|
+
function isSDKInitialized() {
|
|
3872
|
+
return sdkStateManager.getState().isInitialized;
|
|
3873
|
+
}
|
|
3874
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
3875
|
+
0 && (module.exports = {
|
|
3876
|
+
CallControlPanel,
|
|
3877
|
+
getSDKVersion,
|
|
3878
|
+
initSDK,
|
|
3879
|
+
isSDKInitialized,
|
|
3880
|
+
useClickToCall,
|
|
3881
|
+
useEndCall,
|
|
3882
|
+
useGetAuthorizationToken,
|
|
3883
|
+
useGetCallerData,
|
|
3884
|
+
useLogout
|
|
3885
|
+
});
|
|
2
3886
|
//# sourceMappingURL=index.js.map
|