@webex/cc-task 1.28.0-ccwidgets.36 → 1.28.0-ccwidgets.37

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
@@ -2075,7 +2075,7 @@ eval("/*\n * ATTENTION: The \"eval\" devtool has been used (maybe by default in
2075
2075
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
2076
2076
 
2077
2077
  "use strict";
2078
- eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\n__webpack_require__(/*! ./call-control.styles.scss */ \"./src/CallControl/call-control.styles.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nfunction CallControlPresentational(props) {\n const [isRecording, setIsRecording] = (0, react_1.useState)(true);\n const [selectedWrapupReason, setSelectedWrapupReason] = (0, react_1.useState)(null);\n const [selectedWrapupId, setSelectedWrapupId] = (0, react_1.useState)(null);\n const { currentTask, audioRef, toggleHold, toggleRecording, endCall, wrapupCall, wrapupCodes, wrapupRequired, isHeld, setIsHeld, } = props;\n (0, react_1.useEffect)(() => {\n if (!currentTask || !currentTask.data || !currentTask.data.interaction)\n return;\n const { interaction, mediaResourceId } = currentTask.data;\n const { media, callProcessingDetails } = interaction;\n const isHold = media && media[mediaResourceId] && media[mediaResourceId].isHold;\n setIsHeld(isHold);\n if (callProcessingDetails) {\n const { isPaused } = callProcessingDetails;\n setIsRecording(!isPaused);\n }\n }, [currentTask]);\n const handletoggleHold = () => {\n toggleHold(!isHeld);\n setIsHeld(!isHeld);\n };\n const handletoggleRecording = () => {\n toggleRecording(isRecording);\n setIsRecording(!isRecording);\n };\n const handleWrapupCall = () => {\n if (selectedWrapupReason && selectedWrapupId) {\n wrapupCall(selectedWrapupReason, selectedWrapupId);\n setSelectedWrapupReason(null);\n setSelectedWrapupId(null);\n }\n };\n const handleWrapupChange = (text, value) => {\n setSelectedWrapupReason(text);\n setSelectedWrapupId(value);\n };\n const buttons = [\n {\n icon: isHeld ? 'play-bold' : 'pause-bold',\n onClick: () => handletoggleHold(),\n tooltip: isHeld ? 'Resume the call' : 'Hold the call',\n className: 'call-control-button',\n disabled: false,\n },\n {\n icon: isRecording ? 'record-paused-bold' : 'record-bold',\n onClick: () => handletoggleRecording(),\n tooltip: isRecording ? 'Pause Recording' : 'Resume Recording',\n className: 'call-control-button',\n disabled: false,\n },\n {\n icon: 'cancel-regular',\n onClick: endCall,\n tooltip: 'End call',\n className: 'call-control-button-cancel',\n disabled: isHeld,\n },\n ];\n if (!currentTask)\n return null;\n return (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"audio\", { ref: audioRef, id: \"remote-audio\", autoPlay: true }),\n react_1.default.createElement(\"div\", { className: \"call-control-container\", \"data-testid\": \"call-control-container\" },\n !wrapupRequired && (react_1.default.createElement(\"div\", { className: \"button-group\" }, buttons.map((button, index) => (react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, color: \"primary\", delay: [0, 0], placement: \"bottom-start\", triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, onPress: button.onClick, disabled: button.disabled },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)))))),\n wrapupRequired && (react_1.default.createElement(\"div\", { className: \"wrapup-group\" },\n react_1.default.createElement(react_collaboration_1.PopoverNext, { color: \"primary\", delay: [0, 0], placement: \"bottom-start\", showArrow: true, trigger: \"click\", triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"wrapup-button\" },\n \"Wrap up\",\n react_1.default.createElement(react_2.Icon, { name: \"arrow-down-bold\" })), variant: \"medium\", interactive: true, offsetDistance: 2, className: \"wrapup-popover\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-large-bold\" }, \"Wrap-up Interaction\"),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-secondary\" }, \"Wrap-up reason\"),\n react_1.default.createElement(react_collaboration_1.SelectNext, { \"aria-label\": \"wrapup-reason\", className: \"wrapup-select\", onSelectionChange: (key) => {\n const selectedItem = wrapupCodes === null || wrapupCodes === void 0 ? void 0 : wrapupCodes.find((code) => code.id === key);\n handleWrapupChange(selectedItem.name, selectedItem.id);\n }, items: wrapupCodes, showBorder: false, placeholder: \"Select\" }, (item) => (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-name\", tagName: 'small' }, item.name)))),\n react_1.default.createElement(react_2.Icon, { className: \"wrapup-select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" }),\n react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"submit-wrapup-button\", onPress: handleWrapupCall, disabled: selectedWrapupId && selectedWrapupReason ? false : true }, \"Submit & Wrap up\")))))));\n}\nexports[\"default\"] = CallControlPresentational;\n\n\n//# sourceURL=webpack://@webex/cc-task/./src/CallControl/call-control.presentational.tsx?");
2078
+ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\n__webpack_require__(/*! ./call-control.styles.scss */ \"./src/CallControl/call-control.styles.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nfunction CallControlPresentational(props) {\n const [selectedWrapupReason, setSelectedWrapupReason] = (0, react_1.useState)(null);\n const [selectedWrapupId, setSelectedWrapupId] = (0, react_1.useState)(null);\n const { currentTask, audioRef, toggleHold, toggleRecording, endCall, wrapupCall, wrapupCodes, wrapupRequired, isHeld, setIsHeld, isRecording, setIsRecording, } = props;\n (0, react_1.useEffect)(() => {\n if (!currentTask || !currentTask.data || !currentTask.data.interaction)\n return;\n const { interaction, mediaResourceId } = currentTask.data;\n const { media, callProcessingDetails } = interaction;\n const isHold = media && media[mediaResourceId] && media[mediaResourceId].isHold;\n setIsHeld(isHold);\n if (callProcessingDetails) {\n const { isPaused } = callProcessingDetails;\n setIsRecording(!isPaused);\n }\n }, [currentTask]);\n const handletoggleHold = () => {\n toggleHold(!isHeld);\n setIsHeld(!isHeld);\n };\n const handleWrapupCall = () => {\n if (selectedWrapupReason && selectedWrapupId) {\n wrapupCall(selectedWrapupReason, selectedWrapupId);\n setSelectedWrapupReason(null);\n setSelectedWrapupId(null);\n }\n };\n const handleWrapupChange = (text, value) => {\n setSelectedWrapupReason(text);\n setSelectedWrapupId(value);\n };\n const buttons = [\n {\n icon: isHeld ? 'play-bold' : 'pause-bold',\n onClick: () => handletoggleHold(),\n tooltip: isHeld ? 'Resume the call' : 'Hold the call',\n className: 'call-control-button',\n disabled: false,\n },\n {\n icon: isRecording ? 'record-paused-bold' : 'record-bold',\n onClick: () => toggleRecording(),\n tooltip: isRecording ? 'Pause Recording' : 'Resume Recording',\n className: 'call-control-button',\n disabled: false,\n },\n {\n icon: 'cancel-regular',\n onClick: endCall,\n tooltip: 'End call',\n className: 'call-control-button-cancel',\n disabled: isHeld,\n },\n ];\n if (!currentTask)\n return null;\n return (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"audio\", { ref: audioRef, id: \"remote-audio\", autoPlay: true }),\n react_1.default.createElement(\"div\", { className: \"call-control-container\", \"data-testid\": \"call-control-container\" },\n !wrapupRequired && (react_1.default.createElement(\"div\", { className: \"button-group\" }, buttons.map((button, index) => (react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, color: \"primary\", delay: [0, 0], placement: \"bottom-start\", triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, onPress: button.onClick, disabled: button.disabled },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)))))),\n wrapupRequired && (react_1.default.createElement(\"div\", { className: \"wrapup-group\" },\n react_1.default.createElement(react_collaboration_1.PopoverNext, { color: \"primary\", delay: [0, 0], placement: \"bottom-start\", showArrow: true, trigger: \"click\", triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"wrapup-button\" },\n \"Wrap up\",\n react_1.default.createElement(react_2.Icon, { name: \"arrow-down-bold\" })), variant: \"medium\", interactive: true, offsetDistance: 2, className: \"wrapup-popover\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-large-bold\" }, \"Wrap-up Interaction\"),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-secondary\" }, \"Wrap-up reason\"),\n react_1.default.createElement(react_collaboration_1.SelectNext, { \"aria-label\": \"wrapup-reason\", className: \"wrapup-select\", onSelectionChange: (key) => {\n const selectedItem = wrapupCodes === null || wrapupCodes === void 0 ? void 0 : wrapupCodes.find((code) => code.id === key);\n handleWrapupChange(selectedItem.name, selectedItem.id);\n }, items: wrapupCodes, showBorder: false, placeholder: \"Select\" }, (item) => (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-name\", tagName: 'small' }, item.name)))),\n react_1.default.createElement(react_2.Icon, { className: \"wrapup-select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" }),\n react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"submit-wrapup-button\", onPress: handleWrapupCall, disabled: selectedWrapupId && selectedWrapupReason ? false : true }, \"Submit & Wrap up\")))))));\n}\nexports[\"default\"] = CallControlPresentational;\n\n\n//# sourceURL=webpack://@webex/cc-task/./src/CallControl/call-control.presentational.tsx?");
2079
2079
 
2080
2080
  /***/ }),
2081
2081
 
@@ -2174,7 +2174,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
2174
2174
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
2175
2175
 
2176
2176
  "use strict";
2177
- eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.useOutdialCall = exports.useCallControl = exports.useIncomingTask = exports.useTaskList = void 0;\nconst react_1 = __webpack_require__(/*! react */ \"react\");\nconst cc_store_1 = __importStar(__webpack_require__(/*! @webex/cc-store */ \"@webex/cc-store\"));\n// Hook for managing the task list\nconst useTaskList = (props) => {\n const { deviceType, onTaskAccepted, onTaskDeclined, logger, taskList } = props;\n const isBrowser = deviceType === 'BROWSER';\n const logError = (message, method) => {\n logger.error(message, {\n module: 'widget-cc-task#helper.ts',\n method: `useTaskList#${method}`,\n });\n };\n (0, react_1.useEffect)(() => {\n if (!taskList || taskList.length === 0)\n return;\n let taskAssignCallback, taskRejectCallback;\n taskList.forEach((task) => {\n const taskId = task === null || task === void 0 ? void 0 : task.data.interactionId;\n if (!taskId)\n return;\n taskAssignCallback = () => {\n if (onTaskAccepted)\n onTaskAccepted(task);\n };\n taskRejectCallback = () => {\n if (onTaskDeclined)\n onTaskDeclined(task);\n };\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_ASSIGNED, taskAssignCallback, taskId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_REJECT, taskRejectCallback, taskId);\n });\n return () => {\n taskList.forEach((task) => {\n const taskId = task === null || task === void 0 ? void 0 : task.data.interactionId;\n if (!taskId)\n return;\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_ASSIGNED, taskAssignCallback, taskId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_REJECT, taskRejectCallback, taskId);\n });\n };\n }, [taskList]);\n const acceptTask = (task) => {\n const taskId = task === null || task === void 0 ? void 0 : task.data.interactionId;\n if (!taskId)\n return;\n task.accept(taskId).catch((error) => {\n logError(`Error accepting task: ${error}`, 'acceptTask');\n });\n };\n const declineTask = (task) => {\n const taskId = task === null || task === void 0 ? void 0 : task.data.interactionId;\n if (!taskId)\n return;\n task.decline(taskId).catch((error) => {\n logError(`Error declining task: ${error}`, 'declineTask');\n });\n };\n return { taskList, acceptTask, declineTask, isBrowser };\n};\nexports.useTaskList = useTaskList;\nconst useIncomingTask = (props) => {\n const { onAccepted, onDeclined, deviceType, incomingTask, logger } = props;\n const isBrowser = deviceType === 'BROWSER';\n const taskAssignCallback = () => {\n if (onAccepted)\n onAccepted();\n };\n const taskRejectCallback = () => {\n if (onDeclined)\n onDeclined();\n };\n (0, react_1.useEffect)(() => {\n if (!incomingTask)\n return;\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_ASSIGNED, taskAssignCallback, incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_REJECT, taskRejectCallback, incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId);\n return () => {\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_ASSIGNED, taskAssignCallback, incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_REJECT, taskRejectCallback, incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId);\n };\n }, [incomingTask]);\n const logError = (message, method) => {\n logger.error(message, {\n module: 'widget-cc-task#helper.ts',\n method: `useIncomingTask#${method}`,\n });\n };\n const accept = () => {\n const taskId = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId;\n if (!taskId)\n return;\n incomingTask.accept(taskId).catch((error) => {\n logError(`Error accepting incoming task: ${error}`, 'accept');\n });\n };\n const decline = () => {\n const taskId = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId;\n if (!taskId)\n return;\n incomingTask.decline(taskId).catch((error) => {\n logError(`Error declining incoming task: ${error}`, 'decline');\n });\n };\n return {\n incomingTask,\n accept,\n decline,\n isBrowser,\n };\n};\nexports.useIncomingTask = useIncomingTask;\nconst useCallControl = (props) => {\n const { currentTask, onHoldResume, onEnd, onWrapUp, logger, deviceType } = props;\n const audioRef = (0, react_1.useRef)(null); // Ref for the audio element\n const isBrowser = deviceType === 'BROWSER';\n const [isHeld, setIsHeld] = (0, react_1.useState)(undefined);\n const holdCallback = () => {\n setIsHeld(true);\n if (onHoldResume)\n onHoldResume();\n };\n const resumeCallback = () => {\n setIsHeld(false);\n if (onHoldResume)\n onHoldResume();\n };\n const endCallCallback = () => {\n if (onEnd)\n onEnd();\n };\n const wrapupCallCallback = ({ wrapUpAuxCodeId }) => {\n var _a;\n const wrapUpReason = (_a = cc_store_1.default.wrapupCodes.find((code) => code.id === wrapUpAuxCodeId)) === null || _a === void 0 ? void 0 : _a.name;\n if (onWrapUp) {\n onWrapUp({\n task: currentTask,\n wrapUpReason: wrapUpReason,\n });\n }\n };\n (0, react_1.useEffect)(() => {\n if (!currentTask)\n return;\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_HOLD, holdCallback, currentTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_RESUME, resumeCallback, currentTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_END, endCallCallback, currentTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.AGENT_WRAPPEDUP, wrapupCallCallback, currentTask.data.interactionId);\n return () => {\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_HOLD, holdCallback, currentTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_RESUME, resumeCallback, currentTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_END, endCallCallback, currentTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.AGENT_WRAPPEDUP, wrapupCallCallback, currentTask.data.interactionId);\n };\n }, [currentTask]);\n const logError = (message, method) => {\n logger.error(message, {\n module: 'widget-cc-task#helper.ts',\n method: `useCallControl#${method}`,\n });\n };\n const handleTaskMedia = (0, react_1.useCallback)((track) => {\n if (audioRef.current) {\n audioRef.current.srcObject = new MediaStream([track]);\n }\n }, [audioRef, currentTask]);\n (0, react_1.useEffect)(() => {\n if (!currentTask || !isBrowser)\n return;\n // Call control only event for WebRTC calls\n currentTask.on(cc_store_1.TASK_EVENTS.TASK_MEDIA, handleTaskMedia);\n return () => {\n currentTask.off(cc_store_1.TASK_EVENTS.TASK_MEDIA, handleTaskMedia);\n };\n }, [currentTask]);\n const toggleHold = (hold) => {\n if (hold) {\n currentTask.hold().catch((error) => {\n logError(`Error holding call: ${error}`, 'toggleHold');\n });\n return;\n }\n currentTask.resume().catch((error) => {\n logError(`Error resuming call: ${error}`, 'toggleHold');\n });\n };\n const toggleRecording = (pause) => {\n if (pause) {\n currentTask.pauseRecording().catch((error) => {\n logError(`Error pausing recording: ${error}`, 'toggleRecording');\n });\n }\n else {\n currentTask.resumeRecording().catch((error) => {\n logError(`Error resuming recording: ${error}`, 'toggleRecording');\n });\n }\n };\n const endCall = () => {\n currentTask.end().catch((error) => {\n logError(`Error ending call: ${error}`, 'endCall');\n });\n };\n const wrapupCall = (wrapUpReason, auxCodeId) => {\n currentTask.wrapup({ wrapUpReason: wrapUpReason, auxCodeId: auxCodeId }).catch((error) => {\n logError(`Error wrapping up call: ${error}`, 'wrapupCall');\n });\n };\n return {\n currentTask,\n audioRef,\n endCall,\n toggleHold,\n toggleRecording,\n wrapupCall,\n isHeld,\n setIsHeld,\n };\n};\nexports.useCallControl = useCallControl;\nconst useOutdialCall = (props) => {\n const { cc, logger } = props;\n const startOutdial = (destination) => {\n // Perform validation on destination number.\n if (!destination || !destination.trim()) {\n alert('Destination number is required, it cannot be empty');\n return;\n }\n cc.startOutdial(destination)\n .then((response) => {\n logger.info('Outdial call started', response);\n })\n .catch((error) => {\n logger.error(`${error}`, {\n module: 'widget-OutdialCall#helper.ts',\n method: 'startOutdial',\n });\n });\n };\n return {\n startOutdial,\n };\n};\nexports.useOutdialCall = useOutdialCall;\n\n\n//# sourceURL=webpack://@webex/cc-task/./src/helper.ts?");
2177
+ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.useOutdialCall = exports.useCallControl = exports.useIncomingTask = exports.useTaskList = void 0;\nconst react_1 = __webpack_require__(/*! react */ \"react\");\nconst cc_store_1 = __importStar(__webpack_require__(/*! @webex/cc-store */ \"@webex/cc-store\"));\n// Hook for managing the task list\nconst useTaskList = (props) => {\n const { deviceType, onTaskAccepted, onTaskDeclined, logger, taskList } = props;\n const isBrowser = deviceType === 'BROWSER';\n const logError = (message, method) => {\n logger.error(message, {\n module: 'widget-cc-task#helper.ts',\n method: `useTaskList#${method}`,\n });\n };\n (0, react_1.useEffect)(() => {\n if (!taskList || taskList.length === 0)\n return;\n let taskAssignCallback, taskRejectCallback;\n taskList.forEach((task) => {\n const taskId = task === null || task === void 0 ? void 0 : task.data.interactionId;\n if (!taskId)\n return;\n taskAssignCallback = () => {\n if (onTaskAccepted)\n onTaskAccepted(task);\n };\n taskRejectCallback = () => {\n if (onTaskDeclined)\n onTaskDeclined(task);\n };\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_ASSIGNED, taskAssignCallback, taskId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_REJECT, taskRejectCallback, taskId);\n });\n return () => {\n taskList.forEach((task) => {\n const taskId = task === null || task === void 0 ? void 0 : task.data.interactionId;\n if (!taskId)\n return;\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_ASSIGNED, taskAssignCallback, taskId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_REJECT, taskRejectCallback, taskId);\n });\n };\n }, [taskList]);\n const acceptTask = (task) => {\n const taskId = task === null || task === void 0 ? void 0 : task.data.interactionId;\n if (!taskId)\n return;\n task.accept(taskId).catch((error) => {\n logError(`Error accepting task: ${error}`, 'acceptTask');\n });\n };\n const declineTask = (task) => {\n const taskId = task === null || task === void 0 ? void 0 : task.data.interactionId;\n if (!taskId)\n return;\n task.decline(taskId).catch((error) => {\n logError(`Error declining task: ${error}`, 'declineTask');\n });\n };\n return { taskList, acceptTask, declineTask, isBrowser };\n};\nexports.useTaskList = useTaskList;\nconst useIncomingTask = (props) => {\n const { onAccepted, onDeclined, deviceType, incomingTask, logger } = props;\n const isBrowser = deviceType === 'BROWSER';\n const taskAssignCallback = () => {\n if (onAccepted)\n onAccepted();\n };\n const taskRejectCallback = () => {\n if (onDeclined)\n onDeclined();\n };\n (0, react_1.useEffect)(() => {\n if (!incomingTask)\n return;\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_ASSIGNED, taskAssignCallback, incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_REJECT, taskRejectCallback, incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId);\n return () => {\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_ASSIGNED, taskAssignCallback, incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_REJECT, taskRejectCallback, incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId);\n };\n }, [incomingTask]);\n const logError = (message, method) => {\n logger.error(message, {\n module: 'widget-cc-task#helper.ts',\n method: `useIncomingTask#${method}`,\n });\n };\n const accept = () => {\n const taskId = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId;\n if (!taskId)\n return;\n incomingTask.accept(taskId).catch((error) => {\n logError(`Error accepting incoming task: ${error}`, 'accept');\n });\n };\n const decline = () => {\n const taskId = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data.interactionId;\n if (!taskId)\n return;\n incomingTask.decline(taskId).catch((error) => {\n logError(`Error declining incoming task: ${error}`, 'decline');\n });\n };\n return {\n incomingTask,\n accept,\n decline,\n isBrowser,\n };\n};\nexports.useIncomingTask = useIncomingTask;\nconst useCallControl = (props) => {\n const { currentTask, onHoldResume, onEnd, onWrapUp, logger, deviceType } = props;\n const audioRef = (0, react_1.useRef)(null); // Ref for the audio element\n const isBrowser = deviceType === 'BROWSER';\n const [isHeld, setIsHeld] = (0, react_1.useState)(undefined);\n const [isRecording, setIsRecording] = (0, react_1.useState)(true);\n const holdCallback = () => {\n setIsHeld(true);\n if (onHoldResume)\n onHoldResume();\n };\n const resumeCallback = () => {\n setIsHeld(false);\n if (onHoldResume)\n onHoldResume();\n };\n const endCallCallback = () => {\n if (onEnd)\n onEnd();\n };\n const wrapupCallCallback = ({ wrapUpAuxCodeId }) => {\n var _a;\n const wrapUpReason = (_a = cc_store_1.default.wrapupCodes.find((code) => code.id === wrapUpAuxCodeId)) === null || _a === void 0 ? void 0 : _a.name;\n if (onWrapUp) {\n onWrapUp({\n task: currentTask,\n wrapUpReason: wrapUpReason,\n });\n }\n };\n const pauseRecordingCallback = () => {\n setIsRecording(false);\n };\n const resumeRecordingCallback = () => {\n setIsRecording(true);\n };\n (0, react_1.useEffect)(() => {\n if (!currentTask)\n return;\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_HOLD, holdCallback, currentTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_RESUME, resumeCallback, currentTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.TASK_END, endCallCallback, currentTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.AGENT_WRAPPEDUP, wrapupCallCallback, currentTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.CONTACT_RECORDING_PAUSED, pauseRecordingCallback, currentTask.data.interactionId);\n cc_store_1.default.setTaskCallback(cc_store_1.TASK_EVENTS.CONTACT_RECORDING_RESUMED, resumeRecordingCallback, currentTask.data.interactionId);\n return () => {\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_HOLD, holdCallback, currentTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_RESUME, resumeCallback, currentTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.TASK_END, endCallCallback, currentTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.AGENT_WRAPPEDUP, wrapupCallCallback, currentTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.CONTACT_RECORDING_PAUSED, pauseRecordingCallback, currentTask.data.interactionId);\n cc_store_1.default.removeTaskCallback(cc_store_1.TASK_EVENTS.CONTACT_RECORDING_RESUMED, resumeRecordingCallback, currentTask.data.interactionId);\n };\n }, [currentTask]);\n const logError = (message, method) => {\n logger.error(message, {\n module: 'widget-cc-task#helper.ts',\n method: `useCallControl#${method}`,\n });\n };\n const handleTaskMedia = (0, react_1.useCallback)((track) => {\n if (audioRef.current) {\n audioRef.current.srcObject = new MediaStream([track]);\n }\n }, [audioRef, currentTask]);\n (0, react_1.useEffect)(() => {\n if (!currentTask || !isBrowser)\n return;\n // Call control only event for WebRTC calls\n currentTask.on(cc_store_1.TASK_EVENTS.TASK_MEDIA, handleTaskMedia);\n return () => {\n currentTask.off(cc_store_1.TASK_EVENTS.TASK_MEDIA, handleTaskMedia);\n };\n }, [currentTask]);\n const toggleHold = (hold) => {\n if (hold) {\n currentTask.hold().catch((error) => {\n logError(`Error holding call: ${error}`, 'toggleHold');\n });\n return;\n }\n currentTask.resume().catch((error) => {\n logError(`Error resuming call: ${error}`, 'toggleHold');\n });\n };\n const toggleRecording = () => {\n if (isRecording) {\n currentTask.pauseRecording().catch((error) => {\n logError(`Error pausing recording: ${error}`, 'toggleRecording');\n });\n }\n else {\n currentTask.resumeRecording().catch((error) => {\n logError(`Error resuming recording: ${error}`, 'toggleRecording');\n });\n }\n };\n const endCall = () => {\n currentTask.end().catch((error) => {\n logError(`Error ending call: ${error}`, 'endCall');\n });\n };\n const wrapupCall = (wrapUpReason, auxCodeId) => {\n currentTask.wrapup({ wrapUpReason: wrapUpReason, auxCodeId: auxCodeId }).catch((error) => {\n logError(`Error wrapping up call: ${error}`, 'wrapupCall');\n });\n };\n return {\n currentTask,\n audioRef,\n endCall,\n toggleHold,\n toggleRecording,\n wrapupCall,\n isHeld,\n setIsHeld,\n isRecording,\n setIsRecording,\n };\n};\nexports.useCallControl = useCallControl;\nconst useOutdialCall = (props) => {\n const { cc, logger } = props;\n const startOutdial = (destination) => {\n // Perform validation on destination number.\n if (!destination || !destination.trim()) {\n alert('Destination number is required, it cannot be empty');\n return;\n }\n cc.startOutdial(destination)\n .then((response) => {\n logger.info('Outdial call started', response);\n })\n .catch((error) => {\n logger.error(`${error}`, {\n module: 'widget-OutdialCall#helper.ts',\n method: 'startOutdial',\n });\n });\n };\n return {\n startOutdial,\n };\n};\nexports.useOutdialCall = useOutdialCall;\n\n\n//# sourceURL=webpack://@webex/cc-task/./src/helper.ts?");
2178
2178
 
2179
2179
  /***/ }),
2180
2180
 
@@ -18,10 +18,12 @@ export declare const useCallControl: (props: useCallControlProps) => {
18
18
  audioRef: import("react").MutableRefObject<HTMLAudioElement>;
19
19
  endCall: () => void;
20
20
  toggleHold: (hold: boolean) => void;
21
- toggleRecording: (pause: boolean) => void;
21
+ toggleRecording: () => void;
22
22
  wrapupCall: (wrapUpReason: string, auxCodeId: string) => void;
23
23
  isHeld: boolean;
24
24
  setIsHeld: import("react").Dispatch<import("react").SetStateAction<boolean>>;
25
+ isRecording: boolean;
26
+ setIsRecording: import("react").Dispatch<import("react").SetStateAction<boolean>>;
25
27
  };
26
28
  export declare const useOutdialCall: (props: useOutdialCallProps) => {
27
29
  startOutdial: (destination: string) => void;
@@ -124,10 +124,9 @@ export interface ControlProps {
124
124
  */
125
125
  toggleHold: (hold: boolean) => void;
126
126
  /**
127
- * Function to handle pause/resume recording actions with a boolean parameter.
128
- * @param pause - Boolean indicating whether to pause (true) or resume (false) recording.
127
+ * Function to handle pause/resume recording actions.
129
128
  */
130
- toggleRecording: (pause: boolean) => void;
129
+ toggleRecording: () => void;
131
130
  /**
132
131
  * Function to handle ending the call.
133
132
  */
@@ -151,7 +150,16 @@ export interface ControlProps {
151
150
  * @param isHeld - Boolean indicating whether the task is held.
152
151
  */
153
152
  setIsHeld: (isHeld: boolean) => void;
153
+ /**
154
+ * Flag to determine if the task is being recorded
155
+ */
156
+ isRecording: boolean;
157
+ /**
158
+ * Function to set the recording status of the task.
159
+ * @param isRecording - Boolean indicating whether the task is being recorded.
160
+ */
161
+ setIsRecording: (isRecording: boolean) => void;
154
162
  }
155
163
  export type CallControlProps = Pick<ControlProps, 'onHoldResume' | 'onEnd' | 'onWrapUp'>;
156
- export type CallControlPresentationalProps = Pick<ControlProps, 'currentTask' | 'audioRef' | 'wrapupCodes' | 'wrapupRequired' | 'toggleHold' | 'toggleRecording' | 'endCall' | 'wrapupCall' | 'isHeld' | 'setIsHeld'>;
164
+ export type CallControlPresentationalProps = Pick<ControlProps, 'currentTask' | 'audioRef' | 'wrapupCodes' | 'wrapupRequired' | 'toggleHold' | 'toggleRecording' | 'endCall' | 'wrapupCall' | 'isHeld' | 'setIsHeld' | 'isRecording' | 'setIsRecording'>;
157
165
  export type useCallControlProps = Pick<ControlProps, 'currentTask' | 'onHoldResume' | 'onEnd' | 'onWrapUp' | 'logger' | 'deviceType'>;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@webex/cc-task",
3
3
  "description": "Webex Contact Center Widgets: Task",
4
- "version": "1.28.0-ccwidgets.36",
4
+ "version": "1.28.0-ccwidgets.37",
5
5
  "main": "dist/index.js",
6
6
  "publishConfig": {
7
7
  "access": "public"
@@ -20,8 +20,8 @@
20
20
  "test:styles": "eslint"
21
21
  },
22
22
  "dependencies": {
23
- "@webex/cc-components": "1.28.0-ccwidgets.36",
24
- "@webex/cc-store": "1.28.0-ccwidgets.36",
23
+ "@webex/cc-components": "1.28.0-ccwidgets.37",
24
+ "@webex/cc-store": "1.28.0-ccwidgets.37",
25
25
  "mobx-react-lite": "^4.1.0"
26
26
  },
27
27
  "devDependencies": {