@nethesis/phone-island 0.7.97 → 0.7.99

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.
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../node_modules/@nethesis/nethesis-light-svg-icons/index.mjs.js"),a=require("../../lib/phone/call.js"),n=require("../../static/icons/PhoneKeypadLight.js"),r=require("../../static/icons/PhoneKeypadSolid.js");require("../../node_modules/react-redux/es/index.js");var o=require("../../store/index.js");require("../../node_modules/socket.io-client/build/esm/index.js"),require("../../node_modules/webrtc-adapter/src/js/adapter_core.js"),require("../../lib/webrtc/janus.js");var i=require("../../lib/webrtc/messages.js");require("../../node_modules/mic-check/lib/index.js");var l=require("../../static/outgoing_ringtone.js");require("../Island.js");var s=require("../Button.js"),u=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),c=require("../../node_modules/@nethesis/nethesis-solid-svg-icons/index.mjs.js");require("../../node_modules/framer-motion/dist/framer-motion.js");var d=require("../TransferView/TransferActions.js"),f=require("../../node_modules/react-tooltip/dist/react-tooltip.min.cjs.js"),p=require("../../node_modules/react-redux/es/hooks/useSelector.js"),m=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=j(e);exports.default=function(){var e=p.useSelector((function(e){return e.currentCall})),j=e.paused,E=e.muted,g=p.useSelector((function(e){return e.currentCall.parked})),x=p.useSelector((function(e){return e.island})),C=x.view,w=x.actionsExpanded,y=p.useSelector((function(e){return e.currentCall.transferring})),q=m.useDispatch();return v.default.createElement(v.default.Fragment,null,v.default.createElement("div",{className:"pi-grid pi-grid-cols-4 pi-auto-cols-max pi-gap-y-5 pi-justify-items-center pi-place-items-center pi-justify-center"},v.default.createElement(s.Button,{variant:"default",active:!!j,onClick:function(){return j?a.unpauseCurrentCall():a.pauseCurrentCall()},"data-tooltip-id":"tooltip","data-tooltip-content":j?"Play":"Pause"},j?v.default.createElement(u.FontAwesomeIcon,{size:"xl",icon:c.faPlay}):v.default.createElement(u.FontAwesomeIcon,{size:"xl",icon:t.faPause})),v.default.createElement(s.Button,{variant:"default",active:!!E,onClick:function(){return E?a.unmuteCurrentCall():a.muteCurrentCall()},"data-tooltip-id":"tooltip","data-tooltip-content":E?"Unmute":"Mute"},E?v.default.createElement(u.FontAwesomeIcon,{size:"xl",icon:c.faMicrophoneSlash}):v.default.createElement(u.FontAwesomeIcon,{size:"xl",icon:t.faMicrophone})),v.default.createElement(s.Button,{active:y,onClick:y?function(){i.sendDTMF("*"),o.store.getState().player.audioPlayerPlaying||q.player.updateStartAudioPlayer({src:l.default,loop:!0}),setTimeout((function(){i.sendDTMF("1"),q.player.stopAudioPlayer(),y&&setTimeout((function(){q.currentCall.updateTransferring(!1)}),500)}),500)}:function(){q.island.setIslandView("transfer"!==C?"transfer":"call"),a.pauseCurrentCall()},variant:"default","data-tooltip-id":"tooltip","data-tooltip-content":y?"Cancel transfer":"Transfer"},y?v.default.createElement(u.FontAwesomeIcon,{className:"",size:"xl",icon:c.faArrowDownUpAcrossLine}):v.default.createElement(u.FontAwesomeIcon,{size:"xl",icon:t.faArrowDownArrowUp})),v.default.createElement(s.Button,{active:w,variant:"transparent",onClick:function(){w?q.island.toggleActionsExpanded(!1):q.island.toggleActionsExpanded(!0)},"data-tooltip-id":"tooltip","data-tooltip-content":w?"Collapse":"Expand"},w?v.default.createElement(u.FontAwesomeIcon,{className:"",size:"xl",icon:t.faChevronUp}):v.default.createElement(u.FontAwesomeIcon,{size:"xl",icon:t.faChevronDown}))),w?v.default.createElement(v.default.Fragment,null," ",v.default.createElement("div",{className:"pi-grid pi-grid-cols-4 pi-auto-cols-max pi-gap-y-5 pi-justify-items-center pi-place-items-center pi-justify-center"},v.default.createElement(s.Button,{active:"keypad"===C,variant:"default",onClick:function(){q.island.setIslandView("keypad"!==C?"keypad":"call")},"data-tooltip-id":"tooltip","data-tooltip-content":"Keyboard"},"keypad"===C?v.default.createElement(r.default,null):v.default.createElement(n.default,null)),v.default.createElement(s.Button,{active:g,variant:"default",onClick:function(){a.park(),q.currentCall.setParked(!0)},"data-tooltip-id":"tooltip","data-tooltip-content":"Park"},v.default.createElement(u.FontAwesomeIcon,{size:"xl",icon:g?c.faCircleParking:t.faCircleParking})))):v.default.createElement(v.default.Fragment,null),y&&v.default.createElement(d.TransferActions,null),v.default.createElement(f.Tooltip,{className:"pi-z-20",id:"tooltip",place:"bottom"}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react"),n=require("../../node_modules/@nethesis/nethesis-light-svg-icons/index.mjs.js"),a=require("../../lib/phone/call.js"),r=require("../../static/icons/PhoneKeypadLight.js"),o=require("../../static/icons/PhoneKeypadSolid.js"),i=require("../../utils/customHooks/useEventListener.js");require("../../node_modules/react-redux/es/index.js");var l=require("../../store/index.js");require("../../node_modules/socket.io-client/build/esm/index.js"),require("../../node_modules/webrtc-adapter/src/js/adapter_core.js"),require("../../lib/webrtc/janus.js");var s=require("../../lib/webrtc/messages.js");require("../../node_modules/mic-check/lib/index.js");var u=require("../../static/outgoing_ringtone.js");require("../Island.js");var c=require("../Button.js"),d=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),f=require("../../node_modules/@nethesis/nethesis-solid-svg-icons/index.mjs.js");require("../../node_modules/framer-motion/dist/framer-motion.js");var p=require("../TransferView/TransferActions.js"),m=require("../../node_modules/react-tooltip/dist/react-tooltip.min.cjs.js"),j=require("../../node_modules/react-redux/es/hooks/useSelector.js"),v=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function C(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var E=C(t);exports.default=function(){var t=j.useSelector((function(e){return e.currentCall})),C=t.paused,g=t.muted,x=j.useSelector((function(e){return e.currentCall.parked})),w=j.useSelector((function(e){return e.island})),y=w.view,q=w.actionsExpanded,h=j.useSelector((function(e){return e.currentCall.transferring})),k=v.useDispatch();return i.useEventListener("phone-island-transfer-call",(function(t){!function(t){e.__awaiter(this,void 0,void 0,(function(){return e.__generator(this,(function(e){switch(e.label){case 0:return[4,a.attendedTransfer(t)];case 1:return e.sent()&&(k.currentCall.updateCurrentCall({transferring:!0,paused:!1}),k.player.playRemoteAudio()),[2]}}))}))}(t.to)})),E.default.createElement(E.default.Fragment,null,E.default.createElement("div",{className:"pi-grid pi-grid-cols-4 pi-auto-cols-max pi-gap-y-5 pi-justify-items-center pi-place-items-center pi-justify-center"},E.default.createElement(c.Button,{variant:"default",active:!!C,onClick:function(){return C?a.unpauseCurrentCall():a.pauseCurrentCall()},"data-tooltip-id":"tooltip","data-tooltip-content":C?"Play":"Pause"},C?E.default.createElement(d.FontAwesomeIcon,{size:"xl",icon:f.faPlay}):E.default.createElement(d.FontAwesomeIcon,{size:"xl",icon:n.faPause})),E.default.createElement(c.Button,{variant:"default",active:!!g,onClick:function(){return g?a.unmuteCurrentCall():a.muteCurrentCall()},"data-tooltip-id":"tooltip","data-tooltip-content":g?"Unmute":"Mute"},g?E.default.createElement(d.FontAwesomeIcon,{size:"xl",icon:f.faMicrophoneSlash}):E.default.createElement(d.FontAwesomeIcon,{size:"xl",icon:n.faMicrophone})),E.default.createElement(c.Button,{active:h,onClick:h?function(){s.sendDTMF("*"),l.store.getState().player.audioPlayerPlaying||k.player.updateStartAudioPlayer({src:u.default,loop:!0}),setTimeout((function(){s.sendDTMF("1"),k.player.stopAudioPlayer(),h&&setTimeout((function(){k.currentCall.updateTransferring(!1)}),500)}),500)}:function(){k.island.setIslandView("transfer"!==y?"transfer":"call"),a.pauseCurrentCall()},variant:"default","data-tooltip-id":"tooltip","data-tooltip-content":h?"Cancel transfer":"Transfer"},h?E.default.createElement(d.FontAwesomeIcon,{className:"",size:"xl",icon:f.faArrowDownUpAcrossLine}):E.default.createElement(d.FontAwesomeIcon,{size:"xl",icon:n.faArrowDownArrowUp})),E.default.createElement(c.Button,{active:q,variant:"transparent",onClick:function(){q?k.island.toggleActionsExpanded(!1):k.island.toggleActionsExpanded(!0)},"data-tooltip-id":"tooltip","data-tooltip-content":q?"Collapse":"Expand"},q?E.default.createElement(d.FontAwesomeIcon,{className:"",size:"xl",icon:n.faChevronUp}):E.default.createElement(d.FontAwesomeIcon,{size:"xl",icon:n.faChevronDown}))),q?E.default.createElement(E.default.Fragment,null," ",E.default.createElement("div",{className:"pi-grid pi-grid-cols-4 pi-auto-cols-max pi-gap-y-5 pi-justify-items-center pi-place-items-center pi-justify-center"},E.default.createElement(c.Button,{active:"keypad"===y,variant:"default",onClick:function(){k.island.setIslandView("keypad"!==y?"keypad":"call")},"data-tooltip-id":"tooltip","data-tooltip-content":"Keyboard"},"keypad"===y?E.default.createElement(o.default,null):E.default.createElement(r.default,null)),E.default.createElement(c.Button,{active:x,variant:"default",onClick:function(){a.park(),k.currentCall.setParked(!0)},"data-tooltip-id":"tooltip","data-tooltip-content":"Park"},E.default.createElement(d.FontAwesomeIcon,{size:"xl",icon:x?f.faCircleParking:n.faCircleParking})),h&&E.default.createElement(p.TransferActions,null))):E.default.createElement(E.default.Fragment,null),E.default.createElement(m.Tooltip,{className:"pi-z-20",id:"tooltip",place:"bottom"}))};
2
2
  //# sourceMappingURL=Actions.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Actions.js","sources":["../../../src/components/CallView/Actions.tsx"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC } from 'react'\nimport {\n faPause as faPauseRegular,\n faMicrophone as faMicrophoneLight,\n faArrowDownArrowUp,\n faCircleParking,\n faChevronDown,\n faChevronUp,\n} from '@nethesis/nethesis-light-svg-icons'\nimport {\n muteCurrentCall,\n unmuteCurrentCall,\n pauseCurrentCall,\n unpauseCurrentCall,\n} from '../../lib/phone/call'\nimport PhoneKeypadLight from '../../static/icons/PhoneKeypadLight'\nimport PhoneKeypadSolid from '../../static/icons/PhoneKeypadSolid'\nimport { Button } from '../'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n faMicrophoneSlash,\n faPlay,\n faArrowDownUpAcrossLine,\n faCircleParking as faCircleParkingSolid,\n} from '@nethesis/nethesis-solid-svg-icons'\nimport { RootState, Dispatch } from '../../store'\nimport { useSelector, useDispatch } from 'react-redux'\nimport { sendDTMF } from '../../lib/webrtc/messages'\nimport { store } from '../../store'\nimport outgoingRingtone from '../../static/outgoing_ringtone'\nimport { TransferActions } from '../TransferView'\nimport { Tooltip } from 'react-tooltip/dist/react-tooltip.min.cjs'\nimport { park } from '../../lib/phone/call'\n\nconst Actions: FC = () => {\n // Get multiple values from currentCall store\n const { paused, muted } = useSelector((state: RootState) => state.currentCall)\n const parked = useSelector((state: RootState) => state.currentCall.parked)\n\n // Get isOpen and view from island store\n const { view, actionsExpanded } = useSelector((state: RootState) => state.island)\n const transferring = useSelector((state: RootState) => state.currentCall.transferring)\n\n const dispatch = useDispatch<Dispatch>()\n\n function openKeypad() {\n dispatch.island.setIslandView(view !== 'keypad' ? 'keypad' : 'call')\n }\n\n function transfer() {\n // Open the transfer view\n dispatch.island.setIslandView(view !== 'transfer' ? 'transfer' : 'call')\n // Pause the call\n pauseCurrentCall()\n }\n\n // Cancels the current transfer through dtmfs\n function calcelTransfer() {\n sendDTMF('*')\n const { audioPlayerPlaying } = store.getState().player\n // Check if the local audio is already playing and start playing\n if (!audioPlayerPlaying) {\n dispatch.player.updateStartAudioPlayer({\n src: outgoingRingtone,\n loop: true,\n })\n }\n setTimeout(() => {\n sendDTMF('1')\n dispatch.player.stopAudioPlayer()\n // The workarround to disable transfer because of the wrong conv.connection value from ws\n if (transferring) {\n setTimeout(() => {\n dispatch.currentCall.updateTransferring(false)\n }, 500)\n }\n }, 500)\n }\n\n function toggleActionsExpanded() {\n if (actionsExpanded) {\n dispatch.island.toggleActionsExpanded(false)\n } else {\n dispatch.island.toggleActionsExpanded(true)\n }\n }\n\n function parkAction() {\n park()\n dispatch.currentCall.setParked(true)\n }\n\n return (\n <>\n <div className='pi-grid pi-grid-cols-4 pi-auto-cols-max pi-gap-y-5 pi-justify-items-center pi-place-items-center pi-justify-center'>\n <Button\n variant='default'\n active={paused ? true : false}\n onClick={() => (paused ? unpauseCurrentCall() : pauseCurrentCall())}\n data-tooltip-id='tooltip'\n data-tooltip-content={paused ? 'Play' : 'Pause'}\n >\n {paused ? (\n <FontAwesomeIcon size='xl' icon={faPlay} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faPauseRegular} />\n )}\n </Button>\n <Button\n variant='default'\n active={muted ? true : false}\n onClick={() => (muted ? unmuteCurrentCall() : muteCurrentCall())}\n data-tooltip-id='tooltip'\n data-tooltip-content={muted ? 'Unmute' : 'Mute'}\n >\n {muted ? (\n <FontAwesomeIcon size='xl' icon={faMicrophoneSlash} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faMicrophoneLight} />\n )}\n </Button>\n <Button\n active={transferring}\n onClick={transferring ? calcelTransfer : transfer}\n variant='default'\n data-tooltip-id='tooltip'\n data-tooltip-content={transferring ? 'Cancel transfer' : 'Transfer'}\n >\n {transferring ? (\n <FontAwesomeIcon className='' size='xl' icon={faArrowDownUpAcrossLine} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faArrowDownArrowUp} />\n )}\n </Button>\n <Button\n active={actionsExpanded}\n variant='transparent'\n onClick={() => toggleActionsExpanded()}\n data-tooltip-id='tooltip'\n data-tooltip-content={actionsExpanded ? 'Collapse' : 'Expand'}\n >\n {actionsExpanded ? (\n <FontAwesomeIcon className='' size='xl' icon={faChevronUp} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faChevronDown} />\n )}\n </Button>\n </div>\n {/* Actions expanded section */}\n {actionsExpanded ? (\n <>\n {' '}\n <div className='pi-grid pi-grid-cols-4 pi-auto-cols-max pi-gap-y-5 pi-justify-items-center pi-place-items-center pi-justify-center'>\n <Button\n active={view === 'keypad'}\n variant='default'\n onClick={openKeypad}\n data-tooltip-id='tooltip'\n data-tooltip-content='Keyboard'\n >\n {view === 'keypad' ? <PhoneKeypadSolid /> : <PhoneKeypadLight />}\n </Button>\n <Button\n active={parked}\n variant='default'\n onClick={parkAction}\n data-tooltip-id='tooltip'\n data-tooltip-content='Park'\n >\n <FontAwesomeIcon size='xl' icon={parked ? faCircleParkingSolid : faCircleParking} />\n </Button>\n </div>\n </>\n ) : (\n <></>\n )}\n\n {transferring && <TransferActions />}\n {/* Buttons tooltips */}\n <Tooltip className='pi-z-20' id='tooltip' place='bottom' />\n </>\n )\n}\n\nexport default Actions\n"],"names":["_a","useSelector","state","currentCall","paused","muted","parked","_b","island","view","actionsExpanded","transferring","dispatch","useDispatch","React","createElement","Fragment","className","Button","variant","active","onClick","unpauseCurrentCall","pauseCurrentCall","FontAwesomeIcon","size","icon","faPlay","faPauseRegular","unmuteCurrentCall","muteCurrentCall","faMicrophoneSlash","faMicrophoneLight","sendDTMF","store","getState","player","audioPlayerPlaying","updateStartAudioPlayer","src","outgoingRingtone","loop","setTimeout","stopAudioPlayer","updateTransferring","setIslandView","faArrowDownUpAcrossLine","faArrowDownArrowUp","toggleActionsExpanded","faChevronUp","faChevronDown","PhoneKeypadSolid","PhoneKeypadLight","park","setParked","faCircleParkingSolid","faCircleParking","TransferActions","Tooltip","id","place"],"mappings":"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"}
1
+ {"version":3,"file":"Actions.js","sources":["../../../src/components/CallView/Actions.tsx"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC } from 'react'\nimport {\n faPause as faPauseRegular,\n faMicrophone as faMicrophoneLight,\n faArrowDownArrowUp,\n faCircleParking,\n faChevronDown,\n faChevronUp,\n} from '@nethesis/nethesis-light-svg-icons'\nimport {\n muteCurrentCall,\n unmuteCurrentCall,\n pauseCurrentCall,\n unpauseCurrentCall,\n attendedTransfer,\n} from '../../lib/phone/call'\nimport PhoneKeypadLight from '../../static/icons/PhoneKeypadLight'\nimport PhoneKeypadSolid from '../../static/icons/PhoneKeypadSolid'\nimport { Button } from '../'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n faMicrophoneSlash,\n faPlay,\n faArrowDownUpAcrossLine,\n faCircleParking as faCircleParkingSolid,\n} from '@nethesis/nethesis-solid-svg-icons'\nimport { RootState, Dispatch } from '../../store'\nimport { useSelector, useDispatch } from 'react-redux'\nimport { sendDTMF } from '../../lib/webrtc/messages'\nimport { store } from '../../store'\nimport outgoingRingtone from '../../static/outgoing_ringtone'\nimport { TransferActions } from '../TransferView'\nimport { Tooltip } from 'react-tooltip/dist/react-tooltip.min.cjs'\nimport { park } from '../../lib/phone/call'\nimport { useEventListener } from '../../utils'\n\nconst Actions: FC = () => {\n // Get multiple values from currentCall store\n const { paused, muted } = useSelector((state: RootState) => state.currentCall)\n const parked = useSelector((state: RootState) => state.currentCall.parked)\n\n // Get isOpen and view from island store\n const { view, actionsExpanded } = useSelector((state: RootState) => state.island)\n const transferring = useSelector((state: RootState) => state.currentCall.transferring)\n\n const dispatch = useDispatch<Dispatch>()\n\n function openKeypad() {\n dispatch.island.setIslandView(view !== 'keypad' ? 'keypad' : 'call')\n }\n\n function transfer() {\n // Open the transfer view\n dispatch.island.setIslandView(view !== 'transfer' ? 'transfer' : 'call')\n // Pause the call\n pauseCurrentCall()\n }\n\n // Cancels the current transfer through dtmfs\n function calcelTransfer() {\n sendDTMF('*')\n const { audioPlayerPlaying } = store.getState().player\n // Check if the local audio is already playing and start playing\n if (!audioPlayerPlaying) {\n dispatch.player.updateStartAudioPlayer({\n src: outgoingRingtone,\n loop: true,\n })\n }\n setTimeout(() => {\n sendDTMF('1')\n dispatch.player.stopAudioPlayer()\n // The workarround to disable transfer because of the wrong conv.connection value from ws\n if (transferring) {\n setTimeout(() => {\n dispatch.currentCall.updateTransferring(false)\n }, 500)\n }\n }, 500)\n }\n\n function toggleActionsExpanded() {\n if (actionsExpanded) {\n dispatch.island.toggleActionsExpanded(false)\n } else {\n dispatch.island.toggleActionsExpanded(true)\n }\n }\n\n function parkAction() {\n park()\n dispatch.currentCall.setParked(true)\n }\n\n /**\n * Event listner for phone-island-transfer-call event\n */\n useEventListener('phone-island-transfer-call', (data) => {\n const transferNumber = data.to\n handleAttendedTransfer(transferNumber)\n })\n\n async function handleAttendedTransfer(number: string) {\n // Send attended transfer message\n const transferringMessageSent = await attendedTransfer(number)\n if (transferringMessageSent) {\n // Set transferring and disable pause\n dispatch.currentCall.updateCurrentCall({\n transferring: true,\n paused: false,\n })\n // Play the remote audio element\n dispatch.player.playRemoteAudio()\n }\n }\n\n return (\n <>\n <div className='pi-grid pi-grid-cols-4 pi-auto-cols-max pi-gap-y-5 pi-justify-items-center pi-place-items-center pi-justify-center'>\n <Button\n variant='default'\n active={paused ? true : false}\n onClick={() => (paused ? unpauseCurrentCall() : pauseCurrentCall())}\n data-tooltip-id='tooltip'\n data-tooltip-content={paused ? 'Play' : 'Pause'}\n >\n {paused ? (\n <FontAwesomeIcon size='xl' icon={faPlay} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faPauseRegular} />\n )}\n </Button>\n\n <Button\n variant='default'\n active={muted ? true : false}\n onClick={() => (muted ? unmuteCurrentCall() : muteCurrentCall())}\n data-tooltip-id='tooltip'\n data-tooltip-content={muted ? 'Unmute' : 'Mute'}\n >\n {muted ? (\n <FontAwesomeIcon size='xl' icon={faMicrophoneSlash} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faMicrophoneLight} />\n )}\n </Button>\n <Button\n active={transferring}\n onClick={transferring ? calcelTransfer : transfer}\n variant='default'\n data-tooltip-id='tooltip'\n data-tooltip-content={transferring ? 'Cancel transfer' : 'Transfer'}\n >\n {transferring ? (\n <FontAwesomeIcon className='' size='xl' icon={faArrowDownUpAcrossLine} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faArrowDownArrowUp} />\n )}\n </Button>\n <Button\n active={actionsExpanded}\n variant='transparent'\n onClick={() => toggleActionsExpanded()}\n data-tooltip-id='tooltip'\n data-tooltip-content={actionsExpanded ? 'Collapse' : 'Expand'}\n >\n {actionsExpanded ? (\n <FontAwesomeIcon className='' size='xl' icon={faChevronUp} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faChevronDown} />\n )}\n </Button>\n </div>\n {/* Actions expanded section */}\n {actionsExpanded ? (\n <>\n {' '}\n <div className='pi-grid pi-grid-cols-4 pi-auto-cols-max pi-gap-y-5 pi-justify-items-center pi-place-items-center pi-justify-center'>\n <Button\n active={view === 'keypad'}\n variant='default'\n onClick={openKeypad}\n data-tooltip-id='tooltip'\n data-tooltip-content='Keyboard'\n >\n {view === 'keypad' ? <PhoneKeypadSolid /> : <PhoneKeypadLight />}\n </Button>\n <Button\n active={parked}\n variant='default'\n onClick={parkAction}\n data-tooltip-id='tooltip'\n data-tooltip-content='Park'\n >\n <FontAwesomeIcon size='xl' icon={parked ? faCircleParkingSolid : faCircleParking} />\n </Button>\n {transferring && <TransferActions />}\n </div>\n </>\n ) : (\n <></>\n )}\n {/* Buttons tooltips */}\n <Tooltip className='pi-z-20' id='tooltip' place='bottom' />\n </>\n )\n}\n\nexport default Actions\n"],"names":["_a","useSelector","state","currentCall","paused","muted","parked","_b","island","view","actionsExpanded","transferring","dispatch","useDispatch","useEventListener","data","number","attendedTransfer","sent","updateCurrentCall","player","playRemoteAudio","handleAttendedTransfer","to","React","createElement","Fragment","className","Button","variant","active","onClick","unpauseCurrentCall","pauseCurrentCall","FontAwesomeIcon","size","icon","faPlay","faPauseRegular","unmuteCurrentCall","muteCurrentCall","faMicrophoneSlash","faMicrophoneLight","sendDTMF","store","getState","audioPlayerPlaying","updateStartAudioPlayer","src","outgoingRingtone","loop","setTimeout","stopAudioPlayer","updateTransferring","setIslandView","faArrowDownUpAcrossLine","faArrowDownArrowUp","toggleActionsExpanded","faChevronUp","faChevronDown","PhoneKeypadSolid","PhoneKeypadLight","park","setParked","faCircleParkingSolid","faCircleParking","TransferActions","Tooltip","id","place"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react"),n=require("../Button.js");require("../../node_modules/react-redux/es/index.js");var i=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),r=require("../../lib/island/island.js"),a=require("./ListAvatar.js"),l=require("../../node_modules/@nethesis/nethesis-light-svg-icons/index.mjs.js"),o=require("../../lib/phone/call.js"),s=require("../../node_modules/react-tooltip/dist/react-tooltip.min.cjs.js"),u=require("../../node_modules/react-redux/es/hooks/useSelector.js"),c=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=p(t);exports.TransferListView=function(){var p=u.useSelector((function(e){return e.island})).isOpen,f=u.useSelector((function(e){return e.users})).endpoints,m=u.useSelector((function(e){return e.currentUser})).username,v=t.useState(!1),x=v[0],h=v[1],E=t.useState([]),w=E[0],g=E[1],b=t.useRef(""),C=t.useState(),N=C[0],j=C[1],y=t.useRef(null),k=t.useState(!1),P=k[0],_=k[1],q=t.useState(10),L=q[0],S=q[1],T=c.useDispatch();function z(e){return m&&delete e[m],Object.values(e).filter((function(e){return e.endpoints.extension.find((function(e){return e.id.toLowerCase().startsWith(b.current.toLowerCase())}))||e.username.toLowerCase().startsWith(b.current.toLowerCase())||e.name.toLowerCase().startsWith(b.current.toLowerCase())}))}function A(t){return e.__awaiter(this,void 0,void 0,(function(){return e.__generator(this,(function(e){switch(e.label){case 0:return[4,o.attendedTransfer(t)];case 1:return e.sent()&&(T.currentCall.updateCurrentCall({transferring:!0,paused:!1}),T.player.playRemoteAudio()),[2]}}))}))}return t.useEffect((function(){f&&m&&(g(z(f)),h(!0))}),[f,m]),t.useEffect((function(){var e,t,n=function(){var e,t,n;_(!!(y.current&&y.current.scrollTop>3)),y.current&&(null===(e=y.current)||void 0===e?void 0:e.offsetHeight)+(null===(t=y.current)||void 0===t?void 0:t.scrollTop)>=(null===(n=y.current)||void 0===n?void 0:n.scrollHeight)-10&&S((function(e){return e+10}))};return p?null===(e=y.current)||void 0===e||e.addEventListener("scroll",n):null===(t=y.current)||void 0===t||t.removeEventListener("scroll",n),function(){var e;return null===(e=y.current)||void 0===e?void 0:e.removeEventListener("scroll",n)}}),[p]),d.default.createElement(d.default.Fragment,null,p?d.default.createElement("div",{className:"pi-relative pi-flex pi-flex-col"},d.default.createElement("div",{className:"pi-relative pi-z-50"},d.default.createElement("div",{className:"pi-flex pi-gap-4"},d.default.createElement(n.Button,{variant:"transparent",onClick:function(){o.unpauseCurrentCall(),r.backToCallView()},"data-tooltip-id":"transfer-list-tooltip","data-tooltip-content":"Back to call"},d.default.createElement(i.FontAwesomeIcon,{size:"xl",icon:l.faArrowLeft})),d.default.createElement("input",{"data-stop-propagation":!0,type:"text",onChange:function(e){b.current=e.currentTarget.value,f&&g(z(f)),/^[0-9*#+]+$/.test(b.current)?j(!0):j(!1)},value:b.current,autoFocus:!0,spellCheck:!1,className:"pi-w-full pi-rounded-full pi-bg-black pi-border-2 pi-border-emerald-500 active:pi-border-emerald-500 focus:pi-border-emerald-500 pi-text-white pi-font-sans pi-font-light pi-text-xl pi-text-center pi-px-2 focus:pi-outline-0 focus:pi-ring-0"}))),d.default.createElement("div",{className:"pi-z-30 pi-h-6 pi-pointer-events-none pi-bg-transparent pi-mt-7 pi-pr-4"},P&&d.default.createElement("div",{className:"pi-h-6 pi-w-full pi-bg-gradient-to-b pi-from-black pi-to-transparent pi-z-100"})),d.default.createElement("div",{style:{marginTop:"-22px"},className:"pi-flex pi-flex-col pi-gap-7"},d.default.createElement("div",{style:{height:"17rem"},ref:y,className:"pi-relative pi-w-full pi-flex pi-flex-col pi-gap-1 pi-overflow-y-auto pi-overflow-x-hidden"},N&&0===w.length&&d.default.createElement("div",{className:"pi-flex pi-items-center pi-w-full pi-justify-between pi-px-3 pi-py-1"},d.default.createElement("div",{className:"pi-flex pi-items-center pi-gap-4"},d.default.createElement(a.default,null),d.default.createElement("div",{style:{maxWidth:"146px"},className:"pi-h-fit pi-max-w-40 pi-font-sans pi-truncate pi-text-sm pi-font-bold"},b.current)),d.default.createElement("div",{className:"pi-flex pi-gap-3.5"},d.default.createElement(n.Button,{onClick:function(){return A(b.current)},variant:"default","data-tooltip-id":"transfer-list-tooltip","data-tooltip-content":"Call to transfer"},d.default.createElement(i.FontAwesomeIcon,{size:"xl",icon:l.faPhone})))),w&&w.slice(0,L).map((function(e,t){return d.default.createElement("div",{key:t,className:"pi-flex pi-items-center pi-w-full pi-justify-between pi-px-3 pi-py-1"},d.default.createElement("div",{className:"pi-flex pi-items-center pi-gap-4"},d.default.createElement(a.default,{onClick:function(){return"online"===e.mainPresence&&A(e.endpoints.mainextension[0].id)},username:e.username,status:e.mainPresence,"data-tooltip-id":"online"===e.mainPresence&&"transfer-list-tooltip","data-tooltip-content":"online"===e.mainPresence&&"Call to transfer"}),d.default.createElement("div",{onClick:function(){return"online"===e.mainPresence&&A(e.endpoints.mainextension[0].id)},style:{maxWidth:"196px"},"data-stop-propagation":!0,"data-tooltip-id":"online"===e.mainPresence&&"transfer-list-tooltip","data-tooltip-content":"online"===e.mainPresence&&"Call to transfer",className:"pi-h-fit pi-font-sans pi-truncate pi-text-sm pi-font-bold pi-text-white pi-transition"},e.name)),d.default.createElement("div",{className:"pi-flex pi-gap-3.5"},"online"===e.mainPresence&&d.default.createElement(n.Button,{onClick:function(){return"online"===e.mainPresence&&A(e.endpoints.mainextension[0].id)},variant:"default",disabled:"online"!==e.mainPresence,"data-tooltip-id":"transfer-list-tooltip","data-tooltip-content":"Call to transfer"},d.default.createElement(i.FontAwesomeIcon,{size:"xl",icon:l.faPhone}))))})),x&&0===w.length&&!N&&d.default.createElement("p",{className:"pi-font-sans pi-font-bold pi-w-full pi-flex pi-justify-center pi-text-sm"},"No users found.")))):d.default.createElement("div",{className:"pi-font-medium pi-text-base pi-font-sans"},"Transfer"),d.default.createElement(s.Tooltip,{className:"pi-z-1000",id:"transfer-list-tooltip",place:"bottom"}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react"),n=require("../Button.js");require("../../node_modules/react-redux/es/index.js");var i=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),r=require("../../lib/island/island.js"),a=require("./ListAvatar.js"),l=require("../../node_modules/@nethesis/nethesis-light-svg-icons/index.mjs.js"),o=require("../../lib/phone/call.js"),s=require("../../node_modules/react-tooltip/dist/react-tooltip.min.cjs.js"),u=require("../../node_modules/react-redux/es/hooks/useSelector.js"),c=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=p(t);exports.TransferListView=function(){var p=u.useSelector((function(e){return e.island})).isOpen,f=u.useSelector((function(e){return e.users})).endpoints,m=u.useSelector((function(e){return e.currentUser})).username,v=t.useState(!1),x=v[0],h=v[1],w=t.useState([]),E=w[0],g=w[1],b=t.useRef(""),C=t.useState(),N=C[0],j=C[1],y=t.useRef(null),L=t.useState(!1),k=L[0],P=L[1],_=t.useState(10),q=_[0],S=_[1],T=c.useDispatch();function z(e){return m&&delete e[m],Object.values(e).filter((function(e){return e.endpoints.extension.find((function(e){return e.id.toLowerCase().startsWith(b.current.toLowerCase())}))||e.username.toLowerCase().startsWith(b.current.toLowerCase())||e.name.toLowerCase().startsWith(b.current.toLowerCase())||e.name.toLowerCase().includes(b.current.toLowerCase())||e.username.toLowerCase()===b.current.toLowerCase()}))}function A(t){return e.__awaiter(this,void 0,void 0,(function(){return e.__generator(this,(function(e){switch(e.label){case 0:return[4,o.attendedTransfer(t)];case 1:return e.sent()&&(T.currentCall.updateCurrentCall({transferring:!0,paused:!1}),T.player.playRemoteAudio()),[2]}}))}))}return t.useEffect((function(){f&&m&&(g(z(f)),h(!0))}),[f,m]),t.useEffect((function(){var e,t,n=function(){var e,t,n;P(!!(y.current&&y.current.scrollTop>3)),y.current&&(null===(e=y.current)||void 0===e?void 0:e.offsetHeight)+(null===(t=y.current)||void 0===t?void 0:t.scrollTop)>=(null===(n=y.current)||void 0===n?void 0:n.scrollHeight)-10&&S((function(e){return e+10}))};return p?null===(e=y.current)||void 0===e||e.addEventListener("scroll",n):null===(t=y.current)||void 0===t||t.removeEventListener("scroll",n),function(){var e;return null===(e=y.current)||void 0===e?void 0:e.removeEventListener("scroll",n)}}),[p]),d.default.createElement(d.default.Fragment,null,p?d.default.createElement("div",{className:"pi-relative pi-flex pi-flex-col"},d.default.createElement("div",{className:"pi-relative pi-z-50"},d.default.createElement("div",{className:"pi-flex pi-gap-4"},d.default.createElement(n.Button,{variant:"transparent",onClick:function(){o.unpauseCurrentCall(),r.backToCallView()},"data-tooltip-id":"transfer-list-tooltip","data-tooltip-content":"Back to call"},d.default.createElement(i.FontAwesomeIcon,{size:"xl",icon:l.faArrowLeft})),d.default.createElement("input",{"data-stop-propagation":!0,type:"text",onChange:function(e){b.current=e.currentTarget.value,f&&g(z(f)),/^[0-9*#+]+$/.test(b.current)?j(!0):j(!1)},value:b.current,autoFocus:!0,spellCheck:!1,className:"pi-w-full pi-rounded-full pi-bg-black pi-border-2 pi-border-emerald-500 active:pi-border-emerald-500 focus:pi-border-emerald-500 pi-text-white pi-font-sans pi-font-light pi-text-xl pi-text-center pi-px-2 focus:pi-outline-0 focus:pi-ring-0"}))),d.default.createElement("div",{className:"pi-z-30 pi-h-6 pi-pointer-events-none pi-bg-transparent pi-mt-7 pi-pr-4"},k&&d.default.createElement("div",{className:"pi-h-6 pi-w-full pi-bg-gradient-to-b pi-from-black pi-to-transparent pi-z-100"})),d.default.createElement("div",{style:{marginTop:"-22px"},className:"pi-flex pi-flex-col pi-gap-7"},d.default.createElement("div",{style:{height:"17rem"},ref:y,className:"pi-relative pi-w-full pi-flex pi-flex-col pi-gap-1 pi-overflow-y-auto pi-overflow-x-hidden"},N&&0===E.length&&d.default.createElement("div",{className:"pi-flex pi-items-center pi-w-full pi-justify-between pi-px-3 pi-py-1"},d.default.createElement("div",{className:"pi-flex pi-items-center pi-gap-4"},d.default.createElement(a.default,null),d.default.createElement("div",{style:{maxWidth:"146px"},className:"pi-h-fit pi-max-w-40 pi-font-sans pi-truncate pi-text-sm pi-font-bold"},b.current)),d.default.createElement("div",{className:"pi-flex pi-gap-3.5"},d.default.createElement(n.Button,{onClick:function(){return A(b.current)},variant:"default","data-tooltip-id":"transfer-list-tooltip","data-tooltip-content":"Call to transfer"},d.default.createElement(i.FontAwesomeIcon,{size:"xl",icon:l.faPhone})))),E&&E.slice(0,q).map((function(e,t){return d.default.createElement("div",{key:t,className:"pi-flex pi-items-center pi-w-full pi-justify-between pi-px-3 pi-py-1"},d.default.createElement("div",{className:"pi-flex pi-items-center pi-gap-4"},d.default.createElement(a.default,{onClick:function(){return"online"===e.mainPresence&&A(e.endpoints.mainextension[0].id)},username:e.username,status:e.mainPresence,"data-tooltip-id":"online"===e.mainPresence&&"transfer-list-tooltip","data-tooltip-content":"online"===e.mainPresence&&"Call to transfer"}),d.default.createElement("div",{onClick:function(){return"online"===e.mainPresence&&A(e.endpoints.mainextension[0].id)},style:{maxWidth:"196px"},"data-stop-propagation":!0,"data-tooltip-id":"online"===e.mainPresence&&"transfer-list-tooltip","data-tooltip-content":"online"===e.mainPresence&&"Call to transfer",className:"pi-h-fit pi-font-sans pi-truncate pi-text-sm pi-font-bold pi-text-white pi-transition"},e.name)),d.default.createElement("div",{className:"pi-flex pi-gap-3.5"},"online"===e.mainPresence&&d.default.createElement(n.Button,{onClick:function(){return"online"===e.mainPresence&&A(e.endpoints.mainextension[0].id)},variant:"default",disabled:"online"!==e.mainPresence,"data-tooltip-id":"transfer-list-tooltip","data-tooltip-content":"Call to transfer"},d.default.createElement(i.FontAwesomeIcon,{size:"xl",icon:l.faPhone}))))})),x&&0===E.length&&!N&&d.default.createElement("p",{className:"pi-font-sans pi-font-bold pi-w-full pi-flex pi-justify-center pi-text-sm"},"No users found.")))):d.default.createElement("div",{className:"pi-font-medium pi-text-base pi-font-sans"},"Transfer"),d.default.createElement(s.Tooltip,{className:"pi-z-1000",id:"transfer-list-tooltip",place:"bottom"}))};
2
2
  //# sourceMappingURL=TransferList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TransferList.js","sources":["../../../src/components/TransferView/TransferList.tsx"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useEffect, useState, FormEvent, useRef } from 'react'\nimport { Button } from '../Button'\nimport { RootState } from '../../store'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { backToCallView } from '../../lib/island/island'\nimport ListAvatar from './ListAvatar'\nimport { faPhone as faPhoneLight, faArrowLeft } from '@nethesis/nethesis-light-svg-icons'\nimport { UserEndpointsTypes, UsersEndpointsTypes } from '../../types'\nimport { attendedTransfer } from '../../lib/phone/call'\nimport { Dispatch } from '../../store'\nimport { Tooltip } from 'react-tooltip/dist/react-tooltip.min.cjs'\nimport { unpauseCurrentCall } from '../../lib/phone/call'\n\nconst USERS_NUMBER_PER_PAGE = 10\nconst SHOW_LIST_GRADIENT_DISTANCE = 3\n\nexport const TransferListView: FC<TransferListViewProps> = () => {\n const { isOpen } = useSelector((state: RootState) => state.island)\n const { endpoints } = useSelector((state: RootState) => state.users)\n const { username } = useSelector((state: RootState) => state.currentUser)\n const [loaded, setLoaded] = useState<boolean>(false)\n const [listUsers, setListUsers] = useState<UserEndpointsTypes[]>([])\n const searchValue = useRef<string>('')\n const [showCustomUser, setShowCustomUser] = useState<boolean>()\n const relativeRef = useRef<HTMLDivElement>(null)\n const [showGradient, setShowGradient] = useState<boolean>(false)\n const [showingUsers, setShowingUsers] = useState<number>(USERS_NUMBER_PER_PAGE)\n const dispatch = useDispatch<Dispatch>()\n\n function handleChange(event: FormEvent<HTMLInputElement>) {\n // Update search value\n searchValue.current = event.currentTarget.value\n // Filter the users list\n endpoints && setListUsers(filterUsers(endpoints))\n // Check if custom user to call must be visible\n if (/^[0-9*#+]+$/.test(searchValue.current)) {\n setShowCustomUser(true)\n } else {\n setShowCustomUser(false)\n }\n }\n\n function filterUsers(endpoints: UsersEndpointsTypes) {\n // Remove the currentUser from the list\n username && delete endpoints[username]\n // Filter the users\n return Object.values(endpoints).filter(\n (userEndpoints: UserEndpointsTypes) =>\n userEndpoints.endpoints.extension.find((extension) =>\n extension.id.toLowerCase().startsWith(searchValue.current.toLowerCase()),\n ) ||\n userEndpoints.username.toLowerCase().startsWith(searchValue.current.toLowerCase()) ||\n userEndpoints.name.toLowerCase().startsWith(searchValue.current.toLowerCase()),\n )\n }\n\n async function handleAttendedTransfer(number: string) {\n // Send attended transfer message\n const transferringMessageSent = await attendedTransfer(number)\n if (transferringMessageSent) {\n // Set transferring and disable pause\n dispatch.currentCall.updateCurrentCall({\n transferring: true,\n paused: false,\n })\n // Play the remote audio element\n dispatch.player.playRemoteAudio()\n }\n }\n\n // Initialize users list\n useEffect(() => {\n if (endpoints && username) {\n setListUsers(filterUsers(endpoints))\n setLoaded(true)\n }\n }, [endpoints, username])\n\n useEffect(() => {\n // Handle users list scrolling\n const handleScroll = () => {\n setShowGradient(\n relativeRef.current && relativeRef.current.scrollTop > SHOW_LIST_GRADIENT_DISTANCE\n ? true\n : false,\n )\n // Manage scroll to bottom\n if (\n relativeRef.current &&\n relativeRef.current?.offsetHeight + relativeRef.current?.scrollTop >=\n relativeRef.current?.scrollHeight - 10\n ) {\n // Improve showing users\n setShowingUsers((state) => state + USERS_NUMBER_PER_PAGE)\n }\n }\n // Manage expansion and collapsing\n if (isOpen) {\n relativeRef.current?.addEventListener('scroll', handleScroll)\n } else {\n relativeRef.current?.removeEventListener('scroll', handleScroll)\n }\n return () => relativeRef.current?.removeEventListener('scroll', handleScroll)\n }, [isOpen])\n\n function handleBackClick() {\n // Unpause the current call\n unpauseCurrentCall()\n // Open the call view\n backToCallView()\n }\n\n return (\n <>\n {isOpen ? (\n <div className='pi-relative pi-flex pi-flex-col'>\n {/* Top section */}\n <div className='pi-relative pi-z-50'>\n <div className='pi-flex pi-gap-4'>\n <Button\n variant='transparent'\n onClick={handleBackClick}\n data-tooltip-id='transfer-list-tooltip'\n data-tooltip-content='Back to call'\n >\n <FontAwesomeIcon size='xl' icon={faArrowLeft} />\n </Button>\n <input\n data-stop-propagation={true}\n type='text'\n onChange={handleChange}\n value={searchValue.current}\n autoFocus\n spellCheck={false}\n className='pi-w-full pi-rounded-full pi-bg-black pi-border-2 pi-border-emerald-500 active:pi-border-emerald-500 focus:pi-border-emerald-500 pi-text-white pi-font-sans pi-font-light pi-text-xl pi-text-center pi-px-2 focus:pi-outline-0 focus:pi-ring-0'\n />\n </div>\n </div>\n {/* List shadow */}\n <div className='pi-z-30 pi-h-6 pi-pointer-events-none pi-bg-transparent pi-mt-7 pi-pr-4'>\n {showGradient && (\n <div className='pi-h-6 pi-w-full pi-bg-gradient-to-b pi-from-black pi-to-transparent pi-z-100'></div>\n )}\n </div>\n <div style={{ marginTop: '-22px' }} className='pi-flex pi-flex-col pi-gap-7'>\n {/* List section */}\n <div\n style={{ height: '17rem' }}\n ref={relativeRef}\n className='pi-relative pi-w-full pi-flex pi-flex-col pi-gap-1 pi-overflow-y-auto pi-overflow-x-hidden'\n >\n {/* The custom searched number */}\n {showCustomUser && listUsers.length === 0 && (\n <div className='pi-flex pi-items-center pi-w-full pi-justify-between pi-px-3 pi-py-1'>\n <div className='pi-flex pi-items-center pi-gap-4'>\n <ListAvatar />\n <div\n style={{ maxWidth: '146px' }}\n className='pi-h-fit pi-max-w-40 pi-font-sans pi-truncate pi-text-sm pi-font-bold'\n >\n {searchValue.current}\n </div>\n </div>\n <div className='pi-flex pi-gap-3.5'>\n <Button\n onClick={() => handleAttendedTransfer(searchValue.current)}\n variant='default'\n data-tooltip-id='transfer-list-tooltip'\n data-tooltip-content='Call to transfer'\n >\n <FontAwesomeIcon size='xl' icon={faPhoneLight} />\n </Button>\n </div>\n </div>\n )}\n {/* The users list */}\n {listUsers &&\n listUsers.slice(0, showingUsers).map((userEndpoints, i) => (\n <div\n key={i}\n className='pi-flex pi-items-center pi-w-full pi-justify-between pi-px-3 pi-py-1'\n >\n <div className='pi-flex pi-items-center pi-gap-4'>\n <ListAvatar\n onClick={() =>\n userEndpoints.mainPresence === 'online' &&\n handleAttendedTransfer(userEndpoints.endpoints.mainextension[0].id)\n }\n username={userEndpoints.username}\n status={userEndpoints.mainPresence}\n data-tooltip-id={\n userEndpoints.mainPresence === 'online' && 'transfer-list-tooltip'\n }\n data-tooltip-content={\n userEndpoints.mainPresence === 'online' && 'Call to transfer'\n }\n />\n <div\n onClick={() =>\n userEndpoints.mainPresence === 'online' &&\n handleAttendedTransfer(userEndpoints.endpoints.mainextension[0].id)\n }\n style={{ maxWidth: '196px' }}\n data-stop-propagation={true}\n data-tooltip-id={\n userEndpoints.mainPresence === 'online' && 'transfer-list-tooltip'\n }\n data-tooltip-content={\n userEndpoints.mainPresence === 'online' && 'Call to transfer'\n }\n className={`pi-h-fit pi-font-sans pi-truncate pi-text-sm pi-font-bold pi-text-white pi-transition`}\n >\n {/* The user name */}\n {userEndpoints.name}\n </div>\n </div>\n <div className='pi-flex pi-gap-3.5'>\n {userEndpoints.mainPresence === 'online' && (\n <Button\n onClick={() =>\n userEndpoints.mainPresence === 'online' &&\n handleAttendedTransfer(userEndpoints.endpoints.mainextension[0].id)\n }\n variant='default'\n disabled={userEndpoints.mainPresence !== 'online'}\n data-tooltip-id='transfer-list-tooltip'\n data-tooltip-content='Call to transfer'\n >\n <FontAwesomeIcon size='xl' icon={faPhoneLight} />\n </Button>\n )}\n </div>\n </div>\n ))}\n {loaded && listUsers.length === 0 && !showCustomUser && (\n <p className='pi-font-sans pi-font-bold pi-w-full pi-flex pi-justify-center pi-text-sm'>\n No users found.\n </p>\n )}\n </div>\n </div>\n </div>\n ) : (\n <div className='pi-font-medium pi-text-base pi-font-sans'>Transfer</div>\n )}\n <Tooltip className='pi-z-1000' id='transfer-list-tooltip' place='bottom' />\n </>\n )\n}\n\ninterface TransferListViewProps {}\n"],"names":["isOpen","useSelector","state","island","endpoints","users","username","currentUser","_a","useState","loaded","setLoaded","_b","listUsers","setListUsers","searchValue","useRef","_c","showCustomUser","setShowCustomUser","relativeRef","_d","showGradient","setShowGradient","_e","showingUsers","setShowingUsers","dispatch","useDispatch","filterUsers","Object","values","filter","userEndpoints","extension","find","id","toLowerCase","startsWith","current","name","handleAttendedTransfer","number","attendedTransfer","sent","currentCall","updateCurrentCall","transferring","paused","player","playRemoteAudio","useEffect","handleScroll","scrollTop","offsetHeight","scrollHeight","addEventListener","removeEventListener","React","createElement","Fragment","className","Button","variant","onClick","unpauseCurrentCall","backToCallView","FontAwesomeIcon","size","icon","faArrowLeft","type","onChange","event","currentTarget","value","test","autoFocus","spellCheck","style","marginTop","height","ref","length","ListAvatar","maxWidth","faPhoneLight","faPhone","slice","map","i","key","mainPresence","mainextension","status","disabled","Tooltip","place"],"mappings":"uyBAoB2D,WACjD,IAAAA,EAAWC,eAAY,SAACC,GAAqB,OAAAA,EAAMC,iBACnDC,EAAcH,eAAY,SAACC,GAAqB,OAAAA,EAAMG,mBACtDC,EAAaL,eAAY,SAACC,GAAqB,OAAAA,EAAMK,wBACvDC,EAAsBC,EAAAA,UAAkB,GAAvCC,EAAMF,EAAA,GAAEG,EAASH,EAAA,GAClBI,EAA4BH,EAAAA,SAA+B,IAA1DI,EAASD,EAAA,GAAEE,EAAYF,EAAA,GACxBG,EAAcC,SAAe,IAC7BC,EAAsCR,aAArCS,EAAcD,EAAA,GAAEE,EAAiBF,EAAA,GAClCG,EAAcJ,SAAuB,MACrCK,EAAkCZ,EAAAA,UAAkB,GAAnDa,EAAYD,EAAA,GAAEE,EAAeF,EAAA,GAC9BG,EAAkCf,EAAAA,SAbZ,IAarBgB,EAAYD,EAAA,GAAEE,EAAeF,EAAA,GAC9BG,EAAWC,EAAAA,cAejB,SAASC,EAAYzB,GAInB,OAFAE,UAAmBF,EAAUE,GAEtBwB,OAAOC,OAAO3B,GAAW4B,QAC9B,SAACC,GACC,OAAAA,EAAc7B,UAAU8B,UAAUC,MAAK,SAACD,GACtC,OAAAA,EAAUE,GAAGC,cAAcC,WAAWvB,EAAYwB,QAAQF,cAA1D,KAEFJ,EAAc3B,SAAS+B,cAAcC,WAAWvB,EAAYwB,QAAQF,gBACpEJ,EAAcO,KAAKH,cAAcC,WAAWvB,EAAYwB,QAAQF,cAJhE,GAML,CAED,SAAeI,EAAuBC,4GAEJ,KAAA,EAAA,MAAA,CAAA,EAAMC,EAAAA,iBAAiBD,kBAAvBlC,EAA8BoC,SAG5DjB,EAASkB,YAAYC,kBAAkB,CACrCC,cAAc,EACdC,QAAQ,IAGVrB,EAASsB,OAAOC,6BAEnB,CA4CD,OAzCAC,EAAAA,WAAU,WACJ/C,GAAaE,IACfQ,EAAae,EAAYzB,IACzBO,GAAU,GAEd,GAAG,CAACP,EAAWE,IAEf6C,EAAAA,WAAU,mBAEFC,EAAe,qBACnB7B,KACEH,EAAYmB,SAAWnB,EAAYmB,QAAQc,UApEf,IA0E5BjC,EAAYmB,UACS,QAArB/B,EAAAY,EAAYmB,eAAS,IAAA/B,OAAA,EAAAA,EAAA8C,eAAkC,QAAnB1C,EAAAQ,EAAYmB,eAAO,IAAA3B,OAAA,EAAAA,EAAEyC,qBACvDpC,EAAAG,EAAYmB,8BAASgB,cAAe,IAGtC7B,GAAgB,SAACxB,GAAU,OAAAA,EAhFL,EAgFkC,GAE5D,EAOA,OALIF,EACmB,QAArBQ,EAAAY,EAAYmB,eAAS,IAAA/B,GAAAA,EAAAgD,iBAAiB,SAAUJ,GAE3B,QAArBxC,EAAAQ,EAAYmB,eAAS,IAAA3B,GAAAA,EAAA6C,oBAAoB,SAAUL,GAE9C,WAAM,IAAA5C,EAAA,OAAmB,QAAnBA,EAAAY,EAAYmB,eAAO,IAAA/B,OAAA,EAAAA,EAAEiD,oBAAoB,SAAUL,GAClE,GAAG,CAACpD,IAUF0D,UAAAC,cAAAD,EAAA,QAAAE,SAAA,KACG5D,EACC0D,EAAK,QAAAC,cAAA,MAAA,CAAAE,UAAU,mCAEbH,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,uBACbH,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,oBACbH,EAAAA,QAAAC,cAACG,SAAM,CACLC,QAAQ,cACRC,QAhBd,WAEEC,EAAAA,qBAEAC,EAAAA,gBACD,EAWqC,kBACR,wBAAuB,uBAClB,gBAErBR,UAACC,cAAAQ,EAAAA,gBAAgB,CAAAC,KAAK,KAAKC,KAAMC,EAAWA,eAE9CZ,UACyBC,cAAA,QAAA,CAAA,yBAAA,EACvBY,KAAK,OACLC,SArGd,SAAsBC,GAEpB1D,EAAYwB,QAAUkC,EAAMC,cAAcC,MAE1CvE,GAAaU,EAAae,EAAYzB,IAElC,cAAcwE,KAAK7D,EAAYwB,SACjCpB,GAAkB,GAElBA,GAAkB,EAErB,EA2FawD,MAAO5D,EAAYwB,QACnBsC,WACA,EAAAC,YAAY,EACZjB,UAAU,qPAKhBH,EAAAA,QAAAC,cAAA,MAAA,CAAKE,UAAU,2EACZvC,GACCoC,EAAAA,QAAAC,cAAA,MAAA,CAAKE,UAAU,mFAGnBH,UAAKC,cAAA,MAAA,CAAAoB,MAAO,CAAEC,UAAW,SAAWnB,UAAU,gCAE5CH,EAAAA,QAAAC,cAAA,MAAA,CACEoB,MAAO,CAAEE,OAAQ,SACjBC,IAAK9D,EACLyC,UAAU,8FAGT3C,GAAuC,IAArBL,EAAUsE,QAC3BzB,EAAAA,QAAAC,cAAA,MAAA,CAAKE,UAAU,wEACbH,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,oCACbH,UAAAC,cAACyB,EAAU,QAAG,MACd1B,EAAAA,QAAAC,cAAA,MAAA,CACEoB,MAAO,CAAEM,SAAU,SACnBxB,UAAU,yEAET9C,EAAYwB,UAGjBmB,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,sBACbH,EAAC,QAAAC,cAAAG,UACCE,QAAS,WAAM,OAAAvB,EAAuB1B,EAAYwB,QAAQ,EAC1DwB,QAAQ,UAAS,kBACD,wBAAuB,uBAClB,oBAErBL,UAAAC,cAACQ,EAAeA,gBAAA,CAACC,KAAK,KAAKC,KAAMiB,EAAYC,aAMpD1E,GACCA,EAAU2E,MAAM,EAAG/D,GAAcgE,KAAI,SAACxD,EAAeyD,GAAM,OACzDhC,EACE,QAAAC,cAAA,MAAA,CAAAgC,IAAKD,EACL7B,UAAU,wEAEVH,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,oCACbH,EAAAA,QAACC,cAAAyB,UACC,CAAApB,QAAS,WACP,MAA+B,WAA/B/B,EAAc2D,cACdnD,EAAuBR,EAAc7B,UAAUyF,cAAc,GAAGzD,GADhE,EAGF9B,SAAU2B,EAAc3B,SACxBwF,OAAQ7D,EAAc2D,aAEpB,kBAA+B,WAA/B3D,EAAc2D,cAA6B,wBAG3C,uBAA+B,WAA/B3D,EAAc2D,cAA6B,qBAG/ClC,EAAAA,QAAAC,cAAA,MAAA,CACEK,QAAS,WACP,MAA+B,WAA/B/B,EAAc2D,cACdnD,EAAuBR,EAAc7B,UAAUyF,cAAc,GAAGzD,GADhE,EAGF2C,MAAO,CAAEM,SAAU,SAAS,yBACL,EAErB,kBAA+B,WAA/BpD,EAAc2D,cAA6B,wBAAuB,uBAGnC,WAA/B3D,EAAc2D,cAA6B,mBAE7C/B,UAAW,yFAGV5B,EAAcO,OAGnBkB,EAAAA,QAAAC,cAAA,MAAA,CAAKE,UAAU,sBACmB,WAA/B5B,EAAc2D,cACblC,EAAAA,QAAAC,cAACG,EAAAA,OAAM,CACLE,QAAS,WACP,MAA+B,WAA/B/B,EAAc2D,cACdnD,EAAuBR,EAAc7B,UAAUyF,cAAc,GAAGzD,GAAG,EAErE2B,QAAQ,UACRgC,SAAyC,WAA/B9D,EAAc2D,aACR,kBAAA,+CACK,oBAErBlC,EAAAA,QAAAC,cAACQ,kBAAgB,CAAAC,KAAK,KAAKC,KAAMiB,EAAAA,YAK1C,IACF5E,GAA+B,IAArBG,EAAUsE,SAAiBjE,GACpCwC,EAAA,QAAAC,cAAA,IAAA,CAAGE,UAAU,4EAET,sBAMZH,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,wDAEjBH,EAAAA,QAAAC,cAACqC,UAAQ,CAAAnC,UAAU,YAAYzB,GAAG,wBAAwB6D,MAAM,WAGtE"}
1
+ {"version":3,"file":"TransferList.js","sources":["../../../src/components/TransferView/TransferList.tsx"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useEffect, useState, FormEvent, useRef } from 'react'\nimport { Button } from '../Button'\nimport { RootState } from '../../store'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { backToCallView } from '../../lib/island/island'\nimport ListAvatar from './ListAvatar'\nimport { faPhone as faPhoneLight, faArrowLeft } from '@nethesis/nethesis-light-svg-icons'\nimport { UserEndpointsTypes, UsersEndpointsTypes } from '../../types'\nimport { attendedTransfer } from '../../lib/phone/call'\nimport { Dispatch } from '../../store'\nimport { Tooltip } from 'react-tooltip/dist/react-tooltip.min.cjs'\nimport { unpauseCurrentCall } from '../../lib/phone/call'\n\nconst USERS_NUMBER_PER_PAGE = 10\nconst SHOW_LIST_GRADIENT_DISTANCE = 3\n\nexport const TransferListView: FC<TransferListViewProps> = () => {\n const { isOpen } = useSelector((state: RootState) => state.island)\n const { endpoints } = useSelector((state: RootState) => state.users)\n const { username } = useSelector((state: RootState) => state.currentUser)\n const [loaded, setLoaded] = useState<boolean>(false)\n const [listUsers, setListUsers] = useState<UserEndpointsTypes[]>([])\n const searchValue = useRef<string>('')\n const [showCustomUser, setShowCustomUser] = useState<boolean>()\n const relativeRef = useRef<HTMLDivElement>(null)\n const [showGradient, setShowGradient] = useState<boolean>(false)\n const [showingUsers, setShowingUsers] = useState<number>(USERS_NUMBER_PER_PAGE)\n const dispatch = useDispatch<Dispatch>()\n\n function handleChange(event: FormEvent<HTMLInputElement>) {\n // Update search value\n searchValue.current = event.currentTarget.value\n // Filter the users list\n endpoints && setListUsers(filterUsers(endpoints))\n // Check if custom user to call must be visible\n if (/^[0-9*#+]+$/.test(searchValue.current)) {\n setShowCustomUser(true)\n } else {\n setShowCustomUser(false)\n }\n }\n\n function filterUsers(endpoints: UsersEndpointsTypes) {\n // Remove the currentUser from the list\n username && delete endpoints[username]\n // Filter the users\n return Object.values(endpoints).filter(\n (userEndpoints: UserEndpointsTypes) =>\n userEndpoints.endpoints.extension.find((extension) =>\n extension.id.toLowerCase().startsWith(searchValue.current.toLowerCase()),\n ) ||\n userEndpoints.username.toLowerCase().startsWith(searchValue.current.toLowerCase()) ||\n userEndpoints.name.toLowerCase().startsWith(searchValue.current.toLowerCase()) ||\n userEndpoints.name.toLowerCase().includes(searchValue.current.toLowerCase()) ||\n userEndpoints.username.toLowerCase() === searchValue.current.toLowerCase(),\n )\n }\n\n async function handleAttendedTransfer(number: string) {\n // Send attended transfer message\n const transferringMessageSent = await attendedTransfer(number)\n if (transferringMessageSent) {\n // Set transferring and disable pause\n dispatch.currentCall.updateCurrentCall({\n transferring: true,\n paused: false,\n })\n // Play the remote audio element\n dispatch.player.playRemoteAudio()\n }\n }\n\n // Initialize users list\n useEffect(() => {\n if (endpoints && username) {\n setListUsers(filterUsers(endpoints))\n setLoaded(true)\n }\n }, [endpoints, username])\n\n useEffect(() => {\n // Handle users list scrolling\n const handleScroll = () => {\n setShowGradient(\n relativeRef.current && relativeRef.current.scrollTop > SHOW_LIST_GRADIENT_DISTANCE\n ? true\n : false,\n )\n // Manage scroll to bottom\n if (\n relativeRef.current &&\n relativeRef.current?.offsetHeight + relativeRef.current?.scrollTop >=\n relativeRef.current?.scrollHeight - 10\n ) {\n // Improve showing users\n setShowingUsers((state) => state + USERS_NUMBER_PER_PAGE)\n }\n }\n // Manage expansion and collapsing\n if (isOpen) {\n relativeRef.current?.addEventListener('scroll', handleScroll)\n } else {\n relativeRef.current?.removeEventListener('scroll', handleScroll)\n }\n return () => relativeRef.current?.removeEventListener('scroll', handleScroll)\n }, [isOpen])\n\n function handleBackClick() {\n // Unpause the current call\n unpauseCurrentCall()\n // Open the call view\n backToCallView()\n }\n\n return (\n <>\n {isOpen ? (\n <div className='pi-relative pi-flex pi-flex-col'>\n {/* Top section */}\n <div className='pi-relative pi-z-50'>\n <div className='pi-flex pi-gap-4'>\n <Button\n variant='transparent'\n onClick={handleBackClick}\n data-tooltip-id='transfer-list-tooltip'\n data-tooltip-content='Back to call'\n >\n <FontAwesomeIcon size='xl' icon={faArrowLeft} />\n </Button>\n <input\n data-stop-propagation={true}\n type='text'\n onChange={handleChange}\n value={searchValue.current}\n autoFocus\n spellCheck={false}\n className='pi-w-full pi-rounded-full pi-bg-black pi-border-2 pi-border-emerald-500 active:pi-border-emerald-500 focus:pi-border-emerald-500 pi-text-white pi-font-sans pi-font-light pi-text-xl pi-text-center pi-px-2 focus:pi-outline-0 focus:pi-ring-0'\n />\n </div>\n </div>\n {/* List shadow */}\n <div className='pi-z-30 pi-h-6 pi-pointer-events-none pi-bg-transparent pi-mt-7 pi-pr-4'>\n {showGradient && (\n <div className='pi-h-6 pi-w-full pi-bg-gradient-to-b pi-from-black pi-to-transparent pi-z-100'></div>\n )}\n </div>\n <div style={{ marginTop: '-22px' }} className='pi-flex pi-flex-col pi-gap-7'>\n {/* List section */}\n <div\n style={{ height: '17rem' }}\n ref={relativeRef}\n className='pi-relative pi-w-full pi-flex pi-flex-col pi-gap-1 pi-overflow-y-auto pi-overflow-x-hidden'\n >\n {/* The custom searched number */}\n {showCustomUser && listUsers.length === 0 && (\n <div className='pi-flex pi-items-center pi-w-full pi-justify-between pi-px-3 pi-py-1'>\n <div className='pi-flex pi-items-center pi-gap-4'>\n <ListAvatar />\n <div\n style={{ maxWidth: '146px' }}\n className='pi-h-fit pi-max-w-40 pi-font-sans pi-truncate pi-text-sm pi-font-bold'\n >\n {searchValue.current}\n </div>\n </div>\n <div className='pi-flex pi-gap-3.5'>\n <Button\n onClick={() => handleAttendedTransfer(searchValue.current)}\n variant='default'\n data-tooltip-id='transfer-list-tooltip'\n data-tooltip-content='Call to transfer'\n >\n <FontAwesomeIcon size='xl' icon={faPhoneLight} />\n </Button>\n </div>\n </div>\n )}\n {/* The users list */}\n {listUsers &&\n listUsers.slice(0, showingUsers).map((userEndpoints, i) => (\n <div\n key={i}\n className='pi-flex pi-items-center pi-w-full pi-justify-between pi-px-3 pi-py-1'\n >\n <div className='pi-flex pi-items-center pi-gap-4'>\n <ListAvatar\n onClick={() =>\n userEndpoints.mainPresence === 'online' &&\n handleAttendedTransfer(userEndpoints.endpoints.mainextension[0].id)\n }\n username={userEndpoints.username}\n status={userEndpoints.mainPresence}\n data-tooltip-id={\n userEndpoints.mainPresence === 'online' && 'transfer-list-tooltip'\n }\n data-tooltip-content={\n userEndpoints.mainPresence === 'online' && 'Call to transfer'\n }\n />\n <div\n onClick={() =>\n userEndpoints.mainPresence === 'online' &&\n handleAttendedTransfer(userEndpoints.endpoints.mainextension[0].id)\n }\n style={{ maxWidth: '196px' }}\n data-stop-propagation={true}\n data-tooltip-id={\n userEndpoints.mainPresence === 'online' && 'transfer-list-tooltip'\n }\n data-tooltip-content={\n userEndpoints.mainPresence === 'online' && 'Call to transfer'\n }\n className={`pi-h-fit pi-font-sans pi-truncate pi-text-sm pi-font-bold pi-text-white pi-transition`}\n >\n {/* The user name */}\n {userEndpoints.name}\n </div>\n </div>\n <div className='pi-flex pi-gap-3.5'>\n {userEndpoints.mainPresence === 'online' && (\n <Button\n onClick={() =>\n userEndpoints.mainPresence === 'online' &&\n handleAttendedTransfer(userEndpoints.endpoints.mainextension[0].id)\n }\n variant='default'\n disabled={userEndpoints.mainPresence !== 'online'}\n data-tooltip-id='transfer-list-tooltip'\n data-tooltip-content='Call to transfer'\n >\n <FontAwesomeIcon size='xl' icon={faPhoneLight} />\n </Button>\n )}\n </div>\n </div>\n ))}\n {loaded && listUsers.length === 0 && !showCustomUser && (\n <p className='pi-font-sans pi-font-bold pi-w-full pi-flex pi-justify-center pi-text-sm'>\n No users found.\n </p>\n )}\n </div>\n </div>\n </div>\n ) : (\n <div className='pi-font-medium pi-text-base pi-font-sans'>Transfer</div>\n )}\n <Tooltip className='pi-z-1000' id='transfer-list-tooltip' place='bottom' />\n </>\n )\n}\n\ninterface TransferListViewProps {}\n"],"names":["isOpen","useSelector","state","island","endpoints","users","username","currentUser","_a","useState","loaded","setLoaded","_b","listUsers","setListUsers","searchValue","useRef","_c","showCustomUser","setShowCustomUser","relativeRef","_d","showGradient","setShowGradient","_e","showingUsers","setShowingUsers","dispatch","useDispatch","filterUsers","Object","values","filter","userEndpoints","extension","find","id","toLowerCase","startsWith","current","name","includes","handleAttendedTransfer","number","attendedTransfer","sent","currentCall","updateCurrentCall","transferring","paused","player","playRemoteAudio","useEffect","handleScroll","scrollTop","offsetHeight","scrollHeight","addEventListener","removeEventListener","React","createElement","Fragment","className","Button","variant","onClick","unpauseCurrentCall","backToCallView","FontAwesomeIcon","size","icon","faArrowLeft","type","onChange","event","currentTarget","value","test","autoFocus","spellCheck","style","marginTop","height","ref","length","ListAvatar","maxWidth","faPhoneLight","faPhone","slice","map","i","key","mainPresence","mainextension","status","disabled","Tooltip","place"],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@nethesis/phone-island",
3
3
  "author": "Nethesis",
4
- "version": "0.7.97",
4
+ "version": "0.7.99",
5
5
  "description": "NethVoice CTI Phone Island",
6
6
  "keywords": [
7
7
  "nethserver",