call-control-sdk 5.0.3 → 5.0.4

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/index.js CHANGED
@@ -1,2954 +1,2 @@
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
- initSDK: () => initSDK,
53
- useLogout: () => useLogout_default
54
- });
55
- module.exports = __toCommonJS(index_exports);
56
-
57
- // call-control-sdk/lib/components/callControlPanel.tsx
58
- var import_icons_material2 = require("@mui/icons-material");
59
- var import_material4 = require("@mui/material");
60
- var import_react6 = require("react");
61
-
62
- // call-control-sdk/lib/hooks/sdk-state.ts
63
- var SDKStateManager = class {
64
- constructor() {
65
- __publicField(this, "state");
66
- __publicField(this, "listeners", []);
67
- __publicField(this, "STORAGE_KEY", "call-control-sdk-state");
68
- this.state = this.getInitialState();
69
- this.loadFromStorage();
70
- }
71
- getInitialState() {
72
- return {
73
- apiKey: null,
74
- process: null,
75
- agentId: "",
76
- isInitialized: false,
77
- isHolding: false,
78
- isMuted: false,
79
- status: "idle",
80
- callStartTime: null,
81
- controlPanelPosition: { x: 10, y: 10 },
82
- iframePosition: { x: 10, y: 80 },
83
- callData: {
84
- agent_id: "",
85
- status: "",
86
- type: "",
87
- event_time: "",
88
- phone_number: ""
89
- },
90
- conferenceLine: [
91
- {
92
- line: 1,
93
- status: "IDLE",
94
- type: "",
95
- phone: "",
96
- isMute: false,
97
- isHold: false,
98
- isCallStart: false,
99
- isMergeCall: false
100
- },
101
- {
102
- line: 2,
103
- status: "IDLE",
104
- type: "",
105
- phone: "",
106
- isMute: false,
107
- isHold: false,
108
- isCallStart: false,
109
- isMergeCall: false
110
- },
111
- {
112
- line: 3,
113
- status: "IDLE",
114
- type: "",
115
- phone: "",
116
- isMute: false,
117
- isHold: false,
118
- isCallStart: false,
119
- isMergeCall: false
120
- },
121
- {
122
- line: 4,
123
- status: "IDLE",
124
- type: "",
125
- phone: "",
126
- isMute: false,
127
- isHold: false,
128
- isCallStart: false,
129
- isMergeCall: false
130
- },
131
- {
132
- line: 5,
133
- status: "IDLE",
134
- type: "",
135
- phone: "",
136
- isMute: false,
137
- isHold: false,
138
- isCallStart: false,
139
- isMergeCall: false
140
- }
141
- ]
142
- };
143
- }
144
- loadFromStorage() {
145
- try {
146
- const stored = localStorage.getItem(this.STORAGE_KEY);
147
- if (stored) {
148
- const parsedState = JSON.parse(stored);
149
- this.state = __spreadProps(__spreadValues({}, this.state), {
150
- apiKey: parsedState.apiKey || "",
151
- agentId: parsedState.agentId || "",
152
- process: parsedState.process || null,
153
- isInitialized: parsedState.isInitialized || false,
154
- isHolding: parsedState.isHolding || false,
155
- isMuted: parsedState.isMuted || false,
156
- status: parsedState.status || "idle",
157
- callStartTime: parsedState.callStartTime || null,
158
- controlPanelPosition: parsedState.controlPanelPosition || {
159
- x: 10,
160
- y: 10
161
- },
162
- iframePosition: parsedState.iframePosition || { x: 10, y: 80 },
163
- callData: parsedState.callData || {
164
- mobileNumber: "",
165
- callReferenceId: "",
166
- agentLoginId: ""
167
- },
168
- // Fix: Properly handle conferenceLine with fallback to initial state
169
- conferenceLine: parsedState.conferenceLine && Array.isArray(parsedState.conferenceLine) && parsedState.conferenceLine.length > 0 ? parsedState.conferenceLine : this.state.conferenceLine
170
- });
171
- }
172
- } catch (error) {
173
- console.warn("Failed to load SDK state from localStorage:", error);
174
- }
175
- }
176
- saveToStorage() {
177
- try {
178
- const persistentState = {
179
- apiKey: this.state.apiKey,
180
- agentId: this.state.agentId,
181
- process: this.state.process,
182
- isInitialized: this.state.isInitialized,
183
- isHolding: this.state.isHolding,
184
- isMuted: this.state.isMuted,
185
- status: this.state.status,
186
- callStartTime: this.state.callStartTime,
187
- controlPanelPosition: this.state.controlPanelPosition,
188
- iframePosition: this.state.iframePosition,
189
- callData: this.state.callData,
190
- conferenceLine: this.state.conferenceLine
191
- };
192
- localStorage.setItem(this.STORAGE_KEY, JSON.stringify(persistentState));
193
- } catch (error) {
194
- console.warn("Failed to save SDK state to localStorage:", error);
195
- }
196
- }
197
- notifyListeners() {
198
- this.listeners.forEach((listener) => listener());
199
- }
200
- initialize(apiKey, agentId) {
201
- if (!apiKey || typeof apiKey !== "string" || apiKey.trim().length === 0) {
202
- throw new Error("API key not available");
203
- }
204
- this.state.apiKey = apiKey;
205
- this.state.agentId = agentId;
206
- this.state.isInitialized = true;
207
- this.saveToStorage();
208
- this.notifyListeners();
209
- }
210
- getState() {
211
- return __spreadValues({}, this.state);
212
- }
213
- subscribe(listener) {
214
- this.listeners.push(listener);
215
- return () => {
216
- const index = this.listeners.indexOf(listener);
217
- if (index > -1) {
218
- this.listeners.splice(index, 1);
219
- }
220
- };
221
- }
222
- setHolding(isHolding) {
223
- this.state.isHolding = isHolding;
224
- this.saveToStorage();
225
- this.notifyListeners();
226
- }
227
- setMuted(isMuted) {
228
- this.state.isMuted = isMuted;
229
- this.saveToStorage();
230
- this.notifyListeners();
231
- }
232
- setStatus(status) {
233
- this.state.status = status;
234
- this.saveToStorage();
235
- this.notifyListeners();
236
- }
237
- setProcess(process) {
238
- this.state.process = process;
239
- this.saveToStorage();
240
- this.notifyListeners();
241
- }
242
- setControlPanelPosition(position) {
243
- this.state.controlPanelPosition = position;
244
- this.saveToStorage();
245
- this.notifyListeners();
246
- }
247
- setIframePosition(position) {
248
- this.state.iframePosition = position;
249
- this.saveToStorage();
250
- this.notifyListeners();
251
- }
252
- startCall() {
253
- this.state.callStartTime = Date.now();
254
- this.state.status = "on call";
255
- this.saveToStorage();
256
- this.notifyListeners();
257
- }
258
- endCall() {
259
- this.state.callStartTime = null;
260
- this.state.status = "idle";
261
- this.state.isHolding = false;
262
- this.state.isMuted = false;
263
- this.saveToStorage();
264
- this.notifyListeners();
265
- }
266
- updateCallData(data) {
267
- this.state.callData = __spreadValues(__spreadValues({}, this.state.callData), data);
268
- this.saveToStorage();
269
- this.notifyListeners();
270
- }
271
- setConferenceLine(line) {
272
- var _a;
273
- if (!this.state.conferenceLine || !Array.isArray(this.state.conferenceLine)) {
274
- console.warn("Conference line data corrupted, resetting to initial state");
275
- this.state.conferenceLine = this.getInitialState().conferenceLine;
276
- }
277
- const conferenceLineData = (_a = this.state.conferenceLine) == null ? void 0 : _a.map((each) => {
278
- if (each.line === line.line) {
279
- return line;
280
- }
281
- return each;
282
- });
283
- this.state.conferenceLine = conferenceLineData;
284
- this.saveToStorage();
285
- this.notifyListeners();
286
- }
287
- resetConferenceLines() {
288
- this.state.conferenceLine = this.getInitialState().conferenceLine;
289
- this.saveToStorage();
290
- this.notifyListeners();
291
- }
292
- clearStorageAndReset() {
293
- try {
294
- localStorage.removeItem(this.STORAGE_KEY);
295
- this.state = this.getInitialState();
296
- this.notifyListeners();
297
- } catch (error) {
298
- console.warn("Failed to clear localStorage:", error);
299
- }
300
- }
301
- // Debug methods
302
- debugStorage() {
303
- try {
304
- const stored = localStorage.getItem(this.STORAGE_KEY);
305
- console.log("Current localStorage data:", stored);
306
- if (stored) {
307
- console.log("Parsed localStorage data:", JSON.parse(stored));
308
- }
309
- console.log("Current state:", this.state);
310
- } catch (error) {
311
- console.error("Error debugging storage:", error);
312
- }
313
- }
314
- getConferenceLines() {
315
- return this.state.conferenceLine || [];
316
- }
317
- };
318
- var sdkStateManager = new SDKStateManager();
319
-
320
- // call-control-sdk/lib/hooks/useDraggable.ts
321
- var import_react = require("react");
322
- function useDraggable(initialPosition, onPositionChange) {
323
- const [position, setPosition] = (0, import_react.useState)(initialPosition);
324
- const [isDragging, setIsDragging] = (0, import_react.useState)(false);
325
- const dragRef = (0, import_react.useRef)();
326
- const dragStart = (0, import_react.useRef)({ x: 0, y: 0 });
327
- const elementStart = (0, import_react.useRef)({ x: 0, y: 0 });
328
- const updatePosition = (0, import_react.useCallback)(
329
- (newPosition) => {
330
- const element = dragRef.current;
331
- if (!element) return;
332
- const rect = element.getBoundingClientRect();
333
- const viewportWidth = window.innerWidth;
334
- const viewportHeight = window.innerHeight;
335
- const constrainedPosition = {
336
- x: Math.max(0, Math.min(newPosition.x, viewportWidth - rect.width)),
337
- y: Math.max(0, Math.min(newPosition.y, viewportHeight - rect.height))
338
- };
339
- setPosition(constrainedPosition);
340
- onPositionChange == null ? void 0 : onPositionChange(constrainedPosition);
341
- },
342
- [onPositionChange]
343
- );
344
- const handleStart = (0, import_react.useCallback)(
345
- (clientX, clientY) => {
346
- setIsDragging(true);
347
- dragStart.current = { x: clientX, y: clientY };
348
- elementStart.current = position;
349
- const handleMove = (moveClientX, moveClientY) => {
350
- const deltaX = moveClientX - dragStart.current.x;
351
- const deltaY = moveClientY - dragStart.current.y;
352
- updatePosition({
353
- x: elementStart.current.x + deltaX,
354
- y: elementStart.current.y + deltaY
355
- });
356
- };
357
- const handleMouseMove = (e) => {
358
- e.preventDefault();
359
- handleMove(e.clientX, e.clientY);
360
- };
361
- const handleTouchMove = (e) => {
362
- e.preventDefault();
363
- const touch = e.touches[0];
364
- if (touch) {
365
- handleMove(touch.clientX, touch.clientY);
366
- }
367
- };
368
- const handleEnd = () => {
369
- setIsDragging(false);
370
- document.removeEventListener("mousemove", handleMouseMove);
371
- document.removeEventListener("mouseup", handleEnd);
372
- document.removeEventListener("touchmove", handleTouchMove);
373
- document.removeEventListener("touchend", handleEnd);
374
- };
375
- document.addEventListener("mousemove", handleMouseMove);
376
- document.addEventListener("mouseup", handleEnd);
377
- document.addEventListener("touchmove", handleTouchMove, {
378
- passive: false
379
- });
380
- document.addEventListener("touchend", handleEnd);
381
- },
382
- [position, updatePosition]
383
- );
384
- const handleMouseDown = (0, import_react.useCallback)(
385
- (e) => {
386
- e.preventDefault();
387
- handleStart(e.clientX, e.clientY);
388
- },
389
- [handleStart]
390
- );
391
- const handleTouchStart = (0, import_react.useCallback)(
392
- (e) => {
393
- e.preventDefault();
394
- const touch = e.touches[0];
395
- if (touch) {
396
- handleStart(touch.clientX, touch.clientY);
397
- }
398
- },
399
- [handleStart]
400
- );
401
- return {
402
- position,
403
- isDragging,
404
- dragRef,
405
- handleMouseDown,
406
- handleTouchStart
407
- };
408
- }
409
-
410
- // call-control-sdk/lib/hooks/useSDKState.ts
411
- var import_react2 = require("react");
412
- function useSDKState() {
413
- const [state, setState] = (0, import_react2.useState)(sdkStateManager.getState());
414
- (0, import_react2.useEffect)(() => {
415
- const unsubscribe = sdkStateManager.subscribe(() => {
416
- setState(sdkStateManager.getState());
417
- });
418
- return unsubscribe;
419
- }, []);
420
- return state;
421
- }
422
-
423
- // call-control-sdk/lib/services/endPoint.ts
424
- var BASE_URL = "http://192.168.101.177:8095";
425
- var WS_BASE_URL = "ws://192.168.101.177:8095";
426
- var VERSION = {
427
- v1: "/api/v1"
428
- };
429
- var END_POINT = {
430
- LOGIN: `${BASE_URL}${VERSION.v1}/cti/login?provider=convox`,
431
- READY_AGENT: `${BASE_URL}${VERSION.v1}/cti/ready-agent?provider=convox`,
432
- UPDATE_AGENT_BREAK: `${BASE_URL}${VERSION.v1}/cti/update-agent-break?provider=convox`,
433
- CLICK_TO_CALL: `${BASE_URL}${VERSION.v1}/cti/click-to-call?provider=convox`,
434
- HOLD_CALL: `${BASE_URL}${VERSION.v1}/cti/hold-call?provider=convox`,
435
- MUTE_CALL: `${BASE_URL}${VERSION.v1}/cti/mute-call?provider=convox`,
436
- UNMUTE_CALL: `${BASE_URL}${VERSION.v1}/cti/unmute-call?provider=convox`,
437
- END_CALL: `${BASE_URL}${VERSION.v1}/cti/end-call?provider=convox`,
438
- LOGOUT: `${BASE_URL}${VERSION.v1}/cti/logout?provider=convox`,
439
- CONFERENCE_CALL: `${BASE_URL}${VERSION.v1}/cti/conference-call?provider=convox`,
440
- CONFERENCE_CALL_HOLD_OR_UN_HOLD: `${BASE_URL}${VERSION.v1}/cti/conference-call/hold-unhold?provider=convox`,
441
- CONFERENCE_CALL_MUTE_OT_UN_MUTE: `${BASE_URL}${VERSION.v1}/cti/conference-call/mute-unmute?provider=convox`,
442
- CONFERENCE_CALL_END: `${BASE_URL}${VERSION.v1}/cti/conference-call/hangup?provider=convox`,
443
- CONFERENCE_CALL_END_ALL: `${BASE_URL}${VERSION.v1}/cti/conference-call/hangup-all-call?provider=convox`,
444
- TRANSFER_CALL: `${BASE_URL}${VERSION.v1}/cti/transfer?provider=convox`,
445
- AGENTS_LIST: `${BASE_URL}${VERSION.v1}/cti/users`,
446
- PROCESS_LIST: `${BASE_URL}${VERSION.v1}/cti/processes-list`,
447
- TRANSFER_TO_DETAILS: `${BASE_URL}${VERSION.v1}/cti/trasnfer-to-details?provider=convox`
448
- };
449
- var WS_END_POINT = {
450
- WS: `${WS_BASE_URL}${VERSION.v1}/cti/ws`
451
- };
452
-
453
- // call-control-sdk/lib/services/request.ts
454
- var import_react4 = require("react");
455
-
456
- // call-control-sdk/lib/services/axios.ts
457
- var import_axios = __toESM(require("axios"));
458
- var token = "12345";
459
- var axiosInstance = import_axios.default.create({
460
- baseURL: BASE_URL,
461
- // Base URL from Vite environment variables
462
- headers: {
463
- "Content-Type": "application/json",
464
- // Default content type for requests
465
- Authorization: token
466
- // Attach token if available (as raw, without Bearer prefix)
467
- },
468
- timeout: 1e4
469
- // Request timeout in milliseconds (10 seconds)
470
- });
471
- axiosInstance.interceptors.request.use(
472
- (config) => {
473
- const token2 = "12345";
474
- if (token2 && config.headers) {
475
- config.headers.Authorization = `Bearer ${token2}`;
476
- }
477
- return config;
478
- },
479
- /**
480
- * @here Handles request errors.
481
- * @description Converts unknown request error types into standardized JavaScript Error.
482
- */
483
- (error) => Promise.reject(error instanceof Error ? error : new Error(String(error)))
484
- );
485
- axiosInstance.interceptors.response.use(
486
- (response) => response,
487
- // Pass through successful response
488
- async (error) => {
489
- var _a;
490
- const originalRequest = error.config;
491
- if (((_a = error.response) == null ? void 0 : _a.status) === 401 && !originalRequest._retry) {
492
- originalRequest._retry = true;
493
- }
494
- return Promise.reject(
495
- error instanceof Error ? error : new Error(String(error))
496
- );
497
- }
498
- );
499
- var axios_default = axiosInstance;
500
-
501
- // call-control-sdk/lib/services/toastMessage.tsx
502
- var import_material = require("@mui/material");
503
- var import_react3 = require("react");
504
- var import_jsx_runtime = require("react/jsx-runtime");
505
- function useToast() {
506
- const [open, setOpen] = (0, import_react3.useState)(false);
507
- const handleClose = (_event, reason) => {
508
- if (reason === "clickaway") {
509
- return;
510
- }
511
- setOpen(false);
512
- };
513
- const showToast = (message, type) => {
514
- setOpen(true);
515
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
516
- import_material.Snackbar,
517
- {
518
- anchorOrigin: { vertical: "top", horizontal: "right" },
519
- open,
520
- onClose: handleClose,
521
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
522
- import_material.Alert,
523
- {
524
- onClose: handleClose,
525
- severity: type,
526
- variant: "filled",
527
- sx: { width: "100%" },
528
- children: message
529
- }
530
- )
531
- }
532
- );
533
- };
534
- return { showToast };
535
- }
536
-
537
- // call-control-sdk/lib/services/request.ts
538
- var initialState = {
539
- isLoading: false,
540
- // Initially not loading
541
- isSuccess: false,
542
- // Initially no success
543
- isError: false,
544
- // Initially no error
545
- error: null,
546
- // No error to show
547
- data: null
548
- // No data to show
549
- };
550
- var reducer = (state, action) => {
551
- if (action.type === "isLoading") {
552
- return __spreadProps(__spreadValues({}, state), {
553
- isLoading: action.payload
554
- });
555
- } else if (action.type === "isSuccess") {
556
- return __spreadProps(__spreadValues({}, state), {
557
- isSuccess: true,
558
- data: action.payload
559
- });
560
- } else if (action.type === "isError") {
561
- return __spreadProps(__spreadValues({}, state), {
562
- isError: true,
563
- error: action.payload
564
- });
565
- } else if (action.type === "reset") {
566
- return {
567
- isLoading: false,
568
- isSuccess: false,
569
- isError: false,
570
- error: null,
571
- data: null
572
- };
573
- }
574
- throw Error("Unknown action.");
575
- };
576
- var usePostRequest = (props = {}) => {
577
- const { onSuccess = null, onError = null } = props;
578
- const { showToast } = useToast();
579
- const [state, dispatch] = (0, import_react4.useReducer)(reducer, initialState);
580
- const postRequest = (0, import_react4.useCallback)(
581
- (url, payload, config = {}) => {
582
- dispatch({
583
- type: "isLoading",
584
- payload: true
585
- });
586
- axios_default.post(url, payload, config).then((res) => {
587
- dispatch({
588
- type: "isSuccess",
589
- payload: res.data
590
- });
591
- onSuccess == null ? void 0 : onSuccess(res.data, payload);
592
- }).catch((err) => {
593
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
594
- const error = {
595
- status: (_b = (_a = err.response) == null ? void 0 : _a.status) != null ? _b : 500,
596
- 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",
597
- data: (_h = (_g = err.response) == null ? void 0 : _g.data) != null ? _h : null,
598
- statusText: (_j = (_i = err.response) == null ? void 0 : _i.statusText) != null ? _j : "",
599
- code: (_k = err == null ? void 0 : err.code) != null ? _k : "",
600
- name: (_l = err == null ? void 0 : err.name) != null ? _l : ""
601
- };
602
- showToast(error.message, "error");
603
- dispatch({
604
- type: "isError",
605
- payload: error
606
- });
607
- onError == null ? void 0 : onError(error, payload);
608
- }).finally(() => {
609
- dispatch({
610
- type: "isLoading",
611
- payload: false
612
- });
613
- });
614
- },
615
- [onSuccess, onError, showToast]
616
- // Dependencies for memoization
617
- );
618
- return [postRequest, state];
619
- };
620
-
621
- // call-control-sdk/lib/components/dialog.tsx
622
- var import_icons_material = require("@mui/icons-material");
623
- var import_material3 = require("@mui/material");
624
- var import_react5 = require("react");
625
-
626
- // call-control-sdk/lib/components/styles.ts
627
- var import_material2 = require("@mui/material");
628
- var useMyStyles = () => {
629
- const theme = (0, import_material2.useTheme)();
630
- return {
631
- disabled: {
632
- padding: "0px",
633
- margin: "0px",
634
- minWidth: "40px !important",
635
- borderRadius: "16px",
636
- border: `1px solid rgb(206, 204, 204)`,
637
- height: "40px",
638
- "&:hover": {
639
- boxShadow: " 0px 2px 2px rgba(0, 0, 0, 0.79)",
640
- border: `1px solid ${theme.palette.primary.main}`
641
- },
642
- "&:active": {
643
- bgcolor: "primary.main",
644
- boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
645
- }
646
- },
647
- enabled: {
648
- padding: "0px",
649
- margin: "0px",
650
- minWidth: "40px !important",
651
- borderRadius: "16px",
652
- boxShadow: " 0px 2px 1px rgba(0, 0, 0, 0.507)",
653
- border: `1px solid ${theme.palette.primary.main}`,
654
- height: "40px",
655
- "&:hover": {
656
- boxShadow: " 0px 2px 1px rgba(0, 0, 0, 0.507)",
657
- border: `1px solid ${theme.palette.primary.main}`
658
- },
659
- "&:active": {
660
- bgcolor: "primary.main",
661
- boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
662
- }
663
- },
664
- outlined: {
665
- padding: "0px",
666
- margin: "0px",
667
- minWidth: "40px !important",
668
- borderRadius: "16px",
669
- backgroundColor: theme.palette.grey[200],
670
- boxShadow: `0px 2px 1px ${theme.palette.primary.light}`,
671
- border: `0px solid ${theme.palette.primary.main}`,
672
- height: "40px",
673
- "&:hover": {
674
- boxShadow: `0px 2px 1px ${theme.palette.primary.main}`,
675
- border: `0px solid ${theme.palette.primary.main}`
676
- },
677
- "&:active": {
678
- bgcolor: "primary.main",
679
- boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
680
- }
681
- }
682
- };
683
- };
684
- var styles_default = useMyStyles;
685
-
686
- // call-control-sdk/lib/components/dialog.tsx
687
- var import_jsx_runtime2 = require("react/jsx-runtime");
688
- function ConferenceDialog({ open, setOpen }) {
689
- var _a, _b;
690
- const state = useSDKState();
691
- const { disabled, enabled, outlined } = styles_default();
692
- const theme = (0, import_material3.useTheme)();
693
- const handleClose = () => {
694
- setOpen(false);
695
- };
696
- const onConferenceLineUpdate = (line, data) => {
697
- sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
698
- };
699
- const onConferenceCallStart = (line, data) => {
700
- var _a2, _b2, _c, _d;
701
- const line_used = __spreadValues(__spreadValues({}, line), data);
702
- const payload = {
703
- action: "EXTERNAL_CONFERENCE",
704
- operation: `CALL${line_used.line}`,
705
- line_used: String(line_used.line),
706
- thirdparty_no: line_used.phone,
707
- userid: (_b2 = (_a2 = state.callData) == null ? void 0 : _a2.agent_id) != null ? _b2 : "",
708
- process: (_d = (_c = state.callData) == null ? void 0 : _c.process_name) != null ? _d : ""
709
- };
710
- axios_default.post(END_POINT.CONFERENCE_CALL, payload).then(() => {
711
- sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
712
- });
713
- };
714
- const onMergeConferenceCall = (line, data) => {
715
- var _a2, _b2, _c, _d;
716
- const line_used = __spreadValues(__spreadValues({}, line), data);
717
- const payload = {
718
- action: "EXTERNAL_CONFERENCE",
719
- operation: `CONFERENCE`,
720
- line_used: String(line_used.line),
721
- thirdparty_no: line_used.phone,
722
- userid: (_b2 = (_a2 = state.callData) == null ? void 0 : _a2.agent_id) != null ? _b2 : "",
723
- process: (_d = (_c = state.callData) == null ? void 0 : _c.process_name) != null ? _d : ""
724
- };
725
- axios_default.post(END_POINT.CONFERENCE_CALL, payload).then(() => {
726
- sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
727
- });
728
- };
729
- const onHoldOrUnHoldConferenceCall = (line, data, type) => {
730
- var _a2, _b2, _c, _d;
731
- const line_used = __spreadValues(__spreadValues({}, line), data);
732
- const payload = {
733
- action: "EXTERNAL_CONFERENCE",
734
- operation: type,
735
- hold_channel_no: type === "HOLDUSER" ? `hold${line_used.line}` : `unhold${line_used.line}`,
736
- // Change the line according where u intiated firstly
737
- userid: (_b2 = (_a2 = state.callData) == null ? void 0 : _a2.agent_id) != null ? _b2 : "",
738
- process: (_d = (_c = state.callData) == null ? void 0 : _c.process_name) != null ? _d : ""
739
- };
740
- axios_default.post(END_POINT.CONFERENCE_CALL_HOLD_OR_UN_HOLD, payload).then(() => {
741
- sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
742
- });
743
- };
744
- const onMuteOrUnMuteConferenceCall = (line, data, type) => {
745
- var _a2, _b2, _c, _d;
746
- const line_used = __spreadValues(__spreadValues({}, line), data);
747
- const payload = {
748
- action: "EXTERNAL_CONFERENCE",
749
- operation: type,
750
- channel_no: type === "MUTEUSER" ? `mute${line_used.line}` : `play${line_used.line}`,
751
- userid: (_b2 = (_a2 = state.callData) == null ? void 0 : _a2.agent_id) != null ? _b2 : "",
752
- thirdparty_no: line_used.phone,
753
- process: (_d = (_c = state.callData) == null ? void 0 : _c.process_name) != null ? _d : ""
754
- };
755
- axios_default.post(END_POINT.CONFERENCE_CALL_MUTE_OT_UN_MUTE, payload).then(() => {
756
- sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
757
- });
758
- };
759
- const onEndConferenceCall = (line, data) => {
760
- var _a2, _b2, _c, _d;
761
- const line_used = __spreadValues(__spreadValues({}, line), data);
762
- const payload = {
763
- action: "EXTERNAL_CONFERENCE",
764
- operation: "HANGUP_CHANNEL",
765
- line_used: String(line_used.line - 1),
766
- user_type: `THIRDPARTY${line_used.line - 1}`,
767
- thirdparty_no: line_used.phone,
768
- userid: (_b2 = (_a2 = state.callData) == null ? void 0 : _a2.agent_id) != null ? _b2 : "",
769
- process: (_d = (_c = state.callData) == null ? void 0 : _c.process_name) != null ? _d : ""
770
- };
771
- axios_default.post(END_POINT.CONFERENCE_CALL_END, payload).then(() => {
772
- sdkStateManager.setConferenceLine(__spreadValues(__spreadValues({}, line), data));
773
- });
774
- };
775
- const onEndAllConferenceCalls = () => {
776
- var _a2, _b2, _c, _d;
777
- const payload = {
778
- action: "EXTERNAL_CONFERENCE",
779
- operation: "ENDCONFERENCE",
780
- userid: (_b2 = (_a2 = state.callData) == null ? void 0 : _a2.agent_id) != null ? _b2 : "",
781
- process: (_d = (_c = state.callData) == null ? void 0 : _c.process_name) != null ? _d : ""
782
- };
783
- axios_default.post(END_POINT.CONFERENCE_CALL_END_ALL, payload).then(() => {
784
- sdkStateManager.resetConferenceLines();
785
- handleClose();
786
- });
787
- };
788
- (0, import_react5.useEffect)(() => {
789
- var _a2, _b2, _c, _d;
790
- const obj = {
791
- line: 1,
792
- status: (_b2 = (_a2 = state.callData) == null ? void 0 : _a2.status) != null ? _b2 : "",
793
- type: "internal",
794
- phone: (_d = (_c = state.callData) == null ? void 0 : _c.phone_number) != null ? _d : "",
795
- isMute: false,
796
- isHold: false,
797
- isMergeCall: false,
798
- isCallStart: true
799
- };
800
- sdkStateManager.setConferenceLine(obj);
801
- }, []);
802
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
803
- import_material3.Dialog,
804
- {
805
- open,
806
- "aria-labelledby": "alert-dialog-title",
807
- "aria-describedby": "alert-dialog-description",
808
- fullWidth: true,
809
- maxWidth: "md",
810
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
811
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
812
- import_material3.Box,
813
- {
814
- sx: {
815
- display: "flex",
816
- justifyContent: "space-between",
817
- alignItems: "center",
818
- padding: "4px 16px"
819
- },
820
- children: [
821
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Typography, { variant: "body1", children: [
822
- (_a = state == null ? void 0 : state.agentId) != null ? _a : "",
823
- " conference"
824
- ] }),
825
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
826
- ]
827
- }
828
- ),
829
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
830
- import_material3.Box,
831
- {
832
- sx: {
833
- boxShadow: "0px 1px 2px #e7e5e5ff",
834
- padding: "2px 6px",
835
- margin: "0px 10px",
836
- borderRadius: "20px"
837
- },
838
- children: (_b = state == null ? void 0 : state.conferenceLine) == null ? void 0 : _b.map((each, index) => {
839
- var _a2, _b2;
840
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
841
- import_material3.Box,
842
- {
843
- sx: {
844
- p: 1,
845
- display: "flex",
846
- alignItems: "center",
847
- justifyContent: "space-between",
848
- gap: 1
849
- },
850
- children: [
851
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
852
- import_material3.Box,
853
- {
854
- sx: {
855
- color: "white",
856
- bgcolor: "warning.main",
857
- fontWeight: "bold",
858
- fontSize: 14,
859
- minWidth: 70,
860
- textAlign: "center",
861
- border: "2px solid primary.main",
862
- borderRadius: "10px 50px 50px 10px"
863
- },
864
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { children: (_a2 = each == null ? void 0 : each.line) != null ? _a2 : "" })
865
- }
866
- ),
867
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
868
- import_material3.Typography,
869
- {
870
- variant: "body2",
871
- sx: {
872
- px: 1,
873
- border: "2px solid gray",
874
- borderRadius: "10px",
875
- textAlign: "center",
876
- width: "80px",
877
- maxWidth: "100px"
878
- },
879
- children: (_b2 = each == null ? void 0 : each.status) != null ? _b2 : ""
880
- }
881
- ),
882
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
883
- import_material3.Button,
884
- {
885
- sx: {
886
- textTransform: "capitalize"
887
- },
888
- size: "small",
889
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body2", children: (each == null ? void 0 : each.line) === 1 ? "Internal" : "External" })
890
- }
891
- ),
892
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
893
- import_material3.TextField,
894
- {
895
- size: "small",
896
- placeholder: "Phone Number",
897
- value: (each == null ? void 0 : each.phone) || "",
898
- disabled: (each == null ? void 0 : each.line) === 1,
899
- onChange: (e) => {
900
- onConferenceLineUpdate(each, { phone: e.target.value });
901
- }
902
- }
903
- ),
904
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "Call", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
905
- import_material3.Button,
906
- {
907
- variant: (each == null ? void 0 : each.isCallStart) ? "outlined" : "contained",
908
- color: "success",
909
- sx: (each == null ? void 0 : each.isCallStart) ? __spreadValues({}, disabled) : __spreadProps(__spreadValues({}, enabled), {
910
- border: `0px solid ${theme.palette.success.light}`,
911
- "&:hover": {
912
- bgcolor: "error.light",
913
- boxShadow: `0px 2px 1px ${theme.palette.success.light}`,
914
- border: `0px solid ${theme.palette.success.light}`
915
- },
916
- "&:active": {
917
- bgcolor: "error.light",
918
- boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
919
- }
920
- }),
921
- onClick: () => {
922
- onConferenceCallStart(each, {
923
- isCallStart: true,
924
- status: "ONCALL"
925
- });
926
- },
927
- disabled: each == null ? void 0 : each.isCallStart,
928
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
929
- import_icons_material.Call,
930
- {
931
- sx: { color: (each == null ? void 0 : each.isCallStart) ? "defalult" : "#fff" }
932
- }
933
- )
934
- }
935
- ) }),
936
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "Merge Call", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
937
- import_material3.Button,
938
- {
939
- variant: (each == null ? void 0 : each.isMergeCall) ? "contained" : "outlined",
940
- sx: (each == null ? void 0 : each.isMergeCall) && (each == null ? void 0 : each.isCallStart) ? __spreadValues({}, disabled) : (each == null ? void 0 : each.isCallStart) ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
941
- onClick: () => {
942
- onMergeConferenceCall(each, {
943
- isMergeCall: true,
944
- status: "ONCALL"
945
- });
946
- },
947
- disabled: !(each == null ? void 0 : each.isCallStart),
948
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.CallSplit, {})
949
- }
950
- ) }),
951
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: each.isHold ? "Hold" : "Un Hold", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
952
- import_material3.Button,
953
- {
954
- variant: (each == null ? void 0 : each.isHold) ? "contained" : "outlined",
955
- sx: (each == null ? void 0 : each.isHold) && (each == null ? void 0 : each.isCallStart) ? __spreadValues({}, disabled) : (each == null ? void 0 : each.isCallStart) ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
956
- onClick: () => {
957
- if (each.isHold) {
958
- onHoldOrUnHoldConferenceCall(
959
- each,
960
- { isHold: false },
961
- "UNHOLDUSER"
962
- );
963
- } else {
964
- onHoldOrUnHoldConferenceCall(
965
- each,
966
- { isHold: true },
967
- "HOLDUSER"
968
- );
969
- }
970
- },
971
- disabled: !(each == null ? void 0 : each.isCallStart),
972
- children: each.isHold ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.PlayArrow, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Pause, {})
973
- }
974
- ) }),
975
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: each.isMute ? "Mute" : "Un Mute", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
976
- import_material3.Button,
977
- {
978
- variant: (each == null ? void 0 : each.isMute) ? "contained" : "outlined",
979
- sx: (each == null ? void 0 : each.isMute) && (each == null ? void 0 : each.isCallStart) ? __spreadValues({}, disabled) : (each == null ? void 0 : each.isCallStart) ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
980
- onClick: () => {
981
- if (each.isMute) {
982
- onMuteOrUnMuteConferenceCall(
983
- each,
984
- { isMute: false },
985
- "PLAYUSER"
986
- );
987
- } else {
988
- onMuteOrUnMuteConferenceCall(
989
- each,
990
- { isMute: true },
991
- "MUTEUSER"
992
- );
993
- }
994
- },
995
- disabled: !(each == null ? void 0 : each.isCallStart),
996
- children: each.isMute ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.MicOff, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Mic, {})
997
- }
998
- ) }),
999
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Tooltip, { title: "End Call", children: (each == null ? void 0 : each.line) !== 1 ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1000
- import_material3.Button,
1001
- {
1002
- variant: (each == null ? void 0 : each.isCallStart) ? "contained" : "outlined",
1003
- color: "error",
1004
- sx: (each == null ? void 0 : each.isCallStart) ? __spreadProps(__spreadValues({}, enabled), {
1005
- minWidth: "60px !important",
1006
- border: `0px solid ${theme.palette.error.light}`,
1007
- "&:hover": {
1008
- bgcolor: "error.light",
1009
- boxShadow: `0px 2px 1px ${theme.palette.error.light}`,
1010
- border: `0px solid ${theme.palette.error.light}`
1011
- },
1012
- "&:active": {
1013
- bgcolor: "error.light",
1014
- boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
1015
- }
1016
- }) : __spreadProps(__spreadValues({}, disabled), { minWidth: "60px !important" }),
1017
- onClick: () => {
1018
- onEndConferenceCall(each, {
1019
- isCallStart: false,
1020
- isMergeCall: false,
1021
- isMute: false,
1022
- isHold: false,
1023
- status: "IDLE"
1024
- });
1025
- },
1026
- disabled: !(each == null ? void 0 : each.isCallStart),
1027
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.CallEnd, {})
1028
- }
1029
- ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1030
- import_material3.Button,
1031
- {
1032
- variant: (each == null ? void 0 : each.isCallStart) ? "contained" : "outlined",
1033
- sx: __spreadProps(__spreadValues({}, disabled), {
1034
- visibility: "hidden",
1035
- minWidth: "60px !important"
1036
- }),
1037
- onClick: () => {
1038
- onEndConferenceCall(each, {
1039
- isCallStart: false,
1040
- isMergeCall: false,
1041
- isMute: false,
1042
- isHold: false,
1043
- status: "IDLE"
1044
- });
1045
- },
1046
- disabled: !(each == null ? void 0 : each.isCallStart),
1047
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1048
- import_icons_material.CallEnd,
1049
- {
1050
- sx: {
1051
- visibility: "hidden"
1052
- }
1053
- }
1054
- ) })
1055
- }
1056
- ) })
1057
- ]
1058
- },
1059
- index
1060
- );
1061
- })
1062
- }
1063
- ),
1064
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { textAlign: "center", m: 2, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1065
- import_material3.Button,
1066
- {
1067
- variant: "outlined",
1068
- color: "error",
1069
- size: "large",
1070
- onClick: onEndAllConferenceCalls,
1071
- sx: { px: 2, borderRadius: "20px", textTransform: "capitalize" },
1072
- children: [
1073
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1074
- import_material3.IconButton,
1075
- {
1076
- sx: {
1077
- bgcolor: "error.main",
1078
- "&:hover": { bgcolor: "error.dark" },
1079
- marginRight: "8px",
1080
- width: "28px",
1081
- height: "28px",
1082
- fontSize: "12px",
1083
- fontWeight: "600",
1084
- lineHeight: "16px",
1085
- letterSpacing: "0.02em",
1086
- textTransform: "capitalize",
1087
- color: "white",
1088
- display: "flex",
1089
- alignItems: "center",
1090
- justifyContent: "center",
1091
- borderRadius: "50%"
1092
- },
1093
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1094
- import_icons_material.PhoneDisabled,
1095
- {
1096
- sx: {
1097
- color: "white",
1098
- fontSize: "16px",
1099
- fontWeight: "600"
1100
- }
1101
- }
1102
- )
1103
- }
1104
- ),
1105
- "End Conference"
1106
- ]
1107
- }
1108
- ) })
1109
- ] })
1110
- }
1111
- ) });
1112
- }
1113
- function CallTransferDialog({ open, setOpen }) {
1114
- var _a, _b, _c, _d, _e, _f, _g, _h;
1115
- const [transferCall] = usePostRequest({
1116
- onSuccess: (res) => {
1117
- console.log("res", res);
1118
- setOpen(false);
1119
- },
1120
- onError: (error) => {
1121
- console.log("error", error);
1122
- }
1123
- });
1124
- const state = useSDKState();
1125
- const [currentselecteTab, setCurrentselecteTab] = (0, import_react5.useState)("process");
1126
- const [getIdelAgentsList, { data: idleAgentsList }] = usePostRequest();
1127
- const [getProcessAndQueuesList, { data: processAndQueuesList }] = usePostRequest();
1128
- const handleClose = () => {
1129
- setOpen(false);
1130
- };
1131
- const handleTransferCall = (data, type) => {
1132
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _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;
1133
- console.log(data, "data34");
1134
- if (type === "PROCESS") {
1135
- const payload = {
1136
- mobile_number: (_b2 = (_a2 = state.callData) == null ? void 0 : _a2.phone_number) != null ? _b2 : "",
1137
- userid: (_d2 = (_c2 = state.callData) == null ? void 0 : _c2.agent_id) != null ? _d2 : "",
1138
- type: "PROCESS",
1139
- transfer_to: (_e2 = data == null ? void 0 : data.process_name) != null ? _e2 : "",
1140
- callreferenceid: (_g2 = (_f2 = state.callData) == null ? void 0 : _f2.convox_id) != null ? _g2 : "",
1141
- processid: String((_i = (_h2 = state.callData) == null ? void 0 : _h2.process_id) != null ? _i : ""),
1142
- process_name: (_k = (_j = state.callData) == null ? void 0 : _j.process_name) != null ? _k : ""
1143
- };
1144
- transferCall(END_POINT.TRANSFER_CALL, payload);
1145
- } else if (type === "QUEUE") {
1146
- const payload = {
1147
- mobile_number: (_m = (_l = state.callData) == null ? void 0 : _l.phone_number) != null ? _m : "",
1148
- userid: (_o = (_n = state.callData) == null ? void 0 : _n.agent_id) != null ? _o : "",
1149
- type: "QUEUE",
1150
- transfer_to: (_p = data == null ? void 0 : data.queue_name) != null ? _p : "",
1151
- callreferenceid: (_r = (_q = state.callData) == null ? void 0 : _q.convox_id) != null ? _r : "",
1152
- processid: String((_t = (_s = state.callData) == null ? void 0 : _s.process_id) != null ? _t : ""),
1153
- process_name: (_v = (_u = state.callData) == null ? void 0 : _u.process_name) != null ? _v : ""
1154
- };
1155
- transferCall(END_POINT.TRANSFER_CALL, payload);
1156
- } else if (type === "AGENT") {
1157
- const payload = {
1158
- mobile_number: (_x = (_w = state.callData) == null ? void 0 : _w.phone_number) != null ? _x : "",
1159
- userid: (_z = (_y = state.callData) == null ? void 0 : _y.agent_id) != null ? _z : "",
1160
- type: "AGENT",
1161
- transfer_to: (_A = data == null ? void 0 : data.user_id) != null ? _A : "",
1162
- callreferenceid: (_C = (_B = state.callData) == null ? void 0 : _B.convox_id) != null ? _C : "",
1163
- processid: String((_E = (_D = state.callData) == null ? void 0 : _D.process_id) != null ? _E : ""),
1164
- process_name: (_G = (_F = state.callData) == null ? void 0 : _F.process_name) != null ? _G : ""
1165
- };
1166
- transferCall(END_POINT.TRANSFER_CALL, payload);
1167
- }
1168
- };
1169
- (0, import_react5.useEffect)(() => {
1170
- getIdelAgentsList(END_POINT.AGENTS_LIST, {
1171
- status: "IDLE",
1172
- active: true
1173
- });
1174
- getProcessAndQueuesList(END_POINT.TRANSFER_TO_DETAILS, {
1175
- status: "ACTIVE",
1176
- active: true
1177
- });
1178
- }, []);
1179
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1180
- import_material3.Dialog,
1181
- {
1182
- open,
1183
- "aria-labelledby": "alert-dialog-title",
1184
- "aria-describedby": "alert-dialog-description",
1185
- fullWidth: true,
1186
- maxWidth: "md",
1187
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
1188
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1189
- import_material3.Box,
1190
- {
1191
- sx: {
1192
- display: "flex",
1193
- justifyContent: "space-between",
1194
- alignItems: "center",
1195
- padding: "4px 16px",
1196
- boxShadow: "0px 1px 2px #f5f5f5ff"
1197
- },
1198
- children: [
1199
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Call Transfer" }),
1200
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
1201
- ]
1202
- }
1203
- ),
1204
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1205
- import_material3.Box,
1206
- {
1207
- sx: {
1208
- boxShadow: "1px 1px 4px #d3d3d3ff",
1209
- padding: "6px 10px",
1210
- margin: "10px",
1211
- borderRadius: "10px"
1212
- },
1213
- children: [
1214
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Box, { sx: { display: "flex", gap: 1 }, children: [
1215
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1216
- import_material3.Button,
1217
- {
1218
- variant: currentselecteTab === "process" ? "contained" : "outlined",
1219
- onClick: () => setCurrentselecteTab("process"),
1220
- children: "Process"
1221
- }
1222
- ),
1223
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1224
- import_material3.Button,
1225
- {
1226
- variant: currentselecteTab === "queues" ? "contained" : "outlined",
1227
- onClick: () => setCurrentselecteTab("queues"),
1228
- children: "Queues"
1229
- }
1230
- ),
1231
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1232
- import_material3.Button,
1233
- {
1234
- variant: currentselecteTab === "agents" ? "contained" : "outlined",
1235
- onClick: () => setCurrentselecteTab("agents"),
1236
- children: "Agents"
1237
- }
1238
- )
1239
- ] }),
1240
- currentselecteTab === "process" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1 }, children: ((_b = (_a = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _a.process) == null ? void 0 : _b.length) > 0 ? (_d = (_c = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _c.process) == null ? void 0 : _d.map(
1241
- (process, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1242
- import_material3.Box,
1243
- {
1244
- sx: {
1245
- p: 1,
1246
- display: "flex",
1247
- alignItems: "center",
1248
- boxShadow: "1px 1px 4px #d3d3d3ff",
1249
- padding: "6px",
1250
- margin: "10px 0px",
1251
- borderRadius: "10px",
1252
- "&:hover": { bgcolor: "action.selected" }
1253
- },
1254
- children: [
1255
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1256
- import_material3.Typography,
1257
- {
1258
- variant: "body1",
1259
- sx: {
1260
- mx: 1,
1261
- width: "200px",
1262
- maxWidth: "250px",
1263
- display: "flex",
1264
- alignItems: "center"
1265
- },
1266
- children: [
1267
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
1268
- process.process_name
1269
- ]
1270
- }
1271
- ),
1272
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1273
- import_material3.IconButton,
1274
- {
1275
- color: "success",
1276
- sx: {
1277
- bgcolor: "action.hover",
1278
- "&:hover": { bgcolor: "action.selected" }
1279
- },
1280
- onClick: () => {
1281
- handleTransferCall(process, "PROCESS");
1282
- },
1283
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
1284
- }
1285
- )
1286
- ]
1287
- },
1288
- index
1289
- )
1290
- ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1291
- import_material3.Typography,
1292
- {
1293
- variant: "body1",
1294
- sx: {
1295
- fontSize: "12px",
1296
- fontWeight: "600",
1297
- letterSpacing: "0.02em",
1298
- textTransform: "capitalize",
1299
- textAlign: "center",
1300
- width: "100%",
1301
- margin: "10px 0px",
1302
- color: "gray"
1303
- },
1304
- children: "No Process Found"
1305
- }
1306
- ) }),
1307
- currentselecteTab === "queues" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1 }, children: ((_f = (_e = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _e.queue) == null ? void 0 : _f.length) > 0 ? (_h = (_g = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _g.queue) == null ? void 0 : _h.map(
1308
- (queue, index) => {
1309
- var _a2, _b2, _c2, _d2, _e2, _f2;
1310
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1311
- import_material3.Box,
1312
- {
1313
- sx: {
1314
- p: 1,
1315
- display: "flex",
1316
- alignItems: "center",
1317
- boxShadow: "1px 1px 4px #d3d3d3ff",
1318
- padding: "6px",
1319
- margin: "10px 0px",
1320
- borderRadius: "10px",
1321
- "&:hover": { bgcolor: "action.selected" }
1322
- },
1323
- children: [
1324
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1325
- import_material3.Typography,
1326
- {
1327
- variant: "body1",
1328
- sx: {
1329
- mx: 1,
1330
- width: "200px",
1331
- maxWidth: "250px",
1332
- display: "flex",
1333
- alignItems: "center"
1334
- },
1335
- children: [
1336
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
1337
- queue.queue_name,
1338
- ((_c2 = (_b2 = (_a2 = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _a2.process) == null ? void 0 : _b2.find(
1339
- (process) => process.process_id === queue.process_id
1340
- )) == null ? void 0 : _c2.process_name) ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1341
- import_material3.Typography,
1342
- {
1343
- variant: "body1",
1344
- sx: {
1345
- fontSize: "12px",
1346
- fontWeight: "600",
1347
- letterSpacing: "0.02em",
1348
- textTransform: "capitalize",
1349
- color: "gray"
1350
- },
1351
- children: "(" + ((_f2 = (_e2 = (_d2 = processAndQueuesList == null ? void 0 : processAndQueuesList.data) == null ? void 0 : _d2.process) == null ? void 0 : _e2.find(
1352
- (process) => process.process_id === queue.process_id
1353
- )) == null ? void 0 : _f2.process_name) + ")"
1354
- }
1355
- ) : ""
1356
- ]
1357
- }
1358
- ),
1359
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1360
- import_material3.IconButton,
1361
- {
1362
- color: "success",
1363
- sx: {
1364
- bgcolor: "action.hover",
1365
- "&:hover": { bgcolor: "action.selected" }
1366
- },
1367
- onClick: () => {
1368
- handleTransferCall(queue, "QUEUE");
1369
- },
1370
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
1371
- }
1372
- )
1373
- ]
1374
- },
1375
- index
1376
- );
1377
- }
1378
- ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1379
- import_material3.Typography,
1380
- {
1381
- variant: "body1",
1382
- sx: {
1383
- fontSize: "12px",
1384
- fontWeight: "600",
1385
- letterSpacing: "0.02em",
1386
- textTransform: "capitalize",
1387
- textAlign: "center",
1388
- width: "100%",
1389
- margin: "10px 0px",
1390
- color: "gray"
1391
- },
1392
- children: "No Queues Found"
1393
- }
1394
- ) }),
1395
- currentselecteTab === "agents" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Box, { sx: { display: "flex", gap: 1 }, children: (idleAgentsList == null ? void 0 : idleAgentsList.length) > 0 ? idleAgentsList.map((agent, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1396
- import_material3.Box,
1397
- {
1398
- sx: {
1399
- p: 1,
1400
- display: "flex",
1401
- alignItems: "center",
1402
- boxShadow: "1px 1px 4px #d3d3d3ff",
1403
- padding: "6px",
1404
- margin: "10px 0px",
1405
- borderRadius: "10px",
1406
- "&:hover": { bgcolor: "action.selected" }
1407
- },
1408
- children: [
1409
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1410
- import_material3.Typography,
1411
- {
1412
- variant: "body1",
1413
- sx: {
1414
- mx: 1,
1415
- width: "200px",
1416
- maxWidth: "250px",
1417
- display: "flex",
1418
- alignItems: "center"
1419
- },
1420
- children: [
1421
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
1422
- agent.name
1423
- ]
1424
- }
1425
- ),
1426
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1427
- import_material3.IconButton,
1428
- {
1429
- color: "success",
1430
- sx: {
1431
- bgcolor: "action.hover",
1432
- "&:hover": { bgcolor: "action.selected" }
1433
- },
1434
- onClick: () => {
1435
- handleTransferCall(agent, "AGENT");
1436
- },
1437
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Call, {})
1438
- }
1439
- )
1440
- ]
1441
- },
1442
- index
1443
- )) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1444
- import_material3.Typography,
1445
- {
1446
- variant: "body1",
1447
- sx: {
1448
- fontSize: "12px",
1449
- fontWeight: "600",
1450
- letterSpacing: "0.02em",
1451
- textTransform: "capitalize",
1452
- textAlign: "center",
1453
- width: "100%",
1454
- margin: "10px 0px",
1455
- color: "gray"
1456
- },
1457
- children: "No Agents Found"
1458
- }
1459
- ) })
1460
- ]
1461
- }
1462
- )
1463
- ] })
1464
- }
1465
- ) });
1466
- }
1467
- function EndCallDispositionDialog({
1468
- open,
1469
- setOpen,
1470
- onSubmitDisposition
1471
- }) {
1472
- var _a, _b;
1473
- const [formData, setFormData] = (0, import_react5.useState)({
1474
- disposition: { label: "Resolved", value: "RES" },
1475
- followUp: { label: "No", value: "N" },
1476
- callbackDate: "",
1477
- callbackHrs: "",
1478
- callbackMins: ""
1479
- });
1480
- const dispositionOptions = [
1481
- { label: "Not Interested", value: "NI" },
1482
- { label: "Resolved", value: "RES" }
1483
- ];
1484
- const followUpOptions = [
1485
- { label: "Yes", value: "Y" },
1486
- { label: "No", value: "N" }
1487
- ];
1488
- const handleChange = (field, value) => {
1489
- setFormData((prev) => __spreadProps(__spreadValues({}, prev), { [field]: value }));
1490
- };
1491
- const handleReset = () => {
1492
- setFormData({
1493
- disposition: { label: "Resolved", value: "RES" },
1494
- followUp: { label: "No", value: "N" },
1495
- callbackDate: "",
1496
- callbackHrs: "",
1497
- callbackMins: ""
1498
- });
1499
- };
1500
- const handleClose = () => {
1501
- handleReset();
1502
- setOpen(false);
1503
- };
1504
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1505
- import_material3.Dialog,
1506
- {
1507
- open,
1508
- "aria-labelledby": "alert-dialog-title",
1509
- "aria-describedby": "alert-dialog-description",
1510
- fullWidth: true,
1511
- maxWidth: "xs",
1512
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
1513
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1514
- import_material3.Box,
1515
- {
1516
- sx: {
1517
- display: "flex",
1518
- justifyContent: "center",
1519
- alignItems: "center",
1520
- padding: "4px 16px",
1521
- boxShadow: "0px 1px 2px #f5f5f5ff"
1522
- },
1523
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Typography, { variant: "body1", m: 1, children: [
1524
- " ",
1525
- "Call Disposition"
1526
- ] })
1527
- }
1528
- ),
1529
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1530
- import_material3.Box,
1531
- {
1532
- sx: {
1533
- boxShadow: "1px 1px 4px #d3d3d3ff",
1534
- padding: "10px",
1535
- margin: "10px",
1536
- borderRadius: "10px"
1537
- },
1538
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Grid, { container: true, spacing: 2, children: [
1539
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Grid, { size: 6, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1540
- import_material3.Autocomplete,
1541
- {
1542
- value: formData.disposition,
1543
- options: dispositionOptions,
1544
- getOptionLabel: (opt) => opt.label,
1545
- onChange: (_, val) => handleChange("disposition", val),
1546
- size: "small",
1547
- renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.TextField, __spreadProps(__spreadValues({}, params), { label: "Disposition", fullWidth: true }))
1548
- }
1549
- ) }),
1550
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Grid, { size: 6, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1551
- import_material3.Autocomplete,
1552
- {
1553
- options: followUpOptions,
1554
- getOptionLabel: (opt) => opt.label,
1555
- value: formData.followUp,
1556
- onChange: (_, val) => handleChange("followUp", val),
1557
- size: "small",
1558
- renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.TextField, __spreadProps(__spreadValues({}, params), { label: "Follow Up", fullWidth: true }))
1559
- }
1560
- ) }),
1561
- ((_b = (_a = formData == null ? void 0 : formData.followUp) == null ? void 0 : _a.label) == null ? void 0 : _b.toLowerCase()) === "yes" && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
1562
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Grid, { size: 6, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1563
- import_material3.TextField,
1564
- {
1565
- size: "small",
1566
- label: "Callback Date",
1567
- type: "date",
1568
- slotProps: {
1569
- inputLabel: { shrink: true }
1570
- },
1571
- value: formData.callbackDate,
1572
- onChange: (e) => handleChange("callbackDate", e.target.value),
1573
- fullWidth: true
1574
- }
1575
- ) }),
1576
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Grid, { size: 6, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1577
- import_material3.TextField,
1578
- {
1579
- size: "small",
1580
- label: "Hours (0-23)",
1581
- type: "text",
1582
- inputProps: { min: 0, max: 23 },
1583
- value: formData.callbackHrs,
1584
- onChange: (e) => handleChange("callbackHrs", e.target.value),
1585
- fullWidth: true
1586
- }
1587
- ) }),
1588
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Grid, { size: 6, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1589
- import_material3.TextField,
1590
- {
1591
- size: "small",
1592
- label: "Minutes (0-59)",
1593
- type: "text",
1594
- inputProps: { min: 0, max: 59 },
1595
- value: formData.callbackMins,
1596
- onChange: (e) => handleChange("callbackMins", e.target.value),
1597
- fullWidth: true
1598
- }
1599
- ) })
1600
- ] })
1601
- ] })
1602
- }
1603
- ),
1604
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Box, { textAlign: "right", m: 2, children: [
1605
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1606
- import_material3.Button,
1607
- {
1608
- variant: "outlined",
1609
- color: "error",
1610
- size: "large",
1611
- onClick: handleClose,
1612
- sx: {
1613
- px: 2,
1614
- mx: 1,
1615
- borderRadius: "10px",
1616
- textTransform: "capitalize"
1617
- },
1618
- children: "cancel"
1619
- }
1620
- ),
1621
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1622
- import_material3.Button,
1623
- {
1624
- variant: "contained",
1625
- color: "primary",
1626
- size: "large",
1627
- onClick: () => onSubmitDisposition(formData),
1628
- sx: { px: 2, borderRadius: "10px", textTransform: "capitalize" },
1629
- children: "Submit"
1630
- }
1631
- )
1632
- ] })
1633
- ] })
1634
- }
1635
- ) });
1636
- }
1637
- function ProcessorListDialog({
1638
- open,
1639
- setOpen,
1640
- processList = [],
1641
- handleSelectedProcessor
1642
- }) {
1643
- const handleClose = () => {
1644
- setOpen(false);
1645
- };
1646
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1647
- import_material3.Dialog,
1648
- {
1649
- open,
1650
- "aria-labelledby": "alert-dialog-title",
1651
- "aria-describedby": "alert-dialog-description",
1652
- maxWidth: "xs",
1653
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
1654
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1655
- import_material3.Box,
1656
- {
1657
- sx: {
1658
- display: "flex",
1659
- justifyContent: "space-between",
1660
- alignItems: "center",
1661
- padding: "4px 16px",
1662
- boxShadow: "0px 1px 2px #f5f5f5ff"
1663
- },
1664
- children: [
1665
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Process List" }),
1666
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
1667
- ]
1668
- }
1669
- ),
1670
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1671
- import_material3.Box,
1672
- {
1673
- sx: {
1674
- boxShadow: "1px 1px 4px #d3d3d3ff",
1675
- padding: "6px 10px",
1676
- margin: "10px",
1677
- borderRadius: "10px"
1678
- },
1679
- children: (processList == null ? void 0 : processList.length) > 0 ? processList == null ? void 0 : processList.map((process, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1680
- import_material3.Box,
1681
- {
1682
- sx: {
1683
- p: 1,
1684
- display: "flex",
1685
- alignItems: "center",
1686
- boxShadow: "1px 1px 4px #d3d3d3ff",
1687
- padding: "6px",
1688
- margin: "10px 0px",
1689
- borderRadius: "10px",
1690
- cursor: "pointer",
1691
- "&:hover": { bgcolor: "action.selected" }
1692
- },
1693
- onClick: () => {
1694
- handleSelectedProcessor(process);
1695
- },
1696
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1697
- import_material3.Typography,
1698
- {
1699
- variant: "body1",
1700
- sx: {
1701
- mx: 1,
1702
- width: "200px",
1703
- maxWidth: "250px",
1704
- display: "flex",
1705
- alignItems: "center"
1706
- },
1707
- children: [
1708
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.SupportAgent, { sx: { marginRight: "4px" } }),
1709
- process.process_name
1710
- ]
1711
- }
1712
- )
1713
- },
1714
- index
1715
- )) : null
1716
- }
1717
- )
1718
- ] })
1719
- }
1720
- ) });
1721
- }
1722
- function CallHistoryDialog({ open, setOpen }) {
1723
- const handleClose = () => {
1724
- setOpen(false);
1725
- };
1726
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1727
- import_material3.Dialog,
1728
- {
1729
- open,
1730
- "aria-labelledby": "alert-dialog-title",
1731
- "aria-describedby": "alert-dialog-description",
1732
- fullWidth: true,
1733
- maxWidth: "md",
1734
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material3.Paper, { sx: { borderRadius: 2 }, children: [
1735
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
1736
- import_material3.Box,
1737
- {
1738
- sx: {
1739
- display: "flex",
1740
- justifyContent: "space-between",
1741
- alignItems: "center",
1742
- padding: "4px 16px",
1743
- boxShadow: "0px 1px 2px #f5f5f5ff"
1744
- },
1745
- children: [
1746
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.Typography, { variant: "body1", children: " Call History" }),
1747
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material3.IconButton, { onClick: handleClose, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.Close, {}) })
1748
- ]
1749
- }
1750
- ),
1751
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
1752
- import_material3.Box,
1753
- {
1754
- sx: {
1755
- boxShadow: "1px 1px 4px #d3d3d3ff",
1756
- margin: "10px",
1757
- borderRadius: "10px",
1758
- textAlign: "center",
1759
- fontSize: "16px",
1760
- fontWeight: "bold"
1761
- },
1762
- p: 6,
1763
- children: "Comming Soon..."
1764
- }
1765
- )
1766
- ] })
1767
- }
1768
- ) });
1769
- }
1770
-
1771
- // call-control-sdk/lib/components/callControlPanel.tsx
1772
- var import_jsx_runtime3 = require("react/jsx-runtime");
1773
- function CallControlPanel({ onDataChange }) {
1774
- var _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, _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;
1775
- const theme = (0, import_material4.useTheme)();
1776
- const { disabled, enabled, outlined } = styles_default();
1777
- const state = useSDKState();
1778
- const { showToast } = useToast();
1779
- const webSocketRef = (0, import_react6.useRef)(null);
1780
- const [anchorEl, setAnchorEl] = (0, import_react6.useState)(null);
1781
- const [showIframe, setShowIframe] = (0, import_react6.useState)(true);
1782
- const [statusAnchorEl, setStatusAnchorEl] = (0, import_react6.useState)(null);
1783
- const [dialerAnchorEl, setDialerAnchorEl] = (0, import_react6.useState)(null);
1784
- const [open, setOpen] = (0, import_react6.useState)(false);
1785
- const [openCallTransfer, setOpenCallTransfer] = (0, import_react6.useState)(false);
1786
- const [openCallDisposition, setOpenCallDisposition] = (0, import_react6.useState)(false);
1787
- const [openProcessorDialog, setOpenProcessorDialog] = (0, import_react6.useState)(false);
1788
- const [openCallHistoryDialog, setOpenCallHistoryDialog] = (0, import_react6.useState)(false);
1789
- const [phoneNumber, setPhoneNumber] = (0, import_react6.useState)("");
1790
- const [callDuration, setCallDuration] = (0, import_react6.useState)(0);
1791
- const { position, isDragging, dragRef, handleMouseDown, handleTouchStart } = useDraggable(
1792
- state.controlPanelPosition,
1793
- (newPosition) => sdkStateManager.setControlPanelPosition(newPosition)
1794
- );
1795
- const {
1796
- position: iframePosition,
1797
- isDragging: iframeIsDragging,
1798
- dragRef: iframeDragRef,
1799
- handleMouseDown: iframeHandleMouseDown,
1800
- handleTouchStart: iframeHandleTouchStart
1801
- } = useDraggable(
1802
- state.iframePosition,
1803
- (newPosition) => sdkStateManager.setIframePosition(newPosition)
1804
- );
1805
- const [getProcessList, { data: processList }] = usePostRequest({
1806
- onSuccess: (res) => {
1807
- var _a2;
1808
- console.log("res", res);
1809
- if (res && res.processes && ((_a2 = res == null ? void 0 : res.processes) == null ? void 0 : _a2.length) > 1) {
1810
- setOpenProcessorDialog(true);
1811
- } else {
1812
- sdkStateManager.setProcess(res == null ? void 0 : res.processes[0]);
1813
- setOpenProcessorDialog(false);
1814
- }
1815
- },
1816
- onError: () => {
1817
- setOpenProcessorDialog(false);
1818
- }
1819
- });
1820
- const [clickToCall] = usePostRequest();
1821
- const [holdOrUnHold] = usePostRequest({
1822
- onSuccess: () => {
1823
- sdkStateManager.setHolding(!state.isHolding);
1824
- },
1825
- onError: (error) => {
1826
- console.log("error", error);
1827
- }
1828
- });
1829
- const [muteOrUnMute] = usePostRequest({
1830
- onSuccess: () => {
1831
- sdkStateManager.setMuted(!state.isMuted);
1832
- },
1833
- onError: (error) => {
1834
- console.log("error", error);
1835
- }
1836
- });
1837
- const [readyAgentStatus] = usePostRequest();
1838
- const [updateAgentStatus] = usePostRequest();
1839
- const [endCall] = usePostRequest();
1840
- const formatDuration = (0, import_react6.useCallback)((seconds) => {
1841
- const mins = Math.floor(seconds / 60);
1842
- const secs = seconds % 60;
1843
- return `${mins.toString().padStart(2, "0")}:${secs.toString().padStart(2, "0")}`;
1844
- }, []);
1845
- const handleCloseQueueCounts = () => {
1846
- setAnchorEl(null);
1847
- };
1848
- const handleOpenDialer = (event) => {
1849
- setShowIframe(true);
1850
- setDialerAnchorEl(event.currentTarget);
1851
- sdkStateManager.setStatus("dial");
1852
- };
1853
- const handleCloseDialer = () => {
1854
- if (state.status !== "on call") {
1855
- sdkStateManager.setStatus("idle");
1856
- }
1857
- setDialerAnchorEl(null);
1858
- };
1859
- const handleOpenAgentStatus = (event) => {
1860
- setStatusAnchorEl(event.currentTarget);
1861
- };
1862
- const handleCloseAgentStatus = () => {
1863
- setStatusAnchorEl(null);
1864
- };
1865
- const handleAgentReady = () => {
1866
- const payload = {
1867
- action: "READYAGENT",
1868
- userId: state.agentId
1869
- };
1870
- readyAgentStatus(END_POINT.READY_AGENT, payload);
1871
- };
1872
- const handleUpdateAgentStatus = (status) => {
1873
- setStatusAnchorEl(null);
1874
- const payload = {
1875
- action: "AGENTBREAK",
1876
- break_type: status,
1877
- userId: state.agentId
1878
- };
1879
- updateAgentStatus(END_POINT.UPDATE_AGENT_BREAK, payload);
1880
- };
1881
- const handleStartCall = (number) => {
1882
- if (number.length !== 10) {
1883
- showToast("Invalid phone number", "error");
1884
- alert("Invalid phone number");
1885
- } else if (!/^\d+$/.test(number)) {
1886
- showToast("Invalid phone number", "error");
1887
- } else {
1888
- const payload = {
1889
- action: "CALL",
1890
- phone_number: number,
1891
- userId: state.agentId
1892
- };
1893
- clickToCall(END_POINT.CLICK_TO_CALL, payload);
1894
- }
1895
- };
1896
- const handleHoldToggle = () => {
1897
- const payload = {
1898
- action: state.isHolding ? "UNHOLD" : "HOLD",
1899
- userId: state.agentId
1900
- };
1901
- holdOrUnHold(END_POINT.HOLD_CALL, payload);
1902
- };
1903
- const handleMuteToggle = () => {
1904
- const payload = {
1905
- action: state.isMuted ? "UNMUTE" : "MUTE",
1906
- userId: state.agentId
1907
- };
1908
- muteOrUnMute(END_POINT.MUTE_CALL, payload);
1909
- };
1910
- const handleEndCall = (data) => {
1911
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2;
1912
- console.log("data", data);
1913
- const payload = {
1914
- action: "ENDCALL",
1915
- userId: state.agentId,
1916
- processid: (_c2 = (_b2 = (_a2 = state.process) == null ? void 0 : _a2.process_id) == null ? void 0 : _b2.toString()) != null ? _c2 : "",
1917
- process_name: (_e2 = (_d2 = state.process) == null ? void 0 : _d2.process_name) != null ? _e2 : "",
1918
- callreferenceid: (_g2 = (_f2 = state.callData) == null ? void 0 : _f2.convox_id) != null ? _g2 : "",
1919
- mobile_number: (_i2 = (_h2 = state.callData) == null ? void 0 : _h2.phone_number) != null ? _i2 : "",
1920
- disposition: (_k2 = (_j2 = data == null ? void 0 : data.disposition) == null ? void 0 : _j2.value) != null ? _k2 : "",
1921
- set_followUp: (_m2 = (_l2 = data == null ? void 0 : data.followUp) == null ? void 0 : _l2.value) != null ? _m2 : "",
1922
- callback_date: (_n2 = data == null ? void 0 : data.callbackDate) != null ? _n2 : "",
1923
- callback_hrs: (_o2 = data == null ? void 0 : data.callbackHrs) != null ? _o2 : "",
1924
- callback_mins: (_p2 = data == null ? void 0 : data.callbackMins) != null ? _p2 : "",
1925
- endcall_type: "CLOSE"
1926
- };
1927
- setPhoneNumber("");
1928
- endCall(END_POINT.END_CALL, payload);
1929
- sdkStateManager.endCall();
1930
- setOpenCallDisposition(false);
1931
- };
1932
- (0, import_react6.useEffect)(() => {
1933
- let interval;
1934
- if (state.callData.status && state.callData.status === "ONCALL") {
1935
- interval = setInterval(() => {
1936
- const elapsed = Math.floor((Date.now() - state.callStartTime) / 1e3);
1937
- setCallDuration(elapsed);
1938
- }, 1e3);
1939
- } else {
1940
- setCallDuration(0);
1941
- }
1942
- return () => {
1943
- if (interval) clearInterval(interval);
1944
- };
1945
- }, [state.callData.status]);
1946
- (0, import_react6.useEffect)(() => {
1947
- if (onDataChange) {
1948
- onDataChange(state.callData);
1949
- }
1950
- }, [state.callData, onDataChange]);
1951
- (0, import_react6.useEffect)(() => {
1952
- if (state.agentId) {
1953
- getProcessList(END_POINT.PROCESS_LIST, {
1954
- userId: state.agentId,
1955
- action: "GETAGENTPROCESSLIST",
1956
- refno: "1234221233"
1957
- });
1958
- } else {
1959
- console.log("No agentId available, skipping API call");
1960
- }
1961
- }, [state.agentId]);
1962
- (0, import_react6.useEffect)(() => {
1963
- if (state.agentId) {
1964
- webSocketRef.current = new WebSocket(`${WS_END_POINT.WS}?agent_id=${state.agentId}`);
1965
- webSocketRef.current.onopen = () => {
1966
- console.log("WebSocket connection established");
1967
- };
1968
- webSocketRef.current.onmessage = (event) => {
1969
- try {
1970
- const data = JSON.parse(event.data);
1971
- console.log("parsedJSON:", data);
1972
- sdkStateManager.updateCallData(data);
1973
- if (data.status === "ONCALL") {
1974
- sdkStateManager.startCall();
1975
- }
1976
- if (data.status === "WRAPUP") {
1977
- sdkStateManager.endCall();
1978
- }
1979
- } catch (e) {
1980
- console.log("Raw message:", event.data);
1981
- }
1982
- };
1983
- webSocketRef.current.onclose = () => {
1984
- console.log("WebSocket connection closed");
1985
- };
1986
- webSocketRef.current.onerror = (error) => {
1987
- console.error("WebSocket error:", error);
1988
- };
1989
- }
1990
- return () => {
1991
- var _a2;
1992
- (_a2 = webSocketRef.current) == null ? void 0 : _a2.close();
1993
- };
1994
- }, [state.agentId]);
1995
- if (!state.isInitialized || !state.process) {
1996
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Box, { children: Boolean(openProcessorDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
1997
- ProcessorListDialog,
1998
- {
1999
- processList: processList == null ? void 0 : processList.processes,
2000
- open: openProcessorDialog,
2001
- setOpen: setOpenProcessorDialog,
2002
- handleSelectedProcessor: (data) => {
2003
- sdkStateManager.setProcess(data);
2004
- }
2005
- }
2006
- ) });
2007
- }
2008
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
2009
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2010
- import_material4.Fade,
2011
- {
2012
- in: true,
2013
- timeout: 300,
2014
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2015
- import_material4.Paper,
2016
- {
2017
- ref: dragRef,
2018
- elevation: isDragging ? 4 : 1,
2019
- sx: {
2020
- position: "fixed",
2021
- left: position.x,
2022
- top: position.y,
2023
- p: 0.5,
2024
- borderRadius: 3,
2025
- bgcolor: "background.paper",
2026
- zIndex: 99999,
2027
- transition: theme.transitions.create(["box-shadow", "transform"], {
2028
- duration: theme.transitions.duration.short
2029
- }),
2030
- userSelect: "none"
2031
- },
2032
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2033
- import_material4.Box,
2034
- {
2035
- sx: {
2036
- display: "flex",
2037
- alignItems: "center"
2038
- },
2039
- children: [
2040
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2041
- import_material4.Box,
2042
- {
2043
- sx: {
2044
- display: "flex",
2045
- justifyContent: "space-between",
2046
- alignItems: "center"
2047
- },
2048
- children: [
2049
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2050
- import_material4.IconButton,
2051
- {
2052
- component: "div",
2053
- size: "small",
2054
- sx: {
2055
- cursor: "all-scroll"
2056
- },
2057
- onMouseDown: handleMouseDown,
2058
- onTouchStart: handleTouchStart,
2059
- children: [
2060
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.DragIndicator, {}),
2061
- " "
2062
- ]
2063
- }
2064
- ),
2065
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2066
- import_material4.Box,
2067
- {
2068
- sx: {
2069
- marginRight: "10px"
2070
- },
2071
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Dial", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2072
- import_material4.IconButton,
2073
- {
2074
- size: "small",
2075
- onClick: (e) => {
2076
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2;
2077
- if (((_b2 = (_a2 = state.callData) == null ? void 0 : _a2.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") {
2078
- handleOpenDialer(e);
2079
- }
2080
- },
2081
- sx: {
2082
- bgcolor: "action.hover",
2083
- "&:hover": {
2084
- bgcolor: "warning"
2085
- }
2086
- },
2087
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2088
- import_icons_material2.WifiCalling3,
2089
- {
2090
- sx: {
2091
- color: ((_b = (_a = state.callData) == null ? void 0 : _a.status) == null ? void 0 : _b.toUpperCase()) === "ONCALL" || ((_d = (_c = state.callData) == null ? void 0 : _c.status) == null ? void 0 : _d.toUpperCase()) === "BREAK" || ((_f = (_e = state.callData) == null ? void 0 : _e.status) == null ? void 0 : _f.toUpperCase()) === "RINGING" || ((_h = (_g = state.callData) == null ? void 0 : _g.status) == null ? void 0 : _h.toUpperCase()) === "WRAPUP" ? "action.selected" : "success.main"
2092
- }
2093
- }
2094
- )
2095
- }
2096
- ) })
2097
- }
2098
- ),
2099
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2100
- import_material4.Typography,
2101
- {
2102
- sx: {
2103
- color: "success.main",
2104
- width: "40px",
2105
- marginRight: "10px"
2106
- },
2107
- children: formatDuration(callDuration)
2108
- }
2109
- ),
2110
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2111
- import_material4.Typography,
2112
- {
2113
- variant: "body2",
2114
- sx: {
2115
- fontWeight: "bold"
2116
- },
2117
- children: (_k = (_j = (_i = state.callData) == null ? void 0 : _i.status) == null ? void 0 : _j.toUpperCase()) != null ? _k : "N/A"
2118
- }
2119
- ),
2120
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2121
- import_material4.Button,
2122
- {
2123
- size: "small",
2124
- variant: "text",
2125
- onClick: handleOpenAgentStatus,
2126
- disabled: Boolean(state.callStartTime),
2127
- children: [
2128
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.ArrowDropDown, {}),
2129
- " "
2130
- ]
2131
- }
2132
- )
2133
- ]
2134
- }
2135
- ),
2136
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2137
- import_material4.Box,
2138
- {
2139
- sx: {
2140
- display: "flex",
2141
- gap: 1,
2142
- justifyContent: "center",
2143
- alignItems: "center"
2144
- },
2145
- children: [
2146
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Agent Ready", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2147
- import_material4.Button,
2148
- {
2149
- variant: ((_m = (_l = state.callData) == null ? void 0 : _l.status) == null ? void 0 : _m.toUpperCase()) === "BREAK" || ((_o = (_n = state.callData) == null ? void 0 : _n.status) == null ? void 0 : _o.toUpperCase()) === "MISSED" ? "outlined" : "contained",
2150
- onClick: (e) => {
2151
- var _a2, _b2, _c2, _d2;
2152
- if (((_b2 = (_a2 = state.callData) == null ? void 0 : _a2.status) == null ? void 0 : _b2.toUpperCase()) === "BREAK" || ((_d2 = (_c2 = state.callData) == null ? void 0 : _c2.status) == null ? void 0 : _d2.toUpperCase()) === "MISSED") {
2153
- e.stopPropagation();
2154
- handleAgentReady();
2155
- }
2156
- },
2157
- classes: {
2158
- root: ((_q = (_p = state.callData) == null ? void 0 : _p.status) == null ? void 0 : _q.toUpperCase()) === "BREAK" || ((_s = (_r = state.callData) == null ? void 0 : _r.status) == null ? void 0 : _s.toUpperCase()) === "MISSED" ? "outlined" : "enabled"
2159
- },
2160
- sx: __spreadValues({}, ((_u = (_t = state.callData) == null ? void 0 : _t.status) == null ? void 0 : _u.toUpperCase()) === "BREAK" || ((_w = (_v = state.callData) == null ? void 0 : _v.status) == null ? void 0 : _w.toUpperCase()) === "MISSED" ? outlined : enabled),
2161
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.SupportAgent, {})
2162
- }
2163
- ) }),
2164
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: state.isHolding ? "Resume" : "Hold", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2165
- import_material4.Button,
2166
- {
2167
- variant: state.isHolding && ((_y = (_x = state.callData) == null ? void 0 : _x.status) == null ? void 0 : _y.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
2168
- onClick: (e) => {
2169
- e.stopPropagation();
2170
- handleHoldToggle();
2171
- },
2172
- sx: state.isHolding && ((_A = (_z = state.callData) == null ? void 0 : _z.status) == null ? void 0 : _A.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_C = (_B = state.callData) == null ? void 0 : _B.status) == null ? void 0 : _C.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
2173
- disabled: ((_E = (_D = state.callData) == null ? void 0 : _D.status) == null ? void 0 : _E.toUpperCase()) !== "ONCALL" && !state.isHolding,
2174
- children: state.isHolding ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.PlayArrow, {}) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Pause, {})
2175
- }
2176
- ) }),
2177
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: state.isMuted ? "Unmute" : "Mute", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2178
- import_material4.Button,
2179
- {
2180
- variant: state.isMuted && ((_G = (_F = state.callData) == null ? void 0 : _F.status) == null ? void 0 : _G.toUpperCase()) === "ONCALL" ? "contained" : "outlined",
2181
- onClick: (e) => {
2182
- e.stopPropagation();
2183
- handleMuteToggle();
2184
- },
2185
- sx: state.isMuted && ((_I = (_H = state.callData) == null ? void 0 : _H.status) == null ? void 0 : _I.toUpperCase()) === "ONCALL" ? __spreadValues({}, enabled) : ((_K = (_J = state.callData) == null ? void 0 : _J.status) == null ? void 0 : _K.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
2186
- disabled: ((_M = (_L = state.callData) == null ? void 0 : _L.status) == null ? void 0 : _M.toUpperCase()) !== "ONCALL" && !state.isMuted,
2187
- children: state.isMuted ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.MicOff, {}) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Mic, {})
2188
- }
2189
- ) }),
2190
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Transfer Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2191
- import_material4.Button,
2192
- {
2193
- variant: openCallTransfer ? "contained" : "outlined",
2194
- onClick: (e) => {
2195
- var _a2, _b2;
2196
- if (((_b2 = (_a2 = state.callData) == null ? void 0 : _a2.status) == null ? void 0 : _b2.toUpperCase()) === "ONCALL") {
2197
- e.stopPropagation();
2198
- setOpenCallTransfer(true);
2199
- }
2200
- },
2201
- sx: openCallTransfer ? __spreadValues({}, enabled) : ((_O = (_N = state.callData) == null ? void 0 : _N.status) == null ? void 0 : _O.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
2202
- disabled: ((_Q = (_P = state.callData) == null ? void 0 : _P.status) == null ? void 0 : _Q.toUpperCase()) !== "ONCALL",
2203
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.TransferWithinAStation, {})
2204
- }
2205
- ) }),
2206
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Conference Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2207
- import_material4.Button,
2208
- {
2209
- variant: open ? "contained" : "outlined",
2210
- onClick: (e) => {
2211
- var _a2, _b2;
2212
- if (((_b2 = (_a2 = state.callData) == null ? void 0 : _a2.status) == null ? void 0 : _b2.toUpperCase()) === "ONCALL") {
2213
- e.stopPropagation();
2214
- setOpen(true);
2215
- }
2216
- },
2217
- sx: open ? __spreadValues({}, enabled) : ((_S = (_R = state.callData) == null ? void 0 : _R.status) == null ? void 0 : _S.toUpperCase()) === "ONCALL" ? __spreadValues({}, outlined) : __spreadValues({}, disabled),
2218
- disabled: ((_U = (_T = state.callData) == null ? void 0 : _T.status) == null ? void 0 : _U.toUpperCase()) !== "ONCALL",
2219
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Group, {})
2220
- }
2221
- ) }),
2222
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "Call History", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2223
- import_material4.Button,
2224
- {
2225
- variant: openCallHistoryDialog ? "contained" : "outlined",
2226
- onClick: (e) => {
2227
- e.stopPropagation();
2228
- setOpenCallHistoryDialog(true);
2229
- },
2230
- sx: openCallHistoryDialog ? __spreadValues({}, enabled) : __spreadValues({}, outlined),
2231
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.History, {})
2232
- }
2233
- ) }),
2234
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.Tooltip, { title: "End Call", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2235
- import_material4.Button,
2236
- {
2237
- variant: ((_W = (_V = state.callData) == null ? void 0 : _V.status) == null ? void 0 : _W.toUpperCase()) === "ONCALL" || ((_Y = (_X = state.callData) == null ? void 0 : _X.status) == null ? void 0 : _Y.toUpperCase()) === "RINGING" || ((__ = (_Z = state.callData) == null ? void 0 : _Z.status) == null ? void 0 : __.toUpperCase()) === "WRAPUP" ? "contained" : "outlined",
2238
- onClick: (e) => {
2239
- var _a2, _b2, _c2, _d2, _e2, _f2;
2240
- if (((_b2 = (_a2 = state.callData) == null ? void 0 : _a2.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") {
2241
- e.stopPropagation();
2242
- setOpenCallDisposition(true);
2243
- }
2244
- },
2245
- sx: ((_aa = (_$ = state.callData) == null ? void 0 : _$.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), {
2246
- borderRight: "1px",
2247
- backgroundColor: "error.main",
2248
- minWidth: "60px !important",
2249
- boxShadow: " 0px 2px 1px #5f3f3f",
2250
- border: `1px solid ${theme.palette.error.light}`,
2251
- height: "40px",
2252
- "&:hover": {
2253
- bgcolor: "error.light",
2254
- boxShadow: " 0px 2px 1px #5f3f3f",
2255
- border: `0px solid ${theme.palette.error.light}`
2256
- },
2257
- "&:active": {
2258
- bgcolor: "error.light",
2259
- boxShadow: `inset 1px -2px 4px ${theme.palette.primary.light}`
2260
- }
2261
- }) : __spreadProps(__spreadValues({}, disabled), {
2262
- minWidth: "60px !important"
2263
- }),
2264
- 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",
2265
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.CallEnd, {})
2266
- }
2267
- ) })
2268
- ]
2269
- }
2270
- )
2271
- ]
2272
- }
2273
- )
2274
- }
2275
- )
2276
- }
2277
- ),
2278
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2279
- import_material4.Fade,
2280
- {
2281
- in: true,
2282
- timeout: 300,
2283
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2284
- import_material4.Paper,
2285
- {
2286
- ref: iframeDragRef,
2287
- elevation: iframeIsDragging ? 4 : 1,
2288
- sx: {
2289
- position: "fixed",
2290
- left: iframePosition.x,
2291
- top: iframePosition.y,
2292
- p: 1,
2293
- height: "auto",
2294
- borderRadius: 2,
2295
- bgcolor: "background.paper",
2296
- zIndex: 99999,
2297
- transition: theme.transitions.create(["box-shadow", "transform"], {
2298
- duration: theme.transitions.duration.short
2299
- }),
2300
- visibility: showIframe ? "visible" : "hidden",
2301
- userSelect: "none"
2302
- },
2303
- children: [
2304
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2305
- import_material4.Box,
2306
- {
2307
- sx: {
2308
- display: "flex",
2309
- alignItems: "center",
2310
- justifyContent: "space-between",
2311
- cursor: "all-scroll"
2312
- },
2313
- onMouseDown: iframeHandleMouseDown,
2314
- onTouchStart: iframeHandleTouchStart,
2315
- children: [
2316
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2317
- import_icons_material2.DragIndicator,
2318
- {
2319
- sx: {
2320
- transform: "rotate(90deg)"
2321
- }
2322
- }
2323
- ),
2324
- " ",
2325
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.IconButton, { onClick: () => setShowIframe(false), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Close, {}) })
2326
- ]
2327
- }
2328
- ),
2329
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2330
- "iframe",
2331
- {
2332
- src: `https://h68.deepijatel.in/ConVoxCCS/iframe?agent_id=${state.agentId}&process_id=${(_la = state.process) == null ? void 0 : _la.process_id}`,
2333
- height: 380,
2334
- width: 420,
2335
- allow: "camera; microphone; autoplay"
2336
- }
2337
- )
2338
- ]
2339
- }
2340
- )
2341
- }
2342
- ),
2343
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2344
- import_material4.Menu,
2345
- {
2346
- anchorEl: dialerAnchorEl,
2347
- open: Boolean(dialerAnchorEl),
2348
- onClose: handleCloseDialer,
2349
- onClick: (e) => e.stopPropagation(),
2350
- sx: {
2351
- zIndex: 99999
2352
- },
2353
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2354
- import_material4.Box,
2355
- {
2356
- sx: {
2357
- all: "unset",
2358
- padding: "10px",
2359
- "&hover": {
2360
- backgroundColor: "white"
2361
- }
2362
- },
2363
- children: [
2364
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2365
- import_material4.TextField,
2366
- {
2367
- size: "small",
2368
- value: phoneNumber,
2369
- placeholder: "Enter Mobile No.",
2370
- onChange: (e) => {
2371
- setPhoneNumber(e.target.value);
2372
- }
2373
- }
2374
- ),
2375
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2376
- import_material4.IconButton,
2377
- {
2378
- color: "info",
2379
- onClick: () => {
2380
- handleStartCall(phoneNumber);
2381
- },
2382
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Phone, { color: "success" })
2383
- }
2384
- )
2385
- ]
2386
- }
2387
- )
2388
- }
2389
- ),
2390
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2391
- import_material4.Menu,
2392
- {
2393
- anchorEl: statusAnchorEl,
2394
- open: Boolean(statusAnchorEl),
2395
- onClose: handleCloseAgentStatus,
2396
- onClick: (e) => e.stopPropagation(),
2397
- sx: {
2398
- zIndex: 99999
2399
- },
2400
- children: [
2401
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.MenuItem, { onClick: () => handleUpdateAgentStatus("Lunch"), children: "- Lunch" }),
2402
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material4.MenuItem, { onClick: () => handleUpdateAgentStatus("Tea"), children: "- Tea" })
2403
- ]
2404
- }
2405
- ),
2406
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2407
- import_material4.Menu,
2408
- {
2409
- anchorEl,
2410
- open: Boolean(anchorEl),
2411
- onClose: handleCloseQueueCounts,
2412
- onClick: (e) => e.stopPropagation(),
2413
- sx: {
2414
- zIndex: 99999
2415
- },
2416
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2417
- import_material4.Box,
2418
- {
2419
- sx: {
2420
- display: "flex",
2421
- justifyContent: "flex-start",
2422
- flexDirection: "column",
2423
- padding: "0px 10px",
2424
- "&hover": {
2425
- backgroundColor: "white"
2426
- }
2427
- },
2428
- children: [
2429
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2430
- import_material4.Chip,
2431
- {
2432
- icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Layers, { color: "secondary" }),
2433
- variant: "outlined",
2434
- label: "Waiting - 25",
2435
- sx: {
2436
- margin: "4px 2px"
2437
- }
2438
- }
2439
- ),
2440
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2441
- import_material4.Chip,
2442
- {
2443
- icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Pending, { color: "info" }),
2444
- label: "Pending - 99+",
2445
- variant: "outlined",
2446
- sx: {
2447
- margin: "4px 2px"
2448
- }
2449
- }
2450
- ),
2451
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2452
- import_material4.Chip,
2453
- {
2454
- icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material2.Upcoming, { color: "success" }),
2455
- variant: "outlined",
2456
- label: "Upcoming - 66",
2457
- sx: {
2458
- margin: "4px 2px"
2459
- }
2460
- }
2461
- )
2462
- ]
2463
- }
2464
- )
2465
- }
2466
- ),
2467
- Boolean(open) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2468
- ConferenceDialog,
2469
- {
2470
- open,
2471
- setOpen
2472
- }
2473
- ),
2474
- Boolean(openCallTransfer) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2475
- CallTransferDialog,
2476
- {
2477
- open: openCallTransfer,
2478
- setOpen: setOpenCallTransfer
2479
- }
2480
- ),
2481
- Boolean(openCallDisposition) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2482
- EndCallDispositionDialog,
2483
- {
2484
- open: openCallDisposition,
2485
- setOpen: setOpenCallDisposition,
2486
- onSubmitDisposition: handleEndCall
2487
- }
2488
- ),
2489
- Boolean(openCallHistoryDialog) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
2490
- CallHistoryDialog,
2491
- {
2492
- open: openCallHistoryDialog,
2493
- setOpen: setOpenCallHistoryDialog
2494
- }
2495
- )
2496
- ] });
2497
- }
2498
-
2499
- // call-control-sdk/lib/hooks/eventsTracker.ts
2500
- var EventTrackerSDK = class {
2501
- constructor() {
2502
- __publicField(this, "config", null);
2503
- __publicField(this, "ticketId", null);
2504
- __publicField(this, "baseUrl", "");
2505
- __publicField(this, "eventQueue", []);
2506
- __publicField(this, "isOnline", true);
2507
- __publicField(this, "retryQueue", []);
2508
- __publicField(this, "flushTimer", null);
2509
- }
2510
- /**
2511
- * Initialize the EventTracker SDK
2512
- * @param config Configuration object
2513
- */
2514
- async init(config) {
2515
- this.config = __spreadValues({
2516
- autoTrack: true,
2517
- retryAttempts: 3,
2518
- queueSize: 100,
2519
- flushInterval: 5e3
2520
- }, config);
2521
- this.baseUrl = config.baseUrl || (typeof window !== "undefined" ? window.location.origin : "");
2522
- this.setupNetworkDetection();
2523
- const ticket = await this.createTicket();
2524
- this.startPeriodicFlush();
2525
- console.log("EventTracker SDK initialized successfully");
2526
- return ticket;
2527
- }
2528
- /**
2529
- * Check if the SDK is initialized
2530
- */
2531
- isInitialized() {
2532
- return this.config !== null && this.ticketId !== null;
2533
- }
2534
- /**
2535
- * Get the current configuration
2536
- */
2537
- getConfig() {
2538
- return this.config;
2539
- }
2540
- /**
2541
- * Get the current ticket ID
2542
- */
2543
- getTicketId() {
2544
- return this.ticketId;
2545
- }
2546
- /**
2547
- * Create a new ticket
2548
- */
2549
- async createTicket() {
2550
- if (!this.config) {
2551
- throw new Error("EventTracker not initialized");
2552
- }
2553
- try {
2554
- const response = await this.makeRequest("/api/v1/et/init", {
2555
- method: "POST",
2556
- headers: {
2557
- "Content-Type": "application/json",
2558
- "X-API-Key": this.config.apiKey
2559
- },
2560
- body: JSON.stringify({
2561
- agentId: this.config.agentId,
2562
- sessionId: this.config.sessionId
2563
- })
2564
- });
2565
- if (!response.ok) {
2566
- throw new Error(
2567
- `Failed to initialize: ${response.status} ${response.statusText}`
2568
- );
2569
- }
2570
- const data = await response.json();
2571
- this.ticketId = data.ticketId;
2572
- if (this.config.autoTrack) {
2573
- this.setupAutoTracking();
2574
- }
2575
- return this.ticketId;
2576
- } catch (error) {
2577
- console.error("EventTracker initialization failed:", error);
2578
- throw error;
2579
- }
2580
- }
2581
- /**
2582
- * Log an event
2583
- * @param eventType The type of event
2584
- * @param eventData Optional event data
2585
- */
2586
- async logEvent(eventType, eventData) {
2587
- if (!this.config || !this.ticketId) {
2588
- console.warn("EventTracker not initialized, skipping event:", eventType);
2589
- return;
2590
- }
2591
- const event = {
2592
- eventType,
2593
- eventData,
2594
- timestamp: Date.now()
2595
- };
2596
- this.eventQueue.push(event);
2597
- if (this.eventQueue.length > (this.config.queueSize || 100)) {
2598
- this.eventQueue.shift();
2599
- }
2600
- if (this.isOnline) {
2601
- try {
2602
- await this.sendEvent(event);
2603
- } catch (error) {
2604
- console.warn("Failed to send event, will retry later:", error);
2605
- }
2606
- }
2607
- }
2608
- /**
2609
- * Send an event to the server
2610
- */
2611
- async sendEvent(event) {
2612
- if (!this.config || !this.ticketId) return;
2613
- try {
2614
- const response = await this.makeRequest("/api/v1/et/event", {
2615
- method: "POST",
2616
- headers: {
2617
- "Content-Type": "application/json",
2618
- "X-API-Key": this.config.apiKey
2619
- },
2620
- body: JSON.stringify({
2621
- ticketId: this.ticketId,
2622
- eventType: event.eventType,
2623
- eventData: event.eventData
2624
- })
2625
- });
2626
- if (!response.ok) {
2627
- throw new Error(
2628
- `Failed to log event: ${response.status} ${response.statusText}`
2629
- );
2630
- }
2631
- const index = this.eventQueue.findIndex(
2632
- (e) => e.timestamp === event.timestamp
2633
- );
2634
- if (index > -1) {
2635
- this.eventQueue.splice(index, 1);
2636
- }
2637
- } catch (error) {
2638
- console.error("Event logging failed:", error);
2639
- this.retryQueue.push(() => this.sendEvent(event));
2640
- }
2641
- }
2642
- /**
2643
- * Close the current ticket
2644
- */
2645
- async closeTicket() {
2646
- if (!this.config || !this.ticketId) {
2647
- throw new Error("EventTracker not initialized");
2648
- }
2649
- await this.flush();
2650
- try {
2651
- const response = await this.makeRequest("/api/v1/et/close", {
2652
- method: "POST",
2653
- headers: {
2654
- "Content-Type": "application/json",
2655
- "X-API-Key": this.config.apiKey
2656
- },
2657
- body: JSON.stringify({
2658
- ticketId: this.ticketId
2659
- })
2660
- });
2661
- if (!response.ok) {
2662
- throw new Error(
2663
- `Failed to close ticket: ${response.status} ${response.statusText}`
2664
- );
2665
- }
2666
- this.ticketId = null;
2667
- this.stopPeriodicFlush();
2668
- console.log("Ticket closed successfully");
2669
- } catch (error) {
2670
- console.error("Ticket close failed:", error);
2671
- throw error;
2672
- }
2673
- }
2674
- /**
2675
- * Flush all pending events
2676
- */
2677
- async flush() {
2678
- if (!this.isOnline || this.eventQueue.length === 0) return;
2679
- const eventsToFlush = [...this.eventQueue];
2680
- for (const event of eventsToFlush) {
2681
- await this.sendEvent(event);
2682
- }
2683
- const retryItems = [...this.retryQueue];
2684
- this.retryQueue = [];
2685
- for (const retryFn of retryItems) {
2686
- try {
2687
- await retryFn();
2688
- } catch (error) {
2689
- console.error("Retry failed:", error);
2690
- }
2691
- }
2692
- }
2693
- /**
2694
- * Make an HTTP request with retry logic
2695
- */
2696
- async makeRequest(url, options) {
2697
- var _a;
2698
- const fullUrl = `${this.baseUrl}${url}`;
2699
- const maxRetries = ((_a = this.config) == null ? void 0 : _a.retryAttempts) || 3;
2700
- for (let attempt = 1; attempt <= maxRetries; attempt++) {
2701
- try {
2702
- const response = await fetch(fullUrl, options);
2703
- return response;
2704
- } catch (error) {
2705
- if (attempt === maxRetries) {
2706
- throw error;
2707
- }
2708
- const delay = Math.min(1e3 * Math.pow(2, attempt - 1), 1e4);
2709
- await new Promise((resolve) => setTimeout(resolve, delay));
2710
- }
2711
- }
2712
- throw new Error("Max retries exceeded");
2713
- }
2714
- /**
2715
- * Set up automatic event tracking
2716
- */
2717
- setupAutoTracking() {
2718
- var _a;
2719
- if (typeof window === "undefined" || !((_a = this.config) == null ? void 0 : _a.autoTrack)) return;
2720
- const autoTrackConfig = this.config.autoTrack === true ? {} : this.config.autoTrack;
2721
- if (autoTrackConfig.pageVisits !== false) {
2722
- this.logEvent("pageVisit", {
2723
- url: window.location.href,
2724
- title: document.title,
2725
- referrer: document.referrer,
2726
- userAgent: navigator.userAgent,
2727
- viewport: {
2728
- width: window.innerWidth,
2729
- height: window.innerHeight
2730
- },
2731
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2732
- }).catch((error) => console.warn("Failed to track page visit:", error));
2733
- }
2734
- if (autoTrackConfig.clicks !== false) {
2735
- document.addEventListener("click", (event) => {
2736
- var _a2;
2737
- const target = event.target;
2738
- if (target.tagName === "BUTTON" || target.tagName === "A" || target.onclick || target.getAttribute("role") === "button" || target instanceof HTMLButtonElement && target.type === "button") {
2739
- this.logEvent("click", {
2740
- element: target.tagName,
2741
- text: (_a2 = target.textContent) == null ? void 0 : _a2.trim().substring(0, 100),
2742
- // Limit text length
2743
- href: target.getAttribute("href"),
2744
- id: target.id,
2745
- className: target.className,
2746
- role: target.getAttribute("role"),
2747
- position: {
2748
- x: event.clientX,
2749
- y: event.clientY
2750
- },
2751
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2752
- }).catch((error) => console.warn("Failed to track click:", error));
2753
- }
2754
- });
2755
- }
2756
- if (autoTrackConfig.forms !== false) {
2757
- document.addEventListener("submit", (event) => {
2758
- const target = event.target;
2759
- const formData = new FormData(target);
2760
- const formFields = {};
2761
- formData.forEach((value, key) => {
2762
- formFields[key] = value.toString();
2763
- });
2764
- this.logEvent("formSubmission", {
2765
- formId: target.id,
2766
- action: target.action,
2767
- method: target.method,
2768
- fields: Object.keys(formFields),
2769
- fieldCount: Object.keys(formFields).length,
2770
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2771
- }).catch(
2772
- (error) => console.warn("Failed to track form submission:", error)
2773
- );
2774
- });
2775
- }
2776
- if (autoTrackConfig.inputs !== false) {
2777
- let inputTimer;
2778
- document.addEventListener("input", (event) => {
2779
- const target = event.target;
2780
- if (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT") {
2781
- clearTimeout(inputTimer);
2782
- inputTimer = setTimeout(() => {
2783
- var _a2;
2784
- this.logEvent("fieldChange", {
2785
- element: target.tagName,
2786
- type: target.getAttribute("type"),
2787
- name: target.getAttribute("name"),
2788
- id: target.id,
2789
- valueLength: ((_a2 = target.value) == null ? void 0 : _a2.length) || 0,
2790
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2791
- }).catch(
2792
- (error) => console.warn("Failed to track field change:", error)
2793
- );
2794
- }, 1e3);
2795
- }
2796
- });
2797
- }
2798
- const sessionStartTime = Date.now();
2799
- window.addEventListener("beforeunload", () => {
2800
- const sessionDuration = Date.now() - sessionStartTime;
2801
- this.logEvent("pageUnload", {
2802
- url: window.location.href,
2803
- sessionDuration,
2804
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2805
- });
2806
- if (this.ticketId) {
2807
- navigator.sendBeacon(
2808
- `${this.baseUrl}/api/v1/et/close`,
2809
- JSON.stringify({
2810
- ticketId: this.ticketId
2811
- })
2812
- );
2813
- }
2814
- });
2815
- if (autoTrackConfig.visibility !== false) {
2816
- document.addEventListener("visibilitychange", () => {
2817
- this.logEvent("visibilityChange", {
2818
- hidden: document.hidden,
2819
- visibilityState: document.visibilityState,
2820
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2821
- });
2822
- });
2823
- }
2824
- if (autoTrackConfig.errors !== false) {
2825
- window.addEventListener("error", (event) => {
2826
- this.logEvent("jsError", {
2827
- message: event.message,
2828
- filename: event.filename,
2829
- lineno: event.lineno,
2830
- colno: event.colno,
2831
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2832
- });
2833
- });
2834
- window.addEventListener("unhandledrejection", (event) => {
2835
- var _a2;
2836
- this.logEvent("unhandledRejection", {
2837
- reason: (_a2 = event.reason) == null ? void 0 : _a2.toString(),
2838
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2839
- });
2840
- });
2841
- }
2842
- if (autoTrackConfig.performance !== false && typeof window.performance !== "undefined" && window.performance.navigation) {
2843
- window.addEventListener("load", () => {
2844
- setTimeout(() => {
2845
- const navigation = window.performance.navigation;
2846
- const timing = window.performance.timing;
2847
- this.logEvent("performanceMetrics", {
2848
- navigationTime: timing.navigationStart,
2849
- loadTime: timing.loadEventEnd - timing.navigationStart,
2850
- domReady: timing.domContentLoadedEventEnd - timing.navigationStart,
2851
- renderTime: timing.loadEventEnd - timing.domContentLoadedEventEnd,
2852
- navigationType: navigation.type,
2853
- redirectCount: navigation.redirectCount,
2854
- timestamp: (/* @__PURE__ */ new Date()).toISOString()
2855
- });
2856
- }, 1e3);
2857
- });
2858
- }
2859
- }
2860
- /**
2861
- * Set up network detection
2862
- */
2863
- setupNetworkDetection() {
2864
- if (typeof window === "undefined") return;
2865
- this.isOnline = navigator.onLine;
2866
- window.addEventListener("online", () => {
2867
- this.isOnline = true;
2868
- console.log("EventTracker: Back online, flushing queued events");
2869
- this.flush();
2870
- });
2871
- window.addEventListener("offline", () => {
2872
- this.isOnline = false;
2873
- console.log("EventTracker: Offline, queueing events");
2874
- });
2875
- }
2876
- /**
2877
- * Start periodic flush timer
2878
- */
2879
- startPeriodicFlush() {
2880
- var _a;
2881
- if (this.flushTimer) {
2882
- clearInterval(this.flushTimer);
2883
- }
2884
- const interval = ((_a = this.config) == null ? void 0 : _a.flushInterval) || 5e3;
2885
- this.flushTimer = setInterval(() => {
2886
- this.flush();
2887
- }, interval);
2888
- }
2889
- /**
2890
- * Stop periodic flush timer
2891
- */
2892
- stopPeriodicFlush() {
2893
- if (this.flushTimer) {
2894
- clearInterval(this.flushTimer);
2895
- this.flushTimer = null;
2896
- }
2897
- }
2898
- };
2899
- var eventTracker = new EventTrackerSDK();
2900
- if (typeof window !== "undefined") {
2901
- window.EventTracker = eventTracker;
2902
- }
2903
-
2904
- // call-control-sdk/lib/hooks/useLogout.ts
2905
- var import_react7 = require("react");
2906
- var useLogout = (options = {}) => {
2907
- const { onSuccess, onError, onComplete } = options;
2908
- const state = useSDKState();
2909
- const [logOutAgent, logoutState] = usePostRequest({
2910
- onSuccess: (response) => {
2911
- onSuccess == null ? void 0 : onSuccess(response);
2912
- onComplete == null ? void 0 : onComplete();
2913
- sdkStateManager.clearStorageAndReset();
2914
- localStorage.clear();
2915
- },
2916
- onError: (error) => {
2917
- onError == null ? void 0 : onError(error);
2918
- onComplete == null ? void 0 : onComplete();
2919
- }
2920
- });
2921
- const handleLogout = (0, import_react7.useCallback)(() => {
2922
- const payload = {
2923
- action: "LOGOUTUSER",
2924
- userId: state.agentId || ""
2925
- };
2926
- logOutAgent(END_POINT.LOGOUT, payload);
2927
- }, [logOutAgent]);
2928
- return {
2929
- logout: handleLogout,
2930
- isLoading: logoutState.isLoading,
2931
- isSuccess: logoutState.isSuccess,
2932
- isError: logoutState.isError,
2933
- error: logoutState.error,
2934
- data: logoutState.data
2935
- };
2936
- };
2937
- var useLogout_default = useLogout;
2938
-
2939
- // call-control-sdk/index.ts
2940
- function initSDK({ apiKey, tenantId, agentId }) {
2941
- sdkStateManager.initialize(apiKey, agentId);
2942
- eventTracker.init({
2943
- apiKey,
2944
- tenantId,
2945
- agentId,
2946
- baseUrl: BASE_URL
2947
- });
2948
- }
2949
- // Annotate the CommonJS export names for ESM import in node:
2950
- 0 && (module.exports = {
2951
- CallControlPanel,
2952
- initSDK,
2953
- useLogout
2954
- });
1
+ "use strict";var _o=Object.create;var lt=Object.defineProperty,ko=Object.defineProperties,Ao=Object.getOwnPropertyDescriptor,No=Object.getOwnPropertyDescriptors,Po=Object.getOwnPropertyNames,po=Object.getOwnPropertySymbols,Oo=Object.getPrototypeOf,uo=Object.prototype.hasOwnProperty,Uo=Object.prototype.propertyIsEnumerable;var Ut=(r,t,n)=>t in r?lt(r,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):r[t]=n,d=(r,t)=>{for(var n in t||(t={}))uo.call(t,n)&&Ut(r,n,t[n]);if(po)for(var n of po(t))Uo.call(t,n)&&Ut(r,n,t[n]);return r},$=(r,t)=>ko(r,No(t));var Mo=(r,t)=>{for(var n in t)lt(r,n,{get:t[n],enumerable:!0})},go=(r,t,n,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of Po(t))!uo.call(r,p)&&p!==n&&lt(r,p,{get:()=>t[p],enumerable:!(l=Ao(t,p))||l.enumerable});return r};var Bo=(r,t,n)=>(n=r!=null?_o(Oo(r)):{},go(t||!r||!r.__esModule?lt(n,"default",{value:r,enumerable:!0}):n,r)),Ho=r=>go(lt({},"__esModule",{value:!0}),r);var q=(r,t,n)=>Ut(r,typeof t!="symbol"?t+"":t,n);var jo={};Mo(jo,{CallControlPanel:()=>Eo,initSDK:()=>Ko,useLogout:()=>Lo});module.exports=Ho(jo);var v=require("@mui/icons-material"),g=require("@mui/material"),P=require("react");var Mt=class{constructor(){q(this,"state");q(this,"listeners",[]);q(this,"STORAGE_KEY","call-control-sdk-state");this.state=this.getInitialState(),this.loadFromStorage()}getInitialState(){return{apiKey:null,process:null,agentId:"",isInitialized:!1,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 t=localStorage.getItem(this.STORAGE_KEY);if(t){let n=JSON.parse(t);this.state=$(d({},this.state),{apiKey:n.apiKey||"",agentId:n.agentId||"",process:n.process||null,isInitialized:n.isInitialized||!1,isHolding:n.isHolding||!1,isMuted:n.isMuted||!1,status:n.status||"idle",callStartTime:n.callStartTime||null,controlPanelPosition:n.controlPanelPosition||{x:10,y:10},iframePosition:n.iframePosition||{x:10,y:80},callData:n.callData||{mobileNumber:"",callReferenceId:"",agentLoginId:""},conferenceLine:n.conferenceLine&&Array.isArray(n.conferenceLine)&&n.conferenceLine.length>0?n.conferenceLine:this.state.conferenceLine})}}catch(t){console.warn("Failed to load SDK state from localStorage:",t)}}saveToStorage(){try{let t={apiKey:this.state.apiKey,agentId:this.state.agentId,process:this.state.process,isInitialized:this.state.isInitialized,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(t))}catch(t){console.warn("Failed to save SDK state to localStorage:",t)}}notifyListeners(){this.listeners.forEach(t=>t())}initialize(t,n){if(!t||typeof t!="string"||t.trim().length===0)throw new Error("API key not available");this.state.apiKey=t,this.state.agentId=n,this.state.isInitialized=!0,this.saveToStorage(),this.notifyListeners()}getState(){return d({},this.state)}subscribe(t){return this.listeners.push(t),()=>{let n=this.listeners.indexOf(t);n>-1&&this.listeners.splice(n,1)}}setHolding(t){this.state.isHolding=t,this.saveToStorage(),this.notifyListeners()}setMuted(t){this.state.isMuted=t,this.saveToStorage(),this.notifyListeners()}setStatus(t){this.state.status=t,this.saveToStorage(),this.notifyListeners()}setProcess(t){this.state.process=t,this.saveToStorage(),this.notifyListeners()}setControlPanelPosition(t){this.state.controlPanelPosition=t,this.saveToStorage(),this.notifyListeners()}setIframePosition(t){this.state.iframePosition=t,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()}updateCallData(t){this.state.callData=d(d({},this.state.callData),t),this.saveToStorage(),this.notifyListeners()}setConferenceLine(t){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 n=(l=this.state.conferenceLine)==null?void 0:l.map(p=>p.line===t.line?t:p);this.state.conferenceLine=n,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(t){console.warn("Failed to clear localStorage:",t)}}debugStorage(){try{let t=localStorage.getItem(this.STORAGE_KEY);console.log("Current localStorage data:",t),t&&console.log("Parsed localStorage data:",JSON.parse(t)),console.log("Current state:",this.state)}catch(t){console.error("Error debugging storage:",t)}}getConferenceLines(){return this.state.conferenceLine||[]}},L=new Mt;var F=require("react");function Bt(r,t){let[n,l]=(0,F.useState)(r),[p,e]=(0,F.useState)(!1),f=(0,F.useRef)(),h=(0,F.useRef)({x:0,y:0}),E=(0,F.useRef)({x:0,y:0}),C=(0,F.useCallback)(T=>{let N=f.current;if(!N)return;let H=N.getBoundingClientRect(),B=window.innerWidth,o=window.innerHeight,m={x:Math.max(0,Math.min(T.x,B-H.width)),y:Math.max(0,Math.min(T.y,o-H.height))};l(m),t==null||t(m)},[t]),I=(0,F.useCallback)((T,N)=>{e(!0),h.current={x:T,y:N},E.current=n;let H=(x,u)=>{let y=x-h.current.x,R=u-h.current.y;C({x:E.current.x+y,y:E.current.y+R})},B=x=>{x.preventDefault(),H(x.clientX,x.clientY)},o=x=>{x.preventDefault();let u=x.touches[0];u&&H(u.clientX,u.clientY)},m=()=>{e(!1),document.removeEventListener("mousemove",B),document.removeEventListener("mouseup",m),document.removeEventListener("touchmove",o),document.removeEventListener("touchend",m)};document.addEventListener("mousemove",B),document.addEventListener("mouseup",m),document.addEventListener("touchmove",o,{passive:!1}),document.addEventListener("touchend",m)},[n,C]),M=(0,F.useCallback)(T=>{T.preventDefault(),I(T.clientX,T.clientY)},[I]),S=(0,F.useCallback)(T=>{T.preventDefault();let N=T.touches[0];N&&I(N.clientX,N.clientY)},[I]);return{position:n,isDragging:p,dragRef:f,handleMouseDown:M,handleTouchStart:S}}var At=require("react");function tt(){let[r,t]=(0,At.useState)(L.getState());return(0,At.useEffect)(()=>L.subscribe(()=>{t(L.getState())}),[]),r}var k="http://192.168.101.177:8095",$o="ws://192.168.101.177:8095",U={v1:"/api/v1"},A={LOGIN:`${k}${U.v1}/cti/login?provider=convox`,READY_AGENT:`${k}${U.v1}/cti/ready-agent?provider=convox`,UPDATE_AGENT_BREAK:`${k}${U.v1}/cti/update-agent-break?provider=convox`,CLICK_TO_CALL:`${k}${U.v1}/cti/click-to-call?provider=convox`,HOLD_CALL:`${k}${U.v1}/cti/hold-call?provider=convox`,MUTE_CALL:`${k}${U.v1}/cti/mute-call?provider=convox`,UNMUTE_CALL:`${k}${U.v1}/cti/unmute-call?provider=convox`,END_CALL:`${k}${U.v1}/cti/end-call?provider=convox`,LOGOUT:`${k}${U.v1}/cti/logout?provider=convox`,CONFERENCE_CALL:`${k}${U.v1}/cti/conference-call?provider=convox`,CONFERENCE_CALL_HOLD_OR_UN_HOLD:`${k}${U.v1}/cti/conference-call/hold-unhold?provider=convox`,CONFERENCE_CALL_MUTE_OT_UN_MUTE:`${k}${U.v1}/cti/conference-call/mute-unmute?provider=convox`,CONFERENCE_CALL_END:`${k}${U.v1}/cti/conference-call/hangup?provider=convox`,CONFERENCE_CALL_END_ALL:`${k}${U.v1}/cti/conference-call/hangup-all-call?provider=convox`,TRANSFER_CALL:`${k}${U.v1}/cti/transfer?provider=convox`,AGENTS_LIST:`${k}${U.v1}/cti/users`,PROCESS_LIST:`${k}${U.v1}/cti/processes-list`,TRANSFER_TO_DETAILS:`${k}${U.v1}/cti/trasnfer-to-details?provider=convox`},fo={WS:`${$o}${U.v1}/cti/ws`};var Pt=require("react");var mo=Bo(require("axios"));var zo="12345",Ht=mo.default.create({baseURL:k,headers:{"Content-Type":"application/json",Authorization:zo},timeout:1e4});Ht.interceptors.request.use(r=>{let t="12345";return t&&r.headers&&(r.headers.Authorization=`Bearer ${t}`),r},r=>Promise.reject(r instanceof Error?r:new Error(String(r))));Ht.interceptors.response.use(r=>r,async r=>{var n;let t=r.config;return((n=r.response)==null?void 0:n.status)===401&&!t._retry&&(t._retry=!0),Promise.reject(r instanceof Error?r:new Error(String(r)))});var j=Ht;var Nt=require("@mui/material"),xo=require("react"),$t=require("react/jsx-runtime");function ct(){let[r,t]=(0,xo.useState)(!1),n=(p,e)=>{e!=="clickaway"&&t(!1)};return{showToast:(p,e)=>(t(!0),(0,$t.jsx)(Nt.Snackbar,{anchorOrigin:{vertical:"top",horizontal:"right"},open:r,onClose:n,children:(0,$t.jsx)(Nt.Alert,{onClose:n,severity:e,variant:"filled",sx:{width:"100%"},children:p})}))}}var Wo={isLoading:!1,isSuccess:!1,isError:!1,error:null,data:null},qo=(r,t)=>{if(t.type==="isLoading")return $(d({},r),{isLoading:t.payload});if(t.type==="isSuccess")return $(d({},r),{isSuccess:!0,data:t.payload});if(t.type==="isError")return $(d({},r),{isError:!0,error:t.payload});if(t.type==="reset")return{isLoading:!1,isSuccess:!1,isError:!1,error:null,data:null};throw Error("Unknown action.")};var W=(r={})=>{let{onSuccess:t=null,onError:n=null}=r,{showToast:l}=ct(),[p,e]=(0,Pt.useReducer)(qo,Wo);return[(0,Pt.useCallback)((h,E,C={})=>{e({type:"isLoading",payload:!0}),j.post(h,E,C).then(I=>{e({type:"isSuccess",payload:I.data}),t==null||t(I.data,E)}).catch(I=>{var S,T,N,H,B,o,m,x,u,y,R,w;let M={status:(T=(S=I.response)==null?void 0:S.status)!=null?T:500,message:((H=(N=I.response)==null?void 0:N.data)==null?void 0:H.detail)||((o=(B=I.response)==null?void 0:B.data)==null?void 0:o.message)||I.message||"An unknown error occurred",data:(x=(m=I.response)==null?void 0:m.data)!=null?x:null,statusText:(y=(u=I.response)==null?void 0:u.statusText)!=null?y:"",code:(R=I==null?void 0:I.code)!=null?R:"",name:(w=I==null?void 0:I.name)!=null?w:""};l(M.message,"error"),e({type:"isError",payload:M}),n==null||n(M,E)}).finally(()=>{e({type:"isLoading",payload:!1})})},[t,n,l]),p]};var D=require("@mui/icons-material"),s=require("@mui/material"),ot=require("react");var ho=require("@mui/material"),Fo=()=>{let r=(0,ho.useTheme)();return{disabled:{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 ${r.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${r.palette.primary.light}`}},enabled:{padding:"0px",margin:"0px",minWidth:"40px !important",borderRadius:"16px",boxShadow:" 0px 2px 1px rgba(0, 0, 0, 0.507)",border:`1px solid ${r.palette.primary.main}`,height:"40px","&:hover":{boxShadow:" 0px 2px 1px rgba(0, 0, 0, 0.507)",border:`1px solid ${r.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${r.palette.primary.light}`}},outlined:{padding:"0px",margin:"0px",minWidth:"40px !important",borderRadius:"16px",backgroundColor:r.palette.grey[200],boxShadow:`0px 2px 1px ${r.palette.primary.light}`,border:`0px solid ${r.palette.primary.main}`,height:"40px","&:hover":{boxShadow:`0px 2px 1px ${r.palette.primary.main}`,border:`0px solid ${r.palette.primary.main}`},"&:active":{bgcolor:"primary.main",boxShadow:`inset 1px -2px 4px ${r.palette.primary.light}`}}}},Ot=Fo;var a=require("react/jsx-runtime");function yo({open:r,setOpen:t}){var H,B;let n=tt(),{disabled:l,enabled:p,outlined:e}=Ot(),f=(0,s.useTheme)(),h=()=>{t(!1)},E=(o,m)=>{L.setConferenceLine(d(d({},o),m))},C=(o,m)=>{var y,R,w,_;let x=d(d({},o),m),u={action:"EXTERNAL_CONFERENCE",operation:`CALL${x.line}`,line_used:String(x.line),thirdparty_no:x.phone,userid:(R=(y=n.callData)==null?void 0:y.agent_id)!=null?R:"",process:(_=(w=n.callData)==null?void 0:w.process_name)!=null?_:""};j.post(A.CONFERENCE_CALL,u).then(()=>{L.setConferenceLine(d(d({},o),m))})},I=(o,m)=>{var y,R,w,_;let x=d(d({},o),m),u={action:"EXTERNAL_CONFERENCE",operation:"CONFERENCE",line_used:String(x.line),thirdparty_no:x.phone,userid:(R=(y=n.callData)==null?void 0:y.agent_id)!=null?R:"",process:(_=(w=n.callData)==null?void 0:w.process_name)!=null?_:""};j.post(A.CONFERENCE_CALL,u).then(()=>{L.setConferenceLine(d(d({},o),m))})},M=(o,m,x)=>{var R,w,_,z;let u=d(d({},o),m),y={action:"EXTERNAL_CONFERENCE",operation:x,hold_channel_no:x==="HOLDUSER"?`hold${u.line}`:`unhold${u.line}`,userid:(w=(R=n.callData)==null?void 0:R.agent_id)!=null?w:"",process:(z=(_=n.callData)==null?void 0:_.process_name)!=null?z:""};j.post(A.CONFERENCE_CALL_HOLD_OR_UN_HOLD,y).then(()=>{L.setConferenceLine(d(d({},o),m))})},S=(o,m,x)=>{var R,w,_,z;let u=d(d({},o),m),y={action:"EXTERNAL_CONFERENCE",operation:x,channel_no:x==="MUTEUSER"?`mute${u.line}`:`play${u.line}`,userid:(w=(R=n.callData)==null?void 0:R.agent_id)!=null?w:"",thirdparty_no:u.phone,process:(z=(_=n.callData)==null?void 0:_.process_name)!=null?z:""};j.post(A.CONFERENCE_CALL_MUTE_OT_UN_MUTE,y).then(()=>{L.setConferenceLine(d(d({},o),m))})},T=(o,m)=>{var y,R,w,_;let x=d(d({},o),m),u={action:"EXTERNAL_CONFERENCE",operation:"HANGUP_CHANNEL",line_used:String(x.line-1),user_type:`THIRDPARTY${x.line-1}`,thirdparty_no:x.phone,userid:(R=(y=n.callData)==null?void 0:y.agent_id)!=null?R:"",process:(_=(w=n.callData)==null?void 0:w.process_name)!=null?_:""};j.post(A.CONFERENCE_CALL_END,u).then(()=>{L.setConferenceLine(d(d({},o),m))})},N=()=>{var m,x,u,y;let o={action:"EXTERNAL_CONFERENCE",operation:"ENDCONFERENCE",userid:(x=(m=n.callData)==null?void 0:m.agent_id)!=null?x:"",process:(y=(u=n.callData)==null?void 0:u.process_name)!=null?y:""};j.post(A.CONFERENCE_CALL_END_ALL,o).then(()=>{L.resetConferenceLines(),h()})};return(0,ot.useEffect)(()=>{var m,x,u,y;let o={line:1,status:(x=(m=n.callData)==null?void 0:m.status)!=null?x:"",type:"internal",phone:(y=(u=n.callData)==null?void 0:u.phone_number)!=null?y:"",isMute:!1,isHold:!1,isMergeCall:!1,isCallStart:!0};L.setConferenceLine(o)},[]),(0,a.jsx)(a.Fragment,{children:(0,a.jsx)(s.Dialog,{open:r,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,a.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,a.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px"},children:[(0,a.jsxs)(s.Typography,{variant:"body1",children:[(H=n==null?void 0:n.agentId)!=null?H:""," conference"]}),(0,a.jsx)(s.IconButton,{onClick:h,children:(0,a.jsx)(D.Close,{})})]}),(0,a.jsx)(s.Box,{sx:{boxShadow:"0px 1px 2px #e7e5e5ff",padding:"2px 6px",margin:"0px 10px",borderRadius:"20px"},children:(B=n==null?void 0:n.conferenceLine)==null?void 0:B.map((o,m)=>{var x,u;return(0,a.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",justifyContent:"space-between",gap:1},children:[(0,a.jsx)(s.Box,{sx:{color:"white",bgcolor:"warning.main",fontWeight:"bold",fontSize:14,minWidth:70,textAlign:"center",border:"2px solid primary.main",borderRadius:"10px 50px 50px 10px"},children:(0,a.jsx)(s.Typography,{children:(x=o==null?void 0:o.line)!=null?x:""})}),(0,a.jsx)(s.Typography,{variant:"body2",sx:{px:1,border:"2px solid gray",borderRadius:"10px",textAlign:"center",width:"80px",maxWidth:"100px"},children:(u=o==null?void 0:o.status)!=null?u:""}),(0,a.jsx)(s.Button,{sx:{textTransform:"capitalize"},size:"small",children:(0,a.jsx)(s.Typography,{variant:"body2",children:(o==null?void 0:o.line)===1?"Internal":"External"})}),(0,a.jsx)(s.TextField,{size:"small",placeholder:"Phone Number",value:(o==null?void 0:o.phone)||"",disabled:(o==null?void 0:o.line)===1,onChange:y=>{E(o,{phone:y.target.value})}}),(0,a.jsx)(s.Tooltip,{title:"Call",children:(0,a.jsx)(s.Button,{variant:o!=null&&o.isCallStart?"outlined":"contained",color:"success",sx:o!=null&&o.isCallStart?d({},l):$(d({},p),{border:`0px solid ${f.palette.success.light}`,"&:hover":{bgcolor:"error.light",boxShadow:`0px 2px 1px ${f.palette.success.light}`,border:`0px solid ${f.palette.success.light}`},"&:active":{bgcolor:"error.light",boxShadow:`inset 1px -2px 4px ${f.palette.primary.light}`}}),onClick:()=>{C(o,{isCallStart:!0,status:"ONCALL"})},disabled:o==null?void 0:o.isCallStart,children:(0,a.jsx)(D.Call,{sx:{color:o!=null&&o.isCallStart?"defalult":"#fff"}})})}),(0,a.jsx)(s.Tooltip,{title:"Merge Call",children:(0,a.jsx)(s.Button,{variant:o!=null&&o.isMergeCall?"contained":"outlined",sx:o!=null&&o.isMergeCall&&(o!=null&&o.isCallStart)?d({},l):o!=null&&o.isCallStart?d({},e):d({},l),onClick:()=>{I(o,{isMergeCall:!0,status:"ONCALL"})},disabled:!(o!=null&&o.isCallStart),children:(0,a.jsx)(D.CallSplit,{})})}),(0,a.jsx)(s.Tooltip,{title:o.isHold?"Hold":"Un Hold",children:(0,a.jsx)(s.Button,{variant:o!=null&&o.isHold?"contained":"outlined",sx:o!=null&&o.isHold&&(o!=null&&o.isCallStart)?d({},l):o!=null&&o.isCallStart?d({},e):d({},l),onClick:()=>{o.isHold?M(o,{isHold:!1},"UNHOLDUSER"):M(o,{isHold:!0},"HOLDUSER")},disabled:!(o!=null&&o.isCallStart),children:o.isHold?(0,a.jsx)(D.PlayArrow,{}):(0,a.jsx)(D.Pause,{})})}),(0,a.jsx)(s.Tooltip,{title:o.isMute?"Mute":"Un Mute",children:(0,a.jsx)(s.Button,{variant:o!=null&&o.isMute?"contained":"outlined",sx:o!=null&&o.isMute&&(o!=null&&o.isCallStart)?d({},l):o!=null&&o.isCallStart?d({},e):d({},l),onClick:()=>{o.isMute?S(o,{isMute:!1},"PLAYUSER"):S(o,{isMute:!0},"MUTEUSER")},disabled:!(o!=null&&o.isCallStart),children:o.isMute?(0,a.jsx)(D.MicOff,{}):(0,a.jsx)(D.Mic,{})})}),(0,a.jsx)(s.Tooltip,{title:"End Call",children:(o==null?void 0:o.line)!==1?(0,a.jsx)(s.Button,{variant:o!=null&&o.isCallStart?"contained":"outlined",color:"error",sx:o!=null&&o.isCallStart?$(d({},p),{minWidth:"60px !important",border:`0px solid ${f.palette.error.light}`,"&:hover":{bgcolor:"error.light",boxShadow:`0px 2px 1px ${f.palette.error.light}`,border:`0px solid ${f.palette.error.light}`},"&:active":{bgcolor:"error.light",boxShadow:`inset 1px -2px 4px ${f.palette.primary.light}`}}):$(d({},l),{minWidth:"60px !important"}),onClick:()=>{T(o,{isCallStart:!1,isMergeCall:!1,isMute:!1,isHold:!1,status:"IDLE"})},disabled:!(o!=null&&o.isCallStart),children:(0,a.jsx)(D.CallEnd,{})}):(0,a.jsx)(s.Button,{variant:o!=null&&o.isCallStart?"contained":"outlined",sx:$(d({},l),{visibility:"hidden",minWidth:"60px !important"}),onClick:()=>{T(o,{isCallStart:!1,isMergeCall:!1,isMute:!1,isHold:!1,status:"IDLE"})},disabled:!(o!=null&&o.isCallStart),children:(0,a.jsx)(s.Typography,{children:(0,a.jsx)(D.CallEnd,{sx:{visibility:"hidden"}})})})})]},m)})}),(0,a.jsx)(s.Box,{textAlign:"center",m:2,children:(0,a.jsxs)(s.Button,{variant:"outlined",color:"error",size:"large",onClick:N,sx:{px:2,borderRadius:"20px",textTransform:"capitalize"},children:[(0,a.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,a.jsx)(D.PhoneDisabled,{sx:{color:"white",fontSize:"16px",fontWeight:"600"}})}),"End Conference"]})})]})})})}function vo({open:r,setOpen:t}){var S,T,N,H,B,o,m,x;let[n]=W({onSuccess:u=>{console.log("res",u),t(!1)},onError:u=>{console.log("error",u)}}),l=tt(),[p,e]=(0,ot.useState)("process"),[f,{data:h}]=W(),[E,{data:C}]=W(),I=()=>{t(!1)},M=(u,y)=>{var R,w,_,z,Y,X,J,nt,at,pt,dt,ut,gt,st,ft,mt,xt,ht,yt,et,vt,Ct,bt,St,Et,Tt,Lt,Dt,It,Rt,wt,_t,kt;if(console.log(u,"data34"),y==="PROCESS"){let Q={mobile_number:(w=(R=l.callData)==null?void 0:R.phone_number)!=null?w:"",userid:(z=(_=l.callData)==null?void 0:_.agent_id)!=null?z:"",type:"PROCESS",transfer_to:(Y=u==null?void 0:u.process_name)!=null?Y:"",callreferenceid:(J=(X=l.callData)==null?void 0:X.convox_id)!=null?J:"",processid:String((at=(nt=l.callData)==null?void 0:nt.process_id)!=null?at:""),process_name:(dt=(pt=l.callData)==null?void 0:pt.process_name)!=null?dt:""};n(A.TRANSFER_CALL,Q)}else if(y==="QUEUE"){let Q={mobile_number:(gt=(ut=l.callData)==null?void 0:ut.phone_number)!=null?gt:"",userid:(ft=(st=l.callData)==null?void 0:st.agent_id)!=null?ft:"",type:"QUEUE",transfer_to:(mt=u==null?void 0:u.queue_name)!=null?mt:"",callreferenceid:(ht=(xt=l.callData)==null?void 0:xt.convox_id)!=null?ht:"",processid:String((et=(yt=l.callData)==null?void 0:yt.process_id)!=null?et:""),process_name:(Ct=(vt=l.callData)==null?void 0:vt.process_name)!=null?Ct:""};n(A.TRANSFER_CALL,Q)}else if(y==="AGENT"){let Q={mobile_number:(St=(bt=l.callData)==null?void 0:bt.phone_number)!=null?St:"",userid:(Tt=(Et=l.callData)==null?void 0:Et.agent_id)!=null?Tt:"",type:"AGENT",transfer_to:(Lt=u==null?void 0:u.user_id)!=null?Lt:"",callreferenceid:(It=(Dt=l.callData)==null?void 0:Dt.convox_id)!=null?It:"",processid:String((wt=(Rt=l.callData)==null?void 0:Rt.process_id)!=null?wt:""),process_name:(kt=(_t=l.callData)==null?void 0:_t.process_name)!=null?kt:""};n(A.TRANSFER_CALL,Q)}};return(0,ot.useEffect)(()=>{f(A.AGENTS_LIST,{status:"IDLE",active:!0}),E(A.TRANSFER_TO_DETAILS,{status:"ACTIVE",active:!0})},[]),(0,a.jsx)(a.Fragment,{children:(0,a.jsx)(s.Dialog,{open:r,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,a.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,a.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,a.jsx)(s.Typography,{variant:"body1",children:" Call Transfer"}),(0,a.jsx)(s.IconButton,{onClick:I,children:(0,a.jsx)(D.Close,{})})]}),(0,a.jsxs)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px 10px",margin:"10px",borderRadius:"10px"},children:[(0,a.jsxs)(s.Box,{sx:{display:"flex",gap:1},children:[(0,a.jsx)(s.Button,{variant:p==="process"?"contained":"outlined",onClick:()=>e("process"),children:"Process"}),(0,a.jsx)(s.Button,{variant:p==="queues"?"contained":"outlined",onClick:()=>e("queues"),children:"Queues"}),(0,a.jsx)(s.Button,{variant:p==="agents"?"contained":"outlined",onClick:()=>e("agents"),children:"Agents"})]}),p==="process"&&(0,a.jsx)(s.Box,{sx:{display:"flex",gap:1},children:((T=(S=C==null?void 0:C.data)==null?void 0:S.process)==null?void 0:T.length)>0?(H=(N=C==null?void 0:C.data)==null?void 0:N.process)==null?void 0:H.map((u,y)=>(0,a.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",margin:"10px 0px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,a.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,a.jsx)(D.SupportAgent,{sx:{marginRight:"4px"}}),u.process_name]}),(0,a.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{M(u,"PROCESS")},children:(0,a.jsx)(D.Call,{})})]},y)):(0,a.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"12px",fontWeight:"600",letterSpacing:"0.02em",textTransform:"capitalize",textAlign:"center",width:"100%",margin:"10px 0px",color:"gray"},children:"No Process Found"})}),p==="queues"&&(0,a.jsx)(s.Box,{sx:{display:"flex",gap:1},children:((o=(B=C==null?void 0:C.data)==null?void 0:B.queue)==null?void 0:o.length)>0?(x=(m=C==null?void 0:C.data)==null?void 0:m.queue)==null?void 0:x.map((u,y)=>{var R,w,_,z,Y,X;return(0,a.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",margin:"10px 0px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,a.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,a.jsx)(D.SupportAgent,{sx:{marginRight:"4px"}}),u.queue_name,(_=(w=(R=C==null?void 0:C.data)==null?void 0:R.process)==null?void 0:w.find(J=>J.process_id===u.process_id))!=null&&_.process_name?(0,a.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"12px",fontWeight:"600",letterSpacing:"0.02em",textTransform:"capitalize",color:"gray"},children:"("+((X=(Y=(z=C==null?void 0:C.data)==null?void 0:z.process)==null?void 0:Y.find(J=>J.process_id===u.process_id))==null?void 0:X.process_name)+")"}):""]}),(0,a.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{M(u,"QUEUE")},children:(0,a.jsx)(D.Call,{})})]},y)}):(0,a.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"12px",fontWeight:"600",letterSpacing:"0.02em",textTransform:"capitalize",textAlign:"center",width:"100%",margin:"10px 0px",color:"gray"},children:"No Queues Found"})}),p==="agents"&&(0,a.jsx)(s.Box,{sx:{display:"flex",gap:1},children:(h==null?void 0:h.length)>0?h.map((u,y)=>(0,a.jsxs)(s.Box,{sx:{p:1,display:"flex",alignItems:"center",boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px",margin:"10px 0px",borderRadius:"10px","&:hover":{bgcolor:"action.selected"}},children:[(0,a.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,a.jsx)(D.SupportAgent,{sx:{marginRight:"4px"}}),u.name]}),(0,a.jsx)(s.IconButton,{color:"success",sx:{bgcolor:"action.hover","&:hover":{bgcolor:"action.selected"}},onClick:()=>{M(u,"AGENT")},children:(0,a.jsx)(D.Call,{})})]},y)):(0,a.jsx)(s.Typography,{variant:"body1",sx:{fontSize:"12px",fontWeight:"600",letterSpacing:"0.02em",textTransform:"capitalize",textAlign:"center",width:"100%",margin:"10px 0px",color:"gray"},children:"No Agents Found"})})]})]})})})}function Co({open:r,setOpen:t,onSubmitDisposition:n}){var I,M;let[l,p]=(0,ot.useState)({disposition:{label:"Resolved",value:"RES"},followUp:{label:"No",value:"N"},callbackDate:"",callbackHrs:"",callbackMins:""}),e=[{label:"Not Interested",value:"NI"},{label:"Resolved",value:"RES"}],f=[{label:"Yes",value:"Y"},{label:"No",value:"N"}],h=(S,T)=>{p(N=>$(d({},N),{[S]:T}))},E=()=>{p({disposition:{label:"Resolved",value:"RES"},followUp:{label:"No",value:"N"},callbackDate:"",callbackHrs:"",callbackMins:""})},C=()=>{E(),t(!1)};return(0,a.jsx)(a.Fragment,{children:(0,a.jsx)(s.Dialog,{open:r,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"xs",children:(0,a.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,a.jsx)(s.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:(0,a.jsxs)(s.Typography,{variant:"body1",m:1,children:[" ","Call Disposition"]})}),(0,a.jsx)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"10px",margin:"10px",borderRadius:"10px"},children:(0,a.jsxs)(s.Grid,{container:!0,spacing:2,children:[(0,a.jsx)(s.Grid,{size:6,children:(0,a.jsx)(s.Autocomplete,{value:l.disposition,options:e,getOptionLabel:S=>S.label,onChange:(S,T)=>h("disposition",T),size:"small",renderInput:S=>(0,a.jsx)(s.TextField,$(d({},S),{label:"Disposition",fullWidth:!0}))})}),(0,a.jsx)(s.Grid,{size:6,children:(0,a.jsx)(s.Autocomplete,{options:f,getOptionLabel:S=>S.label,value:l.followUp,onChange:(S,T)=>h("followUp",T),size:"small",renderInput:S=>(0,a.jsx)(s.TextField,$(d({},S),{label:"Follow Up",fullWidth:!0}))})}),((M=(I=l==null?void 0:l.followUp)==null?void 0:I.label)==null?void 0:M.toLowerCase())==="yes"&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(s.Grid,{size:6,children:(0,a.jsx)(s.TextField,{size:"small",label:"Callback Date",type:"date",slotProps:{inputLabel:{shrink:!0}},value:l.callbackDate,onChange:S=>h("callbackDate",S.target.value),fullWidth:!0})}),(0,a.jsx)(s.Grid,{size:6,children:(0,a.jsx)(s.TextField,{size:"small",label:"Hours (0-23)",type:"text",inputProps:{min:0,max:23},value:l.callbackHrs,onChange:S=>h("callbackHrs",S.target.value),fullWidth:!0})}),(0,a.jsx)(s.Grid,{size:6,children:(0,a.jsx)(s.TextField,{size:"small",label:"Minutes (0-59)",type:"text",inputProps:{min:0,max:59},value:l.callbackMins,onChange:S=>h("callbackMins",S.target.value),fullWidth:!0})})]})]})}),(0,a.jsxs)(s.Box,{textAlign:"right",m:2,children:[(0,a.jsx)(s.Button,{variant:"outlined",color:"error",size:"large",onClick:C,sx:{px:2,mx:1,borderRadius:"10px",textTransform:"capitalize"},children:"cancel"}),(0,a.jsx)(s.Button,{variant:"contained",color:"primary",size:"large",onClick:()=>n(l),sx:{px:2,borderRadius:"10px",textTransform:"capitalize"},children:"Submit"})]})]})})})}function bo({open:r,setOpen:t,processList:n=[],handleSelectedProcessor:l}){return(0,a.jsx)(a.Fragment,{children:(0,a.jsx)(s.Dialog,{open:r,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",maxWidth:"xs",children:(0,a.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,a.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,a.jsx)(s.Typography,{variant:"body1",children:" Process List"}),(0,a.jsx)(s.IconButton,{onClick:()=>{t(!1)},children:(0,a.jsx)(D.Close,{})})]}),(0,a.jsx)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",padding:"6px 10px",margin:"10px",borderRadius:"10px"},children:(n==null?void 0:n.length)>0?n==null?void 0:n.map((e,f)=>(0,a.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(e)},children:(0,a.jsxs)(s.Typography,{variant:"body1",sx:{mx:1,width:"200px",maxWidth:"250px",display:"flex",alignItems:"center"},children:[(0,a.jsx)(D.SupportAgent,{sx:{marginRight:"4px"}}),e.process_name]})},f)):null})]})})})}function So({open:r,setOpen:t}){return(0,a.jsx)(a.Fragment,{children:(0,a.jsx)(s.Dialog,{open:r,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",fullWidth:!0,maxWidth:"md",children:(0,a.jsxs)(s.Paper,{sx:{borderRadius:2},children:[(0,a.jsxs)(s.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"4px 16px",boxShadow:"0px 1px 2px #f5f5f5ff"},children:[(0,a.jsx)(s.Typography,{variant:"body1",children:" Call History"}),(0,a.jsx)(s.IconButton,{onClick:()=>{t(!1)},children:(0,a.jsx)(D.Close,{})})]}),(0,a.jsx)(s.Box,{sx:{boxShadow:"1px 1px 4px #d3d3d3ff",margin:"10px",borderRadius:"10px",textAlign:"center",fontSize:"16px",fontWeight:"bold"},p:6,children:"Comming Soon..."})]})})})}var c=require("react/jsx-runtime");function Eo({onDataChange:r}){var qt,Ft,Gt,Kt,jt,Yt,Xt,Jt,Qt,Vt,Zt,te,ee,oe,ne,ae,se,ie,re,le,ce,pe,de,ue,ge,fe,me,xe,he,ye,ve,Ce,be,Se,Ee,Te,Le,De,Ie,Re,we,_e,ke,Ae,Ne,Pe,Oe,Ue,Me,Be,He,$e,ze,We,qe,Fe,Ge,Ke,je,Ye,Xe,Je,Qe,Ve,Ze,to;let t=(0,g.useTheme)(),{disabled:n,enabled:l,outlined:p}=Ot(),e=tt(),{showToast:f}=ct(),h=(0,P.useRef)(null),[E,C]=(0,P.useState)(null),[I,M]=(0,P.useState)(!0),[S,T]=(0,P.useState)(null),[N,H]=(0,P.useState)(null),[B,o]=(0,P.useState)(!1),[m,x]=(0,P.useState)(!1),[u,y]=(0,P.useState)(!1),[R,w]=(0,P.useState)(!1),[_,z]=(0,P.useState)(!1),[Y,X]=(0,P.useState)(""),[J,nt]=(0,P.useState)(0),{position:at,isDragging:pt,dragRef:dt,handleMouseDown:ut,handleTouchStart:gt}=Bt(e.controlPanelPosition,i=>L.setControlPanelPosition(i)),{position:st,isDragging:ft,dragRef:mt,handleMouseDown:xt,handleTouchStart:ht}=Bt(e.iframePosition,i=>L.setIframePosition(i)),[yt,{data:et}]=W({onSuccess:i=>{var b;console.log("res",i),i&&i.processes&&((b=i==null?void 0:i.processes)==null?void 0:b.length)>1?w(!0):(L.setProcess(i==null?void 0:i.processes[0]),w(!1))},onError:()=>{w(!1)}}),[vt]=W(),[Ct]=W({onSuccess:()=>{L.setHolding(!e.isHolding)},onError:i=>{console.log("error",i)}}),[bt]=W({onSuccess:()=>{L.setMuted(!e.isMuted)},onError:i=>{console.log("error",i)}}),[St]=W(),[Et]=W(),[Tt]=W(),Lt=(0,P.useCallback)(i=>{let b=Math.floor(i/60),O=i%60;return`${b.toString().padStart(2,"0")}:${O.toString().padStart(2,"0")}`},[]),Dt=()=>{C(null)},It=i=>{M(!0),H(i.currentTarget),L.setStatus("dial")},Rt=()=>{e.status!=="on call"&&L.setStatus("idle"),H(null)},wt=i=>{T(i.currentTarget)},_t=()=>{T(null)},kt=()=>{let i={action:"READYAGENT",userId:e.agentId};St(A.READY_AGENT,i)},Q=i=>{T(null);let b={action:"AGENTBREAK",break_type:i,userId:e.agentId};Et(A.UPDATE_AGENT_BREAK,b)},Do=i=>{if(i.length!==10)f("Invalid phone number","error"),alert("Invalid phone number");else if(!/^\d+$/.test(i))f("Invalid phone number","error");else{let b={action:"CALL",phone_number:i,userId:e.agentId};vt(A.CLICK_TO_CALL,b)}},Io=()=>{let i={action:e.isHolding?"UNHOLD":"HOLD",userId:e.agentId};Ct(A.HOLD_CALL,i)},Ro=()=>{let i={action:e.isMuted?"UNMUTE":"MUTE",userId:e.agentId};bt(A.MUTE_CALL,i)},wo=i=>{var O,G,K,V,Z,it,rt,eo,oo,no,ao,so,io,ro,lo,co;console.log("data",i);let b={action:"ENDCALL",userId:e.agentId,processid:(K=(G=(O=e.process)==null?void 0:O.process_id)==null?void 0:G.toString())!=null?K:"",process_name:(Z=(V=e.process)==null?void 0:V.process_name)!=null?Z:"",callreferenceid:(rt=(it=e.callData)==null?void 0:it.convox_id)!=null?rt:"",mobile_number:(oo=(eo=e.callData)==null?void 0:eo.phone_number)!=null?oo:"",disposition:(ao=(no=i==null?void 0:i.disposition)==null?void 0:no.value)!=null?ao:"",set_followUp:(io=(so=i==null?void 0:i.followUp)==null?void 0:so.value)!=null?io:"",callback_date:(ro=i==null?void 0:i.callbackDate)!=null?ro:"",callback_hrs:(lo=i==null?void 0:i.callbackHrs)!=null?lo:"",callback_mins:(co=i==null?void 0:i.callbackMins)!=null?co:"",endcall_type:"CLOSE"};X(""),Tt(A.END_CALL,b),L.endCall(),y(!1)};return(0,P.useEffect)(()=>{let i;return e.callData.status&&e.callData.status==="ONCALL"?i=setInterval(()=>{let b=Math.floor((Date.now()-e.callStartTime)/1e3);nt(b)},1e3):nt(0),()=>{i&&clearInterval(i)}},[e.callData.status]),(0,P.useEffect)(()=>{r&&r(e.callData)},[e.callData,r]),(0,P.useEffect)(()=>{e.agentId?yt(A.PROCESS_LIST,{userId:e.agentId,action:"GETAGENTPROCESSLIST",refno:"1234221233"}):console.log("No agentId available, skipping API call")},[e.agentId]),(0,P.useEffect)(()=>(e.agentId&&(h.current=new WebSocket(`${fo.WS}?agent_id=${e.agentId}`),h.current.onopen=()=>{console.log("WebSocket connection established")},h.current.onmessage=i=>{try{let b=JSON.parse(i.data);console.log("parsedJSON:",b),L.updateCallData(b),b.status==="ONCALL"&&L.startCall(),b.status==="WRAPUP"&&L.endCall()}catch(b){console.log("Raw message:",i.data)}},h.current.onclose=()=>{console.log("WebSocket connection closed")},h.current.onerror=i=>{console.error("WebSocket error:",i)}),()=>{var i;(i=h.current)==null||i.close()}),[e.agentId]),!e.isInitialized||!e.process?(0,c.jsx)(g.Box,{children:!!R&&(0,c.jsx)(bo,{processList:et==null?void 0:et.processes,open:R,setOpen:w,handleSelectedProcessor:i=>{L.setProcess(i)}})}):(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(g.Fade,{in:!0,timeout:300,children:(0,c.jsx)(g.Paper,{ref:dt,elevation:pt?4:1,sx:{position:"fixed",left:at.x,top:at.y,p:.5,borderRadius:3,bgcolor:"background.paper",zIndex:99999,transition:t.transitions.create(["box-shadow","transform"],{duration:t.transitions.duration.short}),userSelect:"none"},children:(0,c.jsxs)(g.Box,{sx:{display:"flex",alignItems:"center"},children:[(0,c.jsxs)(g.Box,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center"},children:[(0,c.jsxs)(g.IconButton,{component:"div",size:"small",sx:{cursor:"all-scroll"},onMouseDown:ut,onTouchStart:gt,children:[(0,c.jsx)(v.DragIndicator,{})," "]}),(0,c.jsx)(g.Box,{sx:{marginRight:"10px"},children:(0,c.jsx)(g.Tooltip,{title:"Dial",children:(0,c.jsx)(g.IconButton,{size:"small",onClick:i=>{var b,O,G,K,V,Z,it,rt;((O=(b=e.callData)==null?void 0:b.status)==null?void 0:O.toUpperCase())!=="ONCALL"&&((K=(G=e.callData)==null?void 0:G.status)==null?void 0:K.toUpperCase())!=="BREAK"&&((Z=(V=e.callData)==null?void 0:V.status)==null?void 0:Z.toUpperCase())!=="RINGING"&&((rt=(it=e.callData)==null?void 0:it.status)==null?void 0:rt.toUpperCase())!=="WRAPUP"&&It(i)},sx:{bgcolor:"action.hover","&:hover":{bgcolor:"warning"}},children:(0,c.jsx)(v.WifiCalling3,{sx:{color:((Ft=(qt=e.callData)==null?void 0:qt.status)==null?void 0:Ft.toUpperCase())==="ONCALL"||((Kt=(Gt=e.callData)==null?void 0:Gt.status)==null?void 0:Kt.toUpperCase())==="BREAK"||((Yt=(jt=e.callData)==null?void 0:jt.status)==null?void 0:Yt.toUpperCase())==="RINGING"||((Jt=(Xt=e.callData)==null?void 0:Xt.status)==null?void 0:Jt.toUpperCase())==="WRAPUP"?"action.selected":"success.main"}})})})}),(0,c.jsx)(g.Typography,{sx:{color:"success.main",width:"40px",marginRight:"10px"},children:Lt(J)}),(0,c.jsx)(g.Typography,{variant:"body2",sx:{fontWeight:"bold"},children:(Zt=(Vt=(Qt=e.callData)==null?void 0:Qt.status)==null?void 0:Vt.toUpperCase())!=null?Zt:"N/A"}),(0,c.jsxs)(g.Button,{size:"small",variant:"text",onClick:wt,disabled:!!e.callStartTime,children:[(0,c.jsx)(v.ArrowDropDown,{})," "]})]}),(0,c.jsxs)(g.Box,{sx:{display:"flex",gap:1,justifyContent:"center",alignItems:"center"},children:[(0,c.jsx)(g.Tooltip,{title:"Agent Ready",children:(0,c.jsx)(g.Button,{variant:((ee=(te=e.callData)==null?void 0:te.status)==null?void 0:ee.toUpperCase())==="BREAK"||((ne=(oe=e.callData)==null?void 0:oe.status)==null?void 0:ne.toUpperCase())==="MISSED"?"outlined":"contained",onClick:i=>{var b,O,G,K;(((O=(b=e.callData)==null?void 0:b.status)==null?void 0:O.toUpperCase())==="BREAK"||((K=(G=e.callData)==null?void 0:G.status)==null?void 0:K.toUpperCase())==="MISSED")&&(i.stopPropagation(),kt())},classes:{root:((se=(ae=e.callData)==null?void 0:ae.status)==null?void 0:se.toUpperCase())==="BREAK"||((re=(ie=e.callData)==null?void 0:ie.status)==null?void 0:re.toUpperCase())==="MISSED"?"outlined":"enabled"},sx:d({},((ce=(le=e.callData)==null?void 0:le.status)==null?void 0:ce.toUpperCase())==="BREAK"||((de=(pe=e.callData)==null?void 0:pe.status)==null?void 0:de.toUpperCase())==="MISSED"?p:l),children:(0,c.jsx)(v.SupportAgent,{})})}),(0,c.jsx)(g.Tooltip,{title:e.isHolding?"Resume":"Hold",children:(0,c.jsx)(g.Button,{variant:e.isHolding&&((ge=(ue=e.callData)==null?void 0:ue.status)==null?void 0:ge.toUpperCase())==="ONCALL"?"contained":"outlined",onClick:i=>{i.stopPropagation(),Io()},sx:e.isHolding&&((me=(fe=e.callData)==null?void 0:fe.status)==null?void 0:me.toUpperCase())==="ONCALL"?d({},l):((he=(xe=e.callData)==null?void 0:xe.status)==null?void 0:he.toUpperCase())==="ONCALL"?d({},p):d({},n),disabled:((ve=(ye=e.callData)==null?void 0:ye.status)==null?void 0:ve.toUpperCase())!=="ONCALL"&&!e.isHolding,children:e.isHolding?(0,c.jsx)(v.PlayArrow,{}):(0,c.jsx)(v.Pause,{})})}),(0,c.jsx)(g.Tooltip,{title:e.isMuted?"Unmute":"Mute",children:(0,c.jsx)(g.Button,{variant:e.isMuted&&((be=(Ce=e.callData)==null?void 0:Ce.status)==null?void 0:be.toUpperCase())==="ONCALL"?"contained":"outlined",onClick:i=>{i.stopPropagation(),Ro()},sx:e.isMuted&&((Ee=(Se=e.callData)==null?void 0:Se.status)==null?void 0:Ee.toUpperCase())==="ONCALL"?d({},l):((Le=(Te=e.callData)==null?void 0:Te.status)==null?void 0:Le.toUpperCase())==="ONCALL"?d({},p):d({},n),disabled:((Ie=(De=e.callData)==null?void 0:De.status)==null?void 0:Ie.toUpperCase())!=="ONCALL"&&!e.isMuted,children:e.isMuted?(0,c.jsx)(v.MicOff,{}):(0,c.jsx)(v.Mic,{})})}),(0,c.jsx)(g.Tooltip,{title:"Transfer Call",children:(0,c.jsx)(g.Button,{variant:m?"contained":"outlined",onClick:i=>{var b,O;((O=(b=e.callData)==null?void 0:b.status)==null?void 0:O.toUpperCase())==="ONCALL"&&(i.stopPropagation(),x(!0))},sx:m?d({},l):((we=(Re=e.callData)==null?void 0:Re.status)==null?void 0:we.toUpperCase())==="ONCALL"?d({},p):d({},n),disabled:((ke=(_e=e.callData)==null?void 0:_e.status)==null?void 0:ke.toUpperCase())!=="ONCALL",children:(0,c.jsx)(v.TransferWithinAStation,{})})}),(0,c.jsx)(g.Tooltip,{title:"Conference Call",children:(0,c.jsx)(g.Button,{variant:B?"contained":"outlined",onClick:i=>{var b,O;((O=(b=e.callData)==null?void 0:b.status)==null?void 0:O.toUpperCase())==="ONCALL"&&(i.stopPropagation(),o(!0))},sx:B?d({},l):((Ne=(Ae=e.callData)==null?void 0:Ae.status)==null?void 0:Ne.toUpperCase())==="ONCALL"?d({},p):d({},n),disabled:((Oe=(Pe=e.callData)==null?void 0:Pe.status)==null?void 0:Oe.toUpperCase())!=="ONCALL",children:(0,c.jsx)(v.Group,{})})}),(0,c.jsx)(g.Tooltip,{title:"Call History",children:(0,c.jsx)(g.Button,{variant:_?"contained":"outlined",onClick:i=>{i.stopPropagation(),z(!0)},sx:_?d({},l):d({},p),children:(0,c.jsx)(v.History,{})})}),(0,c.jsx)(g.Tooltip,{title:"End Call",children:(0,c.jsx)(g.Button,{variant:((Me=(Ue=e.callData)==null?void 0:Ue.status)==null?void 0:Me.toUpperCase())==="ONCALL"||((He=(Be=e.callData)==null?void 0:Be.status)==null?void 0:He.toUpperCase())==="RINGING"||((ze=($e=e.callData)==null?void 0:$e.status)==null?void 0:ze.toUpperCase())==="WRAPUP"?"contained":"outlined",onClick:i=>{var b,O,G,K,V,Z;(((O=(b=e.callData)==null?void 0:b.status)==null?void 0:O.toUpperCase())==="ONCALL"||((K=(G=e.callData)==null?void 0:G.status)==null?void 0:K.toUpperCase())==="RINGING"||((Z=(V=e.callData)==null?void 0:V.status)==null?void 0:Z.toUpperCase())==="WRAPUP")&&(i.stopPropagation(),y(!0))},sx:((qe=(We=e.callData)==null?void 0:We.status)==null?void 0:qe.toUpperCase())==="ONCALL"||((Ge=(Fe=e.callData)==null?void 0:Fe.status)==null?void 0:Ge.toUpperCase())==="RINGING"||((je=(Ke=e.callData)==null?void 0:Ke.status)==null?void 0:je.toUpperCase())==="WRAPUP"?$(d({},l),{borderRight:"1px",backgroundColor:"error.main",minWidth:"60px !important",boxShadow:" 0px 2px 1px #5f3f3f",border:`1px solid ${t.palette.error.light}`,height:"40px","&:hover":{bgcolor:"error.light",boxShadow:" 0px 2px 1px #5f3f3f",border:`0px solid ${t.palette.error.light}`},"&:active":{bgcolor:"error.light",boxShadow:`inset 1px -2px 4px ${t.palette.primary.light}`}}):$(d({},n),{minWidth:"60px !important"}),disabled:((Xe=(Ye=e.callData)==null?void 0:Ye.status)==null?void 0:Xe.toUpperCase())!=="ONCALL"&&((Qe=(Je=e.callData)==null?void 0:Je.status)==null?void 0:Qe.toUpperCase())!=="RINGING"&&((Ze=(Ve=e.callData)==null?void 0:Ve.status)==null?void 0:Ze.toUpperCase())!=="WRAPUP",children:(0,c.jsx)(v.CallEnd,{})})})]})]})})}),(0,c.jsx)(g.Fade,{in:!0,timeout:300,children:(0,c.jsxs)(g.Paper,{ref:mt,elevation:ft?4:1,sx:{position:"fixed",left:st.x,top:st.y,p:1,height:"auto",borderRadius:2,bgcolor:"background.paper",zIndex:99999,transition:t.transitions.create(["box-shadow","transform"],{duration:t.transitions.duration.short}),visibility:I?"visible":"hidden",userSelect:"none"},children:[(0,c.jsxs)(g.Box,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",cursor:"all-scroll"},onMouseDown:xt,onTouchStart:ht,children:[(0,c.jsx)(v.DragIndicator,{sx:{transform:"rotate(90deg)"}})," ",(0,c.jsx)(g.IconButton,{onClick:()=>M(!1),children:(0,c.jsx)(v.Close,{})})]}),(0,c.jsx)("iframe",{src:`https://h68.deepijatel.in/ConVoxCCS/iframe?agent_id=${e.agentId}&process_id=${(to=e.process)==null?void 0:to.process_id}`,height:380,width:420,allow:"camera; microphone; autoplay"})]})}),(0,c.jsx)(g.Menu,{anchorEl:N,open:!!N,onClose:Rt,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:(0,c.jsxs)(g.Box,{sx:{all:"unset",padding:"10px","&hover":{backgroundColor:"white"}},children:[(0,c.jsx)(g.TextField,{size:"small",value:Y,placeholder:"Enter Mobile No.",onChange:i=>{X(i.target.value)}}),(0,c.jsx)(g.IconButton,{color:"info",onClick:()=>{Do(Y)},children:(0,c.jsx)(v.Phone,{color:"success"})})]})}),(0,c.jsxs)(g.Menu,{anchorEl:S,open:!!S,onClose:_t,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:[(0,c.jsx)(g.MenuItem,{onClick:()=>Q("Lunch"),children:"- Lunch"}),(0,c.jsx)(g.MenuItem,{onClick:()=>Q("Tea"),children:"- Tea"})]}),(0,c.jsx)(g.Menu,{anchorEl:E,open:!!E,onClose:Dt,onClick:i=>i.stopPropagation(),sx:{zIndex:99999},children:(0,c.jsxs)(g.Box,{sx:{display:"flex",justifyContent:"flex-start",flexDirection:"column",padding:"0px 10px","&hover":{backgroundColor:"white"}},children:[(0,c.jsx)(g.Chip,{icon:(0,c.jsx)(v.Layers,{color:"secondary"}),variant:"outlined",label:"Waiting - 25",sx:{margin:"4px 2px"}}),(0,c.jsx)(g.Chip,{icon:(0,c.jsx)(v.Pending,{color:"info"}),label:"Pending - 99+",variant:"outlined",sx:{margin:"4px 2px"}}),(0,c.jsx)(g.Chip,{icon:(0,c.jsx)(v.Upcoming,{color:"success"}),variant:"outlined",label:"Upcoming - 66",sx:{margin:"4px 2px"}})]})}),!!B&&(0,c.jsx)(yo,{open:B,setOpen:o}),!!m&&(0,c.jsx)(vo,{open:m,setOpen:x}),!!u&&(0,c.jsx)(Co,{open:u,setOpen:y,onSubmitDisposition:wo}),!!_&&(0,c.jsx)(So,{open:_,setOpen:z})]})}var zt=class{constructor(){q(this,"config",null);q(this,"ticketId",null);q(this,"baseUrl","");q(this,"eventQueue",[]);q(this,"isOnline",!0);q(this,"retryQueue",[]);q(this,"flushTimer",null)}async init(t){this.config=d({autoTrack:!0,retryAttempts:3,queueSize:100,flushInterval:5e3},t),this.baseUrl=t.baseUrl||(typeof window!="undefined"?window.location.origin:""),this.setupNetworkDetection();let n=await this.createTicket();return this.startPeriodicFlush(),console.log("EventTracker SDK initialized successfully"),n}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 t=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(!t.ok)throw new Error(`Failed to initialize: ${t.status} ${t.statusText}`);let n=await t.json();return this.ticketId=n.ticketId,this.config.autoTrack&&this.setupAutoTracking(),this.ticketId}catch(t){throw console.error("EventTracker initialization failed:",t),t}}async logEvent(t,n){if(!this.config||!this.ticketId){console.warn("EventTracker not initialized, skipping event:",t);return}let l={eventType:t,eventData:n,timestamp:Date.now()};if(this.eventQueue.push(l),this.eventQueue.length>(this.config.queueSize||100)&&this.eventQueue.shift(),this.isOnline)try{await this.sendEvent(l)}catch(p){console.warn("Failed to send event, will retry later:",p)}}async sendEvent(t){if(!(!this.config||!this.ticketId))try{let n=await this.makeRequest("/api/v1/et/event",{method:"POST",headers:{"Content-Type":"application/json","X-API-Key":this.config.apiKey},body:JSON.stringify({ticketId:this.ticketId,eventType:t.eventType,eventData:t.eventData})});if(!n.ok)throw new Error(`Failed to log event: ${n.status} ${n.statusText}`);let l=this.eventQueue.findIndex(p=>p.timestamp===t.timestamp);l>-1&&this.eventQueue.splice(l,1)}catch(n){console.error("Event logging failed:",n),this.retryQueue.push(()=>this.sendEvent(t))}}async closeTicket(){if(!this.config||!this.ticketId)throw new Error("EventTracker not initialized");await this.flush();try{let t=await this.makeRequest("/api/v1/et/close",{method:"POST",headers:{"Content-Type":"application/json","X-API-Key":this.config.apiKey},body:JSON.stringify({ticketId:this.ticketId})});if(!t.ok)throw new Error(`Failed to close ticket: ${t.status} ${t.statusText}`);this.ticketId=null,this.stopPeriodicFlush(),console.log("Ticket closed successfully")}catch(t){throw console.error("Ticket close failed:",t),t}}async flush(){if(!this.isOnline||this.eventQueue.length===0)return;let t=[...this.eventQueue];for(let l of t)await this.sendEvent(l);let n=[...this.retryQueue];this.retryQueue=[];for(let l of n)try{await l()}catch(p){console.error("Retry failed:",p)}}async makeRequest(t,n){var e;let l=`${this.baseUrl}${t}`,p=((e=this.config)==null?void 0:e.retryAttempts)||3;for(let f=1;f<=p;f++)try{return await fetch(l,n)}catch(h){if(f===p)throw h;let E=Math.min(1e3*Math.pow(2,f-1),1e4);await new Promise(C=>setTimeout(C,E))}throw new Error("Max retries exceeded")}setupAutoTracking(){var l;if(typeof window=="undefined"||!((l=this.config)!=null&&l.autoTrack))return;let t=this.config.autoTrack===!0?{}:this.config.autoTrack;if(t.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(p=>console.warn("Failed to track page visit:",p)),t.clicks!==!1&&document.addEventListener("click",p=>{var f;let e=p.target;(e.tagName==="BUTTON"||e.tagName==="A"||e.onclick||e.getAttribute("role")==="button"||e instanceof HTMLButtonElement&&e.type==="button")&&this.logEvent("click",{element:e.tagName,text:(f=e.textContent)==null?void 0:f.trim().substring(0,100),href:e.getAttribute("href"),id:e.id,className:e.className,role:e.getAttribute("role"),position:{x:p.clientX,y:p.clientY},timestamp:new Date().toISOString()}).catch(h=>console.warn("Failed to track click:",h))}),t.forms!==!1&&document.addEventListener("submit",p=>{let e=p.target,f=new FormData(e),h={};f.forEach((E,C)=>{h[C]=E.toString()}),this.logEvent("formSubmission",{formId:e.id,action:e.action,method:e.method,fields:Object.keys(h),fieldCount:Object.keys(h).length,timestamp:new Date().toISOString()}).catch(E=>console.warn("Failed to track form submission:",E))}),t.inputs!==!1){let p;document.addEventListener("input",e=>{let f=e.target;(f.tagName==="INPUT"||f.tagName==="TEXTAREA"||f.tagName==="SELECT")&&(clearTimeout(p),p=setTimeout(()=>{var h;this.logEvent("fieldChange",{element:f.tagName,type:f.getAttribute("type"),name:f.getAttribute("name"),id:f.id,valueLength:((h=f.value)==null?void 0:h.length)||0,timestamp:new Date().toISOString()}).catch(E=>console.warn("Failed to track field change:",E))},1e3))})}let n=Date.now();window.addEventListener("beforeunload",()=>{let p=Date.now()-n;this.logEvent("pageUnload",{url:window.location.href,sessionDuration:p,timestamp:new Date().toISOString()}),this.ticketId&&navigator.sendBeacon(`${this.baseUrl}/api/v1/et/close`,JSON.stringify({ticketId:this.ticketId}))}),t.visibility!==!1&&document.addEventListener("visibilitychange",()=>{this.logEvent("visibilityChange",{hidden:document.hidden,visibilityState:document.visibilityState,timestamp:new Date().toISOString()})}),t.errors!==!1&&(window.addEventListener("error",p=>{this.logEvent("jsError",{message:p.message,filename:p.filename,lineno:p.lineno,colno:p.colno,timestamp:new Date().toISOString()})}),window.addEventListener("unhandledrejection",p=>{var e;this.logEvent("unhandledRejection",{reason:(e=p.reason)==null?void 0:e.toString(),timestamp:new Date().toISOString()})})),t.performance!==!1&&typeof window.performance!="undefined"&&window.performance.navigation&&window.addEventListener("load",()=>{setTimeout(()=>{let p=window.performance.navigation,e=window.performance.timing;this.logEvent("performanceMetrics",{navigationTime:e.navigationStart,loadTime:e.loadEventEnd-e.navigationStart,domReady:e.domContentLoadedEventEnd-e.navigationStart,renderTime:e.loadEventEnd-e.domContentLoadedEventEnd,navigationType:p.type,redirectCount:p.redirectCount,timestamp:new Date().toISOString()})},1e3)})}setupNetworkDetection(){typeof window!="undefined"&&(this.isOnline=navigator.onLine,window.addEventListener("online",()=>{this.isOnline=!0,console.log("EventTracker: Back online, flushing queued events"),this.flush()}),window.addEventListener("offline",()=>{this.isOnline=!1,console.log("EventTracker: Offline, queueing events")}))}startPeriodicFlush(){var n;this.flushTimer&&clearInterval(this.flushTimer);let t=((n=this.config)==null?void 0:n.flushInterval)||5e3;this.flushTimer=setInterval(()=>{this.flush()},t)}stopPeriodicFlush(){this.flushTimer&&(clearInterval(this.flushTimer),this.flushTimer=null)}},Wt=new zt;typeof window!="undefined"&&(window.EventTracker=Wt);var To=require("react");var Go=(r={})=>{let{onSuccess:t,onError:n,onComplete:l}=r,p=tt(),[e,f]=W({onSuccess:E=>{t==null||t(E),l==null||l(),L.clearStorageAndReset(),localStorage.clear()},onError:E=>{n==null||n(E),l==null||l()}});return{logout:(0,To.useCallback)(()=>{let E={action:"LOGOUTUSER",userId:p.agentId||""};e(A.LOGOUT,E)},[e]),isLoading:f.isLoading,isSuccess:f.isSuccess,isError:f.isError,error:f.error,data:f.data}},Lo=Go;function Ko({apiKey:r,tenantId:t,agentId:n}){L.initialize(r,n),Wt.init({apiKey:r,tenantId:t,agentId:n,baseUrl:k})}0&&(module.exports={CallControlPanel,initSDK,useLogout});
2
+ //# sourceMappingURL=index.js.map