@nethesis/phone-island 1.0.14-dev.1 → 1.0.15

package/dist/components/PhysicalRecorderView/PhysicalRecordingTimer.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var r=require("../../node_modules/react-moment/dist/index.js"),t=require("../../node_modules/react-redux/es/hooks/useSelector.js"),u=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=o(e),i=e.memo((function(){var e=t.useSelector((function(e){return{recording:e.physicalRecorder.recording,startTime:e.physicalRecorder.startTime,currentTime:e.physicalRecorder.currentTime}})),o=e.startTime,i=e.currentTime,s=e.recording,a=u.useDispatch();return n.default.createElement(n.default.Fragment,null,o&&s?n.default.createElement(r.default,{date:o,interval:1e3,format:"hh:mm:ss",trim:!1,onChange:function(e){a.recorder.setCurrentTime(e)},unix:!0,durationFromNow:!0}):i)}));exports.default=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var r=require("../../node_modules/react-moment/dist/index.js"),t=require("../../node_modules/react-redux/es/hooks/useSelector.js"),u=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=o(e),i=e.memo(function(){var e=t.useSelector(function(e){return{recording:e.physicalRecorder.recording,startTime:e.physicalRecorder.startTime,currentTime:e.physicalRecorder.currentTime}}),o=e.startTime,i=e.currentTime,s=e.recording,a=u.useDispatch();return n.default.createElement(n.default.Fragment,null,o&&s?n.default.createElement(r.default,{date:o,interval:1e3,format:"hh:mm:ss",trim:!1,onChange:function(e){a.recorder.setCurrentTime(e)},unix:!0,durationFromNow:!0}):i)});exports.default=i;
 //# sourceMappingURL=PhysicalRecordingTimer.js.map

package/dist/components/PhysicalRecorderView/PhysicalRecordingTimer.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhysicalRecordingTimer.js","sources":["../../../src/components/PhysicalRecorderView/PhysicalRecordingTimer.tsx"],"sourcesContent":["//\n// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n//\n\nimport React, { memo, FC } from 'react'\nimport { useSelector, useDispatch } from 'react-redux'\nimport Moment from 'react-moment'\nimport { RootState, Dispatch } from '../../store'\n\nconst PhysicalTimer: FC<TimerProps> = () => {\n  const { startTime, currentTime, recording } = useSelector((state: RootState) => ({\n    recording: state.physicalRecorder.recording,\n    startTime: state.physicalRecorder.startTime,\n    currentTime: state.physicalRecorder.currentTime,\n  }))\n\n  const dispatch = useDispatch<Dispatch>()\n\n  function handleTimerChanged(time: string) {\n    dispatch.recorder.setCurrentTime(time)\n  }\n\n  return (\n    <>\n      {startTime && recording ? (\n        <Moment\n          date={startTime}\n          interval={1000}\n          format='hh:mm:ss'\n          trim={false}\n          onChange={handleTimerChanged}\n          unix\n          durationFromNow\n        />\n      ) : (\n        currentTime\n      )}\n    </>\n  )\n}\n\nexport default memo(PhysicalTimer)\n\ninterface TimerProps {}\n"],"names":["memo","_a","useSelector","state","recording","physicalRecorder","startTime","currentTime","dispatch","useDispatch","React","createElement","Moment","date","interval","format","trim","onChange","time","recorder","setCurrentTime","unix","durationFromNow"],"mappings":"2aA0CeA,EAAAA,EAAAA,MAhCuB,WAC9B,IAAAC,EAAwCC,EAAAA,aAAY,SAACC,GAAqB,MAAC,CAC/EC,UAAWD,EAAME,iBAAiBD,UAClCE,UAAWH,EAAME,iBAAiBC,UAClCC,YAAaJ,EAAME,iBAAiBE,gBAH9BD,EAASL,EAAAK,UAAEC,EAAWN,EAAAM,YAAEH,EAASH,EAAAG,UAMnCI,EAAWC,EAAAA,cAMjB,OACEC,gDACGJ,GAAaF,EACZM,EAAA,QAAAC,cAACC,EAAM,QACL,CAAAC,KAAMP,EACNQ,SAAU,IACVC,OAAO,WACPC,MAAM,EACNC,SAZR,SAA4BC,GAC1BV,EAASW,SAASC,eAAeF,EAClC,EAWOG,MAAI,EACJC,iBACA,IAEF,EAIR"}
+{"version":3,"file":"PhysicalRecordingTimer.js","sources":["../../../src/components/PhysicalRecorderView/PhysicalRecordingTimer.tsx"],"sourcesContent":["//\n// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n//\n\nimport React, { memo, FC } from 'react'\nimport { useSelector, useDispatch } from 'react-redux'\nimport Moment from 'react-moment'\nimport { RootState, Dispatch } from '../../store'\n\nconst PhysicalTimer: FC<TimerProps> = () => {\n  const { startTime, currentTime, recording } = useSelector((state: RootState) => ({\n    recording: state.physicalRecorder.recording,\n    startTime: state.physicalRecorder.startTime,\n    currentTime: state.physicalRecorder.currentTime,\n  }))\n\n  const dispatch = useDispatch<Dispatch>()\n\n  function handleTimerChanged(time: string) {\n    dispatch.recorder.setCurrentTime(time)\n  }\n\n  return (\n    <>\n      {startTime && recording ? (\n        <Moment\n          date={startTime}\n          interval={1000}\n          format='hh:mm:ss'\n          trim={false}\n          onChange={handleTimerChanged}\n          unix\n          durationFromNow\n        />\n      ) : (\n        currentTime\n      )}\n    </>\n  )\n}\n\nexport default memo(PhysicalTimer)\n\ninterface TimerProps {}\n"],"names":["memo","_a","useSelector","state","recording","physicalRecorder","startTime","currentTime","dispatch","useDispatch","React","createElement","Moment","date","interval","format","trim","onChange","time","recorder","setCurrentTime","unix","durationFromNow"],"mappings":"2aA0CeA,EAAAA,EAAAA,KAhCuB,WAC9B,IAAAC,EAAwCC,EAAAA,YAAY,SAACC,GAAqB,MAAC,CAC/EC,UAAWD,EAAME,iBAAiBD,UAClCE,UAAWH,EAAME,iBAAiBC,UAClCC,YAAaJ,EAAME,iBAAiBE,eAH9BD,EAASL,EAAAK,UAAEC,EAAWN,EAAAM,YAAEH,EAASH,EAAAG,UAMnCI,EAAWC,EAAAA,cAMjB,OACEC,gDACGJ,GAAaF,EACZM,EAAA,QAAAC,cAACC,EAAM,QACL,CAAAC,KAAMP,EACNQ,SAAU,IACVC,OAAO,WACPC,MAAM,EACNC,SAZR,SAA4BC,GAC1BV,EAASW,SAASC,eAAeF,EAClC,EAWOG,MAAI,EACJC,iBACA,IAEF,EAIR"}

package/dist/components/PhysicalRecorderView/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react");require("../../node_modules/react-redux/es/index.js");var i=require("../../store/index.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var r=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var s=require("../Hangup.js"),n=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),a=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),o=require("../../utils/customHooks/useEventListener.js"),l=require("../../utils/genericFunctions/eventDispatch.js"),c=require("../../services/offhour.js");require("../../lib/webrtc/janus.js"),require("../../node_modules/webrtc-adapter/src/js/adapter_core.js"),require("../../node_modules/mic-check/lib/index.js");var d=require("../../events/RecorderEvents.js"),u=require("./PhysicalRecordingTimer.js"),p=require("../../node_modules/react-redux/es/hooks/useSelector.js"),m=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=f(t);exports.PhysicalRecorderView=function(){var f=p.useSelector((function(e){return e.island})).isOpen,v=p.useSelector((function(e){return{recording:e.physicalRecorder.recording}})).recording,j=i.store.getState().currentUser.username,g=t.useRef(null),w=m.useDispatch();t.useEffect((function(){return w.recorder.setVisibleContainerRef(g),function(){w.recorder.reset()}}),[]);var x=r.useTranslation().t;o.useEventListener("phone-island-physical-recording-open",(function(){!function(){e.__awaiter(this,void 0,void 0,(function(){var t;return e.__generator(this,(function(e){switch(e.label){case 0:return w.physicalRecorder.setRecording(!0),[4,c.startAnnouncementRecording()];case 1:return(t=e.sent()).tempFilename&&w.physicalRecorder.setTempFilename(t.tempFilename),l.eventDispatch("phone-island-recording-started",{}),[2]}}))}))}()}));var y=i.store.getState().physicalRecorder.recordingTempVariable;return o.useEventListener("phone-island-conversations",(function(e){Object.keys(e).forEach((function(t){var i;if(t===j){var r=null===(i=e[t])||void 0===i?void 0:i.conversations;if(r){var s=Object.keys(r);if(s.length>0&&"REC"===r[s[0]].counterpartName){w.physicalRecorder.setStartTime("".concat(Date.now()/1e3));var n=r[s[0]];if(n&&n.chSource){var a={conversationId:n.id,endpointId:n.chSource.callerNum};w.physicalRecorder.setCallRecordingInformations({recordingCallInformation:a})}}0===s.length&&v&&!y&&(d.dispatchPhysicalRecordingSave(),w.island.setIslandView(null),w.physicalRecorder.setRecording(!1))}}}))})),h.default.createElement(h.default.Fragment,null,f?h.default.createElement("div",{className:""},y&&h.default.createElement("div",{className:"pi-flex pi-w-full pi-justify-center pi-items-center pi-pt-4 pi-pb-9"},h.default.createElement("div",{className:"pi-font-medium pi-text-4xl pi-w-fit pi-h-fit dark:pi-text-white"},h.default.createElement(u.default,null))),h.default.createElement("div",{className:"pi-flex pi-w-full pi-justify-center pi-items-center"},y?h.default.createElement("div",{className:"pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white"},x("Common.Close the call to stop recording")):h.default.createElement("div",{className:"pi-mt-12 pi-font-regular pi-text-lg pi-w-fit pi-h-fit dark:pi-text-white"},x("Common.Answer phone to start recording"))),h.default.createElement("div",{className:"pi-grid pi-pt-2 pi-mt-8"},h.default.createElement("div",{className:"pi-grid pi-justify-items-center"},h.default.createElement(s.default,{description:x("Tooltip.Interrupt recording"),isPhysicalRecording:!0})))):h.default.createElement("div",{className:"pi-flex pi-justify-between pi-items-center"},h.default.createElement("div",{className:"pi-font-medium pi-text-base"},x("Common.Recording")),h.default.createElement("div",{className:"".concat(f?"pi-h-12 pi-w-12":"pi-h-6 pi-w-6"," pi-flex pi-justify-center pi-items-center")},h.default.createElement("div",{className:"".concat(f?"pi-h-8":"pi-h-4 pi-w-4 pi-rounded-full"," pi-w-fit pi-flex pi-justify-center pi-items-center pi-gap-1 pi-overflow-hidden")},h.default.createElement("span",{className:"".concat(f?"pi-w-8 pi-h-8":"pi-h-6 pi-w-6"," pi-animate-ping pi-absolute pi-inline-flex pi-rounded-full pi-bg-red-400 pi-opacity-75 ")}),h.default.createElement(n.FontAwesomeIcon,{className:"pi-w-4 pi-h-6 pi-rotate-45 pi-text-red-500",icon:a.faCircle})))))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react");require("../../node_modules/react-redux/es/index.js");var i=require("../../store/index.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var r=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var s=require("../Hangup.js"),n=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),a=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),o=require("../../utils/customHooks/useEventListener.js"),l=require("../../utils/genericFunctions/eventDispatch.js"),c=require("../../services/offhour.js");require("../../lib/webrtc/janus.js"),require("../../node_modules/webrtc-adapter/src/js/adapter_core.js"),require("../../node_modules/mic-check/lib/index.js");var d=require("../../events/RecorderEvents.js"),u=require("./PhysicalRecordingTimer.js"),p=require("../../node_modules/react-redux/es/hooks/useSelector.js"),m=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=f(t);exports.PhysicalRecorderView=function(){var f=p.useSelector(function(e){return e.island}).isOpen,v=p.useSelector(function(e){return{recording:e.physicalRecorder.recording}}).recording,j=i.store.getState().currentUser.username,g=t.useRef(null),w=m.useDispatch();t.useEffect(function(){return w.recorder.setVisibleContainerRef(g),function(){w.recorder.reset()}},[]);var x=r.useTranslation().t;o.useEventListener("phone-island-physical-recording-open",function(){!function(){e.__awaiter(this,void 0,void 0,function(){var t;return e.__generator(this,function(e){switch(e.label){case 0:return w.physicalRecorder.setRecording(!0),[4,c.startAnnouncementRecording()];case 1:return(t=e.sent()).tempFilename&&w.physicalRecorder.setTempFilename(t.tempFilename),l.eventDispatch("phone-island-recording-started",{}),[2]}})})}()});var y=i.store.getState().physicalRecorder.recordingTempVariable;return o.useEventListener("phone-island-conversations",function(e){Object.keys(e).forEach(function(t){var i;if(t===j){var r=null===(i=e[t])||void 0===i?void 0:i.conversations;if(r){var s=Object.keys(r);if(s.length>0&&"REC"===r[s[0]].counterpartName){w.physicalRecorder.setStartTime("".concat(Date.now()/1e3));var n=r[s[0]];if(n&&n.chSource){var a={conversationId:n.id,endpointId:n.chSource.callerNum};w.physicalRecorder.setCallRecordingInformations({recordingCallInformation:a})}}0===s.length&&v&&!y&&(d.dispatchPhysicalRecordingSave(),w.island.setIslandView(null),w.physicalRecorder.setRecording(!1))}}})}),h.default.createElement(h.default.Fragment,null,f?h.default.createElement("div",{className:""},y&&h.default.createElement("div",{className:"pi-flex pi-w-full pi-justify-center pi-items-center pi-pt-4 pi-pb-9"},h.default.createElement("div",{className:"pi-font-medium pi-text-4xl pi-w-fit pi-h-fit dark:pi-text-white"},h.default.createElement(u.default,null))),h.default.createElement("div",{className:"pi-flex pi-w-full pi-justify-center pi-items-center"},y?h.default.createElement("div",{className:"pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white"},x("Common.Close the call to stop recording")):h.default.createElement("div",{className:"pi-mt-12 pi-font-regular pi-text-lg pi-w-fit pi-h-fit dark:pi-text-white"},x("Common.Answer phone to start recording"))),h.default.createElement("div",{className:"pi-grid pi-pt-2 pi-mt-8"},h.default.createElement("div",{className:"pi-grid pi-justify-items-center"},h.default.createElement(s.default,{description:x("Tooltip.Interrupt recording"),isPhysicalRecording:!0})))):h.default.createElement("div",{className:"pi-flex pi-justify-between pi-items-center"},h.default.createElement("div",{className:"pi-font-medium pi-text-base"},x("Common.Recording")),h.default.createElement("div",{className:"".concat(f?"pi-h-12 pi-w-12":"pi-h-6 pi-w-6"," pi-flex pi-justify-center pi-items-center")},h.default.createElement("div",{className:"".concat(f?"pi-h-8":"pi-h-4 pi-w-4 pi-rounded-full"," pi-w-fit pi-flex pi-justify-center pi-items-center pi-gap-1 pi-overflow-hidden")},h.default.createElement("span",{className:"".concat(f?"pi-w-8 pi-h-8":"pi-h-6 pi-w-6"," pi-animate-ping pi-absolute pi-inline-flex pi-rounded-full pi-bg-red-400 pi-opacity-75 ")}),h.default.createElement(n.FontAwesomeIcon,{className:"pi-w-4 pi-h-6 pi-rotate-45 pi-text-red-500",icon:a.faCircle})))))};
 //# sourceMappingURL=index.js.map

package/dist/components/PhysicalRecorderView/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/PhysicalRecorderView/index.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useRef, useEffect } from 'react'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { Dispatch, RootState, store } from '../../store'\nimport { useTranslation } from 'react-i18next'\nimport Hangup from '../Hangup'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faCircle } from '@fortawesome/free-solid-svg-icons'\nimport { useEventListener, eventDispatch } from '../../utils'\nimport { startAnnouncementRecording } from '../../services/offhour'\nimport { dispatchPhysicalRecordingSave } from '../../events'\nimport PhysicalRecordingTimer from './PhysicalRecordingTimer'\n\nexport const PhysicalRecorderView: FC<PhysicalRecorderViewProps> = () => {\n  const { isOpen } = useSelector((state: RootState) => state.island)\n  const { recording } = useSelector((state: RootState) => ({\n    recording: state.physicalRecorder.recording,\n  }))\n\n  const { username } = store.getState().currentUser\n  const visibleContainerRef = useRef<HTMLDivElement>(null)\n\n  // Initialize state dispatch\n  const dispatch = useDispatch<Dispatch>()\n\n  // Handle view close and reset state\n  useEffect(() => {\n    // Set visible container reference to recorder state\n    dispatch.recorder.setVisibleContainerRef(visibleContainerRef)\n\n    return () => {\n      dispatch.recorder.reset()\n    }\n  }, [])\n\n  const { t } = useTranslation()\n\n  async function handleStart() {\n    // Update the recorder state\n    dispatch.physicalRecorder.setRecording(true)\n    // Call the api to start the recording call\n    const data: { tempFilename: string } | null = await startAnnouncementRecording()\n    // Set the returned temp file name to the store\n    if (data.tempFilename) dispatch.physicalRecorder.setTempFilename(data.tempFilename)\n    eventDispatch('phone-island-recording-started', {})\n  }\n\n  // Save recording inside store and make api request\n  useEventListener('phone-island-physical-recording-open', () => {\n    handleStart()\n  })\n\n  const { recordingTempVariable } = store.getState().physicalRecorder\n  // recording true and conversation not empty recording is started\n  // recording true and conversation empty recording is stopped\n  useEventListener('phone-island-conversations', (data: { [key: string]: any }) => {\n    const keys = Object.keys(data)\n\n    keys.forEach((key) => {\n      if (key === username) {\n        let conversations = data[key]?.conversations\n\n        if (conversations) {\n          const conversationKeys = Object.keys(conversations)\n          if (\n            conversationKeys.length > 0 &&\n            conversations[conversationKeys[0]].counterpartName === 'REC'\n          ) {\n            // Set the start time of recording\n            dispatch.physicalRecorder.setStartTime(`${Date.now() / 1000}`)\n            let firstConversationKey = conversationKeys[0]\n            let userRecordingData = conversations[firstConversationKey]\n            if (userRecordingData) {\n              if (userRecordingData.chSource) {\n                let recordingCallInformation = {\n                  conversationId: userRecordingData.id,\n                  endpointId: userRecordingData.chSource.callerNum,\n                }\n                dispatch.physicalRecorder.setCallRecordingInformations({\n                  recordingCallInformation,\n                })\n              }\n            }\n          }\n          if (conversationKeys.length === 0 && recording && !recordingTempVariable) {\n            // close physical recording phone island view\n            dispatchPhysicalRecordingSave()\n            dispatch.island.setIslandView(null)\n            dispatch.physicalRecorder.setRecording(false)\n          }\n        }\n      }\n    })\n  })\n\n  return (\n    <>\n      {isOpen ? (\n        <div className=''>\n          {recordingTempVariable && (\n            <div className='pi-flex pi-w-full pi-justify-center pi-items-center pi-pt-4 pi-pb-9'>\n              <div className='pi-font-medium pi-text-4xl pi-w-fit pi-h-fit dark:pi-text-white'>\n                <PhysicalRecordingTimer />\n              </div>\n            </div>\n          )}\n          <div className='pi-flex pi-w-full pi-justify-center pi-items-center'>\n            {recordingTempVariable ? (\n              <div className='pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white'>\n                {t('Common.Close the call to stop recording')}\n              </div>\n            ) : (\n              <div className='pi-mt-12 pi-font-regular pi-text-lg pi-w-fit pi-h-fit dark:pi-text-white'>\n                {t('Common.Answer phone to start recording')}\n              </div>\n            )}\n          </div>\n          <div className='pi-grid pi-pt-2 pi-mt-8'>\n            <div className='pi-grid pi-justify-items-center'>\n              <Hangup description={t('Tooltip.Interrupt recording')} isPhysicalRecording />\n            </div>\n          </div>\n        </div>\n      ) : (\n        <div className='pi-flex pi-justify-between pi-items-center'>\n          <div className='pi-font-medium pi-text-base'>{t('Common.Recording')}</div>\n          <div\n            className={`${\n              !isOpen ? 'pi-h-6 pi-w-6' : 'pi-h-12 pi-w-12'\n            } pi-flex pi-justify-center pi-items-center`}\n          >\n            <div\n              className={`${\n                !isOpen ? 'pi-h-4 pi-w-4 pi-rounded-full' : 'pi-h-8'\n              } pi-w-fit pi-flex pi-justify-center pi-items-center pi-gap-1 pi-overflow-hidden`}\n            >\n              <span\n                className={`${\n                  !isOpen ? 'pi-h-6 pi-w-6' : 'pi-w-8 pi-h-8'\n                } pi-animate-ping pi-absolute pi-inline-flex pi-rounded-full pi-bg-red-400 pi-opacity-75 `}\n              ></span>\n              <FontAwesomeIcon\n                className='pi-w-4 pi-h-6 pi-rotate-45 pi-text-red-500'\n                icon={faCircle}\n              ></FontAwesomeIcon>\n            </div>\n          </div>\n        </div>\n      )}\n    </>\n  )\n}\n\nexport interface PhysicalRecorderViewProps {}\n"],"names":["isOpen","useSelector","state","island","recording","physicalRecorder","username","store","getState","currentUser","visibleContainerRef","useRef","dispatch","useDispatch","useEffect","recorder","setVisibleContainerRef","reset","t","useTranslation","useEventListener","setRecording","startAnnouncementRecording","data","_a","sent","tempFilename","setTempFilename","eventDispatch","handleStart","recordingTempVariable","Object","keys","forEach","key","conversations","conversationKeys","length","counterpartName","setStartTime","concat","Date","now","userRecordingData","chSource","recordingCallInformation","conversationId","id","endpointId","callerNum","setCallRecordingInformations","dispatchPhysicalRecordingSave","setIslandView","React","createElement","Fragment","className","PhysicalRecordingTimer","Hangup","description","isPhysicalRecording","FontAwesomeIcon","icon","faCircle"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/PhysicalRecorderView/index.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useRef, useEffect } from 'react'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { Dispatch, RootState, store } from '../../store'\nimport { useTranslation } from 'react-i18next'\nimport Hangup from '../Hangup'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faCircle } from '@fortawesome/free-solid-svg-icons'\nimport { useEventListener, eventDispatch } from '../../utils'\nimport { startAnnouncementRecording } from '../../services/offhour'\nimport { dispatchPhysicalRecordingSave } from '../../events'\nimport PhysicalRecordingTimer from './PhysicalRecordingTimer'\n\nexport const PhysicalRecorderView: FC<PhysicalRecorderViewProps> = () => {\n  const { isOpen } = useSelector((state: RootState) => state.island)\n  const { recording } = useSelector((state: RootState) => ({\n    recording: state.physicalRecorder.recording,\n  }))\n\n  const { username } = store.getState().currentUser\n  const visibleContainerRef = useRef<HTMLDivElement>(null)\n\n  // Initialize state dispatch\n  const dispatch = useDispatch<Dispatch>()\n\n  // Handle view close and reset state\n  useEffect(() => {\n    // Set visible container reference to recorder state\n    dispatch.recorder.setVisibleContainerRef(visibleContainerRef)\n\n    return () => {\n      dispatch.recorder.reset()\n    }\n  }, [])\n\n  const { t } = useTranslation()\n\n  async function handleStart() {\n    // Update the recorder state\n    dispatch.physicalRecorder.setRecording(true)\n    // Call the api to start the recording call\n    const data: { tempFilename: string } | null = await startAnnouncementRecording()\n    // Set the returned temp file name to the store\n    if (data.tempFilename) dispatch.physicalRecorder.setTempFilename(data.tempFilename)\n    eventDispatch('phone-island-recording-started', {})\n  }\n\n  // Save recording inside store and make api request\n  useEventListener('phone-island-physical-recording-open', () => {\n    handleStart()\n  })\n\n  const { recordingTempVariable } = store.getState().physicalRecorder\n  // recording true and conversation not empty recording is started\n  // recording true and conversation empty recording is stopped\n  useEventListener('phone-island-conversations', (data: { [key: string]: any }) => {\n    const keys = Object.keys(data)\n\n    keys.forEach((key) => {\n      if (key === username) {\n        let conversations = data[key]?.conversations\n\n        if (conversations) {\n          const conversationKeys = Object.keys(conversations)\n          if (\n            conversationKeys.length > 0 &&\n            conversations[conversationKeys[0]].counterpartName === 'REC'\n          ) {\n            // Set the start time of recording\n            dispatch.physicalRecorder.setStartTime(`${Date.now() / 1000}`)\n            let firstConversationKey = conversationKeys[0]\n            let userRecordingData = conversations[firstConversationKey]\n            if (userRecordingData) {\n              if (userRecordingData.chSource) {\n                let recordingCallInformation = {\n                  conversationId: userRecordingData.id,\n                  endpointId: userRecordingData.chSource.callerNum,\n                }\n                dispatch.physicalRecorder.setCallRecordingInformations({\n                  recordingCallInformation,\n                })\n              }\n            }\n          }\n          if (conversationKeys.length === 0 && recording && !recordingTempVariable) {\n            // close physical recording phone island view\n            dispatchPhysicalRecordingSave()\n            dispatch.island.setIslandView(null)\n            dispatch.physicalRecorder.setRecording(false)\n          }\n        }\n      }\n    })\n  })\n\n  return (\n    <>\n      {isOpen ? (\n        <div className=''>\n          {recordingTempVariable && (\n            <div className='pi-flex pi-w-full pi-justify-center pi-items-center pi-pt-4 pi-pb-9'>\n              <div className='pi-font-medium pi-text-4xl pi-w-fit pi-h-fit dark:pi-text-white'>\n                <PhysicalRecordingTimer />\n              </div>\n            </div>\n          )}\n          <div className='pi-flex pi-w-full pi-justify-center pi-items-center'>\n            {recordingTempVariable ? (\n              <div className='pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white'>\n                {t('Common.Close the call to stop recording')}\n              </div>\n            ) : (\n              <div className='pi-mt-12 pi-font-regular pi-text-lg pi-w-fit pi-h-fit dark:pi-text-white'>\n                {t('Common.Answer phone to start recording')}\n              </div>\n            )}\n          </div>\n          <div className='pi-grid pi-pt-2 pi-mt-8'>\n            <div className='pi-grid pi-justify-items-center'>\n              <Hangup description={t('Tooltip.Interrupt recording')} isPhysicalRecording />\n            </div>\n          </div>\n        </div>\n      ) : (\n        <div className='pi-flex pi-justify-between pi-items-center'>\n          <div className='pi-font-medium pi-text-base'>{t('Common.Recording')}</div>\n          <div\n            className={`${\n              !isOpen ? 'pi-h-6 pi-w-6' : 'pi-h-12 pi-w-12'\n            } pi-flex pi-justify-center pi-items-center`}\n          >\n            <div\n              className={`${\n                !isOpen ? 'pi-h-4 pi-w-4 pi-rounded-full' : 'pi-h-8'\n              } pi-w-fit pi-flex pi-justify-center pi-items-center pi-gap-1 pi-overflow-hidden`}\n            >\n              <span\n                className={`${\n                  !isOpen ? 'pi-h-6 pi-w-6' : 'pi-w-8 pi-h-8'\n                } pi-animate-ping pi-absolute pi-inline-flex pi-rounded-full pi-bg-red-400 pi-opacity-75 `}\n              ></span>\n              <FontAwesomeIcon\n                className='pi-w-4 pi-h-6 pi-rotate-45 pi-text-red-500'\n                icon={faCircle}\n              ></FontAwesomeIcon>\n            </div>\n          </div>\n        </div>\n      )}\n    </>\n  )\n}\n\nexport interface PhysicalRecorderViewProps {}\n"],"names":["isOpen","useSelector","state","island","recording","physicalRecorder","username","store","getState","currentUser","visibleContainerRef","useRef","dispatch","useDispatch","useEffect","recorder","setVisibleContainerRef","reset","t","useTranslation","useEventListener","setRecording","startAnnouncementRecording","data","_a","sent","tempFilename","setTempFilename","eventDispatch","handleStart","recordingTempVariable","Object","keys","forEach","key","conversations","conversationKeys","length","counterpartName","setStartTime","concat","Date","now","userRecordingData","chSource","recordingCallInformation","conversationId","id","endpointId","callerNum","setCallRecordingInformations","dispatchPhysicalRecordingSave","setIslandView","React","createElement","Fragment","className","PhysicalRecordingTimer","Hangup","description","isPhysicalRecording","FontAwesomeIcon","icon","faCircle"],"mappings":"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"}

package/dist/components/RecorderView/Actions.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react"),r=require("../Button.js"),i=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),o=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),n=require("../../services/offhour.js");require("../../node_modules/react-redux/es/index.js");var s=require("../../lib/phone/call.js"),a=require("../../utils/customHooks/useEventListener.js"),l=require("../../utils/genericFunctions/eventDispatch.js");require("../../store/index.js");var c=require("../../events/RecorderEvents.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var d=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var u=require("../CustomThemedTooltip.js"),p=require("../../node_modules/@nethesis/nethesis-solid-svg-icons/index.mjs.js"),m=require("../../node_modules/react-redux/es/utils/shallowEqual.js");require("../../node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js"),require("../../node_modules/react-redux/node_modules/react-is/index.js");var f=require("../../node_modules/react-redux/es/hooks/useDispatch.js"),g=require("../../node_modules/react-redux/es/hooks/useSelector.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=h(t);exports.Actions=function(){var h=f.useDispatch(),w=g.useSelector((function(e){return{incoming:e.recorder.incoming,waiting:e.recorder.waiting,recording:e.recorder.recording,recorded:e.recorder.recorded,playing:e.recorder.playing}}),m.default),j=w.incoming,x=w.waiting,q=w.recording,E=w.recorded,y=w.playing;function _(){return e.__awaiter(this,void 0,void 0,(function(){var t;return e.__generator(this,(function(e){switch(e.label){case 0:return h.recorder.setRecording(!0),h.recorder.setWaiting(!0),[4,n.startAnnouncementRecording()];case 1:return(t=e.sent()).tempFilename&&h.recorder.setTempFilename(t.tempFilename),h.recorder.setStartTime("".concat(Date.now()/1e3)),l.eventDispatch("phone-island-recording-started",{}),[2]}}))}))}function T(){h.recorder.setWaiting(!0),s.hangupCurrentCall(),h.recorder.setRecorded(!0),l.eventDispatch("phone-island-recording-stopped",{})}function b(){y&&(h.player.pauseAudioPlayer(),h.recorder.setPlaying(!1),h.recorder.setPaused(!0)),c.dispatchRecordingSave(),h.island.setIslandView(null)}a.useEventListener("phone-island-recording-start",(function(e){_()})),a.useEventListener("phone-island-recording-stop",(function(e){T()})),a.useEventListener("phone-island-recording-save",(function(e){b()})),t.useEffect((function(){q||h.recorder.setWaiting(!1)}),[q]),t.useEffect((function(){j&&(s.answerIncomingCall(),h.recorder.setIncoming(!1),h.recorder.setWaiting(!1))}),[j]);var C=d.useTranslation().t;return v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-between pi-px-6 pi-py-2 pi-gap-0 pi-w-full pi-mt-auto"},v.default.createElement(r.Button,{variant:"transparent",disabled:!0,className:"pi-w-6 pi-h-6 pi-flex pi-items-center pi-justify-center pi-flex-none"},v.default.createElement(i.FontAwesomeIcon,{icon:o.faDownLeftAndUpRightToCenter,className:"pi-w-6 pi-h-6"})),v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-center pi-flex-grow"},q&&v.default.createElement(r.Button,{onClick:T,variant:"default",className:"pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center","data-tooltip-id":"tooltip-stop-recorder-view","data-tooltip-content":C("Tooltip.Stop")||""},x?v.default.createElement(i.FontAwesomeIcon,{icon:o.faCircleNotch,className:"fa-spin pi-loader",size:"lg"}):v.default.createElement(i.FontAwesomeIcon,{icon:o.faStop,size:"xl"})),E&&!q&&v.default.createElement(r.Button,{onClick:b,variant:"default",className:"pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center","data-tooltip-id":"tooltip-confirm-record-view","data-tooltip-content":C("Tooltip.Confirm")||""},v.default.createElement(i.FontAwesomeIcon,{icon:o.faFloppyDisk,className:"pi-h-6 pi-w-6"})),!q&&!E&&v.default.createElement(r.Button,{onClick:_,variant:"default",className:"pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center","data-tooltip-id":"tooltip-start-recording-recorder-view","data-tooltip-content":C("Tooltip.Start recording")||""},x?v.default.createElement(i.FontAwesomeIcon,{icon:o.faCircleNotch,className:"fa-spin pi-loader",size:"lg"}):v.default.createElement(i.FontAwesomeIcon,{icon:p.faRecord,className:"pi-h-6 pi-w-6"}))),v.default.createElement("div",{onClick:function(){return h.island.setIslandView("settings")},"data-tooltip-id":"tooltip-settings-view-recorder","data-tooltip-content":C("Tooltip.Go to settings")||"",className:"pi-flex pi-items-center pi-justify-center pi-cursor-pointer pi-text-gray-700 dark:pi-text-gray-200 pi-w-6 pi-h-6 pi-flex-none"},v.default.createElement(i.FontAwesomeIcon,{icon:o.faGear,className:"pi-h-6 pi-w-6"})),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-start-recording-recorder-view",place:"top"}),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-stop-recorder-view",place:"top"}),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-confirm-record-view",place:"top"}),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-settings-view-recorder",place:"top"}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react"),r=require("../Button.js"),i=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),o=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),n=require("../../services/offhour.js");require("../../node_modules/react-redux/es/index.js");var s=require("../../lib/phone/call.js"),a=require("../../utils/customHooks/useEventListener.js"),l=require("../../utils/genericFunctions/eventDispatch.js");require("../../store/index.js");var c=require("../../events/RecorderEvents.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var d=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var u=require("../CustomThemedTooltip.js"),p=require("../../node_modules/@nethesis/nethesis-solid-svg-icons/index.mjs.js"),m=require("../../node_modules/react-redux/es/utils/shallowEqual.js");require("../../node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js"),require("../../node_modules/react-redux/node_modules/react-is/index.js");var f=require("../../node_modules/react-redux/es/hooks/useDispatch.js"),g=require("../../node_modules/react-redux/es/hooks/useSelector.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=h(t);exports.Actions=function(){var h=f.useDispatch(),w=g.useSelector(function(e){return{incoming:e.recorder.incoming,waiting:e.recorder.waiting,recording:e.recorder.recording,recorded:e.recorder.recorded,playing:e.recorder.playing}},m.default),j=w.incoming,x=w.waiting,q=w.recording,E=w.recorded,y=w.playing;function _(){return e.__awaiter(this,void 0,void 0,function(){var t;return e.__generator(this,function(e){switch(e.label){case 0:return h.recorder.setRecording(!0),h.recorder.setWaiting(!0),[4,n.startAnnouncementRecording()];case 1:return(t=e.sent()).tempFilename&&h.recorder.setTempFilename(t.tempFilename),h.recorder.setStartTime("".concat(Date.now()/1e3)),l.eventDispatch("phone-island-recording-started",{}),[2]}})})}function T(){h.recorder.setWaiting(!0),s.hangupCurrentCall(),h.recorder.setRecorded(!0),l.eventDispatch("phone-island-recording-stopped",{})}function b(){y&&(h.player.pauseAudioPlayer(),h.recorder.setPlaying(!1),h.recorder.setPaused(!0)),c.dispatchRecordingSave(),h.island.setIslandView(null)}a.useEventListener("phone-island-recording-start",function(e){_()}),a.useEventListener("phone-island-recording-stop",function(e){T()}),a.useEventListener("phone-island-recording-save",function(e){b()}),t.useEffect(function(){q||h.recorder.setWaiting(!1)},[q]),t.useEffect(function(){j&&(s.answerIncomingCall(),h.recorder.setIncoming(!1),h.recorder.setWaiting(!1))},[j]);var C=d.useTranslation().t;return v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-between pi-px-6 pi-py-2 pi-gap-0 pi-w-full pi-mt-auto"},v.default.createElement(r.Button,{variant:"transparent",disabled:!0,className:"pi-w-6 pi-h-6 pi-flex pi-items-center pi-justify-center pi-flex-none"},v.default.createElement(i.FontAwesomeIcon,{icon:o.faDownLeftAndUpRightToCenter,className:"pi-w-6 pi-h-6"})),v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-center pi-flex-grow"},q&&v.default.createElement(r.Button,{onClick:T,variant:"default",className:"pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center","data-tooltip-id":"tooltip-stop-recorder-view","data-tooltip-content":C("Tooltip.Stop")||""},x?v.default.createElement(i.FontAwesomeIcon,{icon:o.faCircleNotch,className:"fa-spin pi-loader",size:"lg"}):v.default.createElement(i.FontAwesomeIcon,{icon:o.faStop,size:"xl"})),E&&!q&&v.default.createElement(r.Button,{onClick:b,variant:"default",className:"pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center","data-tooltip-id":"tooltip-confirm-record-view","data-tooltip-content":C("Tooltip.Confirm")||""},v.default.createElement(i.FontAwesomeIcon,{icon:o.faFloppyDisk,className:"pi-h-6 pi-w-6"})),!q&&!E&&v.default.createElement(r.Button,{onClick:_,variant:"default",className:"pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center","data-tooltip-id":"tooltip-start-recording-recorder-view","data-tooltip-content":C("Tooltip.Start recording")||""},x?v.default.createElement(i.FontAwesomeIcon,{icon:o.faCircleNotch,className:"fa-spin pi-loader",size:"lg"}):v.default.createElement(i.FontAwesomeIcon,{icon:p.faRecord,className:"pi-h-6 pi-w-6"}))),v.default.createElement("div",{onClick:function(){return h.island.setIslandView("settings")},"data-tooltip-id":"tooltip-settings-view-recorder","data-tooltip-content":C("Tooltip.Go to settings")||"",className:"pi-flex pi-items-center pi-justify-center pi-cursor-pointer pi-text-gray-700 dark:pi-text-gray-200 pi-w-6 pi-h-6 pi-flex-none"},v.default.createElement(i.FontAwesomeIcon,{icon:o.faGear,className:"pi-h-6 pi-w-6"})),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-start-recording-recorder-view",place:"top"}),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-stop-recorder-view",place:"top"}),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-confirm-record-view",place:"top"}),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-settings-view-recorder",place:"top"}))};
 //# sourceMappingURL=Actions.js.map

package/dist/components/RecorderView/Actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sources":["../../../src/components/RecorderView/Actions.tsx"],"sourcesContent":["//\n// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n//\n\nimport React, { type FC, useEffect } from 'react'\nimport { Button } from '../Button'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n  faStop,\n  faCircleNotch,\n  faGear,\n  faDownLeftAndUpRightToCenter,\n  faFloppyDisk,\n} from '@fortawesome/free-solid-svg-icons'\nimport { startAnnouncementRecording } from '../../services/offhour'\nimport { useDispatch, useSelector, shallowEqual } from 'react-redux'\nimport { Dispatch, RootState } from '../../store'\nimport { hangupCurrentCall, answerIncomingCall } from '../../lib/phone/call'\nimport { dispatchRecordingSave } from '../../events'\nimport { useTranslation } from 'react-i18next'\nimport { useEventListener, eventDispatch } from '../../utils'\nimport { CustomThemedTooltip } from '../CustomThemedTooltip'\nimport { faRecord } from '@nethesis/nethesis-solid-svg-icons'\n\nexport const Actions: FC<{}> = () => {\n  const dispatch = useDispatch<Dispatch>()\n  const { incoming, waiting, recording, recorded, playing } = useSelector(\n    (state: RootState) => ({\n      incoming: state.recorder.incoming,\n      waiting: state.recorder.waiting,\n      recording: state.recorder.recording,\n      recorded: state.recorder.recorded,\n      playing: state.recorder.playing,\n    }),\n    shallowEqual,\n  )\n\n  async function handleStart() {\n    // Update the recorder state\n    dispatch.recorder.setRecording(true)\n    dispatch.recorder.setWaiting(true)\n    // Call the api to start the recording call\n    const data: { tempFilename: string } | null = await startAnnouncementRecording()\n    // Set the returned temp file name to the store\n    if (data.tempFilename) dispatch.recorder.setTempFilename(data.tempFilename)\n    // Set the start time of recording\n    dispatch.recorder.setStartTime(`${Date.now() / 1000}`)\n    eventDispatch('phone-island-recording-started', {})\n  }\n  useEventListener('phone-island-recording-start', (data: {}) => {\n    handleStart()\n  })\n\n  function handleStop() {\n    // Set waiting to true\n    dispatch.recorder.setWaiting(true)\n    // Call the function to hangup the current call used for recording\n    hangupCurrentCall()\n    dispatch.recorder.setRecorded(true)\n    eventDispatch('phone-island-recording-stopped', {})\n  }\n  useEventListener('phone-island-recording-stop', (data: {}) => {\n    handleStop()\n  })\n\n  function handleSaveRecording() {\n    // check if the audio is playing and pause it\n    if (playing) {\n      dispatch.player.pauseAudioPlayer()\n      dispatch.recorder.setPlaying(false)\n      dispatch.recorder.setPaused(true)\n    }\n    // Dispatch the reconrding save event\n    dispatchRecordingSave()\n    // Close the Island\n    dispatch.island.setIslandView(null)\n  }\n  useEventListener('phone-island-recording-save', (data: {}) => {\n    handleSaveRecording()\n  })\n\n  useEffect(() => {\n    if (!recording) {\n      dispatch.recorder.setWaiting(false)\n    }\n  }, [recording])\n\n  useEffect(() => {\n    if (incoming) {\n      // Answer the incoming call for recording\n      answerIncomingCall()\n      // Reset incoming to recorder state\n      dispatch.recorder.setIncoming(false)\n      dispatch.recorder.setWaiting(false)\n    }\n  }, [incoming])\n\n  const { t } = useTranslation()\n\n  return (\n    <div\n      className={`pi-flex pi-items-center pi-justify-between pi-px-6 pi-py-2 pi-gap-0 pi-w-full pi-mt-auto`}\n    >\n      <Button\n        variant='transparent'\n        disabled\n        className='pi-w-6 pi-h-6 pi-flex pi-items-center pi-justify-center pi-flex-none'\n      >\n        <FontAwesomeIcon icon={faDownLeftAndUpRightToCenter} className='pi-w-6 pi-h-6' />\n      </Button>\n\n      <div className='pi-flex pi-items-center pi-justify-center pi-flex-grow'>\n        {recording && (\n          <Button\n            onClick={handleStop}\n            variant='default'\n            className='pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center'\n            data-tooltip-id='tooltip-stop-recorder-view'\n            data-tooltip-content={t('Tooltip.Stop') || ''}\n          >\n            {waiting ? (\n              <FontAwesomeIcon icon={faCircleNotch} className='fa-spin pi-loader' size='lg' />\n            ) : (\n              <FontAwesomeIcon icon={faStop} size='xl' />\n            )}\n          </Button>\n        )}\n        {recorded && !recording && (\n          <Button\n            onClick={handleSaveRecording}\n            variant='default'\n            className='pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center'\n            data-tooltip-id='tooltip-confirm-record-view'\n            data-tooltip-content={t('Tooltip.Confirm') || ''}\n          >\n            <FontAwesomeIcon icon={faFloppyDisk} className='pi-h-6 pi-w-6' />\n          </Button>\n        )}\n        {!recording && !recorded && (\n          <Button\n            onClick={handleStart}\n            variant='default'\n            className='pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center'\n            data-tooltip-id='tooltip-start-recording-recorder-view'\n            data-tooltip-content={t('Tooltip.Start recording') || ''}\n          >\n            {waiting ? (\n              <FontAwesomeIcon icon={faCircleNotch} className='fa-spin pi-loader' size='lg' />\n            ) : (\n              <FontAwesomeIcon icon={faRecord} className='pi-h-6 pi-w-6' />\n            )}\n          </Button>\n        )}\n      </div>\n\n      <div\n        onClick={() => dispatch.island.setIslandView('settings')}\n        data-tooltip-id='tooltip-settings-view-recorder'\n        data-tooltip-content={t('Tooltip.Go to settings') || ''}\n        className='pi-flex pi-items-center pi-justify-center pi-cursor-pointer pi-text-gray-700 dark:pi-text-gray-200 pi-w-6 pi-h-6 pi-flex-none'\n      >\n        <FontAwesomeIcon icon={faGear} className={`pi-h-6 pi-w-6`} />\n      </div>\n\n      {/* Buttons tooltips */}\n      <CustomThemedTooltip id='tooltip-start-recording-recorder-view' place='top' />\n      <CustomThemedTooltip id='tooltip-stop-recorder-view' place='top' />\n      <CustomThemedTooltip id='tooltip-confirm-record-view' place='top' />\n      <CustomThemedTooltip id='tooltip-settings-view-recorder' place='top' />\n    </div>\n  )\n}\n"],"names":["dispatch","useDispatch","_a","useSelector","state","incoming","recorder","waiting","recording","recorded","playing","shallowEqual","handleStart","setRecording","setWaiting","startAnnouncementRecording","data","sent","tempFilename","setTempFilename","setStartTime","concat","Date","now","eventDispatch","handleStop","hangupCurrentCall","setRecorded","handleSaveRecording","player","pauseAudioPlayer","setPlaying","setPaused","dispatchRecordingSave","island","setIslandView","useEventListener","useEffect","answerIncomingCall","setIncoming","t","useTranslation","React","createElement","className","Button","variant","disabled","FontAwesomeIcon","icon","faDownLeftAndUpRightToCenter","onClick","faCircleNotch","size","faStop","faFloppyDisk","faRecord","faGear","CustomThemedTooltip","id","place"],"mappings":"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"}
+{"version":3,"file":"Actions.js","sources":["../../../src/components/RecorderView/Actions.tsx"],"sourcesContent":["//\n// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n//\n\nimport React, { type FC, useEffect } from 'react'\nimport { Button } from '../Button'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n  faStop,\n  faCircleNotch,\n  faGear,\n  faDownLeftAndUpRightToCenter,\n  faFloppyDisk,\n} from '@fortawesome/free-solid-svg-icons'\nimport { startAnnouncementRecording } from '../../services/offhour'\nimport { useDispatch, useSelector, shallowEqual } from 'react-redux'\nimport { Dispatch, RootState } from '../../store'\nimport { hangupCurrentCall, answerIncomingCall } from '../../lib/phone/call'\nimport { dispatchRecordingSave } from '../../events'\nimport { useTranslation } from 'react-i18next'\nimport { useEventListener, eventDispatch } from '../../utils'\nimport { CustomThemedTooltip } from '../CustomThemedTooltip'\nimport { faRecord } from '@nethesis/nethesis-solid-svg-icons'\n\nexport const Actions: FC<{}> = () => {\n  const dispatch = useDispatch<Dispatch>()\n  const { incoming, waiting, recording, recorded, playing } = useSelector(\n    (state: RootState) => ({\n      incoming: state.recorder.incoming,\n      waiting: state.recorder.waiting,\n      recording: state.recorder.recording,\n      recorded: state.recorder.recorded,\n      playing: state.recorder.playing,\n    }),\n    shallowEqual,\n  )\n\n  async function handleStart() {\n    // Update the recorder state\n    dispatch.recorder.setRecording(true)\n    dispatch.recorder.setWaiting(true)\n    // Call the api to start the recording call\n    const data: { tempFilename: string } | null = await startAnnouncementRecording()\n    // Set the returned temp file name to the store\n    if (data.tempFilename) dispatch.recorder.setTempFilename(data.tempFilename)\n    // Set the start time of recording\n    dispatch.recorder.setStartTime(`${Date.now() / 1000}`)\n    eventDispatch('phone-island-recording-started', {})\n  }\n  useEventListener('phone-island-recording-start', (data: {}) => {\n    handleStart()\n  })\n\n  function handleStop() {\n    // Set waiting to true\n    dispatch.recorder.setWaiting(true)\n    // Call the function to hangup the current call used for recording\n    hangupCurrentCall()\n    dispatch.recorder.setRecorded(true)\n    eventDispatch('phone-island-recording-stopped', {})\n  }\n  useEventListener('phone-island-recording-stop', (data: {}) => {\n    handleStop()\n  })\n\n  function handleSaveRecording() {\n    // check if the audio is playing and pause it\n    if (playing) {\n      dispatch.player.pauseAudioPlayer()\n      dispatch.recorder.setPlaying(false)\n      dispatch.recorder.setPaused(true)\n    }\n    // Dispatch the reconrding save event\n    dispatchRecordingSave()\n    // Close the Island\n    dispatch.island.setIslandView(null)\n  }\n  useEventListener('phone-island-recording-save', (data: {}) => {\n    handleSaveRecording()\n  })\n\n  useEffect(() => {\n    if (!recording) {\n      dispatch.recorder.setWaiting(false)\n    }\n  }, [recording])\n\n  useEffect(() => {\n    if (incoming) {\n      // Answer the incoming call for recording\n      answerIncomingCall()\n      // Reset incoming to recorder state\n      dispatch.recorder.setIncoming(false)\n      dispatch.recorder.setWaiting(false)\n    }\n  }, [incoming])\n\n  const { t } = useTranslation()\n\n  return (\n    <div\n      className={`pi-flex pi-items-center pi-justify-between pi-px-6 pi-py-2 pi-gap-0 pi-w-full pi-mt-auto`}\n    >\n      <Button\n        variant='transparent'\n        disabled\n        className='pi-w-6 pi-h-6 pi-flex pi-items-center pi-justify-center pi-flex-none'\n      >\n        <FontAwesomeIcon icon={faDownLeftAndUpRightToCenter} className='pi-w-6 pi-h-6' />\n      </Button>\n\n      <div className='pi-flex pi-items-center pi-justify-center pi-flex-grow'>\n        {recording && (\n          <Button\n            onClick={handleStop}\n            variant='default'\n            className='pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center'\n            data-tooltip-id='tooltip-stop-recorder-view'\n            data-tooltip-content={t('Tooltip.Stop') || ''}\n          >\n            {waiting ? (\n              <FontAwesomeIcon icon={faCircleNotch} className='fa-spin pi-loader' size='lg' />\n            ) : (\n              <FontAwesomeIcon icon={faStop} size='xl' />\n            )}\n          </Button>\n        )}\n        {recorded && !recording && (\n          <Button\n            onClick={handleSaveRecording}\n            variant='default'\n            className='pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center'\n            data-tooltip-id='tooltip-confirm-record-view'\n            data-tooltip-content={t('Tooltip.Confirm') || ''}\n          >\n            <FontAwesomeIcon icon={faFloppyDisk} className='pi-h-6 pi-w-6' />\n          </Button>\n        )}\n        {!recording && !recorded && (\n          <Button\n            onClick={handleStart}\n            variant='default'\n            className='pi-rounded-full pi-w-14 pi-h-14 pi-flex pi-items-center pi-justify-center'\n            data-tooltip-id='tooltip-start-recording-recorder-view'\n            data-tooltip-content={t('Tooltip.Start recording') || ''}\n          >\n            {waiting ? (\n              <FontAwesomeIcon icon={faCircleNotch} className='fa-spin pi-loader' size='lg' />\n            ) : (\n              <FontAwesomeIcon icon={faRecord} className='pi-h-6 pi-w-6' />\n            )}\n          </Button>\n        )}\n      </div>\n\n      <div\n        onClick={() => dispatch.island.setIslandView('settings')}\n        data-tooltip-id='tooltip-settings-view-recorder'\n        data-tooltip-content={t('Tooltip.Go to settings') || ''}\n        className='pi-flex pi-items-center pi-justify-center pi-cursor-pointer pi-text-gray-700 dark:pi-text-gray-200 pi-w-6 pi-h-6 pi-flex-none'\n      >\n        <FontAwesomeIcon icon={faGear} className={`pi-h-6 pi-w-6`} />\n      </div>\n\n      {/* Buttons tooltips */}\n      <CustomThemedTooltip id='tooltip-start-recording-recorder-view' place='top' />\n      <CustomThemedTooltip id='tooltip-stop-recorder-view' place='top' />\n      <CustomThemedTooltip id='tooltip-confirm-record-view' place='top' />\n      <CustomThemedTooltip id='tooltip-settings-view-recorder' place='top' />\n    </div>\n  )\n}\n"],"names":["dispatch","useDispatch","_a","useSelector","state","incoming","recorder","waiting","recording","recorded","playing","shallowEqual","handleStart","setRecording","setWaiting","startAnnouncementRecording","data","sent","tempFilename","setTempFilename","setStartTime","concat","Date","now","eventDispatch","handleStop","hangupCurrentCall","setRecorded","handleSaveRecording","player","pauseAudioPlayer","setPlaying","setPaused","dispatchRecordingSave","island","setIslandView","useEventListener","useEffect","answerIncomingCall","setIncoming","t","useTranslation","React","createElement","className","Button","variant","disabled","FontAwesomeIcon","icon","faDownLeftAndUpRightToCenter","onClick","faCircleNotch","size","faStop","faFloppyDisk","faRecord","faGear","CustomThemedTooltip","id","place"],"mappings":"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"}

package/dist/components/RecorderView/Bar.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("../../utils/customHooks/useIntersectionObserver.js"),t=require("../../store/index.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=i(e),n=e.memo((function(i){var n=i.visibleContainer,s=e.useRef(null),o=r.default(s,{root:n||null}),l=t.store.getState().recorder.frequency;return s.current&&(null==o?void 0:o.isIntersecting)&&(s.current.style.height="".concat(l>.1?100*l:10,"%")),u.default.createElement("div",{ref:s,className:"pi-h-1 pi-bg-emerald-700 dark:pi-bg-emerald-500",style:{width:"0.125rem",height:"10%"}})}));exports.Bar=n;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("../../utils/customHooks/useIntersectionObserver.js"),t=require("../../store/index.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=i(e),n=e.memo(function(i){var n=i.visibleContainer,s=e.useRef(null),o=r.default(s,{root:n||null}),l=t.store.getState().recorder.frequency;return s.current&&(null==o?void 0:o.isIntersecting)&&(s.current.style.height="".concat(l>.1?100*l:10,"%")),u.default.createElement("div",{ref:s,className:"pi-h-1 pi-bg-emerald-700 dark:pi-bg-emerald-500",style:{width:"0.125rem",height:"10%"}})});exports.Bar=n;
 //# sourceMappingURL=Bar.js.map

package/dist/components/RecorderView/Bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Bar.js","sources":["../../../src/components/RecorderView/Bar.tsx"],"sourcesContent":["//\n// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n//\n\nimport React, { type FC, useRef, memo } from 'react'\nimport useIntersectionObserver from '../../utils/customHooks/useIntersectionObserver'\nimport { store } from '../../store'\n\nexport const Bar: FC<BarProps> = memo(({ visibleContainer }) => {\n  const barRef = useRef<HTMLDivElement>(null)\n  const intersectionEntry: any = useIntersectionObserver(barRef, { root: visibleContainer || null })\n\n  const { frequency } = store.getState().recorder\n  if (barRef.current && intersectionEntry?.isIntersecting) {\n    barRef.current.style.height = `${frequency > 0.1 ? frequency * 100 : 10}%`\n  }\n\n  return (\n    <div\n      ref={barRef}\n      className='pi-h-1 pi-bg-emerald-700 dark:pi-bg-emerald-500'\n      style={{ width: '0.125rem', height: '10%' }}\n    />\n  )\n})\n\ninterface BarProps {\n  visibleContainer: HTMLDivElement | null\n}\n"],"names":["Bar","memo","_a","visibleContainer","barRef","useRef","intersectionEntry","useIntersectionObserver","root","frequency","store","getState","recorder","current","isIntersecting","style","height","concat","React","ref","className","width"],"mappings":"gRASaA,EAAoBC,EAAAA,MAAK,SAACC,GAAE,IAAAC,EAAgBD,EAAAC,iBACjDC,EAASC,SAAuB,MAChCC,EAAyBC,EAAAA,QAAwBH,EAAQ,CAAEI,KAAML,GAAoB,OAEnFM,EAAcC,EAAKA,MAACC,WAAWC,SAAQH,UAK/C,OAJIL,EAAOS,UAAWP,aAAiB,EAAjBA,EAAmBQ,kBACvCV,EAAOS,QAAQE,MAAMC,OAAS,GAAGC,OAAAR,EAAY,GAAkB,IAAZA,EAAkB,GAAE,MAIvES,EAAAA,6BACEC,IAAKf,EACLgB,UAAU,kDACVL,MAAO,CAAEM,MAAO,WAAYL,OAAQ,QAG1C"}
+{"version":3,"file":"Bar.js","sources":["../../../src/components/RecorderView/Bar.tsx"],"sourcesContent":["//\n// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n//\n\nimport React, { type FC, useRef, memo } from 'react'\nimport useIntersectionObserver from '../../utils/customHooks/useIntersectionObserver'\nimport { store } from '../../store'\n\nexport const Bar: FC<BarProps> = memo(({ visibleContainer }) => {\n  const barRef = useRef<HTMLDivElement>(null)\n  const intersectionEntry: any = useIntersectionObserver(barRef, { root: visibleContainer || null })\n\n  const { frequency } = store.getState().recorder\n  if (barRef.current && intersectionEntry?.isIntersecting) {\n    barRef.current.style.height = `${frequency > 0.1 ? frequency * 100 : 10}%`\n  }\n\n  return (\n    <div\n      ref={barRef}\n      className='pi-h-1 pi-bg-emerald-700 dark:pi-bg-emerald-500'\n      style={{ width: '0.125rem', height: '10%' }}\n    />\n  )\n})\n\ninterface BarProps {\n  visibleContainer: HTMLDivElement | null\n}\n"],"names":["Bar","memo","_a","visibleContainer","barRef","useRef","intersectionEntry","useIntersectionObserver","root","frequency","store","getState","recorder","current","isIntersecting","style","height","concat","React","ref","className","width"],"mappings":"gRASaA,EAAoBC,EAAAA,KAAK,SAACC,GAAE,IAAAC,EAAgBD,EAAAC,iBACjDC,EAASC,SAAuB,MAChCC,EAAyBC,EAAAA,QAAwBH,EAAQ,CAAEI,KAAML,GAAoB,OAEnFM,EAAcC,EAAKA,MAACC,WAAWC,SAAQH,UAK/C,OAJIL,EAAOS,UAAWP,aAAiB,EAAjBA,EAAmBQ,kBACvCV,EAAOS,QAAQE,MAAMC,OAAS,GAAGC,OAAAR,EAAY,GAAkB,IAAZA,EAAkB,GAAE,MAIvES,EAAAA,6BACEC,IAAKf,EACLgB,UAAU,kDACVL,MAAO,CAAEM,MAAO,WAAYL,OAAQ,QAG1C"}

package/dist/components/RecorderView/BarsGroup.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("./Bar.js");require("../../node_modules/react-redux/es/index.js");var t=require("../../node_modules/react-redux/es/hooks/useSelector.js"),n=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=u(e);exports.BarsGroup=function(u){var c=u.index,i=u.startAnimation,s=u.audioStream,o=e.useRef(null),l=e.useRef(0),f=e.useRef(0),d=t.useSelector((function(e){return e.recorder.visibleContainerRef})),m=n.useDispatch(),p=e.useRef(null),v=e.useState(),y=v[0],q=v[1],A=e.useCallback((function(){if(o.current){var e=(f.current?f.current:(t=o.current,(n=t.style.transform.match(/translateX\(([-0-9.]+)%\)/))&&n[1]?parseFloat(n[1]):0))-.4,r=e<=-100?100:e;o.current.style.transform="translateX(".concat(r,"%)"),f.current=r}var t,n;l.current=requestAnimationFrame(A)}),[f]);function x(){var e,r=p.current&&new Uint8Array(p.current.frequencyBinCount);r&&(null===(e=p.current)||void 0===e||e.getByteFrequencyData(r));var t=r&&Object.values(r)||[];m.recorder.setFrequency(t[0]/255),requestAnimationFrame(x)}return e.useEffect((function(){if(s){var e=new AudioContext;p.current=e.createAnalyser(),p.current.fftSize=32,(s&&e.createMediaStreamSource(s)).connect(p.current),requestAnimationFrame(x)}}),[s]),e.useEffect((function(){return i&&(l.current=requestAnimationFrame(A)),function(){l.current&&cancelAnimationFrame(l.current)}}),[i]),e.useEffect((function(){(null==o?void 0:o.current)&&q(!0)}),[]),a.default.createElement("div",{id:"".concat(c),style:{transform:"translateX(".concat(100*c,"%)")},className:"pi-absolute pi-flex pi-w-fit pi-h-6 pi-gap-1 pi-items-center pi-px-0.5",ref:o},y&&a.default.createElement(a.default.Fragment,null,Array.from(Array(55).keys()).map((function(e,t){return a.default.createElement(r.Bar,{key:t,visibleContainer:(null==d?void 0:d.current)||null})}))))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("./Bar.js");require("../../node_modules/react-redux/es/index.js");var t=require("../../node_modules/react-redux/es/hooks/useSelector.js"),n=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=u(e);exports.BarsGroup=function(u){var c=u.index,i=u.startAnimation,s=u.audioStream,o=e.useRef(null),l=e.useRef(0),f=e.useRef(0),d=t.useSelector(function(e){return e.recorder.visibleContainerRef}),m=n.useDispatch(),p=e.useRef(null),v=e.useState(),y=v[0],q=v[1],A=e.useCallback(function(){if(o.current){var e=(f.current?f.current:(t=o.current,(n=t.style.transform.match(/translateX\(([-0-9.]+)%\)/))&&n[1]?parseFloat(n[1]):0))-.4,r=e<=-100?100:e;o.current.style.transform="translateX(".concat(r,"%)"),f.current=r}var t,n;l.current=requestAnimationFrame(A)},[f]);function x(){var e,r=p.current&&new Uint8Array(p.current.frequencyBinCount);r&&(null===(e=p.current)||void 0===e||e.getByteFrequencyData(r));var t=r&&Object.values(r)||[];m.recorder.setFrequency(t[0]/255),requestAnimationFrame(x)}return e.useEffect(function(){if(s){var e=new AudioContext;p.current=e.createAnalyser(),p.current.fftSize=32,(s&&e.createMediaStreamSource(s)).connect(p.current),requestAnimationFrame(x)}},[s]),e.useEffect(function(){return i&&(l.current=requestAnimationFrame(A)),function(){l.current&&cancelAnimationFrame(l.current)}},[i]),e.useEffect(function(){(null==o?void 0:o.current)&&q(!0)},[]),a.default.createElement("div",{id:"".concat(c),style:{transform:"translateX(".concat(100*c,"%)")},className:"pi-absolute pi-flex pi-w-fit pi-h-6 pi-gap-1 pi-items-center pi-px-0.5",ref:o},y&&a.default.createElement(a.default.Fragment,null,Array.from(Array(55).keys()).map(function(e,t){return a.default.createElement(r.Bar,{key:t,visibleContainer:(null==d?void 0:d.current)||null})})))};
 //# sourceMappingURL=BarsGroup.js.map

package/dist/components/RecorderView/BarsGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"BarsGroup.js","sources":["../../../src/components/RecorderView/BarsGroup.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useEffect, useRef, useCallback, useState } from 'react'\nimport { Bar } from './Bar'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { Dispatch, RootState } from '../../store'\n\n// The number in percent of the width of the group bars\n// ...by which the leftward transaction occurs\n// ...so it defines the speed of the animation\nconst BARS_ANIMATION_SPEED: number = 0.4\n// The number of bars to be shown for for every group\n// ...it defines the lenght of every group\nconst BARS_COUNT: number = 55\n// A value that rapresents the window size in samples\n// ...that is used when performing a fast fourier transform\n// ...to get frequency domain data\n// ...a higher number result in more details in frequency and fewer in amplitude\nconst AUDIO_FFT_VALUE: number = 32\n\nfunction getTranslateXPercent(element: HTMLDivElement) {\n  const transformValue = element.style.transform\n  const translateXMatch = transformValue.match(/translateX\\(([-0-9.]+)%\\)/)\n  if (translateXMatch && translateXMatch[1]) {\n    return parseFloat(translateXMatch[1])\n  }\n  return 0\n}\n\nexport const BarsGroup: FC<BarsGroupProps> = ({ index, startAnimation, audioStream }) => {\n  const barsContainerRef = useRef<HTMLDivElement>(null)\n  const animationRequestRef = useRef<number>(0)\n  const lastTranslateRef = useRef<number>(0)\n  const visibleContainerRef = useSelector((state: RootState) => state.recorder.visibleContainerRef)\n  const dispatch = useDispatch<Dispatch>()\n  const analyser = useRef<AnalyserNode | null>(null)\n  const [showBars, setShowBars] = useState<boolean>()\n\n  // The animation of the bars groups\n  const barsGroupAnimation = useCallback(() => {\n    if (barsContainerRef.current) {\n      // Retrieve the last translate value\n      const lastTranslateValue = lastTranslateRef.current\n        ? lastTranslateRef.current\n        : getTranslateXPercent(barsContainerRef.current)\n      // Calculate the new translate value\n      const newTranslateValue = lastTranslateValue - BARS_ANIMATION_SPEED\n      const finalTranslateValue = newTranslateValue <= -100 ? 100 : newTranslateValue\n      barsContainerRef.current.style.transform = `translateX(${finalTranslateValue}%)`\n      // Update the translate ref value\n      lastTranslateRef.current = finalTranslateValue\n    }\n    animationRequestRef.current = requestAnimationFrame(barsGroupAnimation)\n  }, [lastTranslateRef])\n\n  function retrieveFrequency() {\n    const frequencyData = analyser.current && new Uint8Array(analyser.current.frequencyBinCount)\n    frequencyData && analyser.current?.getByteFrequencyData(frequencyData)\n    const values = (frequencyData && Object.values(frequencyData)) || []\n    // Save the higher frequency to recorder state\n    // ...using a number from 0 to 1\n    dispatch.recorder.setFrequency(values[0] / 255)\n    requestAnimationFrame(retrieveFrequency)\n  }\n\n  // Retrieve frequency\n  useEffect(() => {\n    if (audioStream) {\n      const context = new AudioContext()\n      analyser.current = context.createAnalyser()\n      analyser.current.fftSize = AUDIO_FFT_VALUE\n      // Connect the source to the analyser\n      const source = audioStream && context.createMediaStreamSource(audioStream)\n      // Connect the audio source to the analyser\n      source.connect(analyser.current)\n      // Request the animation to perform\n      requestAnimationFrame(retrieveFrequency)\n    }\n  }, [audioStream])\n\n  // Manage animation start\n  useEffect(() => {\n    if (startAnimation) {\n      animationRequestRef.current = requestAnimationFrame(barsGroupAnimation)\n    }\n    return () => {\n      animationRequestRef.current && cancelAnimationFrame(animationRequestRef.current)\n    }\n  }, [startAnimation])\n\n  useEffect(() => {\n    if (barsContainerRef?.current) {\n      setShowBars(true)\n    }\n  }, [])\n\n  return (\n    <div\n      id={`${index}`}\n      style={{\n        transform: `translateX(${100 * index}%)`,\n      }}\n      className='pi-absolute pi-flex pi-w-fit pi-h-6 pi-gap-1 pi-items-center pi-px-0.5'\n      ref={barsContainerRef}\n    >\n      {/* Create a custom number of bars */}\n      {showBars && (\n        <>\n          {Array.from(Array(BARS_COUNT).keys()).map((_, i) => (\n            <Bar key={i} visibleContainer={visibleContainerRef?.current || null} />\n          ))}\n        </>\n      )}\n    </div>\n  )\n}\n\ninterface BarsGroupProps {\n  index: number\n  startAnimation: boolean\n  audioStream: MediaStream | null\n}\n"],"names":["_a","index","startAnimation","audioStream","barsContainerRef","useRef","animationRequestRef","lastTranslateRef","visibleContainerRef","useSelector","state","recorder","dispatch","useDispatch","analyser","_b","useState","showBars","setShowBars","barsGroupAnimation","useCallback","current","newTranslateValue","element","translateXMatch","style","transform","match","parseFloat","finalTranslateValue","concat","requestAnimationFrame","retrieveFrequency","frequencyData","Uint8Array","frequencyBinCount","getByteFrequencyData","values","Object","setFrequency","useEffect","context","AudioContext","createAnalyser","fftSize","createMediaStreamSource","connect","cancelAnimationFrame","React","id","className","ref","createElement","Fragment","Array","from","keys","map","_","i","Bar","key","visibleContainer"],"mappings":"wZA8B6C,SAACA,GAAE,IAAAC,UAAOC,EAAcF,EAAAE,eAAEC,EAAWH,EAAAG,YAC1EC,EAAmBC,SAAuB,MAC1CC,EAAsBD,SAAe,GACrCE,EAAmBF,SAAe,GAClCG,EAAsBC,eAAY,SAACC,GAAqB,OAAAA,EAAMC,SAASH,mBAAf,IACxDI,EAAWC,EAAAA,cACXC,EAAWT,SAA4B,MACvCU,EAA0BC,aAAzBC,EAAQF,EAAA,GAAEG,EAAWH,EAAA,GAGtBI,EAAqBC,EAAAA,aAAY,WACrC,GAAIhB,EAAiBiB,QAAS,CAE5B,IAIMC,GAJqBf,EAAiBc,QACxCd,EAAiBc,SAvBGE,EAwBCnB,EAAiBiB,SAtBxCG,EADiBD,EAAQE,MAAMC,UACEC,MAAM,+BACtBH,EAAgB,GAC9BI,WAAWJ,EAAgB,IAE7B,IAhB4B,GAqCzBK,EAAsBP,IAAsB,IAAM,IAAMA,EAC9DlB,EAAiBiB,QAAQI,MAAMC,UAAY,cAAAI,OAAcD,EAAmB,MAE5EtB,EAAiBc,QAAUQ,CAC5B,CA/BL,IAA8BN,EAEtBC,EA8BJlB,EAAoBe,QAAUU,sBAAsBZ,EACtD,GAAG,CAACZ,IAEJ,SAASyB,UACDC,EAAgBnB,EAASO,SAAW,IAAIa,WAAWpB,EAASO,QAAQc,mBAC1EF,IAAmC,QAAlBjC,EAAAc,EAASO,eAAS,IAAArB,GAAAA,EAAAoC,qBAAqBH,IACxD,IAAMI,EAAUJ,GAAiBK,OAAOD,OAAOJ,IAAmB,GAGlErB,EAASD,SAAS4B,aAAaF,EAAO,GAAK,KAC3CN,sBAAsBC,EACvB,CAiCD,OA9BAQ,EAAAA,WAAU,WACR,GAAIrC,EAAa,CACf,IAAMsC,EAAU,IAAIC,aACpB5B,EAASO,QAAUoB,EAAQE,iBAC3B7B,EAASO,QAAQuB,QApDS,IAsDXzC,GAAesC,EAAQI,wBAAwB1C,IAEvD2C,QAAQhC,EAASO,SAExBU,sBAAsBC,EACvB,CACH,GAAG,CAAC7B,IAGJqC,EAAAA,WAAU,WAIR,OAHItC,IACFI,EAAoBe,QAAUU,sBAAsBZ,IAE/C,WACLb,EAAoBe,SAAW0B,qBAAqBzC,EAAoBe,QAC1E,CACF,GAAG,CAACnB,IAEJsC,EAAAA,WAAU,YACJpC,eAAAA,EAAkBiB,UACpBH,GAAY,EAEf,GAAE,IAGD8B,+BACEC,GAAI,UAAGhD,GACPwB,MAAO,CACLC,UAAW,cAAAI,OAAc,IAAM7B,EAAS,OAE1CiD,UAAU,yEACVC,IAAK/C,GAGJa,GACC+B,EAAAA,QAAAI,cAAAJ,UAAAK,SAAA,KACGC,MAAMC,KAAKD,MA/FK,IA+FaE,QAAQC,KAAI,SAACC,EAAGC,GAAM,OAClDX,EAAA,QAAAI,cAACQ,EAAAA,IAAG,CAACC,IAAKF,EAAGG,kBAAkBtD,aAAA,EAAAA,EAAqBa,UAAW,MADb,KAO9D"}
+{"version":3,"file":"BarsGroup.js","sources":["../../../src/components/RecorderView/BarsGroup.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useEffect, useRef, useCallback, useState } from 'react'\nimport { Bar } from './Bar'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { Dispatch, RootState } from '../../store'\n\n// The number in percent of the width of the group bars\n// ...by which the leftward transaction occurs\n// ...so it defines the speed of the animation\nconst BARS_ANIMATION_SPEED: number = 0.4\n// The number of bars to be shown for for every group\n// ...it defines the lenght of every group\nconst BARS_COUNT: number = 55\n// A value that rapresents the window size in samples\n// ...that is used when performing a fast fourier transform\n// ...to get frequency domain data\n// ...a higher number result in more details in frequency and fewer in amplitude\nconst AUDIO_FFT_VALUE: number = 32\n\nfunction getTranslateXPercent(element: HTMLDivElement) {\n  const transformValue = element.style.transform\n  const translateXMatch = transformValue.match(/translateX\\(([-0-9.]+)%\\)/)\n  if (translateXMatch && translateXMatch[1]) {\n    return parseFloat(translateXMatch[1])\n  }\n  return 0\n}\n\nexport const BarsGroup: FC<BarsGroupProps> = ({ index, startAnimation, audioStream }) => {\n  const barsContainerRef = useRef<HTMLDivElement>(null)\n  const animationRequestRef = useRef<number>(0)\n  const lastTranslateRef = useRef<number>(0)\n  const visibleContainerRef = useSelector((state: RootState) => state.recorder.visibleContainerRef)\n  const dispatch = useDispatch<Dispatch>()\n  const analyser = useRef<AnalyserNode | null>(null)\n  const [showBars, setShowBars] = useState<boolean>()\n\n  // The animation of the bars groups\n  const barsGroupAnimation = useCallback(() => {\n    if (barsContainerRef.current) {\n      // Retrieve the last translate value\n      const lastTranslateValue = lastTranslateRef.current\n        ? lastTranslateRef.current\n        : getTranslateXPercent(barsContainerRef.current)\n      // Calculate the new translate value\n      const newTranslateValue = lastTranslateValue - BARS_ANIMATION_SPEED\n      const finalTranslateValue = newTranslateValue <= -100 ? 100 : newTranslateValue\n      barsContainerRef.current.style.transform = `translateX(${finalTranslateValue}%)`\n      // Update the translate ref value\n      lastTranslateRef.current = finalTranslateValue\n    }\n    animationRequestRef.current = requestAnimationFrame(barsGroupAnimation)\n  }, [lastTranslateRef])\n\n  function retrieveFrequency() {\n    const frequencyData = analyser.current && new Uint8Array(analyser.current.frequencyBinCount)\n    frequencyData && analyser.current?.getByteFrequencyData(frequencyData)\n    const values = (frequencyData && Object.values(frequencyData)) || []\n    // Save the higher frequency to recorder state\n    // ...using a number from 0 to 1\n    dispatch.recorder.setFrequency(values[0] / 255)\n    requestAnimationFrame(retrieveFrequency)\n  }\n\n  // Retrieve frequency\n  useEffect(() => {\n    if (audioStream) {\n      const context = new AudioContext()\n      analyser.current = context.createAnalyser()\n      analyser.current.fftSize = AUDIO_FFT_VALUE\n      // Connect the source to the analyser\n      const source = audioStream && context.createMediaStreamSource(audioStream)\n      // Connect the audio source to the analyser\n      source.connect(analyser.current)\n      // Request the animation to perform\n      requestAnimationFrame(retrieveFrequency)\n    }\n  }, [audioStream])\n\n  // Manage animation start\n  useEffect(() => {\n    if (startAnimation) {\n      animationRequestRef.current = requestAnimationFrame(barsGroupAnimation)\n    }\n    return () => {\n      animationRequestRef.current && cancelAnimationFrame(animationRequestRef.current)\n    }\n  }, [startAnimation])\n\n  useEffect(() => {\n    if (barsContainerRef?.current) {\n      setShowBars(true)\n    }\n  }, [])\n\n  return (\n    <div\n      id={`${index}`}\n      style={{\n        transform: `translateX(${100 * index}%)`,\n      }}\n      className='pi-absolute pi-flex pi-w-fit pi-h-6 pi-gap-1 pi-items-center pi-px-0.5'\n      ref={barsContainerRef}\n    >\n      {/* Create a custom number of bars */}\n      {showBars && (\n        <>\n          {Array.from(Array(BARS_COUNT).keys()).map((_, i) => (\n            <Bar key={i} visibleContainer={visibleContainerRef?.current || null} />\n          ))}\n        </>\n      )}\n    </div>\n  )\n}\n\ninterface BarsGroupProps {\n  index: number\n  startAnimation: boolean\n  audioStream: MediaStream | null\n}\n"],"names":["_a","index","startAnimation","audioStream","barsContainerRef","useRef","animationRequestRef","lastTranslateRef","visibleContainerRef","useSelector","state","recorder","dispatch","useDispatch","analyser","_b","useState","showBars","setShowBars","barsGroupAnimation","useCallback","current","newTranslateValue","element","translateXMatch","style","transform","match","parseFloat","finalTranslateValue","concat","requestAnimationFrame","retrieveFrequency","frequencyData","Uint8Array","frequencyBinCount","getByteFrequencyData","values","Object","setFrequency","useEffect","context","AudioContext","createAnalyser","fftSize","createMediaStreamSource","connect","cancelAnimationFrame","React","id","className","ref","createElement","Fragment","Array","from","keys","map","_","i","Bar","key","visibleContainer"],"mappings":"wZA8B6C,SAACA,GAAE,IAAAC,UAAOC,EAAcF,EAAAE,eAAEC,EAAWH,EAAAG,YAC1EC,EAAmBC,SAAuB,MAC1CC,EAAsBD,SAAe,GACrCE,EAAmBF,SAAe,GAClCG,EAAsBC,cAAY,SAACC,GAAqB,OAAAA,EAAMC,SAASH,mBAAf,GACxDI,EAAWC,EAAAA,cACXC,EAAWT,SAA4B,MACvCU,EAA0BC,aAAzBC,EAAQF,EAAA,GAAEG,EAAWH,EAAA,GAGtBI,EAAqBC,EAAAA,YAAY,WACrC,GAAIhB,EAAiBiB,QAAS,CAE5B,IAIMC,GAJqBf,EAAiBc,QACxCd,EAAiBc,SAvBGE,EAwBCnB,EAAiBiB,SAtBxCG,EADiBD,EAAQE,MAAMC,UACEC,MAAM,+BACtBH,EAAgB,GAC9BI,WAAWJ,EAAgB,IAE7B,IAhB4B,GAqCzBK,EAAsBP,IAAsB,IAAM,IAAMA,EAC9DlB,EAAiBiB,QAAQI,MAAMC,UAAY,cAAAI,OAAcD,EAAmB,MAE5EtB,EAAiBc,QAAUQ,CAC5B,CA/BL,IAA8BN,EAEtBC,EA8BJlB,EAAoBe,QAAUU,sBAAsBZ,EACtD,EAAG,CAACZ,IAEJ,SAASyB,UACDC,EAAgBnB,EAASO,SAAW,IAAIa,WAAWpB,EAASO,QAAQc,mBAC1EF,IAAmC,QAAlBjC,EAAAc,EAASO,eAAS,IAAArB,GAAAA,EAAAoC,qBAAqBH,IACxD,IAAMI,EAAUJ,GAAiBK,OAAOD,OAAOJ,IAAmB,GAGlErB,EAASD,SAAS4B,aAAaF,EAAO,GAAK,KAC3CN,sBAAsBC,EACvB,CAiCD,OA9BAQ,EAAAA,UAAU,WACR,GAAIrC,EAAa,CACf,IAAMsC,EAAU,IAAIC,aACpB5B,EAASO,QAAUoB,EAAQE,iBAC3B7B,EAASO,QAAQuB,QApDS,IAsDXzC,GAAesC,EAAQI,wBAAwB1C,IAEvD2C,QAAQhC,EAASO,SAExBU,sBAAsBC,EACvB,CACH,EAAG,CAAC7B,IAGJqC,EAAAA,UAAU,WAIR,OAHItC,IACFI,EAAoBe,QAAUU,sBAAsBZ,IAE/C,WACLb,EAAoBe,SAAW0B,qBAAqBzC,EAAoBe,QAC1E,CACF,EAAG,CAACnB,IAEJsC,EAAAA,UAAU,YACJpC,eAAAA,EAAkBiB,UACpBH,GAAY,EAEf,EAAE,IAGD8B,+BACEC,GAAI,UAAGhD,GACPwB,MAAO,CACLC,UAAW,cAAAI,OAAc,IAAM7B,EAAS,OAE1CiD,UAAU,yEACVC,IAAK/C,GAGJa,GACC+B,EAAAA,QAAAI,cAAAJ,UAAAK,SAAA,KACGC,MAAMC,KAAKD,MA/FK,IA+FaE,QAAQC,IAAI,SAACC,EAAGC,GAAM,OAClDX,EAAA,QAAAI,cAACQ,EAAAA,IAAG,CAACC,IAAKF,EAAGG,kBAAkBtD,aAAA,EAAAA,EAAqBa,UAAW,MADb,IAO9D"}

package/dist/components/RecorderView/Timer.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var r=require("../../node_modules/react-moment/dist/index.js"),t=require("../../node_modules/react-redux/es/hooks/useSelector.js"),u=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=o(e),d=e.memo((function(){var e=t.useSelector((function(e){return{recording:e.recorder.recording,startTime:e.recorder.startTime,currentTime:e.recorder.currentTime}})),o=e.startTime,d=e.currentTime,i=e.recording,s=u.useDispatch();return n.default.createElement(n.default.Fragment,null,o&&i?n.default.createElement(r.default,{date:o,interval:1e3,format:"hh:mm:ss",trim:!1,onChange:function(e){s.recorder.setCurrentTime(e)},unix:!0,durationFromNow:!0}):d)}));exports.default=d;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var r=require("../../node_modules/react-moment/dist/index.js"),t=require("../../node_modules/react-redux/es/hooks/useSelector.js"),u=require("../../node_modules/react-redux/es/hooks/useDispatch.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=o(e),d=e.memo(function(){var e=t.useSelector(function(e){return{recording:e.recorder.recording,startTime:e.recorder.startTime,currentTime:e.recorder.currentTime}}),o=e.startTime,d=e.currentTime,i=e.recording,s=u.useDispatch();return n.default.createElement(n.default.Fragment,null,o&&i?n.default.createElement(r.default,{date:o,interval:1e3,format:"hh:mm:ss",trim:!1,onChange:function(e){s.recorder.setCurrentTime(e)},unix:!0,durationFromNow:!0}):d)});exports.default=d;
 //# sourceMappingURL=Timer.js.map

package/dist/components/RecorderView/Timer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Timer.js","sources":["../../../src/components/RecorderView/Timer.tsx"],"sourcesContent":["//\n// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n//\n\nimport React, { memo, FC } from 'react'\nimport { useSelector, useDispatch } from 'react-redux'\nimport Moment from 'react-moment'\nimport { RootState, Dispatch } from '../../store'\n\nconst Timer: FC<TimerProps> = () => {\n  const { startTime, currentTime, recording } = useSelector((state: RootState) => ({\n    recording: state.recorder.recording,\n    startTime: state.recorder.startTime,\n    currentTime: state.recorder.currentTime,\n  }))\n\n  const dispatch = useDispatch<Dispatch>()\n\n  function handleTimerChanged(time: string) {\n    dispatch.recorder.setCurrentTime(time)\n  }\n\n  return (\n    <>\n      {startTime && recording ? (\n        <Moment\n          date={startTime}\n          interval={1000}\n          format='hh:mm:ss'\n          trim={false}\n          onChange={handleTimerChanged}\n          unix\n          durationFromNow\n        />\n      ) : (\n        currentTime\n      )}\n    </>\n  )\n}\n\nexport default memo(Timer)\n\ninterface TimerProps {}\n"],"names":["memo","_a","useSelector","state","recording","recorder","startTime","currentTime","dispatch","useDispatch","React","createElement","Moment","date","interval","format","trim","onChange","time","setCurrentTime","unix","durationFromNow"],"mappings":"2aA0CeA,EAAAA,EAAAA,MAhCe,WACtB,IAAAC,EAAwCC,EAAAA,aAAY,SAACC,GAAqB,MAAC,CAC/EC,UAAWD,EAAME,SAASD,UAC1BE,UAAWH,EAAME,SAASC,UAC1BC,YAAaJ,EAAME,SAASE,gBAHtBD,EAASL,EAAAK,UAAEC,EAAWN,EAAAM,YAAEH,EAASH,EAAAG,UAMnCI,EAAWC,EAAAA,cAMjB,OACEC,gDACGJ,GAAaF,EACZM,EAAA,QAAAC,cAACC,EAAM,QACL,CAAAC,KAAMP,EACNQ,SAAU,IACVC,OAAO,WACPC,MAAM,EACNC,SAZR,SAA4BC,GAC1BV,EAASH,SAASc,eAAeD,EAClC,EAWOE,MAAI,EACJC,iBACA,IAEF,EAIR"}
+{"version":3,"file":"Timer.js","sources":["../../../src/components/RecorderView/Timer.tsx"],"sourcesContent":["//\n// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n//\n\nimport React, { memo, FC } from 'react'\nimport { useSelector, useDispatch } from 'react-redux'\nimport Moment from 'react-moment'\nimport { RootState, Dispatch } from '../../store'\n\nconst Timer: FC<TimerProps> = () => {\n  const { startTime, currentTime, recording } = useSelector((state: RootState) => ({\n    recording: state.recorder.recording,\n    startTime: state.recorder.startTime,\n    currentTime: state.recorder.currentTime,\n  }))\n\n  const dispatch = useDispatch<Dispatch>()\n\n  function handleTimerChanged(time: string) {\n    dispatch.recorder.setCurrentTime(time)\n  }\n\n  return (\n    <>\n      {startTime && recording ? (\n        <Moment\n          date={startTime}\n          interval={1000}\n          format='hh:mm:ss'\n          trim={false}\n          onChange={handleTimerChanged}\n          unix\n          durationFromNow\n        />\n      ) : (\n        currentTime\n      )}\n    </>\n  )\n}\n\nexport default memo(Timer)\n\ninterface TimerProps {}\n"],"names":["memo","_a","useSelector","state","recording","recorder","startTime","currentTime","dispatch","useDispatch","React","createElement","Moment","date","interval","format","trim","onChange","time","setCurrentTime","unix","durationFromNow"],"mappings":"2aA0CeA,EAAAA,EAAAA,KAhCe,WACtB,IAAAC,EAAwCC,EAAAA,YAAY,SAACC,GAAqB,MAAC,CAC/EC,UAAWD,EAAME,SAASD,UAC1BE,UAAWH,EAAME,SAASC,UAC1BC,YAAaJ,EAAME,SAASE,eAHtBD,EAASL,EAAAK,UAAEC,EAAWN,EAAAM,YAAEH,EAASH,EAAAG,UAMnCI,EAAWC,EAAAA,cAMjB,OACEC,gDACGJ,GAAaF,EACZM,EAAA,QAAAC,cAACC,EAAM,QACL,CAAAC,KAAMP,EACNQ,SAAU,IACVC,OAAO,WACPC,MAAM,EACNC,SAZR,SAA4BC,GAC1BV,EAASH,SAASc,eAAeD,EAClC,EAWOE,MAAI,EACJC,iBACA,IAEF,EAIR"}

package/dist/components/RecorderView/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react");require("../../node_modules/react-redux/es/index.js");var r=require("./Actions.js"),i=require("./BarsGroup.js"),a=require("../AudioPlayerView/Progress.js"),n=require("../../lib/phone/audio.js"),s=require("../../node_modules/webm-duration-fix/lib/index.js"),l=require("./Timer.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var o=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var u=require("../Button.js"),d=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),c=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js");require("../../store/index.js");var f=require("../../node_modules/react-redux/es/hooks/useSelector.js"),m=require("../../node_modules/react-redux/es/hooks/useDispatch.js"),p=require("../../node_modules/react-redux/es/utils/shallowEqual.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=x(t),w="audio/webm";exports.RecorderView=function(){var x=f.useSelector((function(e){return e.island})).isOpen,b=f.useSelector((function(e){return e.player})).audioPlayerPlaying,h=t.useRef(null),g=t.useRef(null),j=t.useRef([]),y=m.useDispatch(),E=f.useSelector((function(e){return e.webrtc.localAudioStream})),q=f.useSelector((function(e){return{recording:e.recorder.recording,recorded:e.recorder.recorded,waiting:e.recorder.waiting}}),p.default),_=q.recording,N=q.recorded,k=q.waiting;function A(e){j.current.push(e.data)}function P(){return e.__awaiter(this,void 0,void 0,(function(){var t,r;return e.__generator(this,(function(e){switch(e.label){case 0:return[4,s.default(new Blob(j.current,{type:w}))];case 1:return t=e.sent(),r=URL.createObjectURL(t),n.updateAudioPlayerSource(r),[2]}}))}))}t.useEffect((function(){(null==E?void 0:E.active)&&_&&(g.current=new MediaRecorder(E,{mimeType:w}),g.current.ondataavailable=A,g.current.onstop=P,g.current.start())}),[null==E?void 0:E.active,_]),t.useEffect((function(){var e;N&&(j.current=[],null===(e=g.current)||void 0===e||e.stop())}),[N]),t.useEffect((function(){return y.recorder.setVisibleContainerRef(h),function(){y.recorder.reset()}}),[]);var S=o.useTranslation().t;return v.default.createElement(v.default.Fragment,null,x?v.default.createElement(v.default.Fragment,null," ",v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-between pi-text-gray-900 dark:pi-text-gray-50"},v.default.createElement("h1",{className:"pi-text-lg pi-font-medium pi-leading-7"},S("Common.Record message")),v.default.createElement(u.Button,{onClick:function(){y.island.resetPlayerClose()},variant:"transparentSettings","data-tooltip-id":"tooltip-close-settings","data-tooltip-content":S("Common.Close")||""},v.default.createElement(d.FontAwesomeIcon,{icon:c.faXmark,className:"pi-w-5 pi-h-5"}))),v.default.createElement("div",{className:"pi-pt-4"},v.default.createElement("div",{className:"".concat(!_||k||b?"pi-mb-3":""," pi-flex pi-w-full pi-justify-center pi-items-center")},v.default.createElement("div",{className:"pi-font-medium pi-text-4xl pi-w-fit pi-h-fit dark:pi-text-white"},v.default.createElement(l.default,null))),v.default.createElement("div",{className:"pi-relative pi-w-full pi-justify-center pi-overflow-hidden pi-flex pi-items-center",ref:h},N?v.default.createElement(a.Progress,null):_&&!k?v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-between pi-w-full pi-pb-3 pi-overflow-hidden"},v.default.createElement(u.Button,{variant:"transparent",disabled:!0,className:"pi-flex pi-flex-none"},v.default.createElement(d.FontAwesomeIcon,{icon:c.faPlay,className:"pi-h-4 pi-w-4 pi-text-gray-700 dark:pi-text-gray-200"})),v.default.createElement("div",{className:"pi-relative pi-overflow-hidden pi-flex pi-flex-grow pi-justify-center pi-h-4"},Array.from({length:2}).map((function(e,t){return v.default.createElement(i.BarsGroup,{key:t,index:t,startAnimation:_,audioStream:E})}))),v.default.createElement(u.Button,{variant:"transparent",disabled:!0,className:"pi-flex pi-flex-none"},v.default.createElement(d.FontAwesomeIcon,{icon:c.faTrash,className:"pi-h-4 pi-w-4 pi-text-gray-700 dark:pi-text-gray-200"}))):_&&k?v.default.createElement("div",{className:"pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white pi-pb-7"},S("Common.Start recording message after")):v.default.createElement("div",{className:"pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white pi-pb-7"},S("Common.Start recording message before")))),v.default.createElement(r.Actions,null)):v.default.createElement("div",{className:"pi-font-medium pi-text-base"},"Recorder"))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/tslib/tslib.es6.js"),t=require("react");require("../../node_modules/react-redux/es/index.js");var r=require("./Actions.js"),i=require("./BarsGroup.js"),a=require("../AudioPlayerView/Progress.js"),n=require("../../lib/phone/audio.js"),s=require("../../node_modules/webm-duration-fix/lib/index.js"),l=require("./Timer.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var o=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var u=require("../Button.js"),d=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),c=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js");require("../../store/index.js");var f=require("../../node_modules/react-redux/es/hooks/useSelector.js"),m=require("../../node_modules/react-redux/es/hooks/useDispatch.js"),p=require("../../node_modules/react-redux/es/utils/shallowEqual.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=x(t),w="audio/webm";exports.RecorderView=function(){var x=f.useSelector(function(e){return e.island}).isOpen,b=f.useSelector(function(e){return e.player}).audioPlayerPlaying,h=t.useRef(null),g=t.useRef(null),j=t.useRef([]),y=m.useDispatch(),E=f.useSelector(function(e){return e.webrtc.localAudioStream}),q=f.useSelector(function(e){return{recording:e.recorder.recording,recorded:e.recorder.recorded,waiting:e.recorder.waiting}},p.default),_=q.recording,N=q.recorded,k=q.waiting;function A(e){j.current.push(e.data)}function P(){return e.__awaiter(this,void 0,void 0,function(){var t,r;return e.__generator(this,function(e){switch(e.label){case 0:return[4,s.default(new Blob(j.current,{type:w}))];case 1:return t=e.sent(),r=URL.createObjectURL(t),n.updateAudioPlayerSource(r),[2]}})})}t.useEffect(function(){(null==E?void 0:E.active)&&_&&(g.current=new MediaRecorder(E,{mimeType:w}),g.current.ondataavailable=A,g.current.onstop=P,g.current.start())},[null==E?void 0:E.active,_]),t.useEffect(function(){var e;N&&(j.current=[],null===(e=g.current)||void 0===e||e.stop())},[N]),t.useEffect(function(){return y.recorder.setVisibleContainerRef(h),function(){y.recorder.reset()}},[]);var S=o.useTranslation().t;return v.default.createElement(v.default.Fragment,null,x?v.default.createElement(v.default.Fragment,null," ",v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-between pi-text-gray-900 dark:pi-text-gray-50"},v.default.createElement("h1",{className:"pi-text-lg pi-font-medium pi-leading-7"},S("Common.Record message")),v.default.createElement(u.Button,{onClick:function(){y.island.resetPlayerClose()},variant:"transparentSettings","data-tooltip-id":"tooltip-close-settings","data-tooltip-content":S("Common.Close")||""},v.default.createElement(d.FontAwesomeIcon,{icon:c.faXmark,className:"pi-w-5 pi-h-5"}))),v.default.createElement("div",{className:"pi-pt-4"},v.default.createElement("div",{className:"".concat(!_||k||b?"pi-mb-3":""," pi-flex pi-w-full pi-justify-center pi-items-center")},v.default.createElement("div",{className:"pi-font-medium pi-text-4xl pi-w-fit pi-h-fit dark:pi-text-white"},v.default.createElement(l.default,null))),v.default.createElement("div",{className:"pi-relative pi-w-full pi-justify-center pi-overflow-hidden pi-flex pi-items-center",ref:h},N?v.default.createElement(a.Progress,null):_&&!k?v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-between pi-w-full pi-pb-3 pi-overflow-hidden"},v.default.createElement(u.Button,{variant:"transparent",disabled:!0,className:"pi-flex pi-flex-none"},v.default.createElement(d.FontAwesomeIcon,{icon:c.faPlay,className:"pi-h-4 pi-w-4 pi-text-gray-700 dark:pi-text-gray-200"})),v.default.createElement("div",{className:"pi-relative pi-overflow-hidden pi-flex pi-flex-grow pi-justify-center pi-h-4"},Array.from({length:2}).map(function(e,t){return v.default.createElement(i.BarsGroup,{key:t,index:t,startAnimation:_,audioStream:E})})),v.default.createElement(u.Button,{variant:"transparent",disabled:!0,className:"pi-flex pi-flex-none"},v.default.createElement(d.FontAwesomeIcon,{icon:c.faTrash,className:"pi-h-4 pi-w-4 pi-text-gray-700 dark:pi-text-gray-200"}))):_&&k?v.default.createElement("div",{className:"pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white pi-pb-7"},S("Common.Start recording message after")):v.default.createElement("div",{className:"pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white pi-pb-7"},S("Common.Start recording message before")))),v.default.createElement(r.Actions,null)):v.default.createElement("div",{className:"pi-font-medium pi-text-base"},"Recorder"))};
 //# sourceMappingURL=index.js.map

package/dist/components/RecorderView/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/RecorderView/index.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useState, useRef, useEffect, useCallback, memo } from 'react'\nimport { useDispatch, useSelector, shallowEqual } from 'react-redux'\nimport { Dispatch, RootState } from '../../store'\nimport { Actions } from './Actions'\nimport { BarsGroup } from './BarsGroup'\nimport Progress from '../AudioPlayerView/Progress'\nimport { updateAudioPlayerSource } from '../../lib/phone/audio'\nimport fixWebmDuration from 'webm-duration-fix'\nimport Timer from './Timer'\nimport { useTranslation } from 'react-i18next'\nimport { Button } from '../Button'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faTrash, faXmark, faPlay } from '@fortawesome/free-solid-svg-icons'\nimport { eventDispatch } from '../../utils'\n\n// The number of groups to be created\n// ...the minimun to have this effect is 2\nconst BAR_GROUPS_COUNT = 2\n\n// The mime type of the recorded audio\nconst MIME_TYPE = 'audio/webm'\n\nexport const RecorderView: FC<RecorderViewProps> = () => {\n  const { isOpen } = useSelector((state: RootState) => state.island)\n  const { audioPlayerPlaying } = useSelector((state: RootState) => state.player)\n  const visibleContainerRef = useRef<HTMLDivElement>(null)\n  const recorderRef = useRef<MediaRecorder | null>(null)\n  const mediaChunks = useRef<BlobPart[]>([])\n\n  // Initialize state dispatch\n  const dispatch = useDispatch<Dispatch>()\n\n  // Retrieve the local audio stream from webrtc state\n  const localAudioStream = useSelector((state: RootState) => state.webrtc.localAudioStream)\n\n  // Retrieve the local audio stream from recorder state\n  const { recording, recorded, waiting } = useSelector(\n    (state: RootState) => ({\n      recording: state.recorder.recording,\n      recorded: state.recorder.recorded,\n      waiting: state.recorder.waiting,\n    }),\n    shallowEqual,\n  )\n\n  function handleRecordedMedia(event: BlobEvent) {\n    mediaChunks.current.push(event.data)\n  }\n\n  async function handleRecordingStopped() {\n    const blob = await fixWebmDuration(new Blob(mediaChunks.current, { type: MIME_TYPE }))\n    const audioURL = URL.createObjectURL(blob)\n    // The next function is async\n    updateAudioPlayerSource(audioURL)\n  }\n\n  // Handle and manage audio recording start\n  useEffect(() => {\n    // @ts-ignore\n    if (localAudioStream?.active && recording) {\n      recorderRef.current = new MediaRecorder(localAudioStream, {\n        mimeType: MIME_TYPE,\n      })\n      recorderRef.current.ondataavailable = handleRecordedMedia\n      recorderRef.current.onstop = handleRecordingStopped\n      // Start the media recording\n      recorderRef.current.start()\n    }\n    // @ts-ignore\n  }, [localAudioStream?.active, recording])\n\n  // Handle and manage audio recorded\n  useEffect(() => {\n    if (recorded) {\n      mediaChunks.current = []\n      recorderRef.current?.stop()\n    }\n  }, [recorded])\n\n  // Handle view close and reset state\n  useEffect(() => {\n    // Set visible container reference to recorder state\n    dispatch.recorder.setVisibleContainerRef(visibleContainerRef)\n\n    return () => {\n      dispatch.recorder.reset()\n    }\n  }, [])\n\n  const { t } = useTranslation()\n\n  function playerClose() {\n    if (audioPlayerPlaying) {\n      dispatch.player.stopAudioPlayer()\n      eventDispatch('phone-island-audio-player-close', {})\n    }\n    dispatch.island.resetPlayerClose()\n  }\n\n  function close() {\n    dispatch.island.resetPlayerClose()\n  }\n\n  return (\n    <>\n      {isOpen ? (\n        <>\n          {' '}\n          <div className='pi-flex pi-items-center pi-justify-between pi-text-gray-900 dark:pi-text-gray-50'>\n            <h1 className='pi-text-lg pi-font-medium pi-leading-7'>{t('Common.Record message')}</h1>\n            <Button\n              onClick={() => close()}\n              variant='transparentSettings'\n              data-tooltip-id='tooltip-close-settings'\n              data-tooltip-content={t('Common.Close') || ''}\n            >\n              <FontAwesomeIcon icon={faXmark} className='pi-w-5 pi-h-5' />\n            </Button>\n          </div>\n          <div className='pi-pt-4'>\n            <div\n              className={`${\n                !recording || waiting || audioPlayerPlaying ? 'pi-mb-3' : ''\n              } pi-flex pi-w-full pi-justify-center pi-items-center`}\n            >\n              <div className='pi-font-medium pi-text-4xl pi-w-fit pi-h-fit dark:pi-text-white'>\n                <Timer />\n              </div>\n            </div>\n            {/* Bars animation section  */}\n            <div\n              className={`pi-relative pi-w-full pi-justify-center pi-overflow-hidden pi-flex pi-items-center`}\n              ref={visibleContainerRef}\n            >\n              {recorded ? (\n                <Progress />\n              ) : recording && !waiting ? (\n                <div className='pi-flex pi-items-center pi-justify-between pi-w-full pi-pb-3 pi-overflow-hidden'>\n                  {/* Play button (disabled) on left */}\n                  <Button variant='transparent' disabled className='pi-flex pi-flex-none'>\n                    <FontAwesomeIcon\n                      icon={faPlay}\n                      className='pi-h-4 pi-w-4 pi-text-gray-700 dark:pi-text-gray-200'\n                    />\n                  </Button>\n\n                  {/* Audio visualization in the middle */}\n                  <div className='pi-relative pi-overflow-hidden pi-flex pi-flex-grow pi-justify-center pi-h-4'>\n                    {/* Create a custom numbers of bars groups */}\n                    {Array.from({ length: BAR_GROUPS_COUNT }).map((_, i) => (\n                      <BarsGroup\n                        key={i}\n                        index={i}\n                        startAnimation={recording}\n                        audioStream={localAudioStream}\n                      />\n                    ))}\n                  </div>\n\n                  {/* Trash button (disabled) on right */}\n                  <Button variant='transparent' disabled className='pi-flex pi-flex-none'>\n                    <FontAwesomeIcon\n                      icon={faTrash}\n                      className='pi-h-4 pi-w-4 pi-text-gray-700 dark:pi-text-gray-200'\n                    />\n                  </Button>\n                </div>\n              ) : recording && waiting ? (\n                <div className='pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white pi-pb-7'>\n                  {t('Common.Start recording message after')}\n                </div>\n              ) : (\n                <div className='pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white pi-pb-7'>\n                  {t('Common.Start recording message before')}\n                </div>\n              )}\n            </div>\n          </div>\n          {/* Actions section */}\n          <Actions />\n        </>\n      ) : (\n        <div className='pi-font-medium pi-text-base'>Recorder</div>\n      )}\n    </>\n  )\n}\n\nexport interface RecorderViewProps {}\n"],"names":["MIME_TYPE","isOpen","useSelector","state","island","audioPlayerPlaying","player","visibleContainerRef","useRef","recorderRef","mediaChunks","dispatch","useDispatch","localAudioStream","webrtc","_a","recording","recorder","recorded","waiting","shallowEqual","handleRecordedMedia","event","current","push","data","handleRecordingStopped","fixWebmDuration","Blob","type","blob","sent","audioURL","URL","createObjectURL","updateAudioPlayerSource","useEffect","active","MediaRecorder","mimeType","ondataavailable","onstop","start","stop","setVisibleContainerRef","reset","t","useTranslation","React","createElement","Fragment","className","Button","onClick","resetPlayerClose","variant","FontAwesomeIcon","icon","faXmark","concat","Timer","ref","Progress","disabled","faPlay","Array","from","length","map","_","i","BarsGroup","key","index","startAnimation","audioStream","faTrash","Actions"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/RecorderView/index.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useState, useRef, useEffect, useCallback, memo } from 'react'\nimport { useDispatch, useSelector, shallowEqual } from 'react-redux'\nimport { Dispatch, RootState } from '../../store'\nimport { Actions } from './Actions'\nimport { BarsGroup } from './BarsGroup'\nimport Progress from '../AudioPlayerView/Progress'\nimport { updateAudioPlayerSource } from '../../lib/phone/audio'\nimport fixWebmDuration from 'webm-duration-fix'\nimport Timer from './Timer'\nimport { useTranslation } from 'react-i18next'\nimport { Button } from '../Button'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faTrash, faXmark, faPlay } from '@fortawesome/free-solid-svg-icons'\nimport { eventDispatch } from '../../utils'\n\n// The number of groups to be created\n// ...the minimun to have this effect is 2\nconst BAR_GROUPS_COUNT = 2\n\n// The mime type of the recorded audio\nconst MIME_TYPE = 'audio/webm'\n\nexport const RecorderView: FC<RecorderViewProps> = () => {\n  const { isOpen } = useSelector((state: RootState) => state.island)\n  const { audioPlayerPlaying } = useSelector((state: RootState) => state.player)\n  const visibleContainerRef = useRef<HTMLDivElement>(null)\n  const recorderRef = useRef<MediaRecorder | null>(null)\n  const mediaChunks = useRef<BlobPart[]>([])\n\n  // Initialize state dispatch\n  const dispatch = useDispatch<Dispatch>()\n\n  // Retrieve the local audio stream from webrtc state\n  const localAudioStream = useSelector((state: RootState) => state.webrtc.localAudioStream)\n\n  // Retrieve the local audio stream from recorder state\n  const { recording, recorded, waiting } = useSelector(\n    (state: RootState) => ({\n      recording: state.recorder.recording,\n      recorded: state.recorder.recorded,\n      waiting: state.recorder.waiting,\n    }),\n    shallowEqual,\n  )\n\n  function handleRecordedMedia(event: BlobEvent) {\n    mediaChunks.current.push(event.data)\n  }\n\n  async function handleRecordingStopped() {\n    const blob = await fixWebmDuration(new Blob(mediaChunks.current, { type: MIME_TYPE }))\n    const audioURL = URL.createObjectURL(blob)\n    // The next function is async\n    updateAudioPlayerSource(audioURL)\n  }\n\n  // Handle and manage audio recording start\n  useEffect(() => {\n    // @ts-ignore\n    if (localAudioStream?.active && recording) {\n      recorderRef.current = new MediaRecorder(localAudioStream, {\n        mimeType: MIME_TYPE,\n      })\n      recorderRef.current.ondataavailable = handleRecordedMedia\n      recorderRef.current.onstop = handleRecordingStopped\n      // Start the media recording\n      recorderRef.current.start()\n    }\n    // @ts-ignore\n  }, [localAudioStream?.active, recording])\n\n  // Handle and manage audio recorded\n  useEffect(() => {\n    if (recorded) {\n      mediaChunks.current = []\n      recorderRef.current?.stop()\n    }\n  }, [recorded])\n\n  // Handle view close and reset state\n  useEffect(() => {\n    // Set visible container reference to recorder state\n    dispatch.recorder.setVisibleContainerRef(visibleContainerRef)\n\n    return () => {\n      dispatch.recorder.reset()\n    }\n  }, [])\n\n  const { t } = useTranslation()\n\n  function playerClose() {\n    if (audioPlayerPlaying) {\n      dispatch.player.stopAudioPlayer()\n      eventDispatch('phone-island-audio-player-close', {})\n    }\n    dispatch.island.resetPlayerClose()\n  }\n\n  function close() {\n    dispatch.island.resetPlayerClose()\n  }\n\n  return (\n    <>\n      {isOpen ? (\n        <>\n          {' '}\n          <div className='pi-flex pi-items-center pi-justify-between pi-text-gray-900 dark:pi-text-gray-50'>\n            <h1 className='pi-text-lg pi-font-medium pi-leading-7'>{t('Common.Record message')}</h1>\n            <Button\n              onClick={() => close()}\n              variant='transparentSettings'\n              data-tooltip-id='tooltip-close-settings'\n              data-tooltip-content={t('Common.Close') || ''}\n            >\n              <FontAwesomeIcon icon={faXmark} className='pi-w-5 pi-h-5' />\n            </Button>\n          </div>\n          <div className='pi-pt-4'>\n            <div\n              className={`${\n                !recording || waiting || audioPlayerPlaying ? 'pi-mb-3' : ''\n              } pi-flex pi-w-full pi-justify-center pi-items-center`}\n            >\n              <div className='pi-font-medium pi-text-4xl pi-w-fit pi-h-fit dark:pi-text-white'>\n                <Timer />\n              </div>\n            </div>\n            {/* Bars animation section  */}\n            <div\n              className={`pi-relative pi-w-full pi-justify-center pi-overflow-hidden pi-flex pi-items-center`}\n              ref={visibleContainerRef}\n            >\n              {recorded ? (\n                <Progress />\n              ) : recording && !waiting ? (\n                <div className='pi-flex pi-items-center pi-justify-between pi-w-full pi-pb-3 pi-overflow-hidden'>\n                  {/* Play button (disabled) on left */}\n                  <Button variant='transparent' disabled className='pi-flex pi-flex-none'>\n                    <FontAwesomeIcon\n                      icon={faPlay}\n                      className='pi-h-4 pi-w-4 pi-text-gray-700 dark:pi-text-gray-200'\n                    />\n                  </Button>\n\n                  {/* Audio visualization in the middle */}\n                  <div className='pi-relative pi-overflow-hidden pi-flex pi-flex-grow pi-justify-center pi-h-4'>\n                    {/* Create a custom numbers of bars groups */}\n                    {Array.from({ length: BAR_GROUPS_COUNT }).map((_, i) => (\n                      <BarsGroup\n                        key={i}\n                        index={i}\n                        startAnimation={recording}\n                        audioStream={localAudioStream}\n                      />\n                    ))}\n                  </div>\n\n                  {/* Trash button (disabled) on right */}\n                  <Button variant='transparent' disabled className='pi-flex pi-flex-none'>\n                    <FontAwesomeIcon\n                      icon={faTrash}\n                      className='pi-h-4 pi-w-4 pi-text-gray-700 dark:pi-text-gray-200'\n                    />\n                  </Button>\n                </div>\n              ) : recording && waiting ? (\n                <div className='pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white pi-pb-7'>\n                  {t('Common.Start recording message after')}\n                </div>\n              ) : (\n                <div className='pi-sans pi-text-sm pi-w-fit pi-h-fit dark:pi-text-white pi-pb-7'>\n                  {t('Common.Start recording message before')}\n                </div>\n              )}\n            </div>\n          </div>\n          {/* Actions section */}\n          <Actions />\n        </>\n      ) : (\n        <div className='pi-font-medium pi-text-base'>Recorder</div>\n      )}\n    </>\n  )\n}\n\nexport interface RecorderViewProps {}\n"],"names":["MIME_TYPE","isOpen","useSelector","state","island","audioPlayerPlaying","player","visibleContainerRef","useRef","recorderRef","mediaChunks","dispatch","useDispatch","localAudioStream","webrtc","_a","recording","recorder","recorded","waiting","shallowEqual","handleRecordedMedia","event","current","push","data","handleRecordingStopped","fixWebmDuration","Blob","type","blob","sent","audioURL","URL","createObjectURL","updateAudioPlayerSource","useEffect","active","MediaRecorder","mimeType","ondataavailable","onstop","start","stop","setVisibleContainerRef","reset","t","useTranslation","React","createElement","Fragment","className","Button","onClick","resetPlayerClose","variant","FontAwesomeIcon","icon","faXmark","concat","Timer","ref","Progress","disabled","faPlay","Array","from","length","map","_","i","BarsGroup","key","index","startAnimation","audioStream","faTrash","Actions"],"mappings":"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"}

package/dist/components/RestAPI.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../node_modules/tslib/tslib.es6.js"),t=require("react"),r=require("../services/user.js"),n=require("../lib/avatars/avatars.js");require("../node_modules/react-redux/es/index.js");var s=require("../services/astproxy.js"),a=require("../lib/user/extensions.js"),o=require("../utils/genericFunctions/eventDispatch.js");require("../store/index.js");var c=require("../node_modules/react-redux/es/hooks/useSelector.js");require("../node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js"),require("../node_modules/react-redux/node_modules/react-is/index.js");var u=require("../node_modules/react-redux/es/hooks/useDispatch.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=i(t),d="phone_island_api_mode",f=function(e){try{var t=localStorage.getItem("".concat(d,"_").concat(e));if("new"===t||"legacy"===t)return t}catch(e){console.warn("Failed to read API mode from localStorage:",e)}return"unknown"},h=function(e,t){try{localStorage.setItem("".concat(d,"_").concat(e),t)}catch(e){console.warn("Failed to save API mode to localStorage:",e)}};exports.RestAPI=function(i){var d=i.hostName,p=i.username,_=i.authToken,v=i.children,g=u.useDispatch(),m=c.useSelector((function(e){return e.fetchDefaults})).fetchReady;return t.useEffect((function(){if(_&&d&&p){e.__awaiter(void 0,void 0,void 0,(function(){var t,r;return e.__generator(this,(function(e){switch(e.label){case 0:if("unknown"!==(t=f(p)))return[3,4];e.label=1;case 1:return e.trys.push([1,3,,4]),[4,fetch("https://".concat(d,"/api/user/me"),{headers:{Authorization:"Bearer ".concat(_)}})];case 2:if((r=e.sent()).ok)t="new",h(p,"new");else{if(404!==r.status&&401!==r.status)throw new Error("API test failed with status: ".concat(r.status));t="legacy",h(p,"legacy")}return[3,4];case 3:return e.sent(),t="legacy",h(p,"legacy"),[3,4];case 4:return"new"===t?(g.fetchDefaults.updateFetchBaseURL("https://".concat(d,"/api")),g.fetchDefaults.updateFetchHeaders({Authorization:"Bearer ".concat(_)})):(g.fetchDefaults.updateFetchBaseURL("https://".concat(d,"/webrest")),g.fetchDefaults.updateFetchHeaders({Authorization:"".concat(p,":").concat(_)})),g.fetchDefaults.setFetchReady(),[2]}}))}))}}),[_,d,p]),t.useEffect((function(){m&&(function(){e.__awaiter(this,void 0,void 0,(function(){var t;return e.__generator(this,(function(n){switch(n.label){case 0:return[4,r.getCurrentUserInfo()];case 1:return(t=n.sent())&&(g.currentUser.updateCurrentUser(t),o.eventDispatch("phone-island-user-informations-update",e.__assign({},t)),g.currentUser.setCurrentUserReady(!0),t.settings&&t.settings.open_param_url?g.paramUrl.setOpenParamUrlType(t.settings.open_param_url):g.paramUrl.setOpenParamUrlType("never"),function(){e.__awaiter(this,void 0,void 0,(function(){var t,r;return e.__generator(this,(function(e){switch(e.label){case 0:return[4,s.getAllExtensions()];case 1:return(t=e.sent())&&(g.users.updateExtensions(t),r=a.getExtensionsList(),Object.values(t).filter((function(e){return r.includes(e.exten)})).forEach((function(e){return g.currentUser.updateConversations(e)}))),[2]}}))}))}()),[2]}}))}))}(),function(){e.__awaiter(this,void 0,void 0,(function(){var t;return e.__generator(this,(function(e){switch(e.label){case 0:return[4,r.getAllUsersEndpoints()];case 1:return(t=e.sent())&&g.users.updateEndpoints(t),[2]}}))}))}(),function(){e.__awaiter(this,void 0,void 0,(function(){var t;return e.__generator(this,(function(e){switch(e.label){case 0:return[4,r.getVideoSources()];case 1:return(t=e.sent())&&g.streaming.updateVideoSources(t),[2]}}))}))}(),function(){e.__awaiter(this,void 0,void 0,(function(){var t,n;return e.__generator(this,(function(e){switch(e.label){case 0:return e.trys.push([0,2,,3]),[4,r.getFeatureCodes()];case 1:return(t=e.sent())&&g.currentUser.updateFeatureCodes(t),[3,3];case 2:return n=e.sent(),console.warn("Failed to fetch feature codes:",n),[3,3];case 3:return[2]}}))}))}())}),[m]),t.useLayoutEffect((function(){p&&m&&n.retrieveAvatars(p)}),[m,p]),l.default.createElement(l.default.Fragment,null,m&&v)},exports.getApiMode=function(e){return f(e)},exports.resetApiMode=function(e){try{localStorage.removeItem("".concat(d,"_").concat(e))}catch(e){console.warn("Failed to reset API mode in localStorage:",e)}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../node_modules/tslib/tslib.es6.js"),t=require("react"),r=require("../services/user.js"),n=require("../lib/avatars/avatars.js");require("../node_modules/react-redux/es/index.js");var s=require("../services/astproxy.js"),a=require("../lib/user/extensions.js"),o=require("../utils/genericFunctions/eventDispatch.js");require("../store/index.js");var c=require("../node_modules/react-redux/es/hooks/useSelector.js");require("../node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js"),require("../node_modules/react-redux/node_modules/react-is/index.js");var u=require("../node_modules/react-redux/es/hooks/useDispatch.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=i(t),d="phone_island_api_mode",f=function(e){try{var t=localStorage.getItem("".concat(d,"_").concat(e));if("new"===t||"legacy"===t)return t}catch(e){console.warn("Failed to read API mode from localStorage:",e)}return"unknown"},h=function(e,t){try{localStorage.setItem("".concat(d,"_").concat(e),t)}catch(e){console.warn("Failed to save API mode to localStorage:",e)}};exports.RestAPI=function(i){var d=i.hostName,p=i.username,_=i.authToken,v=i.children,g=u.useDispatch(),m=c.useSelector(function(e){return e.fetchDefaults}).fetchReady;return t.useEffect(function(){if(_&&d&&p){e.__awaiter(void 0,void 0,void 0,function(){var t,r;return e.__generator(this,function(e){switch(e.label){case 0:if("unknown"!==(t=f(p)))return[3,4];e.label=1;case 1:return e.trys.push([1,3,,4]),[4,fetch("https://".concat(d,"/api/user/me"),{headers:{Authorization:"Bearer ".concat(_)}})];case 2:if((r=e.sent()).ok)t="new",h(p,"new");else{if(404!==r.status&&401!==r.status)throw new Error("API test failed with status: ".concat(r.status));t="legacy",h(p,"legacy")}return[3,4];case 3:return e.sent(),t="legacy",h(p,"legacy"),[3,4];case 4:return"new"===t?(g.fetchDefaults.updateFetchBaseURL("https://".concat(d,"/api")),g.fetchDefaults.updateFetchHeaders({Authorization:"Bearer ".concat(_)})):(g.fetchDefaults.updateFetchBaseURL("https://".concat(d,"/webrest")),g.fetchDefaults.updateFetchHeaders({Authorization:"".concat(p,":").concat(_)})),g.fetchDefaults.setFetchReady(),[2]}})})}},[_,d,p]),t.useEffect(function(){m&&(function(){e.__awaiter(this,void 0,void 0,function(){var t;return e.__generator(this,function(n){switch(n.label){case 0:return[4,r.getCurrentUserInfo()];case 1:return(t=n.sent())&&(g.currentUser.updateCurrentUser(t),o.eventDispatch("phone-island-user-informations-update",e.__assign({},t)),g.currentUser.setCurrentUserReady(!0),t.settings&&t.settings.open_param_url?g.paramUrl.setOpenParamUrlType(t.settings.open_param_url):g.paramUrl.setOpenParamUrlType("never"),function(){e.__awaiter(this,void 0,void 0,function(){var t,r;return e.__generator(this,function(e){switch(e.label){case 0:return[4,s.getAllExtensions()];case 1:return(t=e.sent())&&(g.users.updateExtensions(t),r=a.getExtensionsList(),Object.values(t).filter(function(e){return r.includes(e.exten)}).forEach(function(e){return g.currentUser.updateConversations(e)})),[2]}})})}()),[2]}})})}(),function(){e.__awaiter(this,void 0,void 0,function(){var t;return e.__generator(this,function(e){switch(e.label){case 0:return[4,r.getAllUsersEndpoints()];case 1:return(t=e.sent())&&g.users.updateEndpoints(t),[2]}})})}(),function(){e.__awaiter(this,void 0,void 0,function(){var t;return e.__generator(this,function(e){switch(e.label){case 0:return[4,r.getVideoSources()];case 1:return(t=e.sent())&&g.streaming.updateVideoSources(t),[2]}})})}(),function(){e.__awaiter(this,void 0,void 0,function(){var t,n;return e.__generator(this,function(e){switch(e.label){case 0:return e.trys.push([0,2,,3]),[4,r.getFeatureCodes()];case 1:return(t=e.sent())&&g.currentUser.updateFeatureCodes(t),[3,3];case 2:return n=e.sent(),console.warn("Failed to fetch feature codes:",n),[3,3];case 3:return[2]}})})}())},[m]),t.useLayoutEffect(function(){p&&m&&n.retrieveAvatars(p)},[m,p]),l.default.createElement(l.default.Fragment,null,m&&v)},exports.getApiMode=function(e){return f(e)},exports.resetApiMode=function(e){try{localStorage.removeItem("".concat(d,"_").concat(e))}catch(e){console.warn("Failed to reset API mode in localStorage:",e)}};
 //# sourceMappingURL=RestAPI.js.map

package/dist/components/RestAPI.js.map

@@ -1 +1 @@
-{"version":3,"file":"RestAPI.js","sources":["../../src/components/RestAPI.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type ReactNode, type FC, useEffect, useLayoutEffect } from 'react'\nimport { getCurrentUserInfo, getVideoSources, getFeatureCodes } from '../services/user'\nimport { retrieveAvatars } from '../lib/avatars/avatars'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { Dispatch, RootState } from '../store'\nimport { getAllExtensions } from '../services/astproxy'\nimport { getAllUsersEndpoints } from '../services/user'\nimport { getExtensionsList } from '../lib/user/extensions'\nimport { eventDispatch } from '../utils'\n\n// Storage key for API mode\nconst API_MODE_STORAGE_KEY = 'phone_island_api_mode'\n\n// Function to get saved API mode from localStorage\nconst getSavedApiMode = (username: string): 'new' | 'legacy' | 'unknown' => {\n  try {\n    const saved = localStorage.getItem(`${API_MODE_STORAGE_KEY}_${username}`)\n    if (saved === 'new' || saved === 'legacy') {\n      return saved\n    }\n  } catch (error) {\n    console.warn('Failed to read API mode from localStorage:', error)\n  }\n  return 'unknown'\n}\n\n// Function to save API mode to localStorage\nconst saveApiMode = (username: string, mode: 'new' | 'legacy') => {\n  try {\n    localStorage.setItem(`${API_MODE_STORAGE_KEY}_${username}`, mode)\n  } catch (error) {\n    console.warn('Failed to save API mode to localStorage:', error)\n  }\n}\n\n// Export function to get current API mode from localStorage\nexport const getApiMode = (username: string) => getSavedApiMode(username)\n\n// Export function to reset API mode (useful for error recovery)\nexport const resetApiMode = (username: string) => {\n  try {\n    localStorage.removeItem(`${API_MODE_STORAGE_KEY}_${username}`)\n  } catch (error) {\n    console.warn('Failed to reset API mode in localStorage:', error)\n  }\n}\n\nexport const RestAPI: FC<RestAPIProps> = ({ hostName, username, authToken, children }) => {\n  const dispatch = useDispatch<Dispatch>()\n  const { fetchReady } = useSelector((state: RootState) => state.fetchDefaults)\n\n  useEffect(() => {\n    if (authToken && hostName && username) {\n      const initializeAPI = async () => {\n        let currentApiMode = getSavedApiMode(username)\n\n        // If mode is unknown or we need to test, probe the API\n        if (currentApiMode === 'unknown') {\n          // First time or after reset: test new API format\n          try {\n            const response = await fetch(`https://${hostName}/api/user/me`, {\n              headers: {\n                Authorization: `Bearer ${authToken}`,\n              },\n            })\n\n            if (response.ok) {\n              // New API format works\n              currentApiMode = 'new'\n              saveApiMode(username, 'new')\n            } else if (response.status === 404 || response.status === 401) {\n              // Fallback to legacy API format\n              currentApiMode = 'legacy'\n              saveApiMode(username, 'legacy')\n            } else {\n              throw new Error(`API test failed with status: ${response.status}`)\n            }\n          } catch (error) {\n            // Network error or other issues, fallback to legacy API\n            currentApiMode = 'legacy'\n            saveApiMode(username, 'legacy')\n          }\n        }\n\n        // Set the appropriate configuration based on the determined mode\n        if (currentApiMode === 'new') {\n          dispatch.fetchDefaults.updateFetchBaseURL(`https://${hostName}/api`)\n          dispatch.fetchDefaults.updateFetchHeaders({\n            Authorization: `Bearer ${authToken}`,\n          })\n        } else {\n          dispatch.fetchDefaults.updateFetchBaseURL(`https://${hostName}/webrest`)\n          dispatch.fetchDefaults.updateFetchHeaders({\n            Authorization: `${username}:${authToken}`,\n          })\n        }\n\n        dispatch.fetchDefaults.setFetchReady()\n      }\n\n      initializeAPI()\n    }\n  }, [authToken, hostName, username])\n\n  useEffect(() => {\n    // Get all extensions info and set to store\n    async function initExtensions() {\n      const extensions = await getAllExtensions()\n      if (extensions) {\n        dispatch.users.updateExtensions(extensions)\n        // Update the current user conversations\n        const currentUserExtensionsList = getExtensionsList()\n        const extensionsData = Object.values(extensions).filter((extension) =>\n          currentUserExtensionsList.includes(extension.exten),\n        )\n        // Update the user conversations to store\n        extensionsData.forEach((extension) => dispatch.currentUser.updateConversations(extension))\n      }\n    }\n    // Get users info and set to store\n    async function initCurrentUser() {\n      const userInfo = await getCurrentUserInfo()\n      if (userInfo) {\n        dispatch.currentUser.updateCurrentUser(userInfo)\n        eventDispatch('phone-island-user-informations-update', { ...userInfo })\n        dispatch.currentUser.setCurrentUserReady(true)\n        // Update open param URL type if it exists in paramurl store\n        if (userInfo.settings && userInfo.settings.open_param_url) {\n          dispatch.paramUrl.setOpenParamUrlType(userInfo.settings.open_param_url)\n        } else {\n          dispatch.paramUrl.setOpenParamUrlType('never')\n        }\n\n        // Inizialize all extensions after user initialization\n        initExtensions()\n      }\n    }\n    // Get all users and endpoints info and set to store\n    async function initUsersEndpoints() {\n      const usersEndpoints = await getAllUsersEndpoints()\n      if (usersEndpoints) {\n        dispatch.users.updateEndpoints(usersEndpoints)\n      }\n    }\n    // Get all streaming source info and set to store\n    async function initVideoSources() {\n      const videoSources: any = await getVideoSources()\n      if (videoSources) {\n        dispatch.streaming.updateVideoSources(videoSources)\n      }\n    }\n    // Get feature codes and save to store\n    async function initFeatureCodes() {\n      try {\n        const codes = await getFeatureCodes()\n        if (codes) {\n          dispatch.currentUser.updateFeatureCodes(codes)\n        }\n      } catch (error) {\n        console.warn('Failed to fetch feature codes:', error)\n      }\n    }\n    // Call the needed APIs on startup\n    if (fetchReady) {\n      initCurrentUser()\n      initUsersEndpoints()\n      initVideoSources()\n      initFeatureCodes()\n    }\n  }, [fetchReady])\n\n  useLayoutEffect(() => {\n    // Initialize avatars request it or get from storage\n    if (username && fetchReady) {\n      retrieveAvatars(username)\n    }\n  }, [fetchReady, username])\n\n  return <>{fetchReady && children}</>\n}\n\ninterface RestAPIProps {\n  children: ReactNode\n  hostName: string\n  username: string\n  authToken: string\n}\n"],"names":["API_MODE_STORAGE_KEY","getSavedApiMode","username","saved","localStorage","getItem","concat","error","console","warn","saveApiMode","mode","setItem","_a","hostName","authToken","children","dispatch","useDispatch","fetchReady","useSelector","state","fetchDefaults","useEffect","__awaiter","currentApiMode","fetch","headers","Authorization","response","sent","ok","status","Error","updateFetchBaseURL","updateFetchHeaders","setFetchReady","getCurrentUserInfo","userInfo","currentUser","updateCurrentUser","eventDispatch","__assign","setCurrentUserReady","settings","open_param_url","paramUrl","setOpenParamUrlType","getAllExtensions","extensions","users","updateExtensions","currentUserExtensionsList_1","getExtensionsList","Object","values","filter","extension","includes","exten","forEach","updateConversations","initExtensions","initCurrentUser","getAllUsersEndpoints","usersEndpoints","updateEndpoints","initUsersEndpoints","getVideoSources","videoSources","streaming","updateVideoSources","initVideoSources","getFeatureCodes","codes","updateFeatureCodes","error_2","initFeatureCodes","useLayoutEffect","retrieveAvatars","React","createElement","Fragment","removeItem"],"mappings":"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"}
+{"version":3,"file":"RestAPI.js","sources":["../../src/components/RestAPI.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type ReactNode, type FC, useEffect, useLayoutEffect } from 'react'\nimport { getCurrentUserInfo, getVideoSources, getFeatureCodes } from '../services/user'\nimport { retrieveAvatars } from '../lib/avatars/avatars'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { Dispatch, RootState } from '../store'\nimport { getAllExtensions } from '../services/astproxy'\nimport { getAllUsersEndpoints } from '../services/user'\nimport { getExtensionsList } from '../lib/user/extensions'\nimport { eventDispatch } from '../utils'\n\n// Storage key for API mode\nconst API_MODE_STORAGE_KEY = 'phone_island_api_mode'\n\n// Function to get saved API mode from localStorage\nconst getSavedApiMode = (username: string): 'new' | 'legacy' | 'unknown' => {\n  try {\n    const saved = localStorage.getItem(`${API_MODE_STORAGE_KEY}_${username}`)\n    if (saved === 'new' || saved === 'legacy') {\n      return saved\n    }\n  } catch (error) {\n    console.warn('Failed to read API mode from localStorage:', error)\n  }\n  return 'unknown'\n}\n\n// Function to save API mode to localStorage\nconst saveApiMode = (username: string, mode: 'new' | 'legacy') => {\n  try {\n    localStorage.setItem(`${API_MODE_STORAGE_KEY}_${username}`, mode)\n  } catch (error) {\n    console.warn('Failed to save API mode to localStorage:', error)\n  }\n}\n\n// Export function to get current API mode from localStorage\nexport const getApiMode = (username: string) => getSavedApiMode(username)\n\n// Export function to reset API mode (useful for error recovery)\nexport const resetApiMode = (username: string) => {\n  try {\n    localStorage.removeItem(`${API_MODE_STORAGE_KEY}_${username}`)\n  } catch (error) {\n    console.warn('Failed to reset API mode in localStorage:', error)\n  }\n}\n\nexport const RestAPI: FC<RestAPIProps> = ({ hostName, username, authToken, children }) => {\n  const dispatch = useDispatch<Dispatch>()\n  const { fetchReady } = useSelector((state: RootState) => state.fetchDefaults)\n\n  useEffect(() => {\n    if (authToken && hostName && username) {\n      const initializeAPI = async () => {\n        let currentApiMode = getSavedApiMode(username)\n\n        // If mode is unknown or we need to test, probe the API\n        if (currentApiMode === 'unknown') {\n          // First time or after reset: test new API format\n          try {\n            const response = await fetch(`https://${hostName}/api/user/me`, {\n              headers: {\n                Authorization: `Bearer ${authToken}`,\n              },\n            })\n\n            if (response.ok) {\n              // New API format works\n              currentApiMode = 'new'\n              saveApiMode(username, 'new')\n            } else if (response.status === 404 || response.status === 401) {\n              // Fallback to legacy API format\n              currentApiMode = 'legacy'\n              saveApiMode(username, 'legacy')\n            } else {\n              throw new Error(`API test failed with status: ${response.status}`)\n            }\n          } catch (error) {\n            // Network error or other issues, fallback to legacy API\n            currentApiMode = 'legacy'\n            saveApiMode(username, 'legacy')\n          }\n        }\n\n        // Set the appropriate configuration based on the determined mode\n        if (currentApiMode === 'new') {\n          dispatch.fetchDefaults.updateFetchBaseURL(`https://${hostName}/api`)\n          dispatch.fetchDefaults.updateFetchHeaders({\n            Authorization: `Bearer ${authToken}`,\n          })\n        } else {\n          dispatch.fetchDefaults.updateFetchBaseURL(`https://${hostName}/webrest`)\n          dispatch.fetchDefaults.updateFetchHeaders({\n            Authorization: `${username}:${authToken}`,\n          })\n        }\n\n        dispatch.fetchDefaults.setFetchReady()\n      }\n\n      initializeAPI()\n    }\n  }, [authToken, hostName, username])\n\n  useEffect(() => {\n    // Get all extensions info and set to store\n    async function initExtensions() {\n      const extensions = await getAllExtensions()\n      if (extensions) {\n        dispatch.users.updateExtensions(extensions)\n        // Update the current user conversations\n        const currentUserExtensionsList = getExtensionsList()\n        const extensionsData = Object.values(extensions).filter((extension) =>\n          currentUserExtensionsList.includes(extension.exten),\n        )\n        // Update the user conversations to store\n        extensionsData.forEach((extension) => dispatch.currentUser.updateConversations(extension))\n      }\n    }\n    // Get users info and set to store\n    async function initCurrentUser() {\n      const userInfo = await getCurrentUserInfo()\n      if (userInfo) {\n        dispatch.currentUser.updateCurrentUser(userInfo)\n        eventDispatch('phone-island-user-informations-update', { ...userInfo })\n        dispatch.currentUser.setCurrentUserReady(true)\n        // Update open param URL type if it exists in paramurl store\n        if (userInfo.settings && userInfo.settings.open_param_url) {\n          dispatch.paramUrl.setOpenParamUrlType(userInfo.settings.open_param_url)\n        } else {\n          dispatch.paramUrl.setOpenParamUrlType('never')\n        }\n\n        // Inizialize all extensions after user initialization\n        initExtensions()\n      }\n    }\n    // Get all users and endpoints info and set to store\n    async function initUsersEndpoints() {\n      const usersEndpoints = await getAllUsersEndpoints()\n      if (usersEndpoints) {\n        dispatch.users.updateEndpoints(usersEndpoints)\n      }\n    }\n    // Get all streaming source info and set to store\n    async function initVideoSources() {\n      const videoSources: any = await getVideoSources()\n      if (videoSources) {\n        dispatch.streaming.updateVideoSources(videoSources)\n      }\n    }\n    // Get feature codes and save to store\n    async function initFeatureCodes() {\n      try {\n        const codes = await getFeatureCodes()\n        if (codes) {\n          dispatch.currentUser.updateFeatureCodes(codes)\n        }\n      } catch (error) {\n        console.warn('Failed to fetch feature codes:', error)\n      }\n    }\n    // Call the needed APIs on startup\n    if (fetchReady) {\n      initCurrentUser()\n      initUsersEndpoints()\n      initVideoSources()\n      initFeatureCodes()\n    }\n  }, [fetchReady])\n\n  useLayoutEffect(() => {\n    // Initialize avatars request it or get from storage\n    if (username && fetchReady) {\n      retrieveAvatars(username)\n    }\n  }, [fetchReady, username])\n\n  return <>{fetchReady && children}</>\n}\n\ninterface RestAPIProps {\n  children: ReactNode\n  hostName: string\n  username: string\n  authToken: string\n}\n"],"names":["API_MODE_STORAGE_KEY","getSavedApiMode","username","saved","localStorage","getItem","concat","error","console","warn","saveApiMode","mode","setItem","_a","hostName","authToken","children","dispatch","useDispatch","fetchReady","useSelector","state","fetchDefaults","useEffect","__awaiter","currentApiMode","fetch","headers","Authorization","response","sent","ok","status","Error","updateFetchBaseURL","updateFetchHeaders","setFetchReady","getCurrentUserInfo","userInfo","currentUser","updateCurrentUser","eventDispatch","__assign","setCurrentUserReady","settings","open_param_url","paramUrl","setOpenParamUrlType","getAllExtensions","extensions","users","updateExtensions","currentUserExtensionsList_1","getExtensionsList","Object","values","filter","extension","includes","exten","forEach","updateConversations","initExtensions","initCurrentUser","getAllUsersEndpoints","usersEndpoints","updateEndpoints","initUsersEndpoints","getVideoSources","videoSources","streaming","updateVideoSources","initVideoSources","getFeatureCodes","codes","updateFeatureCodes","error_2","initFeatureCodes","useLayoutEffect","retrieveAvatars","React","createElement","Fragment","removeItem"],"mappings":"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"}

package/dist/components/SettingsView/AudioView.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var t=require("../../store/index.js"),r=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),i=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),s=require("../../utils/customHooks/useEventListener.js"),o=require("../../utils/genericFunctions/eventDispatch.js"),l=require("../../utils/genericFunctions/localStorage.js");require("../../node_modules/tslib/tslib.es6.js");var a=require("./SettingsHeader.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var u=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var n=require("../../lib/devices/devices.js"),d=require("../../node_modules/react-redux/es/hooks/useSelector.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=c(e);exports.default=function(){var c=d.useSelector((function(e){return e.player.remoteAudio})),m=u.useTranslation().t,f=t.store.select.mediaDevices.audioOutputDevices(t.store.getState()),v=e.useState(n.getCurrentAudioOutputDeviceId()||null),b=v[0],h=v[1],g=function(e){h(e),null==c||c.current.setSinkId(e).then((function(){console.info("Audio output device switch success!"),l.setJSONItem("phone-island-audio-output-device",{deviceId:e}),o.eventDispatch("phone-island-call-audio-output-switched",{})})).catch((function(e){console.error("Audio output device switch error:",e)}))};s.useEventListener("phone-island-call-audio-output-switch",(function(e){g(e.deviceId)}));var x=e.useState(null),y=x[0],j=x[1];return p.default.createElement("div",{className:"pi-flex pi-flex-col pi-w-full"},p.default.createElement(a.SettingsHeader,{title:m("Settings.Speakers"),tooltipPrefix:"audio"}),p.default.createElement("div",{className:"pi-flex pi-flex-col pi-mt-2 pi-space-y-1 pi-max-h-48 pi-overflow-y-auto pi-scrollbar-thin pi-scrollbar-thumb-gray-400 pi-dark:scrollbar-thumb-gray-400 pi-scrollbar-thumb-rounded-full pi-scrollbar-thumb-opacity-50 dark:pi-scrollbar-track-gray-900 pi-scrollbar-track-gray-200 pi-dark:scrollbar-track-gray-900 pi-scrollbar-track-rounded-full pi-scrollbar-track-opacity-25"},f.map((function(e,t){return p.default.createElement("div",{key:t,className:"pi-flex pi-items-center pi-justify-between pi-px-4 pi-py-3 pi-text-base pi-font-normal pi-leading-6 dark:pi-text-gray-200 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700 dark:pi-bg-gray-950 pi-bg-gray-50 pi-rounded-md pi-cursor-pointer",onClick:function(){return g(null==e?void 0:e.deviceId)},onMouseEnter:function(){return j(null==e?void 0:e.deviceId)},onMouseLeave:function(){return j(null)}},p.default.createElement("div",{className:"pi-flex pi-items-center"},p.default.createElement(r.FontAwesomeIcon,{icon:i.faVolumeHigh,className:"pi-mr-2 pi-w-5 pi-h-5"}),p.default.createElement("span",null,(null==e?void 0:e.label)||"Input device ".concat(t+1))),p.default.createElement("div",{className:"pi-flex pi-items-center"},b===(null==e?void 0:e.deviceId)&&p.default.createElement(r.FontAwesomeIcon,{icon:i.faCheck,className:"".concat(y===(null==e?void 0:e.deviceId)?"pi-text-gray-700 dark:pi-text-gray-200":"pi-text-emerald-700 dark:pi-text-emerald-500"," pi-w-5 pi-h-5")})))}))))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var t=require("../../store/index.js"),r=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),i=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),s=require("../../utils/customHooks/useEventListener.js"),o=require("../../utils/genericFunctions/eventDispatch.js"),l=require("../../utils/genericFunctions/localStorage.js");require("../../node_modules/tslib/tslib.es6.js");var a=require("./SettingsHeader.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var u=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var n=require("../../lib/devices/devices.js"),d=require("../../node_modules/react-redux/es/hooks/useSelector.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=c(e);exports.default=function(){var c=d.useSelector(function(e){return e.player.remoteAudio}),m=u.useTranslation().t,f=t.store.select.mediaDevices.audioOutputDevices(t.store.getState()),v=e.useState(n.getCurrentAudioOutputDeviceId()||null),b=v[0],h=v[1],g=function(e){h(e),null==c||c.current.setSinkId(e).then(function(){console.info("Audio output device switch success!"),l.setJSONItem("phone-island-audio-output-device",{deviceId:e}),o.eventDispatch("phone-island-call-audio-output-switched",{})}).catch(function(e){console.error("Audio output device switch error:",e)})};s.useEventListener("phone-island-call-audio-output-switch",function(e){g(e.deviceId)});var x=e.useState(null),y=x[0],j=x[1];return p.default.createElement("div",{className:"pi-flex pi-flex-col pi-w-full"},p.default.createElement(a.SettingsHeader,{title:m("Settings.Speakers"),tooltipPrefix:"audio"}),p.default.createElement("div",{className:"pi-flex pi-flex-col pi-mt-2 pi-space-y-1 pi-max-h-48 pi-overflow-y-auto pi-scrollbar-thin pi-scrollbar-thumb-gray-400 pi-dark:scrollbar-thumb-gray-400 pi-scrollbar-thumb-rounded-full pi-scrollbar-thumb-opacity-50 dark:pi-scrollbar-track-gray-900 pi-scrollbar-track-gray-200 pi-dark:scrollbar-track-gray-900 pi-scrollbar-track-rounded-full pi-scrollbar-track-opacity-25"},f.map(function(e,t){return p.default.createElement("div",{key:t,className:"pi-flex pi-items-center pi-justify-between pi-px-4 pi-py-3 pi-text-base pi-font-normal pi-leading-6 dark:pi-text-gray-200 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700 dark:pi-bg-gray-950 pi-bg-gray-50 pi-rounded-md pi-cursor-pointer",onClick:function(){return g(null==e?void 0:e.deviceId)},onMouseEnter:function(){return j(null==e?void 0:e.deviceId)},onMouseLeave:function(){return j(null)}},p.default.createElement("div",{className:"pi-flex pi-items-center"},p.default.createElement(r.FontAwesomeIcon,{icon:i.faVolumeHigh,className:"pi-mr-2 pi-w-5 pi-h-5"}),p.default.createElement("span",null,(null==e?void 0:e.label)||"Input device ".concat(t+1))),p.default.createElement("div",{className:"pi-flex pi-items-center"},b===(null==e?void 0:e.deviceId)&&p.default.createElement(r.FontAwesomeIcon,{icon:i.faCheck,className:"".concat(y===(null==e?void 0:e.deviceId)?"pi-text-gray-700 dark:pi-text-gray-200":"pi-text-emerald-700 dark:pi-text-emerald-500"," pi-w-5 pi-h-5")})))})))};
 //# sourceMappingURL=AudioView.js.map

package/dist/components/SettingsView/AudioView.js.map

@@ -1 +1 @@
-{"version":3,"file":"AudioView.js","sources":["../../../src/components/SettingsView/AudioView.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { useState } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState, store } from '../../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faCheck, faVolumeHigh } from '@fortawesome/free-solid-svg-icons'\nimport { eventDispatch, setJSONItem, useEventListener } from '../../utils'\nimport { SettingsHeader } from './SettingsHeader'\nimport { useTranslation } from 'react-i18next'\nimport { getCurrentAudioOutputDeviceId } from '../../lib/devices/devices'\n\nconst AudioView = () => {\n  const remoteAudioElement: any = useSelector((state: RootState) => state.player.remoteAudio)\n\n  const { t } = useTranslation()\n  const audioOutputDevices = store.select.mediaDevices.audioOutputDevices(store.getState())\n  const [selectedAudioOutput, setSelectedAudioOutput] = useState<string | null>(\n    getCurrentAudioOutputDeviceId() || null,\n  )\n  const handleClickAudioOutput = (audioOutputDevice: string) => {\n    setSelectedAudioOutput(audioOutputDevice)\n\n    remoteAudioElement?.current\n      .setSinkId(audioOutputDevice)\n      .then(function () {\n        console.info('Audio output device switch success!')\n        // set device to localstorage\n        setJSONItem('phone-island-audio-output-device', { deviceId: audioOutputDevice })\n\n        // dispatch event\n        eventDispatch('phone-island-call-audio-output-switched', {})\n      })\n      .catch(function (err) {\n        console.error('Audio output device switch error:', err)\n      })\n  }\n  useEventListener('phone-island-call-audio-output-switch', (data: DeviceInputOutputTypes) => {\n    handleClickAudioOutput(data.deviceId)\n  })\n\n  const [hoveredDevice, setHoveredDevice] = useState<string | null>(null)\n\n  return (\n    <div className='pi-flex pi-flex-col pi-w-full'>\n      {/* Title */}\n      <SettingsHeader title={t('Settings.Speakers')} tooltipPrefix='audio' />\n      {/* Audio List */}\n      <div className='pi-flex pi-flex-col pi-mt-2 pi-space-y-1 pi-max-h-48 pi-overflow-y-auto pi-scrollbar-thin pi-scrollbar-thumb-gray-400 pi-dark:scrollbar-thumb-gray-400 pi-scrollbar-thumb-rounded-full pi-scrollbar-thumb-opacity-50 dark:pi-scrollbar-track-gray-900 pi-scrollbar-track-gray-200 pi-dark:scrollbar-track-gray-900 pi-scrollbar-track-rounded-full pi-scrollbar-track-opacity-25'>\n        {audioOutputDevices.map((audioDevice, index) => (\n          <div\n            key={index}\n            className='pi-flex pi-items-center pi-justify-between pi-px-4 pi-py-3 pi-text-base pi-font-normal pi-leading-6 dark:pi-text-gray-200 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700 dark:pi-bg-gray-950 pi-bg-gray-50 pi-rounded-md pi-cursor-pointer'\n            onClick={() => handleClickAudioOutput(audioDevice?.deviceId)}\n            onMouseEnter={() => setHoveredDevice(audioDevice?.deviceId)}\n            onMouseLeave={() => setHoveredDevice(null)}\n          >\n            <div className='pi-flex pi-items-center'>\n              <FontAwesomeIcon icon={faVolumeHigh} className='pi-mr-2 pi-w-5 pi-h-5' />\n              <span>{audioDevice?.label || `Input device ${index + 1}`}</span>\n            </div>\n            <div className='pi-flex pi-items-center'>\n              {selectedAudioOutput === audioDevice?.deviceId && (\n                <FontAwesomeIcon\n                  icon={faCheck}\n                  className={`${\n                    hoveredDevice === audioDevice?.deviceId\n                      ? 'pi-text-gray-700 dark:pi-text-gray-200'\n                      : 'pi-text-emerald-700 dark:pi-text-emerald-500'\n                  } pi-w-5 pi-h-5`}\n                />\n              )}\n            </div>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\ninterface DeviceInputOutputTypes {\n  deviceId: string\n}\n\nexport default AudioView\n"],"names":["remoteAudioElement","useSelector","state","player","remoteAudio","t","useTranslation","audioOutputDevices","store","select","mediaDevices","getState","_a","useState","getCurrentAudioOutputDeviceId","selectedAudioOutput","setSelectedAudioOutput","handleClickAudioOutput","audioOutputDevice","current","setSinkId","then","console","info","setJSONItem","deviceId","eventDispatch","catch","err","error","useEventListener","data","_b","hoveredDevice","setHoveredDevice","React","createElement","className","SettingsHeader","title","tooltipPrefix","map","audioDevice","index","key","onClick","onMouseEnter","onMouseLeave","FontAwesomeIcon","icon","faVolumeHigh","label","faCheck","concat"],"mappings":"iyCAakB,WAChB,IAAMA,EAA0BC,eAAY,SAACC,GAAqB,OAAAA,EAAMC,OAAOC,WAAb,IAE1DC,EAAMC,qBACRC,EAAqBC,EAAKA,MAACC,OAAOC,aAAaH,mBAAmBC,EAAKA,MAACG,YACxEC,EAAgDC,EAAQA,SAC5DC,mCAAmC,MAD9BC,EAAmBH,EAAA,GAAEI,OAGtBC,EAAyB,SAACC,GAC9BF,EAAuBE,GAEvBlB,SAAAA,EAAoBmB,QACjBC,UAAUF,GACVG,MAAK,WACJC,QAAQC,KAAK,uCAEbC,EAAAA,YAAY,mCAAoC,CAAEC,SAAUP,IAG5DQ,gBAAc,0CAA2C,CAAA,EAC3D,IACCC,OAAM,SAAUC,GACfN,QAAQO,MAAM,oCAAqCD,EACrD,GACJ,EACAE,mBAAiB,yCAAyC,SAACC,GACzDd,EAAuBc,EAAKN,SAC9B,IAEM,IAAAO,EAAoCnB,EAAAA,SAAwB,MAA3DoB,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GAEtC,OACEG,EAAA,QAAAC,cAAA,MAAA,CAAKC,UAAU,iCAEbF,UAAAC,cAACE,EAAcA,eAAA,CAACC,MAAOlC,EAAE,qBAAsBmC,cAAc,UAE7DL,EAAAA,QAAAC,cAAA,MAAA,CAAKC,UAAU,oXACZ9B,EAAmBkC,KAAI,SAACC,EAAaC,GAAU,OAC9CR,EAAAA,QACEC,cAAA,MAAA,CAAAQ,IAAKD,EACLN,UAAU,8PACVQ,QAAS,WAAM,OAAA5B,EAAuByB,aAAA,EAAAA,EAAajB,SAAS,EAC5DqB,aAAc,WAAM,OAAAZ,EAAiBQ,aAAW,EAAXA,EAAajB,SAA9B,EACpBsB,aAAc,WAAM,OAAAb,EAAiB,QAErCC,EAAAA,QAAKC,cAAA,MAAA,CAAAC,UAAU,2BACbF,EAAC,QAAAC,cAAAY,mBAAgBC,KAAMC,eAAcb,UAAU,0BAC/CF,EAAA,QAAAC,cAAA,OAAA,MAAOM,eAAAA,EAAaS,QAAS,uBAAgBR,EAAQ,KAEvDR,EAAA,QAAAC,cAAA,MAAA,CAAKC,UAAU,2BACZtB,KAAwB2B,eAAAA,EAAajB,WACpCU,EAAAA,QAAAC,cAACY,EAAAA,gBAAe,CACdC,KAAMG,EAAOA,QACbf,UAAW,GACTgB,OAAApB,KAAkBS,aAAW,EAAXA,EAAajB,UAC3B,yCACA,+CACU,qBAKzB,KAIT"}
+{"version":3,"file":"AudioView.js","sources":["../../../src/components/SettingsView/AudioView.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { useState } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState, store } from '../../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faCheck, faVolumeHigh } from '@fortawesome/free-solid-svg-icons'\nimport { eventDispatch, setJSONItem, useEventListener } from '../../utils'\nimport { SettingsHeader } from './SettingsHeader'\nimport { useTranslation } from 'react-i18next'\nimport { getCurrentAudioOutputDeviceId } from '../../lib/devices/devices'\n\nconst AudioView = () => {\n  const remoteAudioElement: any = useSelector((state: RootState) => state.player.remoteAudio)\n\n  const { t } = useTranslation()\n  const audioOutputDevices = store.select.mediaDevices.audioOutputDevices(store.getState())\n  const [selectedAudioOutput, setSelectedAudioOutput] = useState<string | null>(\n    getCurrentAudioOutputDeviceId() || null,\n  )\n  const handleClickAudioOutput = (audioOutputDevice: string) => {\n    setSelectedAudioOutput(audioOutputDevice)\n\n    remoteAudioElement?.current\n      .setSinkId(audioOutputDevice)\n      .then(function () {\n        console.info('Audio output device switch success!')\n        // set device to localstorage\n        setJSONItem('phone-island-audio-output-device', { deviceId: audioOutputDevice })\n\n        // dispatch event\n        eventDispatch('phone-island-call-audio-output-switched', {})\n      })\n      .catch(function (err) {\n        console.error('Audio output device switch error:', err)\n      })\n  }\n  useEventListener('phone-island-call-audio-output-switch', (data: DeviceInputOutputTypes) => {\n    handleClickAudioOutput(data.deviceId)\n  })\n\n  const [hoveredDevice, setHoveredDevice] = useState<string | null>(null)\n\n  return (\n    <div className='pi-flex pi-flex-col pi-w-full'>\n      {/* Title */}\n      <SettingsHeader title={t('Settings.Speakers')} tooltipPrefix='audio' />\n      {/* Audio List */}\n      <div className='pi-flex pi-flex-col pi-mt-2 pi-space-y-1 pi-max-h-48 pi-overflow-y-auto pi-scrollbar-thin pi-scrollbar-thumb-gray-400 pi-dark:scrollbar-thumb-gray-400 pi-scrollbar-thumb-rounded-full pi-scrollbar-thumb-opacity-50 dark:pi-scrollbar-track-gray-900 pi-scrollbar-track-gray-200 pi-dark:scrollbar-track-gray-900 pi-scrollbar-track-rounded-full pi-scrollbar-track-opacity-25'>\n        {audioOutputDevices.map((audioDevice, index) => (\n          <div\n            key={index}\n            className='pi-flex pi-items-center pi-justify-between pi-px-4 pi-py-3 pi-text-base pi-font-normal pi-leading-6 dark:pi-text-gray-200 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700 dark:pi-bg-gray-950 pi-bg-gray-50 pi-rounded-md pi-cursor-pointer'\n            onClick={() => handleClickAudioOutput(audioDevice?.deviceId)}\n            onMouseEnter={() => setHoveredDevice(audioDevice?.deviceId)}\n            onMouseLeave={() => setHoveredDevice(null)}\n          >\n            <div className='pi-flex pi-items-center'>\n              <FontAwesomeIcon icon={faVolumeHigh} className='pi-mr-2 pi-w-5 pi-h-5' />\n              <span>{audioDevice?.label || `Input device ${index + 1}`}</span>\n            </div>\n            <div className='pi-flex pi-items-center'>\n              {selectedAudioOutput === audioDevice?.deviceId && (\n                <FontAwesomeIcon\n                  icon={faCheck}\n                  className={`${\n                    hoveredDevice === audioDevice?.deviceId\n                      ? 'pi-text-gray-700 dark:pi-text-gray-200'\n                      : 'pi-text-emerald-700 dark:pi-text-emerald-500'\n                  } pi-w-5 pi-h-5`}\n                />\n              )}\n            </div>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\ninterface DeviceInputOutputTypes {\n  deviceId: string\n}\n\nexport default AudioView\n"],"names":["remoteAudioElement","useSelector","state","player","remoteAudio","t","useTranslation","audioOutputDevices","store","select","mediaDevices","getState","_a","useState","getCurrentAudioOutputDeviceId","selectedAudioOutput","setSelectedAudioOutput","handleClickAudioOutput","audioOutputDevice","current","setSinkId","then","console","info","setJSONItem","deviceId","eventDispatch","catch","err","error","useEventListener","data","_b","hoveredDevice","setHoveredDevice","React","createElement","className","SettingsHeader","title","tooltipPrefix","map","audioDevice","index","key","onClick","onMouseEnter","onMouseLeave","FontAwesomeIcon","icon","faVolumeHigh","label","faCheck","concat"],"mappings":"iyCAakB,WAChB,IAAMA,EAA0BC,cAAY,SAACC,GAAqB,OAAAA,EAAMC,OAAOC,WAAb,GAE1DC,EAAMC,qBACRC,EAAqBC,EAAKA,MAACC,OAAOC,aAAaH,mBAAmBC,EAAKA,MAACG,YACxEC,EAAgDC,EAAQA,SAC5DC,mCAAmC,MAD9BC,EAAmBH,EAAA,GAAEI,OAGtBC,EAAyB,SAACC,GAC9BF,EAAuBE,GAEvBlB,SAAAA,EAAoBmB,QACjBC,UAAUF,GACVG,KAAK,WACJC,QAAQC,KAAK,uCAEbC,EAAAA,YAAY,mCAAoC,CAAEC,SAAUP,IAG5DQ,gBAAc,0CAA2C,CAAA,EAC3D,GACCC,MAAM,SAAUC,GACfN,QAAQO,MAAM,oCAAqCD,EACrD,EACJ,EACAE,mBAAiB,wCAAyC,SAACC,GACzDd,EAAuBc,EAAKN,SAC9B,GAEM,IAAAO,EAAoCnB,EAAAA,SAAwB,MAA3DoB,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GAEtC,OACEG,EAAA,QAAAC,cAAA,MAAA,CAAKC,UAAU,iCAEbF,UAAAC,cAACE,EAAcA,eAAA,CAACC,MAAOlC,EAAE,qBAAsBmC,cAAc,UAE7DL,EAAAA,QAAAC,cAAA,MAAA,CAAKC,UAAU,oXACZ9B,EAAmBkC,IAAI,SAACC,EAAaC,GAAU,OAC9CR,EAAAA,QACEC,cAAA,MAAA,CAAAQ,IAAKD,EACLN,UAAU,8PACVQ,QAAS,WAAM,OAAA5B,EAAuByB,aAAA,EAAAA,EAAajB,SAAS,EAC5DqB,aAAc,WAAM,OAAAZ,EAAiBQ,aAAW,EAAXA,EAAajB,SAA9B,EACpBsB,aAAc,WAAM,OAAAb,EAAiB,QAErCC,EAAAA,QAAKC,cAAA,MAAA,CAAAC,UAAU,2BACbF,EAAC,QAAAC,cAAAY,mBAAgBC,KAAMC,eAAcb,UAAU,0BAC/CF,EAAA,QAAAC,cAAA,OAAA,MAAOM,eAAAA,EAAaS,QAAS,uBAAgBR,EAAQ,KAEvDR,EAAA,QAAAC,cAAA,MAAA,CAAKC,UAAU,2BACZtB,KAAwB2B,eAAAA,EAAajB,WACpCU,EAAAA,QAAAC,cAACY,EAAAA,gBAAe,CACdC,KAAMG,EAAOA,QACbf,UAAW,GACTgB,OAAApB,KAAkBS,aAAW,EAAXA,EAAajB,UAC3B,yCACA,+CACU,qBAKzB,IAIT"}

package/dist/components/SettingsView/MicrophoneView.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var t=require("../../store/index.js"),r=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),i=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),s=require("../../utils/customHooks/useEventListener.js"),a=require("../../utils/genericFunctions/eventDispatch.js"),n=require("../../utils/genericFunctions/localStorage.js");require("../../node_modules/tslib/tslib.es6.js");var o=require("./SettingsHeader.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var l=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var u=require("../../lib/devices/devices.js"),c=require("../../node_modules/react-redux/es/hooks/useSelector.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=d(e);exports.default=function(){var d=c.useSelector((function(e){return e.webrtc})).sipcall,m=l.useTranslation().t,f=e.useState(u.getCurrentAudioInputDeviceId()||null),v=f[0],b=f[1],h=t.store.select.mediaDevices.audioInputDevices(t.store.getState()),g=function(e){b(e),d.webrtcStuff.myStream?null==d||d.replaceTracks({tracks:[{type:"audio",mid:"0",capture:{deviceId:{exact:e}}}],success:function(){console.info("Audio input device switch success!"),n.setJSONItem("phone-island-audio-input-device",{deviceId:e}),a.eventDispatch("phone-island-call-audio-input-switched",{})},error:function(e){console.error("Audio input device switch error:",e)}}):(n.setJSONItem("phone-island-audio-input-device",{deviceId:e}),a.eventDispatch("phone-island-call-audio-input-switched",{}))};s.useEventListener("phone-island-call-audio-input-switch",(function(e){g(e.deviceId)}));var x=e.useState(null),y=x[0],j=x[1];return p.default.createElement("div",{className:"pi-flex pi-flex-col pi-w-full"},p.default.createElement(o.SettingsHeader,{title:m("Settings.Microphones"),tooltipPrefix:"microphone"}),p.default.createElement("div",{className:"pi-flex pi-flex-col pi-mt-2 pi-space-y-1 pi-max-h-48 pi-overflow-y-auto pi-scrollbar-thin pi-scrollbar-thumb-gray-400 pi-dark:scrollbar-thumb-gray-400 pi-scrollbar-thumb-rounded-full pi-scrollbar-thumb-opacity-50 dark:pi-scrollbar-track-gray-900 pi-scrollbar-track-gray-200 pi-dark:scrollbar-track-gray-900 pi-scrollbar-track-rounded-full pi-scrollbar-track-opacity-25"},h.map((function(e,t){return p.default.createElement("div",{key:t,className:"pi-flex pi-items-center pi-justify-between pi-px-4 pi-py-3 pi-text-base pi-font-normal pi-leading-6 dark:pi-text-gray-200 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700 dark:pi-bg-gray-950 pi-bg-gray-50 pi-rounded-md pi-cursor-pointer",onClick:function(){return g(null==e?void 0:e.deviceId)},onMouseEnter:function(){return j(null==e?void 0:e.deviceId)},onMouseLeave:function(){return j(null)}},p.default.createElement("div",{className:"pi-flex pi-items-center"},p.default.createElement(r.FontAwesomeIcon,{icon:i.faMicrophone,className:"pi-mr-2 pi-w-5 pi-h-5"}),p.default.createElement("span",null,(null==e?void 0:e.label)||"Input device ".concat(t+1))),p.default.createElement("div",{className:"pi-flex pi-items-center"},v===(null==e?void 0:e.deviceId)&&p.default.createElement(r.FontAwesomeIcon,{icon:i.faCheck,className:"".concat(y===(null==e?void 0:e.deviceId)?"pi-text-gray-700 dark:pi-text-gray-200":"pi-text-emerald-700 dark:pi-text-emerald-500"," pi-w-5 pi-h-5")})))}))))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var t=require("../../store/index.js"),r=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),i=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),s=require("../../utils/customHooks/useEventListener.js"),a=require("../../utils/genericFunctions/eventDispatch.js"),n=require("../../utils/genericFunctions/localStorage.js");require("../../node_modules/tslib/tslib.es6.js");var o=require("./SettingsHeader.js");require("../../node_modules/@babel/runtime/helpers/defineProperty.js"),require("../../node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),require("../../node_modules/@babel/runtime/helpers/typeof.js"),require("../../node_modules/html-parse-stringify/dist/html-parse-stringify.js"),require("../../node_modules/react-i18next/dist/es/context.js");var l=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var u=require("../../lib/devices/devices.js"),c=require("../../node_modules/react-redux/es/hooks/useSelector.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=d(e);exports.default=function(){var d=c.useSelector(function(e){return e.webrtc}).sipcall,m=l.useTranslation().t,f=e.useState(u.getCurrentAudioInputDeviceId()||null),v=f[0],b=f[1],h=t.store.select.mediaDevices.audioInputDevices(t.store.getState()),g=function(e){b(e),d.webrtcStuff.myStream?null==d||d.replaceTracks({tracks:[{type:"audio",mid:"0",capture:{deviceId:{exact:e}}}],success:function(){console.info("Audio input device switch success!"),n.setJSONItem("phone-island-audio-input-device",{deviceId:e}),a.eventDispatch("phone-island-call-audio-input-switched",{})},error:function(e){console.error("Audio input device switch error:",e)}}):(n.setJSONItem("phone-island-audio-input-device",{deviceId:e}),a.eventDispatch("phone-island-call-audio-input-switched",{}))};s.useEventListener("phone-island-call-audio-input-switch",function(e){g(e.deviceId)});var x=e.useState(null),y=x[0],j=x[1];return p.default.createElement("div",{className:"pi-flex pi-flex-col pi-w-full"},p.default.createElement(o.SettingsHeader,{title:m("Settings.Microphones"),tooltipPrefix:"microphone"}),p.default.createElement("div",{className:"pi-flex pi-flex-col pi-mt-2 pi-space-y-1 pi-max-h-48 pi-overflow-y-auto pi-scrollbar-thin pi-scrollbar-thumb-gray-400 pi-dark:scrollbar-thumb-gray-400 pi-scrollbar-thumb-rounded-full pi-scrollbar-thumb-opacity-50 dark:pi-scrollbar-track-gray-900 pi-scrollbar-track-gray-200 pi-dark:scrollbar-track-gray-900 pi-scrollbar-track-rounded-full pi-scrollbar-track-opacity-25"},h.map(function(e,t){return p.default.createElement("div",{key:t,className:"pi-flex pi-items-center pi-justify-between pi-px-4 pi-py-3 pi-text-base pi-font-normal pi-leading-6 dark:pi-text-gray-200 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700 dark:pi-bg-gray-950 pi-bg-gray-50 pi-rounded-md pi-cursor-pointer",onClick:function(){return g(null==e?void 0:e.deviceId)},onMouseEnter:function(){return j(null==e?void 0:e.deviceId)},onMouseLeave:function(){return j(null)}},p.default.createElement("div",{className:"pi-flex pi-items-center"},p.default.createElement(r.FontAwesomeIcon,{icon:i.faMicrophone,className:"pi-mr-2 pi-w-5 pi-h-5"}),p.default.createElement("span",null,(null==e?void 0:e.label)||"Input device ".concat(t+1))),p.default.createElement("div",{className:"pi-flex pi-items-center"},v===(null==e?void 0:e.deviceId)&&p.default.createElement(r.FontAwesomeIcon,{icon:i.faCheck,className:"".concat(y===(null==e?void 0:e.deviceId)?"pi-text-gray-700 dark:pi-text-gray-200":"pi-text-emerald-700 dark:pi-text-emerald-500"," pi-w-5 pi-h-5")})))})))};
 //# sourceMappingURL=MicrophoneView.js.map