npm - @nethesis/phone-island - Versions diffs - 1.0.6-dev.6 → 1.0.6-dev.8 - Mend

@nethesis/phone-island 1.0.6-dev.6 → 1.0.6-dev.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1413) hide show

package/dist/components/StreamingAnswerView/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/StreamingAnswerView/index.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useEffect, useRef, useState } from 'react'\nimport { Button } from '../Button'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { Dispatch, RootState, store } from '../../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n faMicrophone,\n faMicrophoneSlash,\n faVideoSlash,\n} from '@fortawesome/free-solid-svg-icons'\nimport { t } from 'i18next'\nimport { useIsomorphicLayoutEffect } from '../../utils'\nimport Hangup from '../Hangup'\nimport {\n muteCurrentCall,\n unmuteCurrentCall,\n} from '../../lib/phone/call'\nimport Avatar from '../CallView/Avatar'\nimport Timer from '../CallView/Timer'\nimport { isPhysical } from '../../lib/user/default_device'\nimport { AudioBars } from '../AudioBars'\nimport { CustomThemedTooltip } from '../CustomThemedTooltip'\nimport { faCamera, faLockOpen } from '@fortawesome/free-solid-svg-icons'\nimport { capitalizeFirstLetter, getISODateForFilename, handleStreamingUnlock } from '../../utils'\n\nexport interface StreamingAnswerViewProps { }\n\nexport const StreamingAnswerView: FC<StreamingAnswerViewProps> = () => {\n const dispatch = useDispatch<Dispatch>()\n const {\n muted,\n startTime,\n paused,\n streamingSourceNumber,\n } = useSelector((state: RootState) => state.currentCall)\n const { isOpen, isExtraLarge } = useSelector((state: RootState) => state.island)\n const { remoteAudioStream } = useSelector((state: RootState) => state.webrtc)\n const { videoSources, sourceImages } = useSelector((state: RootState) => state.streaming)\n\n // Get streaming source image and check if unlock is available\n const streamingSourceData = React.useMemo(() => {\n if (!streamingSourceNumber \|\| !videoSources) return { image: null, canUnlock: false, tooltipText: '' }\n\n const source = Object.values(videoSources).find(\n (source) => source.extension === streamingSourceNumber,\n )\n if (!source) return { image: null, canUnlock: false, tooltipText: '' }\n\n const image = sourceImages[source.id] \|\| source.image \|\| null\n const canUnlock = Boolean(source.cmdOpen && source.cmdOpen.trim() !== '')\n const tooltipText = canUnlock ? `${t('VideoStreaming.Open')}: ${source.description}` : ''\n\n return { image, canUnlock, tooltipText }\n }, [streamingSourceNumber, videoSources, sourceImages, t])\n\n const [isFullscreen, setIsFullscreen] = useState(false)\n const streamingAnswerViewRef = useRef(null)\n const localScreen = useRef<HTMLVideoElement>(null)\n const remoteScreen = useRef<HTMLVideoElement>(null)\n const localVideo = useRef<HTMLVideoElement>(null)\n const largeRemoteVideo = useRef<HTMLVideoElement>(null)\n const smallRemoteVideo = useRef<HTMLVideoElement>(null)\n\n useIsomorphicLayoutEffect(() => {\n dispatch.player.updatePlayer({\n localScreen: localScreen,\n remoteScreen: remoteScreen,\n localVideo: localVideo,\n largeRemoteVideo: largeRemoteVideo,\n smallRemoteVideo: smallRemoteVideo,\n })\n }, [])\n\n const handleFullscreenChange = () => {\n setIsFullscreen(!!document.fullscreenElement)\n }\n\n const toggleFullScreen = () => {\n if (document.fullscreenElement) {\n // exit full screen\n document.exitFullscreen()\n } else {\n // enter full screen\n if (streamingAnswerViewRef.current) {\n ; (streamingAnswerViewRef.current as HTMLElement).requestFullscreen()\n }\n }\n }\n\n useEffect(() => {\n // register for full screen change\n addEventListener('fullscreenchange', handleFullscreenChange)\n\n return () => {\n removeEventListener('fullscreenchange', handleFullscreenChange)\n }\n }, [])\n\n const handleScreenshot = React.useCallback(() => {\n if (!streamingSourceNumber \|\| !videoSources) return\n\n const source = Object.values(videoSources).find(\n (source) => source.extension === streamingSourceNumber,\n )\n if (!source \|\| !source.image) return\n\n const filename = source.description\n ? `${capitalizeFirstLetter(source.description).replace(/\\s+/g, '_')}_${getISODateForFilename()}_screenshot.jpg`\n : `screenshot_${getISODateForFilename()}.jpg`\n\n // Create download link using the base64 image\n const link = document.createElement('a')\n link.href = source.image\n link.download = filename\n document.body.appendChild(link)\n link.click()\n document.body.removeChild(link)\n }, [streamingSourceNumber, videoSources])\n\n return (\n <>\n {isOpen ? (\n <div\n ref={streamingAnswerViewRef}\n className={isFullscreen ? 'pi-h-screen pi-w-full' : isExtraLarge ? 'pi-h-[748px] pi-w-[936px]' : 'pi-h-[480px] pi-w-[600px]'}\n >\n <div className={`${isFullscreen ? `pi-h-[500px]` : isExtraLarge ? `pi-h-[648px]` : `pi-h-[380px]`} pi-flex pi-relative pi-justify-center pi-w-full pi-flex-col`}>\n {/* Video container with rounded corners /}\n <div className='pi-relative pi-flex-1'>\n {/ Streaming source image or placeholder /}\n {streamingSourceData.image ? (\n <img\n src={streamingSourceData.image}\n alt='Streaming source'\n className='pi-rounded-tl-[20px] pi-rounded-tr-[20px] pi-rounded-bl-[20px] pi-rounded-br-[20px] pi-w-full pi-h-full pi-object-cover'\n />\n ) : (\n <div className='pi-w-full pi-h-full pi-bg-gray-200 dark:pi-bg-gray-800 pi-flex pi-items-center pi-justify-center pi-rounded-tl-[20px] pi-rounded-tr-[20px] pi-rounded-bl-[20px] pi-rounded-br-[20px]'>\n <FontAwesomeIcon\n icon={faVideoSlash}\n className='pi-w-24 pi-h-24 pi-text-gray-400 dark:pi-text-gray-600'\n />\n </div>\n )}\n\n {/ Controls overlay (above the image with transparency) /}\n <div className='pi-absolute pi-bottom-0 pi-left-0 pi-right-0 pi-bg-black/30 pi-p-4 pi-rounded-b-3xl'>\n <div>\n <div className='pi-flex pi-items-center pi-justify-center pi-gap-6'>\n {/ Mute button /}\n <Button\n variant='default'\n onClick={muted ? unmuteCurrentCall : muteCurrentCall}\n data-tooltip-id='tooltip-mute-streaming'\n data-tooltip-content={muted ? t('Tooltip.Unmute') : t('Tooltip.Mute')}\n >\n <FontAwesomeIcon\n className='pi-h-6 pi-w-6'\n icon={muted ? faMicrophoneSlash : faMicrophone}\n />\n </Button>\n\n {/ Screenshot button /}\n <Button\n variant='default'\n onClick={handleScreenshot}\n data-tooltip-id='tooltip-screenshot-streaming'\n data-tooltip-content={t('VideoStreaming.Take a screenshot') \|\| 'Take a screenshot'}\n >\n <FontAwesomeIcon\n className='pi-h-6 pi-w-6'\n icon={faCamera}\n />\n </Button>\n\n {/ Open door button - only show if cmdOpen is valid /}\n {streamingSourceData?.canUnlock && (\n <Button\n variant='default'\n onClick={handleStreamingUnlock}\n data-tooltip-id='tooltip-unlock-streaming'\n data-tooltip-content={streamingSourceData?.tooltipText}\n >\n <FontAwesomeIcon\n className='pi-h-6 pi-w-6'\n icon={faLockOpen}\n />\n </Button>\n )}\n </div>\n </div>\n </div>\n </div>\n\n {/ Footer below the image /}\n <div className='pi-bg-surfaceBackground dark:pi-bg-surfaceBackgroundDark pi-pt-4 pi-rounded-bl-[20px] pi-rounded-br-[20px]'>\n <Hangup\n buttonsVariant='default'\n showFullscreenButton={true}\n isFullscreen={isFullscreen}\n onToggleFullscreen={toggleFullScreen}\n isExtraLarge={isExtraLarge}\n onToggleExtraLarge={() => dispatch.island.setExtraLarge(!isExtraLarge)}\n />\n </div>\n\n </div>\n\n {/ Tooltips */}\n <CustomThemedTooltip className='pi-z-20' id='tooltip-mute-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-screenshot-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-unlock-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-record-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-pause-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-screen-share-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-toggle-fullscreen' place='bottom' />\n </div>\n ) : (\n // Collapsed view\n <>\n <div className='pi-flex pi-justify-between pi-items-center'>\n <Avatar />\n <Timer startTime={startTime} isNotAlwaysWhite />\n {!isOpen && remoteAudioStream && !isPhysical() && (\n <AudioBars\n audioStream={remoteAudioStream}\n paused={paused}\n size={isOpen ? 'large' : 'small'}\n />\n )}\n </div>\n </>\n )}\n </>\n )\n}\n\nexport default StreamingAnswerView\n"],"names":["StreamingAnswerView","dispatch","useDispatch","_a","useSelector","state","currentCall","muted","startTime","paused","streamingSourceNumber","_b","island","isOpen","isExtraLarge","remoteAudioStream","webrtc","_c","streaming","videoSources","sourceImages","streamingSourceData","React","useMemo","image","canUnlock","tooltipText","source","Object","values","find","extension","id","Boolean","cmdOpen","trim","concat","t","description","_d","useState","isFullscreen","setIsFullscreen","streamingAnswerViewRef","useRef","localScreen","remoteScreen","localVideo","largeRemoteVideo","smallRemoteVideo","useIsomorphicLayoutEffect","player","updatePlayer","handleFullscreenChange","document","fullscreenElement","useEffect","addEventListener","removeEventListener","handleScreenshot","useCallback","filename","capitalizeFirstLetter","replace","getISODateForFilename","link","createElement","href","download","body","appendChild","click","removeChild","Fragment","ref","className","src","alt","FontAwesomeIcon","icon","faVideoSlash","Button","variant","onClick","unmuteCurrentCall","muteCurrentCall","faMicrophoneSlash","faMicrophone","faCamera","handleStreamingUnlock","faLockOpen","Hangup","buttonsVariant","showFullscreenButton","onToggleFullscreen","exitFullscreen","current","requestFullscreen","onToggleExtraLarge","setExtraLarge","CustomThemedTooltip","place","Avatar","Timer","isNotAlwaysWhite","isPhysical","AudioBars","audioStream","size"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/StreamingAnswerView/index.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, useEffect, useRef, useState } from 'react'\nimport { Button } from '../Button'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { Dispatch, RootState, store } from '../../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n faMicrophone,\n faMicrophoneSlash,\n faVideoSlash,\n} from '@fortawesome/free-solid-svg-icons'\nimport { t } from 'i18next'\nimport { useIsomorphicLayoutEffect } from '../../utils'\nimport Hangup from '../Hangup'\nimport {\n muteCurrentCall,\n unmuteCurrentCall,\n} from '../../lib/phone/call'\nimport Avatar from '../CallView/Avatar'\nimport Timer from '../CallView/Timer'\nimport { isPhysical } from '../../lib/user/default_device'\nimport { AudioBars } from '../AudioBars'\nimport { CustomThemedTooltip } from '../CustomThemedTooltip'\nimport { faCamera, faLockOpen } from '@fortawesome/free-solid-svg-icons'\nimport { capitalizeFirstLetter, getISODateForFilename, handleStreamingUnlock } from '../../utils'\n\nexport interface StreamingAnswerViewProps { }\n\nexport const StreamingAnswerView: FC<StreamingAnswerViewProps> = () => {\n const dispatch = useDispatch<Dispatch>()\n const {\n muted,\n startTime,\n paused,\n streamingSourceNumber,\n } = useSelector((state: RootState) => state.currentCall)\n const { isOpen, isExtraLarge } = useSelector((state: RootState) => state.island)\n const { remoteAudioStream } = useSelector((state: RootState) => state.webrtc)\n const { videoSources, sourceImages } = useSelector((state: RootState) => state.streaming)\n\n // Get streaming source image and check if unlock is available\n const streamingSourceData = React.useMemo(() => {\n if (!streamingSourceNumber \|\| !videoSources) return { image: null, canUnlock: false, tooltipText: '' }\n\n const source = Object.values(videoSources).find(\n (source) => source.extension === streamingSourceNumber,\n )\n if (!source) return { image: null, canUnlock: false, tooltipText: '' }\n\n const image = sourceImages[source.id] \|\| source.image \|\| null\n const canUnlock = Boolean(source.cmdOpen && source.cmdOpen.trim() !== '')\n const tooltipText = canUnlock ? `${t('VideoStreaming.Open')}: ${source.description}` : ''\n\n return { image, canUnlock, tooltipText }\n }, [streamingSourceNumber, videoSources, sourceImages, t])\n\n const [isFullscreen, setIsFullscreen] = useState(false)\n const streamingAnswerViewRef = useRef(null)\n const localScreen = useRef<HTMLVideoElement>(null)\n const remoteScreen = useRef<HTMLVideoElement>(null)\n const localVideo = useRef<HTMLVideoElement>(null)\n const largeRemoteVideo = useRef<HTMLVideoElement>(null)\n const smallRemoteVideo = useRef<HTMLVideoElement>(null)\n\n useIsomorphicLayoutEffect(() => {\n dispatch.player.updatePlayer({\n localScreen: localScreen,\n remoteScreen: remoteScreen,\n localVideo: localVideo,\n largeRemoteVideo: largeRemoteVideo,\n smallRemoteVideo: smallRemoteVideo,\n })\n }, [])\n\n const handleFullscreenChange = () => {\n setIsFullscreen(!!document.fullscreenElement)\n }\n\n const toggleFullScreen = () => {\n if (document.fullscreenElement) {\n // exit full screen\n document.exitFullscreen()\n } else {\n // enter full screen\n if (streamingAnswerViewRef.current) {\n ; (streamingAnswerViewRef.current as HTMLElement).requestFullscreen()\n }\n }\n }\n\n useEffect(() => {\n // register for full screen change\n addEventListener('fullscreenchange', handleFullscreenChange)\n\n return () => {\n removeEventListener('fullscreenchange', handleFullscreenChange)\n }\n }, [])\n\n const handleScreenshot = React.useCallback(() => {\n if (!streamingSourceNumber \|\| !videoSources) return\n\n const source = Object.values(videoSources).find(\n (source) => source.extension === streamingSourceNumber,\n )\n if (!source \|\| !source.image) return\n\n const filename = source.description\n ? `${capitalizeFirstLetter(source.description).replace(/\\s+/g, '_')}_${getISODateForFilename()}_screenshot.jpg`\n : `screenshot_${getISODateForFilename()}.jpg`\n\n // Create download link using the base64 image\n const link = document.createElement('a')\n link.href = source.image\n link.download = filename\n document.body.appendChild(link)\n link.click()\n document.body.removeChild(link)\n }, [streamingSourceNumber, videoSources])\n\n return (\n <>\n {isOpen ? (\n <div\n ref={streamingAnswerViewRef}\n className={isFullscreen ? 'pi-h-screen pi-w-full' : isExtraLarge ? 'pi-h-[748px] pi-w-[936px]' : 'pi-h-[480px] pi-w-[600px]'}\n >\n <div className={`${isFullscreen ? `pi-h-[500px]` : isExtraLarge ? `pi-h-[648px]` : `pi-h-[380px]`} pi-flex pi-relative pi-justify-center pi-w-full pi-flex-col`}>\n {/* Video container with rounded corners /}\n <div className='pi-relative pi-flex-1'>\n {/ Streaming source image or placeholder /}\n {streamingSourceData.image ? (\n <img\n src={streamingSourceData.image}\n alt='Streaming source'\n className='pi-rounded-tl-[20px] pi-rounded-tr-[20px] pi-rounded-bl-[20px] pi-rounded-br-[20px] pi-w-full pi-h-full pi-object-cover'\n />\n ) : (\n <div className='pi-w-full pi-h-full pi-bg-gray-200 dark:pi-bg-gray-800 pi-flex pi-items-center pi-justify-center pi-rounded-tl-[20px] pi-rounded-tr-[20px] pi-rounded-bl-[20px] pi-rounded-br-[20px]'>\n <FontAwesomeIcon\n icon={faVideoSlash}\n className='pi-w-24 pi-h-24 pi-text-gray-400 dark:pi-text-gray-600'\n />\n </div>\n )}\n\n {/ Controls overlay (above the image with transparency) /}\n <div className='pi-absolute pi-bottom-0 pi-left-0 pi-right-0 pi-bg-black/30 pi-p-4 pi-rounded-b-3xl'>\n <div>\n <div className='pi-flex pi-items-center pi-justify-center pi-gap-6'>\n {/ Mute button /}\n <Button\n variant='default'\n onClick={muted ? unmuteCurrentCall : muteCurrentCall}\n data-tooltip-id='tooltip-mute-streaming'\n data-tooltip-content={muted ? t('Tooltip.Unmute') : t('Tooltip.Mute')}\n >\n <FontAwesomeIcon\n className='pi-h-6 pi-w-6'\n icon={muted ? faMicrophoneSlash : faMicrophone}\n />\n </Button>\n\n {/ Screenshot button /}\n <Button\n variant='default'\n onClick={handleScreenshot}\n data-tooltip-id='tooltip-screenshot-streaming'\n data-tooltip-content={t('VideoStreaming.Take a screenshot') \|\| 'Take a screenshot'}\n >\n <FontAwesomeIcon\n className='pi-h-6 pi-w-6'\n icon={faCamera}\n />\n </Button>\n\n {/ Open door button - only show if cmdOpen is valid /}\n {streamingSourceData?.canUnlock && (\n <Button\n variant='default'\n onClick={handleStreamingUnlock}\n data-tooltip-id='tooltip-unlock-streaming'\n data-tooltip-content={streamingSourceData?.tooltipText}\n >\n <FontAwesomeIcon\n className='pi-h-6 pi-w-6'\n icon={faLockOpen}\n />\n </Button>\n )}\n </div>\n </div>\n </div>\n </div>\n\n {/ Footer below the image /}\n <div className='pi-bg-surfaceBackground dark:pi-bg-surfaceBackgroundDark pi-pt-4 pi-rounded-bl-[20px] pi-rounded-br-[20px]'>\n <Hangup\n buttonsVariant='default'\n showFullscreenButton={true}\n isFullscreen={isFullscreen}\n onToggleFullscreen={toggleFullScreen}\n isExtraLarge={isExtraLarge}\n onToggleExtraLarge={() => dispatch.island.setExtraLarge(!isExtraLarge)}\n />\n </div>\n\n </div>\n\n {/ Tooltips */}\n <CustomThemedTooltip className='pi-z-20' id='tooltip-mute-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-screenshot-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-unlock-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-record-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-pause-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-screen-share-streaming' place='bottom' />\n <CustomThemedTooltip className='pi-z-20' id='tooltip-toggle-fullscreen' place='bottom' />\n </div>\n ) : (\n // Collapsed view\n <>\n <div className='pi-flex pi-justify-between pi-items-center'>\n <Avatar />\n <Timer startTime={startTime} isNotAlwaysWhite />\n {!isOpen && remoteAudioStream && !isPhysical() && (\n <AudioBars\n audioStream={remoteAudioStream}\n paused={paused}\n size={isOpen ? 'large' : 'small'}\n />\n )}\n </div>\n </>\n )}\n </>\n )\n}\n\nexport default StreamingAnswerView\n"],"names":["StreamingAnswerView","dispatch","useDispatch","_a","useSelector","state","currentCall","muted","startTime","paused","streamingSourceNumber","_b","island","isOpen","isExtraLarge","remoteAudioStream","webrtc","_c","streaming","videoSources","sourceImages","streamingSourceData","React","useMemo","image","canUnlock","tooltipText","source","Object","values","find","extension","id","Boolean","cmdOpen","trim","concat","t","description","_d","useState","isFullscreen","setIsFullscreen","streamingAnswerViewRef","useRef","localScreen","remoteScreen","localVideo","largeRemoteVideo","smallRemoteVideo","useIsomorphicLayoutEffect","player","updatePlayer","handleFullscreenChange","document","fullscreenElement","useEffect","addEventListener","removeEventListener","handleScreenshot","useCallback","filename","capitalizeFirstLetter","replace","getISODateForFilename","link","createElement","href","download","body","appendChild","click","removeChild","Fragment","ref","className","src","alt","FontAwesomeIcon","icon","faVideoSlash","Button","variant","onClick","unmuteCurrentCall","muteCurrentCall","faMicrophoneSlash","faMicrophone","faCamera","handleStreamingUnlock","faLockOpen","Hangup","buttonsVariant","showFullscreenButton","onToggleFullscreen","exitFullscreen","current","requestFullscreen","onToggleExtraLarge","setExtraLarge","CustomThemedTooltip","place","Avatar","Timer","isNotAlwaysWhite","isPhysical","AudioBars","audioStream","size"],"mappings":"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"}

package/dist/components/StreamingImage/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-redux"),r=require("../../utils/streaming/getStreamingSourceId.js"),i=require("../VideoStreamingSkeleton/index.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=n(e),a=e.memo((function(){var n=t.useSelector((function(e){return e.currentCall.streamingSourceNumber})),a=t.useSelector((function(e){return e.island.isFromStreaming})),l=t.useSelector((function(e){return e.streaming.sourceImages})),o=t.useSelector((function(e){return e.streaming.videoSources})),c=e.useState(0),s=c[0],f=c[1],d=e.useState(!1),m=d[0],p=d[1],g=n?r.getStreamingSourceId(n):void 0,v=n&&o?Object.values(o).find((function(e){return e.extension===n})):null,S=g?l[g]||(null==v?void 0:v.image):null;return e.useEffect((function(){var e=setInterval((function(){f((function(e){return e+1}))}),500);return function(){return clearInterval(e)}}),[]),e.useEffect((function(){S&&p(!1)}),[S]),a&&n?S?u.default.createElement("div",{className:"pi-mt-4 pi-w-[28.2rem] pi-flex pi-justify-center"},u.default.createElement("div",{className:"pi-relative pi-h-[10.5rem] pi-w-[110rem] pi-overflow-hidden pi-rounded-lg pi-border pi-border-gray-300 dark:pi-border-gray-700"},!m&&u.default.createElement(i.default,{className:"pi-absolute pi-inset-0 pi-w-full pi-h-full"}),u.default.createElement("img",{key:s,src:S,alt:"Streaming view",className:"pi-w-full pi-h-full pi-object-cover pi-transition-opacity pi-duration-300 ".concat(m?"pi-opacity-100":"pi-opacity-0"),onLoad:function(){return p(!0)},onError:function(){return p(!1)}}))):u.default.createElement(i.default,{className:"pi-w-[28.2rem] pi-h-[10.5rem] pi-mt-4"}):null}));exports.default=a;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var r=require("../../utils/streaming/getStreamingSourceId.js"),t=require("../VideoStreamingSkeleton/index.js"),i=require("../../node_modules/react-redux/es/hooks/useSelector.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=n(e),a=e.memo((function(){var n=i.useSelector((function(e){return e.currentCall.streamingSourceNumber})),a=i.useSelector((function(e){return e.island.isFromStreaming})),o=i.useSelector((function(e){return e.streaming.sourceImages})),l=i.useSelector((function(e){return e.streaming.videoSources})),c=e.useState(0),s=c[0],d=c[1],f=e.useState(!1),m=f[0],p=f[1],v=n?r.getStreamingSourceId(n):void 0,g=n&&l?Object.values(l).find((function(e){return e.extension===n})):null,S=v?o[v]||(null==g?void 0:g.image):null;return e.useEffect((function(){var e=setInterval((function(){d((function(e){return e+1}))}),500);return function(){return clearInterval(e)}}),[]),e.useEffect((function(){S&&p(!1)}),[S]),a&&n?S?u.default.createElement("div",{className:"pi-mt-4 pi-w-[28.2rem] pi-flex pi-justify-center"},u.default.createElement("div",{className:"pi-relative pi-h-[10.5rem] pi-w-[110rem] pi-overflow-hidden pi-rounded-lg pi-border pi-border-gray-300 dark:pi-border-gray-700"},!m&&u.default.createElement(t.default,{className:"pi-absolute pi-inset-0 pi-w-full pi-h-full"}),u.default.createElement("img",{key:s,src:S,alt:"Streaming view",className:"pi-w-full pi-h-full pi-object-cover pi-transition-opacity pi-duration-300 ".concat(m?"pi-opacity-100":"pi-opacity-0"),onLoad:function(){return p(!0)},onError:function(){return p(!1)}}))):u.default.createElement(t.default,{className:"pi-w-[28.2rem] pi-h-[10.5rem] pi-mt-4"}):null}));exports.default=a;
 //# sourceMappingURL=index.js.map

package/dist/components/StreamingImage/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/StreamingImage/index.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { FC, memo, useEffect, useState } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState } from '../../store'\nimport { getStreamingSourceId } from '../../utils/streaming/getStreamingSourceId'\nimport VideoStreamingSkeleton from '../VideoStreamingSkeleton'\n\n/*\n Component that displays the streaming image from a source\n */\nconst StreamingImage: FC = () => {\n const streamingSourceNumber = useSelector(\n (state: RootState) => state.currentCall.streamingSourceNumber,\n )\n const isFromStreaming = useSelector((state: RootState) => state.island.isFromStreaming)\n const sourceImages = useSelector((state: RootState) => state.streaming.sourceImages)\n const videoSources = useSelector((state: RootState) => state.streaming.videoSources)\n\n const [refreshKey, setRefreshKey] = useState(0)\n const [imageLoaded, setImageLoaded] = useState(false)\n\n const sourceId = streamingSourceNumber ? getStreamingSourceId(streamingSourceNumber) : undefined\n\n // Find the source to get the image\n const source =\n streamingSourceNumber && videoSources\n ? Object.values(videoSources).find((source) => source.extension === streamingSourceNumber)\n : null\n\n // get image URL from the source ID or from the source object\n const imageUrl = sourceId ? (sourceImages[sourceId] \|\| source?.image) : null\n\n useEffect(() => {\n const interval = setInterval(() => {\n setRefreshKey((prev) => prev + 1)\n }, 500)\n\n return () => clearInterval(interval)\n }, [])\n\n useEffect(() => {\n if (imageUrl) {\n setImageLoaded(false)\n }\n }, [imageUrl])\n\n if (!isFromStreaming \|\| !streamingSourceNumber) {\n return null\n }\n\n if (!imageUrl) {\n return <VideoStreamingSkeleton className='pi-w-[28.2rem] pi-h-[10.5rem] pi-mt-4' />\n }\n\n return (\n <div className='pi-mt-4 pi-w-[28.2rem] pi-flex pi-justify-center'>\n <div className='pi-relative pi-h-[10.5rem] pi-w-[110rem] pi-overflow-hidden pi-rounded-lg pi-border pi-border-gray-300 dark:pi-border-gray-700'>\n {!imageLoaded && (\n <VideoStreamingSkeleton className='pi-absolute pi-inset-0 pi-w-full pi-h-full' />\n )}\n <img\n key={refreshKey}\n src={imageUrl}\n alt='Streaming view'\n className={`pi-w-full pi-h-full pi-object-cover pi-transition-opacity pi-duration-300 ${imageLoaded ? 'pi-opacity-100' : 'pi-opacity-0'\n }`}\n onLoad={() => setImageLoaded(true)}\n onError={() => setImageLoaded(false)}\n />\n </div>\n </div>\n )\n}\n\nexport default memo(StreamingImage)\n"],"names":["memo","streamingSourceNumber","useSelector","state","currentCall","isFromStreaming","island","sourceImages","streaming","videoSources","_a","useState","refreshKey","setRefreshKey","_b","imageLoaded","setImageLoaded","sourceId","getStreamingSourceId","undefined","source","Object","values","find","extension","imageUrl","image","useEffect","interval","setInterval","prev","clearInterval","React","createElement","className","VideoStreamingSkeleton","key","src","alt","concat","onLoad","onError"],"mappings":"~~kTA4EeA~~,EAAAA,EAAAA,MAhEY,WACzB,IAAMC,EAAwBC,eAC5B,SAACC,GAAqB,OAAAA,EAAMC,YAAYH,qBAAlB,IAElBI,EAAkBH,eAAY,SAACC,GAAqB,OAAAA,EAAMG,OAAOD,eAAb,IACpDE,EAAeL,eAAY,SAACC,GAAqB,OAAAA,EAAMK,UAAUD,YAAhB,IACjDE,EAAeP,eAAY,SAACC,GAAqB,OAAAA,EAAMK,UAAUC,YAAhB,IAEjDC,EAA8BC,EAAAA,SAAS,GAAtCC,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAC1BI,EAAgCH,EAAAA,UAAS,GAAxCI,EAAWD,EAAA,GAAEE,EAAcF,EAAA,GAE5BG,EAAWhB,EAAwBiB,EAAoBA,qBAACjB,QAAyBkB,EAGjFC,EACJnB,GAAyBQ,EACrBY,OAAOC,OAAOb,GAAcc,MAAK,SAACH,GAAW,OAAAA,EAAOI,YAAcvB,CAArB,IAC7C,KAGAwB,EAAWR,EAAYV,EAAaU,KAAaG,aAAA,EAAAA,EAAQM,OAAS,KAgBxE,OAdAC,EAAAA,WAAU,WACR,IAAMC,EAAWC,aAAY,WAC3BhB,GAAc,SAACiB,GAAS,OAAAA,EAAO,CAAC,GACjC,GAAE,KAEH,OAAO,WAAM,OAAAC,cAAcH,EAAS,CACrC,GAAE,IAEHD,EAAAA,WAAU,WACJF,GACFT,GAAe,EAEnB,GAAG,CAACS,IAECpB,GAAoBJ,EAIpBwB,EAKHO,EAAA,QAAAC,cAAA,MAAA,CAAKC,UAAU,oDACbF,EAAAA,QAAKC,cAAA,MAAA,CAAAC,UAAU,mIACXnB,GACAiB,EAAAA,QAACC,cAAAE,EAAsB,SAACD,UAAU,+CAEpCF,EAAAA,QACEC,cAAA,MAAA,CAAAG,IAAKxB,EACLyB,IAAKZ,EACLa,IAAI,iBACJJ,UAAW,6EAA6EK,OAAAxB,EAAc,iBAAmB,gBAEzHyB,OAAQ,WAAM,OAAAxB,GAAe,EAAK,EAClCyB,QAAS,WAAM,OAAAzB,GAAe,EAAM,MAhBnCgB,EAAAA,sBAACG,EAAAA,QAAsB,CAACD,UAAU,0CAJlC,IAyBX"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/StreamingImage/index.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { FC, memo, useEffect, useState } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState } from '../../store'\nimport { getStreamingSourceId } from '../../utils/streaming/getStreamingSourceId'\nimport VideoStreamingSkeleton from '../VideoStreamingSkeleton'\n\n/*\n Component that displays the streaming image from a source\n */\nconst StreamingImage: FC = () => {\n const streamingSourceNumber = useSelector(\n (state: RootState) => state.currentCall.streamingSourceNumber,\n )\n const isFromStreaming = useSelector((state: RootState) => state.island.isFromStreaming)\n const sourceImages = useSelector((state: RootState) => state.streaming.sourceImages)\n const videoSources = useSelector((state: RootState) => state.streaming.videoSources)\n\n const [refreshKey, setRefreshKey] = useState(0)\n const [imageLoaded, setImageLoaded] = useState(false)\n\n const sourceId = streamingSourceNumber ? getStreamingSourceId(streamingSourceNumber) : undefined\n\n // Find the source to get the image\n const source =\n streamingSourceNumber && videoSources\n ? Object.values(videoSources).find((source) => source.extension === streamingSourceNumber)\n : null\n\n // get image URL from the source ID or from the source object\n const imageUrl = sourceId ? (sourceImages[sourceId] \|\| source?.image) : null\n\n useEffect(() => {\n const interval = setInterval(() => {\n setRefreshKey((prev) => prev + 1)\n }, 500)\n\n return () => clearInterval(interval)\n }, [])\n\n useEffect(() => {\n if (imageUrl) {\n setImageLoaded(false)\n }\n }, [imageUrl])\n\n if (!isFromStreaming \|\| !streamingSourceNumber) {\n return null\n }\n\n if (!imageUrl) {\n return <VideoStreamingSkeleton className='pi-w-[28.2rem] pi-h-[10.5rem] pi-mt-4' />\n }\n\n return (\n <div className='pi-mt-4 pi-w-[28.2rem] pi-flex pi-justify-center'>\n <div className='pi-relative pi-h-[10.5rem] pi-w-[110rem] pi-overflow-hidden pi-rounded-lg pi-border pi-border-gray-300 dark:pi-border-gray-700'>\n {!imageLoaded && (\n <VideoStreamingSkeleton className='pi-absolute pi-inset-0 pi-w-full pi-h-full' />\n )}\n <img\n key={refreshKey}\n src={imageUrl}\n alt='Streaming view'\n className={`pi-w-full pi-h-full pi-object-cover pi-transition-opacity pi-duration-300 ${imageLoaded ? 'pi-opacity-100' : 'pi-opacity-0'\n }`}\n onLoad={() => setImageLoaded(true)}\n onError={() => setImageLoaded(false)}\n />\n </div>\n </div>\n )\n}\n\nexport default memo(StreamingImage)\n"],"names":["memo","streamingSourceNumber","useSelector","state","currentCall","isFromStreaming","island","sourceImages","streaming","videoSources","_a","useState","refreshKey","setRefreshKey","_b","imageLoaded","setImageLoaded","sourceId","getStreamingSourceId","undefined","source","Object","values","find","extension","imageUrl","image","useEffect","interval","setInterval","prev","clearInterval","React","createElement","className","VideoStreamingSkeleton","key","src","alt","concat","onLoad","onError"],"mappings":"uZA4EeA,EAAAA,EAAAA,MAhEY,WACzB,IAAMC,EAAwBC,eAC5B,SAACC,GAAqB,OAAAA,EAAMC,YAAYH,qBAAlB,IAElBI,EAAkBH,eAAY,SAACC,GAAqB,OAAAA,EAAMG,OAAOD,eAAb,IACpDE,EAAeL,eAAY,SAACC,GAAqB,OAAAA,EAAMK,UAAUD,YAAhB,IACjDE,EAAeP,eAAY,SAACC,GAAqB,OAAAA,EAAMK,UAAUC,YAAhB,IAEjDC,EAA8BC,EAAAA,SAAS,GAAtCC,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAC1BI,EAAgCH,EAAAA,UAAS,GAAxCI,EAAWD,EAAA,GAAEE,EAAcF,EAAA,GAE5BG,EAAWhB,EAAwBiB,EAAoBA,qBAACjB,QAAyBkB,EAGjFC,EACJnB,GAAyBQ,EACrBY,OAAOC,OAAOb,GAAcc,MAAK,SAACH,GAAW,OAAAA,EAAOI,YAAcvB,CAArB,IAC7C,KAGAwB,EAAWR,EAAYV,EAAaU,KAAaG,aAAA,EAAAA,EAAQM,OAAS,KAgBxE,OAdAC,EAAAA,WAAU,WACR,IAAMC,EAAWC,aAAY,WAC3BhB,GAAc,SAACiB,GAAS,OAAAA,EAAO,CAAC,GACjC,GAAE,KAEH,OAAO,WAAM,OAAAC,cAAcH,EAAS,CACrC,GAAE,IAEHD,EAAAA,WAAU,WACJF,GACFT,GAAe,EAEnB,GAAG,CAACS,IAECpB,GAAoBJ,EAIpBwB,EAKHO,EAAA,QAAAC,cAAA,MAAA,CAAKC,UAAU,oDACbF,EAAAA,QAAKC,cAAA,MAAA,CAAAC,UAAU,mIACXnB,GACAiB,EAAAA,QAACC,cAAAE,EAAsB,SAACD,UAAU,+CAEpCF,EAAAA,QACEC,cAAA,MAAA,CAAAG,IAAKxB,EACLyB,IAAKZ,EACLa,IAAI,iBACJJ,UAAW,6EAA6EK,OAAAxB,EAAc,iBAAmB,gBAEzHyB,OAAQ,WAAM,OAAAxB,GAAe,EAAK,EAClCyB,QAAS,WAAM,OAAAzB,GAAe,EAAM,MAhBnCgB,EAAAA,sBAACG,EAAAA,QAAsB,CAACD,UAAU,0CAJlC,IAyBX"}

package/dist/components/SwitchDeviceView/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("react"),i=require("react-redux"),l=require("@fortawesome/react-fontawesome"),a=require("@fortawesome/free-solid-svg-icons"),n=require("../Button.js"),r=require("../../utils/genericFunctions/isEmpty.js"),o=require("../../lib/phone/call.js"),c=require("@nethesis/nethesis-solid-svg-icons"),s=require("../../utils/genericFunctions/eventDispatch.js");require("../../store/index.js");var d=require("../../services/user.js"),u=require("../CustomThemedTooltip.js"),p=require("react-i18next"),f=require("../../utils/deviceUtils.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=m(t);exports.SwitchDeviceView=function(){var m=i.useDispatch(),h=p.useTranslation().t,y=i.useSelector((function(e){return null==e?void 0:e.currentUser})),g=i.useSelector((function(e){return null==e?void 0:e.users})),b=Object.keys((null==y?void 0:y.conversations)||{}).filter((function(e){return!r.isEmpty(y.conversations[e])})),w=f.getAvailableDevices(y,g),x=t.useState(null),k=x[0],E=x[1],N=t.useState({id:"",type:""}),q=N[0],D=N[1],S=b[0],j=function(t){var i,l,a,n;(null==q?void 0:q.id)&&t&&("physical"==(null==q?void 0:q.type)&&"physical"===(null===(i=null==y?void 0:y.default_device)||void 0===i?void 0:i.type)?(m.island.toggleAvoidToShow(!1),o.blindTransferFunction(null==q?void 0:q.id,t),s.eventDispatch("phone-island-call-switched",{})):"physical"===(null==q?void 0:q.type)&&"nethlink"===(null===(l=null==y?void 0:y.default_device)||void 0===l?void 0:l.type)?(m.island.toggleAvoidToShow(!1),n=q,e.__awaiter(void 0,void 0,void 0,(function(){var t,i;return e.__generator(this,(function(e){switch(e.label){case 0:if(t={},!n)return[3,4];t.id=null==n?void 0:n.id,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,d.changeDefaultDevice(t)];case 2:return e.sent(),m.user.updateDefaultDevice(n),[3,4];case 3:return i=e.sent(),console.log(i),[3,4];case 4:return[2]}}))})),m.currentUser.updateCurrentDefaultDevice(q),s.eventDispatch("phone-island-default-device-changed",{}),setTimeout((function(){o.blindTransferFunction(null==q?void 0:q.id,t),s.eventDispatch("phone-island-call-switched",{})}),500),s.eventDispatch("phone-island-call-switched",{})):("mobile"===(null==q?void 0:q.type)||"physical"===(null==q?void 0:q.type)&&"nethlink"!==(null===(a=null==y?void 0:y.default_device)||void 0===a?void 0:a.type))&&(m.island.toggleAvoidToShow(!0),o.blindTransferFunction(null==q?void 0:q.id,t),s.eventDispatch("phone-island-call-switched",{})))};return v.default.createElement(v.default.Fragment,null,v.default.createElement("div",{className:"pi-flex pi-flex-col pi-w-full"},v.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-between"},v.default.createElement("div",{className:"pi-flex pi-items-center pi-space-x-2"},v.default.createElement("h1",{className:"pi-flex pi-text-lg pi-font-medium pi-text-gray-900 dark:pi-text-gray-50"},h("Switch device.Switch device")||""),v.default.createElement(l.FontAwesomeIcon,{icon:a.faCircleInfo,className:"pi-flex pi-w-4 pi-h-4 pi-text-indigo-800 dark:pi-text-indigo-300","data-tooltip-id":"tooltip-switch-information","data-tooltip-content":h("Switch device.Switch information")||""})),v.default.createElement(n.Button,{onClick:function(){return m.island.setIslandView("call")},variant:"transparentSettings","data-tooltip-id":"tooltip-close-settings","data-tooltip-content":h("Common.Close")||""},v.default.createElement(l.FontAwesomeIcon,{icon:a.faXmark,className:"pi-w-5 pi-h-5"}))),v.default.createElement("div",{className:"pi-border-t pi-border-gray-300 dark:pi-border-gray-600 pi-mt-1"}),v.default.createElement("div",{className:"pi-flex pi-flex-col pi-mt-2 pi-h-40 pi-overflow-y-auto pi-space-y-2 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"},w.map((function(e){return v.default.createElement("div",{key:null==e?void 0:e.id,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",onClick:function(){return function(e){D({id:null==e?void 0:e.id,type:null==e?void 0:e.type})}(e)},onMouseEnter:function(){return E(null==e?void 0:e.id)},onMouseLeave:function(){return E(null)}},v.default.createElement("div",{className:"pi-flex pi-items-center pi-max-w-60 pi-truncate"},v.default.createElement(l.FontAwesomeIcon,{icon:"mobile"===(null==e?void 0:e.type)?a.faMobile:"physical"===(null==e?void 0:e.type)?c.faOfficePhone:a.faUser,className:"pi-mr-2 pi-w-5 pi-h-5"}),v.default.createElement("span",{className:"pi-truncate"},"mobile"===(null==e?void 0:e.type)?h("Phone Island.Mobile app"):"physical"===(null==e?void 0:e.type)?null==e?void 0:e.description:"-")),v.default.createElement("div",{className:"pi-flex pi-items-center"},q.id===(null==e?void 0:e.id)&&v.default.createElement(l.FontAwesomeIcon,{icon:a.faCheck,className:"".concat(k===(null==e?void 0:e.id)?"pi-text-gray-700 dark:pi-text-gray-200":"pi-text-emerald-700 dark:pi-text-emerald-500"," pi-w-5 pi-h-5")})))}))),v.default.createElement("div",{className:"pi-flex pi-justify-center pi-mt-2"},v.default.createElement(n.Button,{disabled:""===(null==q?void 0:q.id),variant:"gray",className:"pi-font-medium pi-text-sm pi-leading-5",onClick:function(){return j(S)}},v.default.createElement(l.FontAwesomeIcon,{className:"pi-w-6 pi-h-6 pi-mr-2",icon:c.faArrowsRepeat}),v.default.createElement("span",null,h("Switch device.Switch device"))))),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-close-settings",place:"bottom"}),v.default.createElement(u.CustomThemedTooltip,{id:"tooltip-switch-information",place:"bottom"}))};
+"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("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),l=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),n=require("../Button.js"),r=require("../../utils/genericFunctions/isEmpty.js"),a=require("../../lib/phone/call.js"),o=require("../../node_modules/@nethesis/nethesis-solid-svg-icons/index.mjs.js"),s=require("../../utils/genericFunctions/eventDispatch.js");require("../../store/index.js");var d=require("../../services/user.js"),u=require("../CustomThemedTooltip.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 c=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var p=require("../../utils/deviceUtils.js"),m=require("../../node_modules/react-redux/es/hooks/useDispatch.js"),f=require("../../node_modules/react-redux/es/hooks/useSelector.js");function v(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=v(t);exports.SwitchDeviceView=function(){var v=m.useDispatch(),y=c.useTranslation().t,b=f.useSelector((function(e){return null==e?void 0:e.currentUser})),g=f.useSelector((function(e){return null==e?void 0:e.users})),x=Object.keys((null==b?void 0:b.conversations)||{}).filter((function(e){return!r.isEmpty(b.conversations[e])})),w=p.getAvailableDevices(b,g),j=t.useState(null),k=j[0],E=j[1],q=t.useState({id:"",type:""}),_=q[0],N=q[1],D=x[0],S=function(t){var i,l,n,r;(null==_?void 0:_.id)&&t&&("physical"==(null==_?void 0:_.type)&&"physical"===(null===(i=null==b?void 0:b.default_device)||void 0===i?void 0:i.type)?(v.island.toggleAvoidToShow(!1),a.blindTransferFunction(null==_?void 0:_.id,t),s.eventDispatch("phone-island-call-switched",{})):"physical"===(null==_?void 0:_.type)&&"nethlink"===(null===(l=null==b?void 0:b.default_device)||void 0===l?void 0:l.type)?(v.island.toggleAvoidToShow(!1),r=_,e.__awaiter(void 0,void 0,void 0,(function(){var t,i;return e.__generator(this,(function(e){switch(e.label){case 0:if(t={},!r)return[3,4];t.id=null==r?void 0:r.id,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,d.changeDefaultDevice(t)];case 2:return e.sent(),v.user.updateDefaultDevice(r),[3,4];case 3:return i=e.sent(),console.log(i),[3,4];case 4:return[2]}}))})),v.currentUser.updateCurrentDefaultDevice(_),s.eventDispatch("phone-island-default-device-changed",{}),setTimeout((function(){a.blindTransferFunction(null==_?void 0:_.id,t),s.eventDispatch("phone-island-call-switched",{})}),500),s.eventDispatch("phone-island-call-switched",{})):("mobile"===(null==_?void 0:_.type)||"physical"===(null==_?void 0:_.type)&&"nethlink"!==(null===(n=null==b?void 0:b.default_device)||void 0===n?void 0:n.type))&&(v.island.toggleAvoidToShow(!0),a.blindTransferFunction(null==_?void 0:_.id,t),s.eventDispatch("phone-island-call-switched",{})))};return h.default.createElement(h.default.Fragment,null,h.default.createElement("div",{className:"pi-flex pi-flex-col pi-w-full"},h.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-between"},h.default.createElement("div",{className:"pi-flex pi-items-center pi-space-x-2"},h.default.createElement("h1",{className:"pi-flex pi-text-lg pi-font-medium pi-text-gray-900 dark:pi-text-gray-50"},y("Switch device.Switch device")||""),h.default.createElement(i.FontAwesomeIcon,{icon:l.faCircleInfo,className:"pi-flex pi-w-4 pi-h-4 pi-text-indigo-800 dark:pi-text-indigo-300","data-tooltip-id":"tooltip-switch-information","data-tooltip-content":y("Switch device.Switch information")||""})),h.default.createElement(n.Button,{onClick:function(){return v.island.setIslandView("call")},variant:"transparentSettings","data-tooltip-id":"tooltip-close-settings","data-tooltip-content":y("Common.Close")||""},h.default.createElement(i.FontAwesomeIcon,{icon:l.faXmark,className:"pi-w-5 pi-h-5"}))),h.default.createElement("div",{className:"pi-border-t pi-border-gray-300 dark:pi-border-gray-600 pi-mt-1"}),h.default.createElement("div",{className:"pi-flex pi-flex-col pi-mt-2 pi-h-40 pi-overflow-y-auto pi-space-y-2 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"},w.map((function(e){return h.default.createElement("div",{key:null==e?void 0:e.id,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",onClick:function(){return function(e){N({id:null==e?void 0:e.id,type:null==e?void 0:e.type})}(e)},onMouseEnter:function(){return E(null==e?void 0:e.id)},onMouseLeave:function(){return E(null)}},h.default.createElement("div",{className:"pi-flex pi-items-center pi-max-w-60 pi-truncate"},h.default.createElement(i.FontAwesomeIcon,{icon:"mobile"===(null==e?void 0:e.type)?l.faMobile:"physical"===(null==e?void 0:e.type)?o.faOfficePhone:l.faUser,className:"pi-mr-2 pi-w-5 pi-h-5"}),h.default.createElement("span",{className:"pi-truncate"},"mobile"===(null==e?void 0:e.type)?y("Phone Island.Mobile app"):"physical"===(null==e?void 0:e.type)?null==e?void 0:e.description:"-")),h.default.createElement("div",{className:"pi-flex pi-items-center"},_.id===(null==e?void 0:e.id)&&h.default.createElement(i.FontAwesomeIcon,{icon:l.faCheck,className:"".concat(k===(null==e?void 0:e.id)?"pi-text-gray-700 dark:pi-text-gray-200":"pi-text-emerald-700 dark:pi-text-emerald-500"," pi-w-5 pi-h-5")})))}))),h.default.createElement("div",{className:"pi-flex pi-justify-center pi-mt-2"},h.default.createElement(n.Button,{disabled:""===(null==_?void 0:_.id),variant:"gray",className:"pi-font-medium pi-text-sm pi-leading-5",onClick:function(){return S(D)}},h.default.createElement(i.FontAwesomeIcon,{className:"pi-w-6 pi-h-6 pi-mr-2",icon:o.faArrowsRepeat}),h.default.createElement("span",null,y("Switch device.Switch device"))))),h.default.createElement(u.CustomThemedTooltip,{id:"tooltip-close-settings",place:"bottom"}),h.default.createElement(u.CustomThemedTooltip,{id:"tooltip-switch-information",place:"bottom"}))};
 //# sourceMappingURL=index.js.map

package/dist/components/SwitchDeviceView/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/SwitchDeviceView/index.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { useState, type FC } from 'react'\nimport { useSelector, useDispatch } from 'react-redux'\nimport { RootState, Dispatch } from '../../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faCheck, faCircleInfo, faMobile, faUser, faXmark } from '@fortawesome/free-solid-svg-icons'\nimport { Button } from '../Button'\nimport { isEmpty } from '../../utils/genericFunctions/isEmpty'\nimport { blindTransferFunction } from '../../lib/phone/call'\nimport { faArrowsRepeat, faOfficePhone } from '@nethesis/nethesis-solid-svg-icons'\nimport { eventDispatch } from '../../utils'\nimport { CustomThemedTooltip } from '../CustomThemedTooltip'\nimport { useTranslation } from 'react-i18next'\nimport { getAvailableDevices } from '../../utils/deviceUtils'\nimport { changeDefaultDevice } from '../../services/user'\n\nexport const SwitchDeviceView: FC<SwitchDeviceViewProps> = () => {\n const dispatch = useDispatch<Dispatch>()\n const { t } = useTranslation()\n\n const userInformation: any = useSelector((state: RootState) => state?.currentUser)\n const allUsersInformation: any = useSelector((state: RootState) => state?.users)\n\n // Extract devices with active conversations:\n // Get IDs of devices with active conversations\n const activeConversationIds = Object.keys(userInformation?.conversations \|\| {}).filter(\n (id) => !isEmpty(userInformation.conversations[id]),\n )\n\n const filteredDevices = getAvailableDevices(userInformation, allUsersInformation)\n\n const [hoveredDevice, setHoveredDevice] = useState<string \| null>(null)\n const [selectedSwitchDevices, setSelectedSwitchDevices] = useState({ id: '', type: '' })\n\n // Get the first device ID with active conversation\n const extensionInCall = activeConversationIds[0]\n\n const transferCallOnDevice = (device: any) => {\n setSelectedSwitchDevices({\n id: device?.id,\n type: device?.type,\n })\n }\n\n const setMainDeviceId = async (device: any) => {\n let deviceExtension: any = {}\n if (device) {\n deviceExtension.id = device?.id\n try {\n await changeDefaultDevice(deviceExtension)\n dispatch.user.updateDefaultDevice(device)\n } catch (err) {\n console.log(err)\n }\n }\n }\n\n const blindTransferOnSelectedDevice = (endpointIdInConversation: string) => {\n if (selectedSwitchDevices?.id && endpointIdInConversation) {\n if (\n selectedSwitchDevices?.type == 'physical' &&\n userInformation?.default_device?.type === 'physical'\n ) {\n dispatch.island.toggleAvoidToShow(false)\n blindTransferFunction(selectedSwitchDevices?.id, endpointIdInConversation)\n eventDispatch('phone-island-call-switched', {})\n } else if (\n selectedSwitchDevices?.type === 'physical' &&\n userInformation?.default_device?.type === 'nethlink'\n ) {\n dispatch.island.toggleAvoidToShow(false)\n setMainDeviceId(selectedSwitchDevices)\n dispatch.currentUser.updateCurrentDefaultDevice(selectedSwitchDevices)\n eventDispatch('phone-island-default-device-changed', {})\n setTimeout(() => {\n blindTransferFunction(selectedSwitchDevices?.id, endpointIdInConversation)\n eventDispatch('phone-island-call-switched', {})\n }, 500)\n eventDispatch('phone-island-call-switched', {})\n } else if (\n selectedSwitchDevices?.type === 'mobile' \|\|\n (selectedSwitchDevices?.type === 'physical' &&\n userInformation?.default_device?.type !== 'nethlink')\n ) {\n dispatch.island.toggleAvoidToShow(true)\n blindTransferFunction(selectedSwitchDevices?.id, endpointIdInConversation)\n eventDispatch('phone-island-call-switched', {})\n }\n }\n }\n\n return (\n <>\n <div className='pi-flex pi-flex-col pi-w-full'>\n {/* Header /}\n <div className='pi-flex pi-items-center pi-justify-between'>\n <div className='pi-flex pi-items-center pi-space-x-2'>\n <h1 className='pi-flex pi-text-lg pi-font-medium pi-text-gray-900 dark:pi-text-gray-50'>\n {t('Switch device.Switch device') \|\| ''}\n </h1>\n <FontAwesomeIcon\n icon={faCircleInfo}\n className='pi-flex pi-w-4 pi-h-4 pi-text-indigo-800 dark:pi-text-indigo-300'\n data-tooltip-id='tooltip-switch-information'\n data-tooltip-content={t('Switch device.Switch information') \|\| ''}\n />\n </div>\n\n <Button\n onClick={() => dispatch.island.setIslandView('call')}\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\n {/ Divider /}\n <div className='pi-border-t pi-border-gray-300 dark:pi-border-gray-600 pi-mt-1' />\n\n {/ Devices List/}\n <div className='pi-flex pi-flex-col pi-mt-2 pi-h-40 pi-overflow-y-auto pi-space-y-2 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 {filteredDevices.map((device: any) => (\n <div\n key={device?.id}\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'\n onClick={() => transferCallOnDevice(device)}\n onMouseEnter={() => setHoveredDevice(device?.id)}\n onMouseLeave={() => setHoveredDevice(null)}\n >\n <div className='pi-flex pi-items-center pi-max-w-60 pi-truncate'>\n <FontAwesomeIcon\n icon={\n device?.type === 'mobile'\n ? faMobile\n : device?.type === 'physical'\n ? faOfficePhone\n : faUser\n }\n className='pi-mr-2 pi-w-5 pi-h-5'\n />\n <span className='pi-truncate'>\n {device?.type === 'mobile'\n ? t('Phone Island.Mobile app')\n : device?.type === 'physical'\n ? device?.description\n : '-'}\n </span>\n </div>\n <div className='pi-flex pi-items-center'>\n {selectedSwitchDevices.id === device?.id && (\n <FontAwesomeIcon\n icon={faCheck}\n className={`${\n hoveredDevice === device?.id\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\n {/ Centered Button */}\n <div className='pi-flex pi-justify-center pi-mt-2'>\n <Button\n disabled={selectedSwitchDevices?.id === ''}\n variant='gray'\n className='pi-font-medium pi-text-sm pi-leading-5'\n onClick={() => blindTransferOnSelectedDevice(extensionInCall)}\n >\n <FontAwesomeIcon className='pi-w-6 pi-h-6 pi-mr-2' icon={faArrowsRepeat} />\n <span>{t('Switch device.Switch device')}</span>\n </Button>\n </div>\n </div>\n <CustomThemedTooltip id='tooltip-close-settings' place='bottom' />\n <CustomThemedTooltip id='tooltip-switch-information' place='bottom' />\n </>\n )\n}\n\nexport interface SwitchDeviceViewProps {}\n"],"names":["dispatch","useDispatch","t","useTranslation","userInformation","useSelector","state","currentUser","allUsersInformation","users","activeConversationIds","Object","keys","conversations","filter","id","isEmpty","filteredDevices","getAvailableDevices","_a","useState","hoveredDevice","setHoveredDevice","_b","type","selectedSwitchDevices","setSelectedSwitchDevices","extensionInCall","blindTransferOnSelectedDevice","endpointIdInConversation","device","default_device","island","toggleAvoidToShow","blindTransferFunction","eventDispatch","__awaiter","deviceExtension","changeDefaultDevice","sent","user","updateDefaultDevice","console","log","err_1","updateCurrentDefaultDevice","setTimeout","_c","React","createElement","Fragment","className","FontAwesomeIcon","icon","faCircleInfo","Button","onClick","setIslandView","variant","faXmark","map","key","transferCallOnDevice","onMouseEnter","onMouseLeave","faMobile","faOfficePhone","faUser","description","faCheck","concat","disabled","faArrowsRepeat","CustomThemedTooltip","place"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/SwitchDeviceView/index.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { useState, type FC } from 'react'\nimport { useSelector, useDispatch } from 'react-redux'\nimport { RootState, Dispatch } from '../../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faCheck, faCircleInfo, faMobile, faUser, faXmark } from '@fortawesome/free-solid-svg-icons'\nimport { Button } from '../Button'\nimport { isEmpty } from '../../utils/genericFunctions/isEmpty'\nimport { blindTransferFunction } from '../../lib/phone/call'\nimport { faArrowsRepeat, faOfficePhone } from '@nethesis/nethesis-solid-svg-icons'\nimport { eventDispatch } from '../../utils'\nimport { CustomThemedTooltip } from '../CustomThemedTooltip'\nimport { useTranslation } from 'react-i18next'\nimport { getAvailableDevices } from '../../utils/deviceUtils'\nimport { changeDefaultDevice } from '../../services/user'\n\nexport const SwitchDeviceView: FC<SwitchDeviceViewProps> = () => {\n const dispatch = useDispatch<Dispatch>()\n const { t } = useTranslation()\n\n const userInformation: any = useSelector((state: RootState) => state?.currentUser)\n const allUsersInformation: any = useSelector((state: RootState) => state?.users)\n\n // Extract devices with active conversations:\n // Get IDs of devices with active conversations\n const activeConversationIds = Object.keys(userInformation?.conversations \|\| {}).filter(\n (id) => !isEmpty(userInformation.conversations[id]),\n )\n\n const filteredDevices = getAvailableDevices(userInformation, allUsersInformation)\n\n const [hoveredDevice, setHoveredDevice] = useState<string \| null>(null)\n const [selectedSwitchDevices, setSelectedSwitchDevices] = useState({ id: '', type: '' })\n\n // Get the first device ID with active conversation\n const extensionInCall = activeConversationIds[0]\n\n const transferCallOnDevice = (device: any) => {\n setSelectedSwitchDevices({\n id: device?.id,\n type: device?.type,\n })\n }\n\n const setMainDeviceId = async (device: any) => {\n let deviceExtension: any = {}\n if (device) {\n deviceExtension.id = device?.id\n try {\n await changeDefaultDevice(deviceExtension)\n dispatch.user.updateDefaultDevice(device)\n } catch (err) {\n console.log(err)\n }\n }\n }\n\n const blindTransferOnSelectedDevice = (endpointIdInConversation: string) => {\n if (selectedSwitchDevices?.id && endpointIdInConversation) {\n if (\n selectedSwitchDevices?.type == 'physical' &&\n userInformation?.default_device?.type === 'physical'\n ) {\n dispatch.island.toggleAvoidToShow(false)\n blindTransferFunction(selectedSwitchDevices?.id, endpointIdInConversation)\n eventDispatch('phone-island-call-switched', {})\n } else if (\n selectedSwitchDevices?.type === 'physical' &&\n userInformation?.default_device?.type === 'nethlink'\n ) {\n dispatch.island.toggleAvoidToShow(false)\n setMainDeviceId(selectedSwitchDevices)\n dispatch.currentUser.updateCurrentDefaultDevice(selectedSwitchDevices)\n eventDispatch('phone-island-default-device-changed', {})\n setTimeout(() => {\n blindTransferFunction(selectedSwitchDevices?.id, endpointIdInConversation)\n eventDispatch('phone-island-call-switched', {})\n }, 500)\n eventDispatch('phone-island-call-switched', {})\n } else if (\n selectedSwitchDevices?.type === 'mobile' \|\|\n (selectedSwitchDevices?.type === 'physical' &&\n userInformation?.default_device?.type !== 'nethlink')\n ) {\n dispatch.island.toggleAvoidToShow(true)\n blindTransferFunction(selectedSwitchDevices?.id, endpointIdInConversation)\n eventDispatch('phone-island-call-switched', {})\n }\n }\n }\n\n return (\n <>\n <div className='pi-flex pi-flex-col pi-w-full'>\n {/* Header /}\n <div className='pi-flex pi-items-center pi-justify-between'>\n <div className='pi-flex pi-items-center pi-space-x-2'>\n <h1 className='pi-flex pi-text-lg pi-font-medium pi-text-gray-900 dark:pi-text-gray-50'>\n {t('Switch device.Switch device') \|\| ''}\n </h1>\n <FontAwesomeIcon\n icon={faCircleInfo}\n className='pi-flex pi-w-4 pi-h-4 pi-text-indigo-800 dark:pi-text-indigo-300'\n data-tooltip-id='tooltip-switch-information'\n data-tooltip-content={t('Switch device.Switch information') \|\| ''}\n />\n </div>\n\n <Button\n onClick={() => dispatch.island.setIslandView('call')}\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\n {/ Divider /}\n <div className='pi-border-t pi-border-gray-300 dark:pi-border-gray-600 pi-mt-1' />\n\n {/ Devices List/}\n <div className='pi-flex pi-flex-col pi-mt-2 pi-h-40 pi-overflow-y-auto pi-space-y-2 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 {filteredDevices.map((device: any) => (\n <div\n key={device?.id}\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'\n onClick={() => transferCallOnDevice(device)}\n onMouseEnter={() => setHoveredDevice(device?.id)}\n onMouseLeave={() => setHoveredDevice(null)}\n >\n <div className='pi-flex pi-items-center pi-max-w-60 pi-truncate'>\n <FontAwesomeIcon\n icon={\n device?.type === 'mobile'\n ? faMobile\n : device?.type === 'physical'\n ? faOfficePhone\n : faUser\n }\n className='pi-mr-2 pi-w-5 pi-h-5'\n />\n <span className='pi-truncate'>\n {device?.type === 'mobile'\n ? t('Phone Island.Mobile app')\n : device?.type === 'physical'\n ? device?.description\n : '-'}\n </span>\n </div>\n <div className='pi-flex pi-items-center'>\n {selectedSwitchDevices.id === device?.id && (\n <FontAwesomeIcon\n icon={faCheck}\n className={`${\n hoveredDevice === device?.id\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\n {/ Centered Button */}\n <div className='pi-flex pi-justify-center pi-mt-2'>\n <Button\n disabled={selectedSwitchDevices?.id === ''}\n variant='gray'\n className='pi-font-medium pi-text-sm pi-leading-5'\n onClick={() => blindTransferOnSelectedDevice(extensionInCall)}\n >\n <FontAwesomeIcon className='pi-w-6 pi-h-6 pi-mr-2' icon={faArrowsRepeat} />\n <span>{t('Switch device.Switch device')}</span>\n </Button>\n </div>\n </div>\n <CustomThemedTooltip id='tooltip-close-settings' place='bottom' />\n <CustomThemedTooltip id='tooltip-switch-information' place='bottom' />\n </>\n )\n}\n\nexport interface SwitchDeviceViewProps {}\n"],"names":["dispatch","useDispatch","t","useTranslation","userInformation","useSelector","state","currentUser","allUsersInformation","users","activeConversationIds","Object","keys","conversations","filter","id","isEmpty","filteredDevices","getAvailableDevices","_a","useState","hoveredDevice","setHoveredDevice","_b","type","selectedSwitchDevices","setSelectedSwitchDevices","extensionInCall","blindTransferOnSelectedDevice","endpointIdInConversation","device","default_device","island","toggleAvoidToShow","blindTransferFunction","eventDispatch","__awaiter","deviceExtension","changeDefaultDevice","sent","user","updateDefaultDevice","console","log","err_1","updateCurrentDefaultDevice","setTimeout","_c","React","createElement","Fragment","className","FontAwesomeIcon","icon","faCircleInfo","Button","onClick","setIslandView","variant","faXmark","map","key","transferCallOnDevice","onMouseEnter","onMouseLeave","faMobile","faOfficePhone","faUser","description","faCheck","concat","disabled","faArrowsRepeat","CustomThemedTooltip","place"],"mappings":"u+CAkB2D,WACzD,IAAMA,EAAWC,EAAAA,cACTC,EAAMC,qBAERC,EAAuBC,EAAAA,aAAY,SAACC,GAAqB,OAAAA,eAAAA,EAAOC,WAAW,IAC3EC,EAA2BH,EAAAA,aAAY,SAACC,GAAqB,OAAAA,eAAAA,EAAOG,KAAK,IAIzEC,EAAwBC,OAAOC,MAAKR,eAAAA,EAAiBS,gBAAiB,CAAE,GAAEC,QAC9E,SAACC,GAAO,OAACC,EAAAA,QAAQZ,EAAgBS,cAAcE,GAAI,IAG/CE,EAAkBC,EAAAA,oBAAoBd,EAAiBI,GAEvDW,EAAoCC,EAAAA,SAAwB,MAA3DC,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAChCI,EAAoDH,EAAAA,SAAS,CAAEL,GAAI,GAAIS,KAAM,KAA5EC,OAAuBC,OAGxBC,EAAkBjB,EAAsB,GAsBxCkB,EAAgC,SAACC,aAbRC,GAczBL,aAAqB,EAArBA,EAAuBV,KAAMc,IAEE,aAA/BJ,eAAAA,EAAuBD,OACmB,cAAT,QAAjCL,EAAAf,aAAA,EAAAA,EAAiB2B,sBAAgB,IAAAZ,OAAA,EAAAA,EAAAK,OAEjCxB,EAASgC,OAAOC,mBAAkB,GAClCC,EAAAA,sBAAsBT,aAAqB,EAArBA,EAAuBV,GAAIc,GACjDM,gBAAc,6BAA8B,CAAA,IAEZ,cAAhCV,eAAAA,EAAuBD,OACmB,cAAT,QAAjCD,EAAAnB,aAAA,EAAAA,EAAiB2B,sBAAgB,IAAAR,OAAA,EAAAA,EAAAC,OAEjCxB,EAASgC,OAAOC,mBAAkB,GA1BTH,EA2BTL,EA3BoBW,EAAAA,eAAA,OAAA,OAAA,GAAA,iFAEpC,GADAC,EAAuB,CAAA,GACvBP,EAAA,MAAM,CAAA,EAAA,GACRO,EAAgBtB,GAAKe,aAAA,EAAAA,EAAQf,oBAE3B,6BAAA,CAAA,EAAMuB,sBAAoBD,kBAA1BlB,EAAAoB,OACAvC,EAASwC,KAAKC,oBAAoBX,kCAElCY,QAAQC,IAAIC,iCAoBZ5C,EAASO,YAAYsC,2BAA2BpB,GAChDU,gBAAc,sCAAuC,CAAA,GACrDW,YAAW,WACTZ,EAAAA,sBAAsBT,aAAqB,EAArBA,EAAuBV,GAAIc,GACjDM,gBAAc,6BAA8B,CAAA,EAC7C,GAAE,KACHA,gBAAc,6BAA8B,CAAA,KAEZ,YAAhCV,eAAAA,EAAuBD,OACU,cAAhCC,eAAAA,EAAuBD,OACoB,cAAT,QAAjCuB,EAAA3C,aAAA,EAAAA,EAAiB2B,sBAAgB,IAAAgB,OAAA,EAAAA,EAAAvB,SAEnCxB,EAASgC,OAAOC,mBAAkB,GAClCC,EAAAA,sBAAsBT,aAAqB,EAArBA,EAAuBV,GAAIc,GACjDM,gBAAc,6BAA8B,CAAA,IAGlD,EAEA,OACEa,UAAAC,cAAAD,EAAA,QAAAE,SAAA,KACEF,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,iCAEbH,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,8CACbH,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,wCACbH,UAAIC,cAAA,KAAA,CAAAE,UAAU,2EACXjD,EAAE,gCAAkC,IAEvC8C,EAAA,QAAAC,cAACG,EAAeA,gBACd,CAAAC,KAAMC,EAAAA,aACNH,UAAU,qFACM,6BAA4B,uBACtBjD,EAAE,qCAAuC,MAInE8C,UAAAC,cAACM,EAAAA,OAAM,CACLC,QAAS,WAAM,OAAAxD,EAASgC,OAAOyB,cAAc,SAC7CC,QAAQ,sBACQ,kBAAA,yBACM,uBAAAxD,EAAE,iBAAmB,IAE3C8C,UAACC,cAAAG,EAAAA,gBAAgB,CAAAC,KAAMM,EAAAA,QAASR,UAAU,oBAK9CH,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,mEAGfH,EAAAA,QAAAC,cAAA,MAAA,CAAKE,UAAU,gXACZlC,EAAgB2C,KAAI,SAAC9B,GAAgB,OACpCkB,EACE,QAAAC,cAAA,MAAA,CAAAY,IAAK/B,aAAA,EAAAA,EAAQf,GACboC,UAAU,4OACVK,QAAS,WAAM,OA1FE,SAAC1B,GAC5BJ,EAAyB,CACvBX,GAAIe,aAAA,EAAAA,EAAQf,GACZS,KAAMM,aAAA,EAAAA,EAAQN,MAElB,CAqF2BsC,CAAqBhC,EAAO,EAC3CiC,aAAc,WAAM,OAAAzC,EAAiBQ,aAAM,EAANA,EAAQf,GAAG,EAChDiD,aAAc,WAAM,OAAA1C,EAAiB,QAErC0B,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,mDACbH,EAAAA,QAAAC,cAACG,EAAAA,gBAAe,CACdC,KACmB,YAAjBvB,aAAA,EAAAA,EAAQN,MACJyC,EAAQA,SACS,cAAjBnC,eAAAA,EAAQN,MACR0C,EAAaA,cACbC,SAENhB,UAAU,0BAEZH,EAAA,QAAAC,cAAA,OAAA,CAAME,UAAU,eACI,YAAjBrB,aAAA,EAAAA,EAAQN,MACLtB,EAAE,2BACe,cAAjB4B,eAAAA,EAAQN,MACRM,aAAA,EAAAA,EAAQsC,YACR,MAGRpB,EAAA,QAAAC,cAAA,MAAA,CAAKE,UAAU,2BACZ1B,EAAsBV,MAAOe,aAAA,EAAAA,EAAQf,KACpCiC,EAAC,QAAAC,cAAAG,EAAeA,iBACdC,KAAMgB,EAAOA,QACblB,UAAW,GAAAmB,OACTjD,KAAkBS,eAAAA,EAAQf,IACtB,yCACA,+CAA8C,qBAM7D,KAIHiC,EAAAA,QAAKC,cAAA,MAAA,CAAAE,UAAU,qCACbH,EAAAA,QAAAC,cAACM,SAAM,CACLgB,SAAwC,MAA9B9C,aAAqB,EAArBA,EAAuBV,IACjC2C,QAAQ,OACRP,UAAU,yCACVK,QAAS,WAAM,OAAA5B,EAA8BD,KAE7CqB,EAAC,QAAAC,cAAAG,mBAAgBD,UAAU,wBAAwBE,KAAMmB,EAAAA,iBACzDxB,EAAA,QAAAC,cAAA,OAAA,KAAO/C,EAAE,mCAIf8C,EAAC,QAAAC,cAAAwB,uBAAoB1D,GAAG,yBAAyB2D,MAAM,WACvD1B,UAAAC,cAACwB,EAAAA,oBAAmB,CAAC1D,GAAG,6BAA6B2D,MAAM,WAGjE"}

package/dist/components/SwitchInputView/DropdownContent.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-redux"),i=require("@fortawesome/react-fontawesome"),a=require("@fortawesome/free-solid-svg-icons"),r=require("@headlessui/react"),n=require("../../lib/user/default_device.js"),o=require("../../utils/customHooks/useEventListener.js"),l=require("../../utils/genericFunctions/eventDispatch.js"),c=require("../../utils/genericFunctions/localStorage.js");require("tslib"),require("../../store/index.js");var p=require("../CustomThemedTooltip.js"),d=require("react-i18next");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=s(e);exports.default=function(s){s.isTransferView;var m=t.useSelector((function(e){return e.webrtc})).sipcall,f=d.useTranslation().t,g=t.useSelector((function(e){return e.player.remoteAudio})),v=e.useState(c.getJSONItem("phone-island-audio-input-device").deviceId||null),y=v[0],h=v[1],k=e.useState(c.getJSONItem("phone-island-audio-output-device").deviceId||null),x=k[0],b=k[1],E=function(e){h(e),m.webrtcStuff.myStream?null==m||m.replaceTracks({tracks:[{type:"audio",mid:"0",capture:{deviceId:{exact:e}}}],success:function(){console.info("Audio input device switch success!"),c.setJSONItem("phone-island-audio-input-device",{deviceId:e}),l.eventDispatch("phone-island-call-audio-input-switched",{})},error:function(e){console.error("Audio input device switch error:",e)}}):(c.setJSONItem("phone-island-audio-input-device",{deviceId:e}),l.eventDispatch("phone-island-call-audio-input-switched",{}))};o.useEventListener("phone-island-call-audio-input-switch",(function(e){E(e.deviceId)}));var I=function(e){b(e),null==g||g.current.setSinkId(e).then((function(){console.info("Audio output device switch success!"),c.setJSONItem("phone-island-audio-output-device",{deviceId:e}),l.eventDispatch("phone-island-call-audio-output-switched",{})})).catch((function(e){console.error("Audio output device switch error:",e)}))};o.useEventListener("phone-island-call-audio-output-switch",(function(e){I(e.deviceId)}));var w=e.useState([]),N=w[0],S=w[1];e.useEffect((function(){var e=function(){navigator.mediaDevices.enumerateDevices().then((function(e){S(e)})).catch((function(e){console.error("error",e)}))};return e(),navigator.mediaDevices.addEventListener("devicechange",e),function(){navigator.mediaDevices.removeEventListener("devicechange",e)}}),[x,y]);var C=t.useSelector((function(e){return e.darkTheme})).theme,F=function(e){l.eventDispatch("phone-island-theme-change",{selectedTheme:e})},A=t.useSelector((function(e){return e.currentCall})).transferring,D=t.useSelector((function(e){return e.listen})).isListen;return u.default.createElement(u.default.Fragment,null,n.isWebRTC()?u.default.createElement(r.Menu,{as:"div",className:"relative inline-block text-left","data-stop-propagation":!0,"data-tooltip-id":"tooltip-left-settings-devices","data-tooltip-content":f("Tooltip.Settings")},u.default.createElement(r.MenuButton,{className:"pi-bg-transparent dark:enabled:hover:pi-bg-gray-600/30 enabled:hover:pi-bg-gray-200/70  dark:focus:pi-ring-gray-500 focus:pi-ring-gray-400 pi-flex pi-font-light pi-content-center pi-items-center pi-justify-center pi-tracking-wide pi-duration-200 pi-transform pi-outline-none focus:pi-ring-2 focus:pi-z-20 focus:pi-ring-offset-2 disabled:pi-opacity-75 dark:pi-text-white pi-text-gray-600 pi-border pi-border-transparent focus:pi-ring-offset-gray-200 dark:focus:pi-ring-offset-black pi-rounded-full pi-text-sm pi-leading-4 pi-h-12 pi-w-12 pi-col-start-auto pi-transition-color pi-shrink-0","data-stop-propagation":!0},u.default.createElement(i.FontAwesomeIcon,{size:"xl",icon:a.faEllipsis,className:"dark:pi-text-gray-200 pi-text-gray-700","data-stop-propagation":!0})),u.default.createElement(r.Transition,{as:e.Fragment,enter:"transition ease-out duration-100",enterFrom:"transform opacity-0 scale-95",enterTo:"transform opacity-100 scale-100",leave:"transition ease-in duration-75",leaveFrom:"transform opacity-100 scale-100",leaveTo:"transform opacity-0 scale-95"},u.default.createElement(r.MenuItems,{className:"".concat(A?"pi-right-[1.5rem]":"pi-right-[4.5rem]"," \n              ").concat(D?"pi-max-h-[9.125rem] pi-mt-[-8.5rem]":"pi-max-h-[13.125rem] pi-mt-[-12.5rem]","\n               pi-z-50 pi-absolute pi-w-56 pi-origin-top-right pi-rounded-md pi-shadow-lg pi-ring-1 dark:pi-bg-gray-950 pi-bg-gray-50 pi-bg-opacity-[0.99] dark:pi-bg-opacity-[0.99] pi-ring-black pi-ring-opacity-5 pi-focus:outline-none pi-cursor-auto pi-border-gray-300 dark:pi-border-gray-600 pi-border pi-py-2 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"),"data-stop-propagation":!0},u.default.createElement("div",{className:"","data-stop-propagation":!0},!D&&u.default.createElement(u.default.Fragment,null," ",u.default.createElement("div",{className:"pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4"},f("DropdownContent.Microphones")),N.filter((function(e){return"audioinput"===(null==e?void 0:e.kind)})).map((function(e,t){return u.default.createElement(r.MenuItem,{key:t},(function(r){var n=r.active;return u.default.createElement("div",{className:"pi-flex pi-py-2 pi-px-2 ".concat(n?"pi-bg-gray-200 dark:pi-bg-gray-700":""),onClick:function(){return E(e.deviceId)},"data-stop-propagation":!0},y===(null==e?void 0:e.deviceId)&&u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-2"}),!y&&"default"===(null==e?void 0:e.deviceId)&&u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-2"}),u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faMicrophone,className:"".concat(null!==y&&""!==y&&y!==(null==e?void 0:e.deviceId)?"pi-ml-6":""!==y&&null!==y&&y===(null==e?void 0:e.deviceId)?"":null===y&&"default"!==(null==e?void 0:e.deviceId)?"pi-ml-6":""," dark:pi-text-gray-100 pi-text-gray-600 pi-mr-1")}),u.default.createElement("div",{className:"".concat(n?"dark:pi-text-gray-50 pi-text-gray-900":"dark:pi-text-gray-50 pi-text-gray-700")},(null==e?void 0:e.label)||"Input device ".concat(t+1)))}))})),u.default.createElement("div",{className:"pi-relative pi-py-2"},u.default.createElement("div",{className:"pi-absolute pi-inset-0 pi-flex pi-items-center","aria-hidden":"true"},u.default.createElement("div",{className:"pi-w-full pi-border-t pi-border-gray-400 dark:pi-border-gray-600"})))),u.default.createElement("div",{className:"pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4","data-stop-propagation":!0},f("DropdownContent.Speakers")),N.filter((function(e){return"audiooutput"===(null==e?void 0:e.kind)})).map((function(e,t){return u.default.createElement(r.MenuItem,{key:t},(function(r){var n=r.active;return u.default.createElement("div",{className:"pi-flex pi-py-2 pi-px-2 ".concat(n?"pi-bg-gray-200 dark:pi-bg-gray-700":""),onClick:function(){return I(null==e?void 0:e.deviceId)},"data-stop-propagation":!0},x===(null==e?void 0:e.deviceId)&&u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-2"}),!x&&"default"===(null==e?void 0:e.deviceId)&&u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-2"}),u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faVolumeHigh,className:"".concat(null!==x&&""!==x&&x!==(null==e?void 0:e.deviceId)?"pi-ml-6":""!==x&&null!==x&&x===(null==e?void 0:e.deviceId)?"":null===x&&"default"!==(null==e?void 0:e.deviceId)?"pi-ml-6":""," dark:pi-text-gray-100 pi-text-gray-600 pi-mr-1")}),u.default.createElement("div",{className:"".concat(n?"dark:pi-text-gray-50 pi-text-gray-900":"dark:pi-text-gray-50 pi-text-gray-700")},(null==e?void 0:e.label)||"Output device ".concat(t+1)))}))})),u.default.createElement("div",{className:"pi-relative pi-py-2"},u.default.createElement("div",{className:"pi-absolute pi-inset-0 pi-flex pi-items-center","aria-hidden":"true"},u.default.createElement("div",{className:"pi-w-full pi-border-t pi-border-gray-400 dark:pi-border-gray-600"}))),u.default.createElement("div",{className:"pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4","data-stop-propagation":!0},f("DropdownContent.Theme")),u.default.createElement("div",{className:"pi-flex pi-py-2 pi-px-2 dark:hover:pi-text-gray-50 hover:pi-text-gray-900 dark:pi-text-gray-50 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700",onClick:function(){return F("dark")},"data-stop-propagation":!0},"dark"===C&&u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-[0.57rem]"}),u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faMoon,className:"".concat("dark"!==C?"pi-ml-[1.49rem] pi-mr-[0.42rem]":"pi-mr-[0.4rem]"," dark:pi-text-gray-100 pi-text-gray-600 ")}),u.default.createElement("div",null,f("DropdownContent.Dark"))),u.default.createElement("div",{className:"pi-flex pi-py-2 pi-px-2 dark:hover:pi-text-gray-50 hover:pi-text-gray-900 dark:pi-text-gray-50 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700",onClick:function(){return F("light")},"data-stop-propagation":!0},"light"===C&&u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-[0.4rem]"}),u.default.createElement(i.FontAwesomeIcon,{size:"lg",icon:a.faSun,className:"".concat("light"!==C?"pi-ml-[1.4rem] pi-mr-[0.27rem]":"pi-mr-[0.28rem]"," dark:pi-text-gray-100 pi-text-gray-600 ")}),u.default.createElement("div",null,f("DropdownContent.Light"))))))):u.default.createElement("div",null),u.default.createElement(p.CustomThemedTooltip,{id:"tooltip-left-settings-devices",place:"left"}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../node_modules/react-redux/es/index.js");var t=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),i=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),a=require("../../node_modules/@headlessui/react/dist/components/menu/menu.js"),r=require("../../node_modules/@headlessui/react/dist/components/transition/transition.js"),n=require("../../lib/user/default_device.js"),o=require("../../utils/customHooks/useEventListener.js"),l=require("../../utils/genericFunctions/eventDispatch.js"),s=require("../../utils/genericFunctions/localStorage.js");require("../../node_modules/tslib/tslib.es6.js"),require("../../store/index.js");var c=require("../CustomThemedTooltip.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 p=require("../../node_modules/react-redux/es/hooks/useSelector.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=u(e);exports.default=function(u){u.isTransferView;var f=p.useSelector((function(e){return e.webrtc})).sipcall,g=d.useTranslation().t,v=p.useSelector((function(e){return e.player.remoteAudio})),y=e.useState(s.getJSONItem("phone-island-audio-input-device").deviceId||null),h=y[0],x=y[1],k=e.useState(s.getJSONItem("phone-island-audio-output-device").deviceId||null),b=k[0],E=k[1],I=function(e){x(e),f.webrtcStuff.myStream?null==f||f.replaceTracks({tracks:[{type:"audio",mid:"0",capture:{deviceId:{exact:e}}}],success:function(){console.info("Audio input device switch success!"),s.setJSONItem("phone-island-audio-input-device",{deviceId:e}),l.eventDispatch("phone-island-call-audio-input-switched",{})},error:function(e){console.error("Audio input device switch error:",e)}}):(s.setJSONItem("phone-island-audio-input-device",{deviceId:e}),l.eventDispatch("phone-island-call-audio-input-switched",{}))};o.useEventListener("phone-island-call-audio-input-switch",(function(e){I(e.deviceId)}));var w=function(e){E(e),null==v||v.current.setSinkId(e).then((function(){console.info("Audio output device switch success!"),s.setJSONItem("phone-island-audio-output-device",{deviceId:e}),l.eventDispatch("phone-island-call-audio-output-switched",{})})).catch((function(e){console.error("Audio output device switch error:",e)}))};o.useEventListener("phone-island-call-audio-output-switch",(function(e){w(e.deviceId)}));var N=e.useState([]),j=N[0],q=N[1];e.useEffect((function(){var e=function(){navigator.mediaDevices.enumerateDevices().then((function(e){q(e)})).catch((function(e){console.error("error",e)}))};return e(),navigator.mediaDevices.addEventListener("devicechange",e),function(){navigator.mediaDevices.removeEventListener("devicechange",e)}}),[b,h]);var S=p.useSelector((function(e){return e.darkTheme})).theme,C=function(e){l.eventDispatch("phone-island-theme-change",{selectedTheme:e})},F=p.useSelector((function(e){return e.currentCall})).transferring,A=p.useSelector((function(e){return e.listen})).isListen;return m.default.createElement(m.default.Fragment,null,n.isWebRTC()?m.default.createElement(a.Menu,{as:"div",className:"relative inline-block text-left","data-stop-propagation":!0,"data-tooltip-id":"tooltip-left-settings-devices","data-tooltip-content":g("Tooltip.Settings")},m.default.createElement(a.MenuButton,{className:"pi-bg-transparent dark:enabled:hover:pi-bg-gray-600/30 enabled:hover:pi-bg-gray-200/70  dark:focus:pi-ring-gray-500 focus:pi-ring-gray-400 pi-flex pi-font-light pi-content-center pi-items-center pi-justify-center pi-tracking-wide pi-duration-200 pi-transform pi-outline-none focus:pi-ring-2 focus:pi-z-20 focus:pi-ring-offset-2 disabled:pi-opacity-75 dark:pi-text-white pi-text-gray-600 pi-border pi-border-transparent focus:pi-ring-offset-gray-200 dark:focus:pi-ring-offset-black pi-rounded-full pi-text-sm pi-leading-4 pi-h-12 pi-w-12 pi-col-start-auto pi-transition-color pi-shrink-0","data-stop-propagation":!0},m.default.createElement(t.FontAwesomeIcon,{size:"xl",icon:i.faEllipsis,className:"dark:pi-text-gray-200 pi-text-gray-700","data-stop-propagation":!0})),m.default.createElement(r.Transition,{as:e.Fragment,enter:"transition ease-out duration-100",enterFrom:"transform opacity-0 scale-95",enterTo:"transform opacity-100 scale-100",leave:"transition ease-in duration-75",leaveFrom:"transform opacity-100 scale-100",leaveTo:"transform opacity-0 scale-95"},m.default.createElement(a.MenuItems,{className:"".concat(F?"pi-right-[1.5rem]":"pi-right-[4.5rem]"," \n              ").concat(A?"pi-max-h-[9.125rem] pi-mt-[-8.5rem]":"pi-max-h-[13.125rem] pi-mt-[-12.5rem]","\n               pi-z-50 pi-absolute pi-w-56 pi-origin-top-right pi-rounded-md pi-shadow-lg pi-ring-1 dark:pi-bg-gray-950 pi-bg-gray-50 pi-bg-opacity-[0.99] dark:pi-bg-opacity-[0.99] pi-ring-black pi-ring-opacity-5 pi-focus:outline-none pi-cursor-auto pi-border-gray-300 dark:pi-border-gray-600 pi-border pi-py-2 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"),"data-stop-propagation":!0},m.default.createElement("div",{className:"","data-stop-propagation":!0},!A&&m.default.createElement(m.default.Fragment,null," ",m.default.createElement("div",{className:"pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4"},g("DropdownContent.Microphones")),j.filter((function(e){return"audioinput"===(null==e?void 0:e.kind)})).map((function(e,r){return m.default.createElement(a.MenuItem,{key:r},(function(a){var n=a.active;return m.default.createElement("div",{className:"pi-flex pi-py-2 pi-px-2 ".concat(n?"pi-bg-gray-200 dark:pi-bg-gray-700":""),onClick:function(){return I(e.deviceId)},"data-stop-propagation":!0},h===(null==e?void 0:e.deviceId)&&m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-2"}),!h&&"default"===(null==e?void 0:e.deviceId)&&m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-2"}),m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faMicrophone,className:"".concat(null!==h&&""!==h&&h!==(null==e?void 0:e.deviceId)?"pi-ml-6":""!==h&&null!==h&&h===(null==e?void 0:e.deviceId)?"":null===h&&"default"!==(null==e?void 0:e.deviceId)?"pi-ml-6":""," dark:pi-text-gray-100 pi-text-gray-600 pi-mr-1")}),m.default.createElement("div",{className:"".concat(n?"dark:pi-text-gray-50 pi-text-gray-900":"dark:pi-text-gray-50 pi-text-gray-700")},(null==e?void 0:e.label)||"Input device ".concat(r+1)))}))})),m.default.createElement("div",{className:"pi-relative pi-py-2"},m.default.createElement("div",{className:"pi-absolute pi-inset-0 pi-flex pi-items-center","aria-hidden":"true"},m.default.createElement("div",{className:"pi-w-full pi-border-t pi-border-gray-400 dark:pi-border-gray-600"})))),m.default.createElement("div",{className:"pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4","data-stop-propagation":!0},g("DropdownContent.Speakers")),j.filter((function(e){return"audiooutput"===(null==e?void 0:e.kind)})).map((function(e,r){return m.default.createElement(a.MenuItem,{key:r},(function(a){var n=a.active;return m.default.createElement("div",{className:"pi-flex pi-py-2 pi-px-2 ".concat(n?"pi-bg-gray-200 dark:pi-bg-gray-700":""),onClick:function(){return w(null==e?void 0:e.deviceId)},"data-stop-propagation":!0},b===(null==e?void 0:e.deviceId)&&m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-2"}),!b&&"default"===(null==e?void 0:e.deviceId)&&m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-2"}),m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faVolumeHigh,className:"".concat(null!==b&&""!==b&&b!==(null==e?void 0:e.deviceId)?"pi-ml-6":""!==b&&null!==b&&b===(null==e?void 0:e.deviceId)?"":null===b&&"default"!==(null==e?void 0:e.deviceId)?"pi-ml-6":""," dark:pi-text-gray-100 pi-text-gray-600 pi-mr-1")}),m.default.createElement("div",{className:"".concat(n?"dark:pi-text-gray-50 pi-text-gray-900":"dark:pi-text-gray-50 pi-text-gray-700")},(null==e?void 0:e.label)||"Output device ".concat(r+1)))}))})),m.default.createElement("div",{className:"pi-relative pi-py-2"},m.default.createElement("div",{className:"pi-absolute pi-inset-0 pi-flex pi-items-center","aria-hidden":"true"},m.default.createElement("div",{className:"pi-w-full pi-border-t pi-border-gray-400 dark:pi-border-gray-600"}))),m.default.createElement("div",{className:"pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4","data-stop-propagation":!0},g("DropdownContent.Theme")),m.default.createElement("div",{className:"pi-flex pi-py-2 pi-px-2 dark:hover:pi-text-gray-50 hover:pi-text-gray-900 dark:pi-text-gray-50 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700",onClick:function(){return C("dark")},"data-stop-propagation":!0},"dark"===S&&m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-[0.57rem]"}),m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faMoon,className:"".concat("dark"!==S?"pi-ml-[1.49rem] pi-mr-[0.42rem]":"pi-mr-[0.4rem]"," dark:pi-text-gray-100 pi-text-gray-600 ")}),m.default.createElement("div",null,g("DropdownContent.Dark"))),m.default.createElement("div",{className:"pi-flex pi-py-2 pi-px-2 dark:hover:pi-text-gray-50 hover:pi-text-gray-900 dark:pi-text-gray-50 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700",onClick:function(){return C("light")},"data-stop-propagation":!0},"light"===S&&m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faCheck,className:"pi-text-green-600 dark:pi-text-green-400 pi-mr-[0.4rem]"}),m.default.createElement(t.FontAwesomeIcon,{size:"lg",icon:i.faSun,className:"".concat("light"!==S?"pi-ml-[1.4rem] pi-mr-[0.27rem]":"pi-mr-[0.28rem]"," dark:pi-text-gray-100 pi-text-gray-600 ")}),m.default.createElement("div",null,g("DropdownContent.Light"))))))):m.default.createElement("div",null),m.default.createElement(c.CustomThemedTooltip,{id:"tooltip-left-settings-devices",place:"left"}))};
 //# sourceMappingURL=DropdownContent.js.map

package/dist/components/SwitchInputView/DropdownContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropdownContent.js","sources":["../../../src/components/SwitchInputView/DropdownContent.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, ComponentProps, Fragment, useState, useEffect } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState } from '../../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n faCheck,\n faEllipsis,\n faMicrophone,\n faMoon,\n faSun,\n faVolumeHigh,\n} from '@fortawesome/free-solid-svg-icons'\nimport { Menu, MenuButton, MenuItem, MenuItems, Transition } from '@headlessui/react'\nimport { isWebRTC } from '../../lib/user/default_device'\nimport { eventDispatch, getJSONItem, setJSONItem, useEventListener } from '../../utils'\nimport { CustomThemedTooltip } from '../CustomThemedTooltip'\nimport { useTranslation } from 'react-i18next'\n\nconst DropdownContent: FC<DropdownContentProps> = ({ isTransferView }) => {\n const { sipcall }: any = useSelector((state: RootState) => state.webrtc)\n const { t } = useTranslation()\n const remoteAudioElement: any = useSelector((state: RootState) => state.player.remoteAudio)\n\n const [selectedAudioInput, setSelectedAudioInput] = useState<string \| null>(\n getJSONItem('phone-island-audio-input-device').deviceId \|\| null,\n )\n const [selectedAudioOutput, setSelectedAudioOutput] = useState<string \| null>(\n getJSONItem('phone-island-audio-output-device').deviceId \|\| null,\n )\n\n const handleClickAudioInput = (audioInputDevice: string) => {\n setSelectedAudioInput(audioInputDevice)\n\n if (sipcall.webrtcStuff.myStream) {\n sipcall?.replaceTracks({\n tracks: [\n {\n type: 'audio',\n mid: '0', // We assume mid 0 is audio\n capture: { deviceId: { exact: audioInputDevice } },\n },\n ],\n success: function () {\n console.info('Audio input device switch success!')\n // set device to localstorage\n setJSONItem('phone-island-audio-input-device', { deviceId: audioInputDevice })\n\n // dispatch event\n eventDispatch('phone-island-call-audio-input-switched', {})\n },\n error: function (err) {\n console.error('Audio input device switch error:', err)\n },\n })\n } else {\n // set device to localstorage\n setJSONItem('phone-island-audio-input-device', { deviceId: audioInputDevice })\n\n // dispatch event\n eventDispatch('phone-island-call-audio-input-switched', {})\n }\n }\n useEventListener('phone-island-call-audio-input-switch', (data: DeviceInputOutputTypes) => {\n handleClickAudioInput(data.deviceId)\n })\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 [actualDevice, setActualDevice]: any = useState([])\n\n useEffect(() => {\n const checkInputOutputDevices = () => {\n navigator.mediaDevices\n .enumerateDevices()\n .then((deviceInfos) => {\n setActualDevice(deviceInfos)\n })\n .catch((error) => {\n console.error('error', error)\n })\n }\n\n checkInputOutputDevices()\n\n navigator.mediaDevices.addEventListener('devicechange', checkInputOutputDevices)\n\n return () => {\n navigator.mediaDevices.removeEventListener('devicechange', checkInputOutputDevices)\n }\n }, [selectedAudioOutput, selectedAudioInput])\n\n const { theme } = useSelector((state: RootState) => state.darkTheme)\n\n const handleSelectTheme = (clickedTheme: string) => {\n eventDispatch('phone-island-theme-change', { selectedTheme: clickedTheme })\n }\n const { transferring } = useSelector((state: RootState) => state.currentCall)\n const { isListen } = useSelector((state: RootState) => state.listen)\n\n return (\n <>\n {isWebRTC() ? (\n <Menu\n as='div'\n className='relative inline-block text-left'\n data-stop-propagation={true}\n data-tooltip-id='tooltip-left-settings-devices'\n data-tooltip-content={t('Tooltip.Settings')}\n >\n <MenuButton\n className='pi-bg-transparent dark:enabled:hover:pi-bg-gray-600/30 enabled:hover:pi-bg-gray-200/70 dark:focus:pi-ring-gray-500 focus:pi-ring-gray-400 pi-flex pi-font-light pi-content-center pi-items-center pi-justify-center pi-tracking-wide pi-duration-200 pi-transform pi-outline-none focus:pi-ring-2 focus:pi-z-20 focus:pi-ring-offset-2 disabled:pi-opacity-75 dark:pi-text-white pi-text-gray-600 pi-border pi-border-transparent focus:pi-ring-offset-gray-200 dark:focus:pi-ring-offset-black pi-rounded-full pi-text-sm pi-leading-4 pi-h-12 pi-w-12 pi-col-start-auto pi-transition-color pi-shrink-0'\n data-stop-propagation={true}\n >\n <FontAwesomeIcon\n size='xl'\n icon={faEllipsis}\n className='dark:pi-text-gray-200 pi-text-gray-700'\n data-stop-propagation={true}\n />\n </MenuButton>\n\n <Transition\n as={Fragment}\n enter='transition ease-out duration-100'\n enterFrom='transform opacity-0 scale-95'\n enterTo='transform opacity-100 scale-100'\n leave='transition ease-in duration-75'\n leaveFrom='transform opacity-100 scale-100'\n leaveTo='transform opacity-0 scale-95'\n >\n <MenuItems\n className={`${transferring ? 'pi-right-[1.5rem]' : 'pi-right-[4.5rem]'} \n ${\n isListen\n ? 'pi-max-h-[9.125rem] pi-mt-[-8.5rem]'\n : 'pi-max-h-[13.125rem] pi-mt-[-12.5rem]'\n }\n pi-z-50 pi-absolute pi-w-56 pi-origin-top-right pi-rounded-md pi-shadow-lg pi-ring-1 dark:pi-bg-gray-950 pi-bg-gray-50 pi-bg-opacity-[0.99] dark:pi-bg-opacity-[0.99] pi-ring-black pi-ring-opacity-5 pi-focus:outline-none pi-cursor-auto pi-border-gray-300 dark:pi-border-gray-600 pi-border pi-py-2 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 data-stop-propagation={true}\n >\n <div className='' data-stop-propagation={true}>\n {!isListen && (\n <>\n {' '}\n {/* Microphones /}\n <div className='pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4'>\n {t('DropdownContent.Microphones')}\n </div>\n {actualDevice\n .filter((device) => device?.kind === 'audioinput')\n .map((audioDevice, index) => (\n <MenuItem key={index}>\n {({ active }: any) => (\n <div\n className={`pi-flex pi-py-2 pi-px-2 ${\n active ? 'pi-bg-gray-200 dark:pi-bg-gray-700' : ''\n }`}\n onClick={() => handleClickAudioInput(audioDevice.deviceId)}\n data-stop-propagation={true}\n >\n {/ faCheck on selectedAudioInput /}\n {selectedAudioInput === audioDevice?.deviceId && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-2'\n />\n )}\n\n {/ faCheck if user has no selectedAudioInput and audioDevice is default /}\n {!selectedAudioInput && audioDevice?.deviceId === 'default' && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-2'\n />\n )}\n\n <FontAwesomeIcon\n size='lg'\n icon={faMicrophone}\n className={`${\n selectedAudioInput !== null &&\n selectedAudioInput !== '' &&\n selectedAudioInput !== audioDevice?.deviceId\n ? 'pi-ml-6'\n : selectedAudioInput !== '' &&\n selectedAudioInput !== null &&\n selectedAudioInput === audioDevice?.deviceId\n ? ''\n : selectedAudioInput === null &&\n audioDevice?.deviceId !== 'default'\n ? 'pi-ml-6'\n : ''\n } dark:pi-text-gray-100 pi-text-gray-600 pi-mr-1`}\n />\n <div\n className={`${\n active\n ? 'dark:pi-text-gray-50 pi-text-gray-900'\n : 'dark:pi-text-gray-50 pi-text-gray-700'\n }`}\n >\n {audioDevice?.label \|\| `Input device ${index + 1}`}\n </div>\n </div>\n )}\n </MenuItem>\n ))}\n {/ Divider /}\n <div className='pi-relative pi-py-2'>\n <div\n className='pi-absolute pi-inset-0 pi-flex pi-items-center'\n aria-hidden='true'\n >\n <div className='pi-w-full pi-border-t pi-border-gray-400 dark:pi-border-gray-600' />\n </div>\n </div>\n </>\n )}\n\n {/ Speaker /}\n <div\n className='pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4'\n data-stop-propagation={true}\n >\n {t('DropdownContent.Speakers')}\n </div>\n {actualDevice\n .filter((device) => device?.kind === 'audiooutput')\n .map((audioDevice, index) => (\n <MenuItem key={index}>\n {({ active }: any) => (\n <div\n className={`pi-flex pi-py-2 pi-px-2 ${\n active ? 'pi-bg-gray-200 dark:pi-bg-gray-700' : ''\n }`}\n onClick={() => handleClickAudioOutput(audioDevice?.deviceId)}\n data-stop-propagation={true}\n >\n {/ faCheck on selectedAudioOutput /}\n {selectedAudioOutput === audioDevice?.deviceId && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-2'\n />\n )}\n\n {/ faCheck if user has no selectedAudioInput and audioDevice is default /}\n {!selectedAudioOutput && audioDevice?.deviceId === 'default' && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-2'\n />\n )}\n\n <FontAwesomeIcon\n size='lg'\n icon={faVolumeHigh}\n className={`${\n selectedAudioOutput !== null &&\n selectedAudioOutput !== '' &&\n selectedAudioOutput !== audioDevice?.deviceId\n ? 'pi-ml-6'\n : selectedAudioOutput !== '' &&\n selectedAudioOutput !== null &&\n selectedAudioOutput === audioDevice?.deviceId\n ? ''\n : selectedAudioOutput === null &&\n audioDevice?.deviceId !== 'default'\n ? 'pi-ml-6'\n : ''\n } dark:pi-text-gray-100 pi-text-gray-600 pi-mr-1`}\n />\n\n <div\n className={`${\n active\n ? 'dark:pi-text-gray-50 pi-text-gray-900'\n : 'dark:pi-text-gray-50 pi-text-gray-700'\n }`}\n >\n {audioDevice?.label \|\| `Output device ${index + 1}`}\n </div>\n </div>\n )}\n </MenuItem>\n ))}\n {/ Divider /}\n <div className='pi-relative pi-py-2'>\n <div\n className='pi-absolute pi-inset-0 pi-flex pi-items-center'\n aria-hidden='true'\n >\n <div className='pi-w-full pi-border-t pi-border-gray-400 dark:pi-border-gray-600' />\n </div>\n </div>\n {/ theme selection /}\n <div\n className='pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4'\n data-stop-propagation={true}\n >\n {t('DropdownContent.Theme')}\n </div>\n\n {/ dark theme /}\n <div\n className={`pi-flex pi-py-2 pi-px-2 dark:hover:pi-text-gray-50 hover:pi-text-gray-900 dark:pi-text-gray-50 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700`}\n onClick={() => handleSelectTheme('dark')}\n data-stop-propagation={true}\n >\n {theme === 'dark' && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-[0.57rem]'\n />\n )}\n <FontAwesomeIcon\n size='lg'\n icon={faMoon}\n className={`${\n theme !== 'dark' ? 'pi-ml-[1.49rem] pi-mr-[0.42rem]' : 'pi-mr-[0.4rem]'\n } dark:pi-text-gray-100 pi-text-gray-600 `}\n />\n\n <div>{t('DropdownContent.Dark')}</div>\n </div>\n\n {/ light theme /}\n <div\n className={`pi-flex pi-py-2 pi-px-2 dark:hover:pi-text-gray-50 hover:pi-text-gray-900 dark:pi-text-gray-50 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700`}\n onClick={() => handleSelectTheme('light')}\n data-stop-propagation={true}\n >\n {theme === 'light' && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-[0.4rem]'\n />\n )}\n\n <FontAwesomeIcon\n size='lg'\n icon={faSun}\n className={`${\n theme !== 'light' ? 'pi-ml-[1.4rem] pi-mr-[0.27rem]' : 'pi-mr-[0.28rem]'\n } dark:pi-text-gray-100 pi-text-gray-600 `}\n />\n <div>{t('DropdownContent.Light')}</div>\n </div>\n\n {/ Video\n <div className='pi-font-semibold pi-text-gray-700 pi-py-1 pi-px-4'>\n Video\n </div>\n {actualDevice\n .filter((device) => device.kind === 'videoinput')\n .map((videoDevice, index) => (\n <MenuItem key={index}>\n {({ active }) => (\n <div className='pi-text-gray-700'>\n Webcam: {videoDevice.label \|\| `Device ${index + 1}`}\n </div>\n )}\n </MenuItem>\n ))}*/}\n </div>\n </MenuItems>\n </Transition>\n </Menu>\n ) : (\n <div></div>\n )}\n <CustomThemedTooltip id='tooltip-left-settings-devices' place='left' />\n </>\n )\n}\n\ninterface DropdownContentProps extends ComponentProps<'div'> {\n isTransferView?: boolean\n}\n\ninterface DeviceInputOutputTypes {\n deviceId: string\n}\n\nexport default DropdownContent\n"],"names":["_a","isTransferView","sipcall","useSelector","state","webrtc","t","useTranslation","remoteAudioElement","player","remoteAudio","_b","useState","getJSONItem","deviceId","selectedAudioInput","setSelectedAudioInput","_c","selectedAudioOutput","setSelectedAudioOutput","handleClickAudioInput","audioInputDevice","webrtcStuff","myStream","replaceTracks","tracks","type","mid","capture","exact","success","console","info","setJSONItem","eventDispatch","error","err","useEventListener","data","handleClickAudioOutput","audioOutputDevice","current","setSinkId","then","catch","_d","actualDevice","setActualDevice","useEffect","checkInputOutputDevices","navigator","mediaDevices","enumerateDevices","deviceInfos","addEventListener","removeEventListener","theme","darkTheme","handleSelectTheme","clickedTheme","selectedTheme","transferring","currentCall","isListen","listen","React","createElement","Fragment","isWebRTC","Menu","as","className","MenuButton","FontAwesomeIcon","size","icon","faEllipsis","Transition","enter","enterFrom","enterTo","leave","leaveFrom","leaveTo","MenuItems","filter","device","kind","map","audioDevice","index","MenuItem","key","active","concat","onClick","faCheck","faMicrophone","label","faVolumeHigh","faMoon","faSun","CustomThemedTooltip","id","place"],"mappings":"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"}
1	+ {"version":3,"file":"DropdownContent.js","sources":["../../../src/components/SwitchInputView/DropdownContent.tsx"],"sourcesContent":["// Copyright (C) 2024 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type FC, ComponentProps, Fragment, useState, useEffect } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState } from '../../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n faCheck,\n faEllipsis,\n faMicrophone,\n faMoon,\n faSun,\n faVolumeHigh,\n} from '@fortawesome/free-solid-svg-icons'\nimport { Menu, MenuButton, MenuItem, MenuItems, Transition } from '@headlessui/react'\nimport { isWebRTC } from '../../lib/user/default_device'\nimport { eventDispatch, getJSONItem, setJSONItem, useEventListener } from '../../utils'\nimport { CustomThemedTooltip } from '../CustomThemedTooltip'\nimport { useTranslation } from 'react-i18next'\n\nconst DropdownContent: FC<DropdownContentProps> = ({ isTransferView }) => {\n const { sipcall }: any = useSelector((state: RootState) => state.webrtc)\n const { t } = useTranslation()\n const remoteAudioElement: any = useSelector((state: RootState) => state.player.remoteAudio)\n\n const [selectedAudioInput, setSelectedAudioInput] = useState<string \| null>(\n getJSONItem('phone-island-audio-input-device').deviceId \|\| null,\n )\n const [selectedAudioOutput, setSelectedAudioOutput] = useState<string \| null>(\n getJSONItem('phone-island-audio-output-device').deviceId \|\| null,\n )\n\n const handleClickAudioInput = (audioInputDevice: string) => {\n setSelectedAudioInput(audioInputDevice)\n\n if (sipcall.webrtcStuff.myStream) {\n sipcall?.replaceTracks({\n tracks: [\n {\n type: 'audio',\n mid: '0', // We assume mid 0 is audio\n capture: { deviceId: { exact: audioInputDevice } },\n },\n ],\n success: function () {\n console.info('Audio input device switch success!')\n // set device to localstorage\n setJSONItem('phone-island-audio-input-device', { deviceId: audioInputDevice })\n\n // dispatch event\n eventDispatch('phone-island-call-audio-input-switched', {})\n },\n error: function (err) {\n console.error('Audio input device switch error:', err)\n },\n })\n } else {\n // set device to localstorage\n setJSONItem('phone-island-audio-input-device', { deviceId: audioInputDevice })\n\n // dispatch event\n eventDispatch('phone-island-call-audio-input-switched', {})\n }\n }\n useEventListener('phone-island-call-audio-input-switch', (data: DeviceInputOutputTypes) => {\n handleClickAudioInput(data.deviceId)\n })\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 [actualDevice, setActualDevice]: any = useState([])\n\n useEffect(() => {\n const checkInputOutputDevices = () => {\n navigator.mediaDevices\n .enumerateDevices()\n .then((deviceInfos) => {\n setActualDevice(deviceInfos)\n })\n .catch((error) => {\n console.error('error', error)\n })\n }\n\n checkInputOutputDevices()\n\n navigator.mediaDevices.addEventListener('devicechange', checkInputOutputDevices)\n\n return () => {\n navigator.mediaDevices.removeEventListener('devicechange', checkInputOutputDevices)\n }\n }, [selectedAudioOutput, selectedAudioInput])\n\n const { theme } = useSelector((state: RootState) => state.darkTheme)\n\n const handleSelectTheme = (clickedTheme: string) => {\n eventDispatch('phone-island-theme-change', { selectedTheme: clickedTheme })\n }\n const { transferring } = useSelector((state: RootState) => state.currentCall)\n const { isListen } = useSelector((state: RootState) => state.listen)\n\n return (\n <>\n {isWebRTC() ? (\n <Menu\n as='div'\n className='relative inline-block text-left'\n data-stop-propagation={true}\n data-tooltip-id='tooltip-left-settings-devices'\n data-tooltip-content={t('Tooltip.Settings')}\n >\n <MenuButton\n className='pi-bg-transparent dark:enabled:hover:pi-bg-gray-600/30 enabled:hover:pi-bg-gray-200/70 dark:focus:pi-ring-gray-500 focus:pi-ring-gray-400 pi-flex pi-font-light pi-content-center pi-items-center pi-justify-center pi-tracking-wide pi-duration-200 pi-transform pi-outline-none focus:pi-ring-2 focus:pi-z-20 focus:pi-ring-offset-2 disabled:pi-opacity-75 dark:pi-text-white pi-text-gray-600 pi-border pi-border-transparent focus:pi-ring-offset-gray-200 dark:focus:pi-ring-offset-black pi-rounded-full pi-text-sm pi-leading-4 pi-h-12 pi-w-12 pi-col-start-auto pi-transition-color pi-shrink-0'\n data-stop-propagation={true}\n >\n <FontAwesomeIcon\n size='xl'\n icon={faEllipsis}\n className='dark:pi-text-gray-200 pi-text-gray-700'\n data-stop-propagation={true}\n />\n </MenuButton>\n\n <Transition\n as={Fragment}\n enter='transition ease-out duration-100'\n enterFrom='transform opacity-0 scale-95'\n enterTo='transform opacity-100 scale-100'\n leave='transition ease-in duration-75'\n leaveFrom='transform opacity-100 scale-100'\n leaveTo='transform opacity-0 scale-95'\n >\n <MenuItems\n className={`${transferring ? 'pi-right-[1.5rem]' : 'pi-right-[4.5rem]'} \n ${\n isListen\n ? 'pi-max-h-[9.125rem] pi-mt-[-8.5rem]'\n : 'pi-max-h-[13.125rem] pi-mt-[-12.5rem]'\n }\n pi-z-50 pi-absolute pi-w-56 pi-origin-top-right pi-rounded-md pi-shadow-lg pi-ring-1 dark:pi-bg-gray-950 pi-bg-gray-50 pi-bg-opacity-[0.99] dark:pi-bg-opacity-[0.99] pi-ring-black pi-ring-opacity-5 pi-focus:outline-none pi-cursor-auto pi-border-gray-300 dark:pi-border-gray-600 pi-border pi-py-2 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 data-stop-propagation={true}\n >\n <div className='' data-stop-propagation={true}>\n {!isListen && (\n <>\n {' '}\n {/* Microphones /}\n <div className='pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4'>\n {t('DropdownContent.Microphones')}\n </div>\n {actualDevice\n .filter((device) => device?.kind === 'audioinput')\n .map((audioDevice, index) => (\n <MenuItem key={index}>\n {({ active }: any) => (\n <div\n className={`pi-flex pi-py-2 pi-px-2 ${\n active ? 'pi-bg-gray-200 dark:pi-bg-gray-700' : ''\n }`}\n onClick={() => handleClickAudioInput(audioDevice.deviceId)}\n data-stop-propagation={true}\n >\n {/ faCheck on selectedAudioInput /}\n {selectedAudioInput === audioDevice?.deviceId && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-2'\n />\n )}\n\n {/ faCheck if user has no selectedAudioInput and audioDevice is default /}\n {!selectedAudioInput && audioDevice?.deviceId === 'default' && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-2'\n />\n )}\n\n <FontAwesomeIcon\n size='lg'\n icon={faMicrophone}\n className={`${\n selectedAudioInput !== null &&\n selectedAudioInput !== '' &&\n selectedAudioInput !== audioDevice?.deviceId\n ? 'pi-ml-6'\n : selectedAudioInput !== '' &&\n selectedAudioInput !== null &&\n selectedAudioInput === audioDevice?.deviceId\n ? ''\n : selectedAudioInput === null &&\n audioDevice?.deviceId !== 'default'\n ? 'pi-ml-6'\n : ''\n } dark:pi-text-gray-100 pi-text-gray-600 pi-mr-1`}\n />\n <div\n className={`${\n active\n ? 'dark:pi-text-gray-50 pi-text-gray-900'\n : 'dark:pi-text-gray-50 pi-text-gray-700'\n }`}\n >\n {audioDevice?.label \|\| `Input device ${index + 1}`}\n </div>\n </div>\n )}\n </MenuItem>\n ))}\n {/ Divider /}\n <div className='pi-relative pi-py-2'>\n <div\n className='pi-absolute pi-inset-0 pi-flex pi-items-center'\n aria-hidden='true'\n >\n <div className='pi-w-full pi-border-t pi-border-gray-400 dark:pi-border-gray-600' />\n </div>\n </div>\n </>\n )}\n\n {/ Speaker /}\n <div\n className='pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4'\n data-stop-propagation={true}\n >\n {t('DropdownContent.Speakers')}\n </div>\n {actualDevice\n .filter((device) => device?.kind === 'audiooutput')\n .map((audioDevice, index) => (\n <MenuItem key={index}>\n {({ active }: any) => (\n <div\n className={`pi-flex pi-py-2 pi-px-2 ${\n active ? 'pi-bg-gray-200 dark:pi-bg-gray-700' : ''\n }`}\n onClick={() => handleClickAudioOutput(audioDevice?.deviceId)}\n data-stop-propagation={true}\n >\n {/ faCheck on selectedAudioOutput /}\n {selectedAudioOutput === audioDevice?.deviceId && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-2'\n />\n )}\n\n {/ faCheck if user has no selectedAudioInput and audioDevice is default /}\n {!selectedAudioOutput && audioDevice?.deviceId === 'default' && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-2'\n />\n )}\n\n <FontAwesomeIcon\n size='lg'\n icon={faVolumeHigh}\n className={`${\n selectedAudioOutput !== null &&\n selectedAudioOutput !== '' &&\n selectedAudioOutput !== audioDevice?.deviceId\n ? 'pi-ml-6'\n : selectedAudioOutput !== '' &&\n selectedAudioOutput !== null &&\n selectedAudioOutput === audioDevice?.deviceId\n ? ''\n : selectedAudioOutput === null &&\n audioDevice?.deviceId !== 'default'\n ? 'pi-ml-6'\n : ''\n } dark:pi-text-gray-100 pi-text-gray-600 pi-mr-1`}\n />\n\n <div\n className={`${\n active\n ? 'dark:pi-text-gray-50 pi-text-gray-900'\n : 'dark:pi-text-gray-50 pi-text-gray-700'\n }`}\n >\n {audioDevice?.label \|\| `Output device ${index + 1}`}\n </div>\n </div>\n )}\n </MenuItem>\n ))}\n {/ Divider /}\n <div className='pi-relative pi-py-2'>\n <div\n className='pi-absolute pi-inset-0 pi-flex pi-items-center'\n aria-hidden='true'\n >\n <div className='pi-w-full pi-border-t pi-border-gray-400 dark:pi-border-gray-600' />\n </div>\n </div>\n {/ theme selection /}\n <div\n className='pi-font-semibold dark:pi-text-gray-50 pi-text-gray-600 pi-py-1 pi-px-4'\n data-stop-propagation={true}\n >\n {t('DropdownContent.Theme')}\n </div>\n\n {/ dark theme /}\n <div\n className={`pi-flex pi-py-2 pi-px-2 dark:hover:pi-text-gray-50 hover:pi-text-gray-900 dark:pi-text-gray-50 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700`}\n onClick={() => handleSelectTheme('dark')}\n data-stop-propagation={true}\n >\n {theme === 'dark' && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-[0.57rem]'\n />\n )}\n <FontAwesomeIcon\n size='lg'\n icon={faMoon}\n className={`${\n theme !== 'dark' ? 'pi-ml-[1.49rem] pi-mr-[0.42rem]' : 'pi-mr-[0.4rem]'\n } dark:pi-text-gray-100 pi-text-gray-600 `}\n />\n\n <div>{t('DropdownContent.Dark')}</div>\n </div>\n\n {/ light theme /}\n <div\n className={`pi-flex pi-py-2 pi-px-2 dark:hover:pi-text-gray-50 hover:pi-text-gray-900 dark:pi-text-gray-50 pi-text-gray-700 hover:pi-bg-gray-200 dark:hover:pi-bg-gray-700`}\n onClick={() => handleSelectTheme('light')}\n data-stop-propagation={true}\n >\n {theme === 'light' && (\n <FontAwesomeIcon\n size='lg'\n icon={faCheck}\n className='pi-text-green-600 dark:pi-text-green-400 pi-mr-[0.4rem]'\n />\n )}\n\n <FontAwesomeIcon\n size='lg'\n icon={faSun}\n className={`${\n theme !== 'light' ? 'pi-ml-[1.4rem] pi-mr-[0.27rem]' : 'pi-mr-[0.28rem]'\n } dark:pi-text-gray-100 pi-text-gray-600 `}\n />\n <div>{t('DropdownContent.Light')}</div>\n </div>\n\n {/ Video\n <div className='pi-font-semibold pi-text-gray-700 pi-py-1 pi-px-4'>\n Video\n </div>\n {actualDevice\n .filter((device) => device.kind === 'videoinput')\n .map((videoDevice, index) => (\n <MenuItem key={index}>\n {({ active }) => (\n <div className='pi-text-gray-700'>\n Webcam: {videoDevice.label \|\| `Device ${index + 1}`}\n </div>\n )}\n </MenuItem>\n ))}*/}\n </div>\n </MenuItems>\n </Transition>\n </Menu>\n ) : (\n <div></div>\n )}\n <CustomThemedTooltip id='tooltip-left-settings-devices' place='left' />\n </>\n )\n}\n\ninterface DropdownContentProps extends ComponentProps<'div'> {\n isTransferView?: boolean\n}\n\ninterface DeviceInputOutputTypes {\n deviceId: string\n}\n\nexport default DropdownContent\n"],"names":["_a","isTransferView","sipcall","useSelector","state","webrtc","t","useTranslation","remoteAudioElement","player","remoteAudio","_b","useState","getJSONItem","deviceId","selectedAudioInput","setSelectedAudioInput","_c","selectedAudioOutput","setSelectedAudioOutput","handleClickAudioInput","audioInputDevice","webrtcStuff","myStream","replaceTracks","tracks","type","mid","capture","exact","success","console","info","setJSONItem","eventDispatch","error","err","useEventListener","data","handleClickAudioOutput","audioOutputDevice","current","setSinkId","then","catch","_d","actualDevice","setActualDevice","useEffect","checkInputOutputDevices","navigator","mediaDevices","enumerateDevices","deviceInfos","addEventListener","removeEventListener","theme","darkTheme","handleSelectTheme","clickedTheme","selectedTheme","transferring","currentCall","isListen","listen","React","createElement","Fragment","isWebRTC","Menu","as","className","MenuButton","FontAwesomeIcon","size","icon","faEllipsis","Transition","enter","enterFrom","enterTo","leave","leaveFrom","leaveTo","MenuItems","filter","device","kind","map","audioDevice","index","MenuItem","key","active","concat","onClick","faCheck","faMicrophone","label","faVolumeHigh","faMoon","faSun","CustomThemedTooltip","id","place"],"mappings":"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"}

package/dist/components/SwitchInputView/Index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require("react"),require("react-redux"),require("@fortawesome/react-fontawesome"),require("@fortawesome/free-solid-svg-icons"),require("@headlessui/react"),require("../../store/index.js"),require("tslib"),require("react-tooltip"),require("react-i18next");
+"use strict";require("react"),require("../../node_modules/react-redux/es/index.js"),require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),require("../../store/index.js"),require("../../node_modules/tslib/tslib.es6.js"),require("../../node_modules/react-tooltip/dist/react-tooltip.min.mjs.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"),require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");
 //# sourceMappingURL=Index.js.map

package/dist/components/TextScroll.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-i18next");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=n(e);exports.default=function(n){var a=n.text,i=t.useTranslation().t,l=e.useState(!1),u=l[0],c=l[1],s=e.useRef(null),p=e.useRef(null),o="unknown"===a?i("TextScroll.unknown"):a,f=e.useCallback((function(){if(s.current&&p.current){var e=p.current.scrollWidth-s.current.clientWidth>5;c(e||o.length>12)}else c(o.length>12)}),[o,12]);e.useLayoutEffect((function(){f()}),[o,f]),e.useEffect((function(){if("undefined"!=typeof ResizeObserver){var e=new ResizeObserver((function(){f()}));return s.current&&e.observe(s.current),p.current&&e.observe(p.current),function(){return e.disconnect()}}}),[o,f]);var d=e.useMemo((function(){return"".concat(Math.max(8,Math.ceil(o.length/2)),"s")}),[o]);return r.default.createElement("div",{ref:s,className:"pi-relative pi-block pi-w-full pi-max-w-full pi-overflow-hidden pi-whitespace-nowrap"},u?r.default.createElement(r.default.Fragment,null,r.default.createElement("div",{className:"pi-inline-flex pi-whitespace-nowrap",style:{animation:"scrollText ".concat(d," linear infinite")}},r.default.createElement("span",{className:"pi-pr-6"},o),r.default.createElement("span",{className:"pi-pr-6","aria-hidden":"true"},o)),r.default.createElement("div",{className:"pi-pointer-events-none pi-absolute pi-right-0 pi-top-0 pi-h-full pi-w-6 pi-bg-gradient-to-r pi-from-transparent pi-to-gray-50 dark:pi-to-gray-950"})):r.default.createElement("span",{className:"pi-block pi-max-w-full pi-truncate"},o),r.default.createElement("span",{ref:p,className:"pi-pointer-events-none pi-absolute pi-left-0 pi-top-0 pi-invisible pi-whitespace-nowrap","aria-hidden":"true"},o))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");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 t=require("../node_modules/react-i18next/dist/es/useTranslation.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../node_modules/@babel/runtime/helpers/slicedToArray.js");var n=r(e);exports.default=function(r){var i=r.text,a=t.useTranslation().t,l=e.useState(!1),s=l[0],u=l[1],o=e.useRef(null),c=e.useRef(null),p="unknown"===i?a("TextScroll.unknown"):i,d=e.useCallback((function(){if(o.current&&c.current){var e=c.current.scrollWidth-o.current.clientWidth>5;u(e||p.length>12)}else u(p.length>12)}),[p,12]);e.useLayoutEffect((function(){d()}),[p,d]),e.useEffect((function(){if("undefined"!=typeof ResizeObserver){var e=new ResizeObserver((function(){d()}));return o.current&&e.observe(o.current),c.current&&e.observe(c.current),function(){return e.disconnect()}}}),[p,d]);var f=e.useMemo((function(){return"".concat(Math.max(8,Math.ceil(p.length/2)),"s")}),[p]);return n.default.createElement("div",{ref:o,className:"pi-relative pi-block pi-w-full pi-max-w-full pi-overflow-hidden pi-whitespace-nowrap"},s?n.default.createElement(n.default.Fragment,null,n.default.createElement("div",{className:"pi-inline-flex pi-whitespace-nowrap",style:{animation:"scrollText ".concat(f," linear infinite")}},n.default.createElement("span",{className:"pi-pr-6"},p),n.default.createElement("span",{className:"pi-pr-6","aria-hidden":"true"},p)),n.default.createElement("div",{className:"pi-pointer-events-none pi-absolute pi-right-0 pi-top-0 pi-h-full pi-w-6 pi-bg-gradient-to-r pi-from-transparent pi-to-gray-50 dark:pi-to-gray-950"})):n.default.createElement("span",{className:"pi-block pi-max-w-full pi-truncate"},p),n.default.createElement("span",{ref:c,className:"pi-pointer-events-none pi-absolute pi-left-0 pi-top-0 pi-invisible pi-whitespace-nowrap","aria-hidden":"true"},p))};
 //# sourceMappingURL=TextScroll.js.map

package/dist/components/TextScroll.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextScroll.js","sources":["../../src/components/TextScroll.tsx"],"sourcesContent":["/* Copyright (C) 2024 Nethesis S.r.l. /\n/ SPDX-License-Identifier: AGPL-3.0-or-later */\n\nimport React, { useState, useEffect, useRef, useLayoutEffect, useCallback, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\n\nexport interface TextScrollProps {\n text: string\n}\n\nconst TextScroll: React.FC<TextScrollProps> = ({ text }) => {\n const { t } = useTranslation()\n const [scrollText, setScrollText] = useState(false)\n const containerRef = useRef<HTMLDivElement \| null>(null)\n const measureRef = useRef<HTMLSpanElement \| null>(null)\n const translatedText = text === 'unknown' ? t('TextScroll.unknown') : text\n const minCharactersToScroll = 12\n\n const updateOverflow = useCallback(() => {\n if (!containerRef.current \|\| !measureRef.current) {\n setScrollText(translatedText.length > minCharactersToScroll)\n return\n }\n\n const hasOverflow = measureRef.current.scrollWidth - containerRef.current.clientWidth > 5\n setScrollText(hasOverflow \|\| translatedText.length > minCharactersToScroll)\n }, [translatedText, minCharactersToScroll])\n\n useLayoutEffect(() => {\n updateOverflow()\n }, [translatedText, updateOverflow])\n\n useEffect(() => {\n if (typeof ResizeObserver === 'undefined') {\n return\n }\n\n const observer = new ResizeObserver(() => {\n updateOverflow()\n })\n\n if (containerRef.current) {\n observer.observe(containerRef.current)\n }\n\n if (measureRef.current) {\n observer.observe(measureRef.current)\n }\n\n return () => observer.disconnect()\n }, [translatedText, updateOverflow])\n\n const scrollDuration = useMemo(\n () => `${Math.max(8, Math.ceil(translatedText.length / 2))}s`,\n [translatedText],\n )\n\n return (\n <div ref={containerRef} className='pi-relative pi-block pi-w-full pi-max-w-full pi-overflow-hidden pi-whitespace-nowrap'>\n {scrollText ? (\n <>\n <div\n className='pi-inline-flex pi-whitespace-nowrap'\n style={{ animation: `scrollText ${scrollDuration} linear infinite` }}\n >\n <span className='pi-pr-6'>{translatedText}</span>\n <span className='pi-pr-6' aria-hidden='true'>\n {translatedText}\n </span>\n </div>\n <div className='pi-pointer-events-none pi-absolute pi-right-0 pi-top-0 pi-h-full pi-w-6 pi-bg-gradient-to-r pi-from-transparent pi-to-gray-50 dark:pi-to-gray-950' />\n </>\n ) : (\n <span className='pi-block pi-max-w-full pi-truncate'>{translatedText}</span>\n )}\n\n <span\n ref={measureRef}\n className='pi-pointer-events-none pi-absolute pi-left-0 pi-top-0 pi-invisible pi-whitespace-nowrap'\n aria-hidden='true'\n >\n {translatedText}\n </span>\n </div>\n )\n}\n\nexport default TextScroll\n"],"names":["_a","text","t","useTranslation","_b","useState","scrollText","setScrollText","containerRef","useRef","measureRef","translatedText","updateOverflow","useCallback","current","hasOverflow","scrollWidth","clientWidth","length","useLayoutEffect","useEffect","ResizeObserver","observer","observe","disconnect","scrollDuration","useMemo","concat","Math","max","ceil","React","ref","className","createElement","Fragment","style","animation"],"mappings":"~~yNAU8C~~,SAACA,GAAE,IAAAC,EAAID,EAAAC,KAC3CC,EAAMC,qBACRC,EAA8BC,EAAAA,UAAS,GAAtCC,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAC1BI,EAAeC,SAA8B,MAC7CC,EAAaD,SAA+B,MAC5CE,EAA0B,YAATV,EAAqBC,EAAE,sBAAwBD,EAGhEW,EAAiBC,EAAAA,aAAY,WACjC,GAAKL,EAAaM,SAAYJ,EAAWI,QAAzC,CAKA,IAAMC,EAAcL,EAAWI,QAAQE,YAAcR,EAAaM,QAAQG,YAAc,EACxFV,EAAcQ,GAAeJ,EAAeO,OAThB,GAM3B,MAFCX,EAAcI,EAAeO,OAJH,GAU9B,GAAG,CAACP,EAV0B,KAY9BQ,EAAAA,iBAAgB,WACdP,GACF,GAAG,CAACD,EAAgBC,IAEpBQ,EAAAA,WAAU,WACR,GAA8B,oBAAnBC,eAAX,CAIA,IAAMC,EAAW,IAAID,gBAAe,WAClCT,GACF,IAUA,OARIJ,EAAaM,SACfQ,EAASC,QAAQf,EAAaM,SAG5BJ,EAAWI,SACbQ,EAASC,QAAQb,EAAWI,SAGvB,WAAM,OAAAQ,EAASE,YAAY,CAdjC,CAeH,GAAG,CAACb,EAAgBC,IAEpB,IAAMa,EAAiBC,EAAOA,SAC5B,WAAM,MAAA,GAAAC,OAAGC,KAAKC,IAAI,EAAGD,KAAKE,KAAKnB,EAAeO,OAAS,IAAG,IAAG,GAC7D,CAACP,IAGH,OACEoB,EAAAA,6BAAKC,IAAKxB,EAAcyB,UAAU,wFAC/B3B,EACCyB,EAAAA,QAAAG,cAAAH,EAAA,QAAAI,SAAA,KACEJ,EAAAA,QAAAG,cAAA,MAAA,CACED,UAAU,sCACVG,MAAO,CAAEC,UAAW,cAAAV,OAAcF,EAAc,sBAEhDM,EAAA,QAAAG,cAAA,OAAA,CAAMD,UAAU,WAAWtB,GAC3BoB,UAAMG,cAAA,OAAA,CAAAD,UAAU,UAAS,cAAa,QACnCtB,IAGLoB,EAAA,QAAAG,cAAA,MAAA,CAAKD,UAAU,uJAGjBF,gCAAME,UAAU,sCAAsCtB,GAGxDoB,EAAAA,QAAAG,cAAA,OAAA,CACEF,IAAKtB,EACLuB,UAAU,0FACE,cAAA,QAEXtB,GAIT"}
1	+ {"version":3,"file":"TextScroll.js","sources":["../../src/components/TextScroll.tsx"],"sourcesContent":["/* Copyright (C) 2024 Nethesis S.r.l. /\n/ SPDX-License-Identifier: AGPL-3.0-or-later */\n\nimport React, { useState, useEffect, useRef, useLayoutEffect, useCallback, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\n\nexport interface TextScrollProps {\n text: string\n}\n\nconst TextScroll: React.FC<TextScrollProps> = ({ text }) => {\n const { t } = useTranslation()\n const [scrollText, setScrollText] = useState(false)\n const containerRef = useRef<HTMLDivElement \| null>(null)\n const measureRef = useRef<HTMLSpanElement \| null>(null)\n const translatedText = text === 'unknown' ? t('TextScroll.unknown') : text\n const minCharactersToScroll = 12\n\n const updateOverflow = useCallback(() => {\n if (!containerRef.current \|\| !measureRef.current) {\n setScrollText(translatedText.length > minCharactersToScroll)\n return\n }\n\n const hasOverflow = measureRef.current.scrollWidth - containerRef.current.clientWidth > 5\n setScrollText(hasOverflow \|\| translatedText.length > minCharactersToScroll)\n }, [translatedText, minCharactersToScroll])\n\n useLayoutEffect(() => {\n updateOverflow()\n }, [translatedText, updateOverflow])\n\n useEffect(() => {\n if (typeof ResizeObserver === 'undefined') {\n return\n }\n\n const observer = new ResizeObserver(() => {\n updateOverflow()\n })\n\n if (containerRef.current) {\n observer.observe(containerRef.current)\n }\n\n if (measureRef.current) {\n observer.observe(measureRef.current)\n }\n\n return () => observer.disconnect()\n }, [translatedText, updateOverflow])\n\n const scrollDuration = useMemo(\n () => `${Math.max(8, Math.ceil(translatedText.length / 2))}s`,\n [translatedText],\n )\n\n return (\n <div ref={containerRef} className='pi-relative pi-block pi-w-full pi-max-w-full pi-overflow-hidden pi-whitespace-nowrap'>\n {scrollText ? (\n <>\n <div\n className='pi-inline-flex pi-whitespace-nowrap'\n style={{ animation: `scrollText ${scrollDuration} linear infinite` }}\n >\n <span className='pi-pr-6'>{translatedText}</span>\n <span className='pi-pr-6' aria-hidden='true'>\n {translatedText}\n </span>\n </div>\n <div className='pi-pointer-events-none pi-absolute pi-right-0 pi-top-0 pi-h-full pi-w-6 pi-bg-gradient-to-r pi-from-transparent pi-to-gray-50 dark:pi-to-gray-950' />\n </>\n ) : (\n <span className='pi-block pi-max-w-full pi-truncate'>{translatedText}</span>\n )}\n\n <span\n ref={measureRef}\n className='pi-pointer-events-none pi-absolute pi-left-0 pi-top-0 pi-invisible pi-whitespace-nowrap'\n aria-hidden='true'\n >\n {translatedText}\n </span>\n </div>\n )\n}\n\nexport default TextScroll\n"],"names":["_a","text","t","useTranslation","_b","useState","scrollText","setScrollText","containerRef","useRef","measureRef","translatedText","updateOverflow","useCallback","current","hasOverflow","scrollWidth","clientWidth","length","useLayoutEffect","useEffect","ResizeObserver","observer","observe","disconnect","scrollDuration","useMemo","concat","Math","max","ceil","React","ref","className","createElement","Fragment","style","animation"],"mappings":"gqBAU8C,SAACA,GAAE,IAAAC,EAAID,EAAAC,KAC3CC,EAAMC,qBACRC,EAA8BC,EAAAA,UAAS,GAAtCC,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAC1BI,EAAeC,SAA8B,MAC7CC,EAAaD,SAA+B,MAC5CE,EAA0B,YAATV,EAAqBC,EAAE,sBAAwBD,EAGhEW,EAAiBC,EAAAA,aAAY,WACjC,GAAKL,EAAaM,SAAYJ,EAAWI,QAAzC,CAKA,IAAMC,EAAcL,EAAWI,QAAQE,YAAcR,EAAaM,QAAQG,YAAc,EACxFV,EAAcQ,GAAeJ,EAAeO,OAThB,GAM3B,MAFCX,EAAcI,EAAeO,OAJH,GAU9B,GAAG,CAACP,EAV0B,KAY9BQ,EAAAA,iBAAgB,WACdP,GACF,GAAG,CAACD,EAAgBC,IAEpBQ,EAAAA,WAAU,WACR,GAA8B,oBAAnBC,eAAX,CAIA,IAAMC,EAAW,IAAID,gBAAe,WAClCT,GACF,IAUA,OARIJ,EAAaM,SACfQ,EAASC,QAAQf,EAAaM,SAG5BJ,EAAWI,SACbQ,EAASC,QAAQb,EAAWI,SAGvB,WAAM,OAAAQ,EAASE,YAAY,CAdjC,CAeH,GAAG,CAACb,EAAgBC,IAEpB,IAAMa,EAAiBC,EAAOA,SAC5B,WAAM,MAAA,GAAAC,OAAGC,KAAKC,IAAI,EAAGD,KAAKE,KAAKnB,EAAeO,OAAS,IAAG,IAAG,GAC7D,CAACP,IAGH,OACEoB,EAAAA,6BAAKC,IAAKxB,EAAcyB,UAAU,wFAC/B3B,EACCyB,EAAAA,QAAAG,cAAAH,EAAA,QAAAI,SAAA,KACEJ,EAAAA,QAAAG,cAAA,MAAA,CACED,UAAU,sCACVG,MAAO,CAAEC,UAAW,cAAAV,OAAcF,EAAc,sBAEhDM,EAAA,QAAAG,cAAA,OAAA,CAAMD,UAAU,WAAWtB,GAC3BoB,UAAMG,cAAA,OAAA,CAAAD,UAAU,UAAS,cAAa,QACnCtB,IAGLoB,EAAA,QAAAG,cAAA,MAAA,CAAKD,UAAU,uJAGjBF,gCAAME,UAAU,sCAAsCtB,GAGxDoB,EAAAA,QAAAG,cAAA,OAAA,CACEF,IAAKtB,EACLuB,UAAU,0FACE,cAAA,QAEXtB,GAIT"}

package/dist/components/TranscriptionView/TranscriptionView.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("react"),i=require("react-redux"),r=require("framer-motion"),a=require("react-i18next"),n=require("../../utils/customHooks/useEventListener.js"),l=require("../../utils/genericFunctions/eventDispatch.js");require("../../store/index.js");var p=require("@fortawesome/react-fontawesome"),s=require("@fortawesome/free-solid-svg-icons");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=o(t),u={initial:{height:0,opacity:0},animate:{height:"360px",opacity:1},exit:{height:0,opacity:0},transition:{duration:.1,ease:"easeOut"}},d={borderBottomLeftRadius:"20px",borderBottomRightRadius:"20px",transformOrigin:"top",overflow:"hidden"},m=function(e){var i=e.text,r=e.isFinal,a=e.speed,n=void 0===a?50:a,l=t.useState(""),p=l[0],s=l[1];return t.useEffect((function(){if(!r){s("");var e=0,t=setInterval((function(){e<i.length?(s(i.slice(0,e+1)),e++):clearInterval(t)}),n);return function(){return clearInterval(t)}}s(i)}),[i,r,n]),c.default.createElement("div",{className:"pi-inline-flex pi-items-center pi-flex-wrap"},c.default.createElement("span",null,p))},f=t.memo((function(o){var f=o.isVisible,g=i.useSelector((function(e){return e.island})),y=g.actionsExpanded,b=g.view,x=i.useSelector((function(e){return e.currentUser})),v=i.useSelector((function(e){return e.currentCall.startTime})),h=a.useTranslation().t,k=t.useState([]),N=k[0],_=k[1],E=t.useState([]),w=E[0],A=E[1],F=t.useState(!1),S=F[0],I=F[1],M=t.useState(!1),q=M[0],T=M[1],D=t.useState(0),j=D[0],L=D[1],H=t.useRef(null),C=t.useRef(null),R=t.useRef(null),V=t.useState(!0),O=V[0],P=V[1],U=function(){R.current=null,_([]),A([]),I(!1),T(!1),L(0),P(!0)},z=function(e){var t,i,r,a;return!(!x||!e)&&((null===(r=null===(i=null===(t=x.endpoints)||void 0===t?void 0:t.mainextension)||void 0===i?void 0:i[0])||void 0===r?void 0:r.id)===e||!!(null===(a=x.endpoints)||void 0===a?void 0:a.extension)&&Object.values(x.endpoints.extension).some((function(t){return t.id===e||t.exten===e})))};t.useEffect((function(){var t=Math.max(0,N.length-100),i=N.slice(t),r=e.__spreadArray([],i,!0).sort((function(e,t){return e.timestamp-t.timestamp}));A(r)}),[N]);var B=function(t){var i,r=Number(t.timestamp)||0,a=Number.isFinite(Number(t.channel_index))?Number(t.channel_index):-1,n=Number.isFinite(Number(t.segment_start))?Number(t.segment_start):r,l=t.uniqueid&&a>=0?"".concat(t.uniqueid,"_").concat(a,"_").concat(n.toFixed(3)):"".concat(t.uniqueid,"_").concat(r),p=(i=Number(v),!Number.isFinite(i)||i<=0?null:Math.max(0,Math.floor(Date.now()/1e3)-i)),s=r;if(null!==p){if(null===R.current)R.current=p-r;else{var o=p-(r+R.current),c=Math.max(-2,Math.min(2,o));R.current+=.2*c}s=r+(R.current||0),s=Math.max(0,Math.min(p,s))}var u={id:l,timestamp:s,channelIndex:a,segmentStart:n,speaker:t.speaker_name||"Unknown",speakerNumber:t.speaker_number||"",counterpart:t.speaker_counterpart_name||"",counterpartNumber:t.speaker_counterpart_number||"",text:t.transcription||"",isFinal:t.is_final||!1};_((function(t){var i=function(e){for(var i=t.length-1;i>=0;i-=1)if(e(t[i]))return i;return-1},r=function(e){return u.channelIndex>=0&&e.channelIndex>=0?e.channelIndex===u.channelIndex:u.speakerNumber&&e.speakerNumber?e.speakerNumber===u.speakerNumber:e.speaker===u.speaker},a=t.findIndex((function(e){return e.id===l}));if(-1!==a)return t[a].isFinal&&!u.isFinal?e.__spreadArray(e.__spreadArray([],t,!0),[e.__assign(e.__assign({},u),{id:"".concat(u.id,"_").concat(Date.now())})],!1):((s=e.__spreadArray([],t,!0))[a]=u,s);if(u.isFinal){var n=i((function(e){return e.isFinal&&r(e)&&e.text.trim()===u.text.trim()&&Math.abs(e.timestamp-u.timestamp)<=1}));if(-1!==n)return(s=e.__spreadArray([],t,!0))[n]=e.__assign(e.__assign({},u),{id:t[n].id}),s;var p=i((function(e){return!e.isFinal&&r(e)}));return-1!==p?((s=e.__spreadArray([],t,!0))[p]=e.__assign(e.__assign({},u),{id:t[p].id}),s):e.__spreadArray(e.__spreadArray([],t,!0),[u],!1)}var s,o=i((function(e){return!e.isFinal&&r(e)}));return-1!==o?((s=e.__spreadArray([],t,!0))[o]=e.__assign(e.__assign({},u),{id:t[o].id}),s):e.__spreadArray(e.__spreadArray([],t,!0),[u],!1)}))},W=Math.max(0,N.length-j);t.useEffect((function(){0!==N.length&&(O&&C.current?setTimeout((function(){C.current&&(C.current.scrollTop=C.current.scrollHeight)}),100):q&&!O&&I(!0))}),[N]),t.useEffect((function(){f&&N.length>0&&(P(!0),T(!1),I(!1))}),[f]),n.useEventListener("phone-island-conversation-transcription",(function(e){B(e)})),n.useEventListener("phone-island-transcription-opened",(function(){U()})),n.useEventListener("phone-island-transcription-closed",(function(){U()}));var G="pi-absolute pi-w-full pi-bg-elevationL2 pi-flex pi-flex-col pi-text-iconWhite dark:pi-text-iconWhiteDark pi-left-0 -pi-z-10 pi-pointer-events-auto ".concat("settings"===b||y?"pi-top-[17rem]":"pi-top-[13rem]");return c.default.createElement(c.default.Fragment,null,c.default.createElement(r.AnimatePresence,null,f&&c.default.createElement(r.motion.div,e.__assign({className:G,style:d},u),c.default.createElement("div",{className:"pi-h-full pi-rounded-lg pi-overflow-hidden pi-bg-elevationL2 dark:pi-bg-elevationL2Dark pi-relative pi-flex pi-flex-col pi-border-2 pi-border-gray-100 dark:pi-border-gray-600 pi-shadow-lg"},c.default.createElement("div",{className:"pi-flex-1 pi-pt-4 pi-px-4 pi-mt-8"},c.default.createElement("div",{className:"pi-h-60 pi-bg-gray-100 dark:pi-bg-gray-800 pi-rounded-lg pi-border pi-border-gray-200 dark:pi-border-gray-700 pi-overflow-hidden pi-flex pi-flex-col"},c.default.createElement(r.AnimatePresence,null,S&&q&&c.default.createElement(r.motion.div,{initial:{opacity:0,y:-10,scale:.9},animate:{opacity:1,y:0,scale:1},exit:{opacity:0,y:-10,scale:.9},className:"pi-absolute pi-top-16 pi-left-0 pi-right-0 pi-flex pi-justify-center pi-z-20"},c.default.createElement("button",{onClick:function(){C.current&&(C.current.scrollTop=C.current.scrollHeight,I(!1),T(!1),P(!0),L(N.length))},className:"pi-bg-phoneIslandActive dark:pi-bg-phoneIslandActiveDark hover:pi-bg-gray-500 dark:hover:pi-bg-gray-50 focus:pi-ring-emerald-500 dark:focus:pi-ring-emerald-300 pi-text-primaryInvert dark:pi-text-primaryInvertDark pi-px-4 pi-py-2 pi-rounded-full pi-text-sm pi-shadow-lg pi-flex pi-items-center pi-gap-2 pi-transition-all pi-duration-200 pi-border pi-backdrop-blur-sm"},c.default.createElement(p.FontAwesomeIcon,{icon:s.faArrowDown,className:"pi-w-4 pi-h-4"}),h(W>1?"TranscriptionView.New messages":"TranscriptionView.New message")))),c.default.createElement("div",{ref:C,onScroll:function(){if(C.current){var e=function(){if(!C.current)return!0;var e=C.current,t=e.scrollTop;return e.scrollHeight-t<=e.clientHeight+10}(),t=C.current;t.scrollTop,t.scrollHeight,t.clientHeight,e?(I(!1),T(!1),P(!0),L(N.length)):(T(!0),P(!1))}},className:"pi-flex-1 pi-p-4 ".concat(w.length>0?"pi-overflow-y-auto pi-scrollbar-thin pi-scrollbar-thumb-gray-400 pi-scrollbar-thumb-rounded-full pi-scrollbar-thumb-opacity-50 pi-scrollbar-track-gray-200 dark:pi-scrollbar-track-gray-900 pi-scrollbar-track-rounded-full pi-scrollbar-track-opacity-25":"pi-overflow-hidden")},0===w.length?c.default.createElement((function(){return c.default.createElement("div",{className:"pi-space-y-2 pi-animate-pulse"},c.default.createElement("div",{className:"pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-2/5"}),c.default.createElement("div",{className:"pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-4/5"}),c.default.createElement("div",{className:"pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-2/5"}),c.default.createElement("div",{className:"pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-4/5"}))}),null):c.default.createElement("div",{className:"pi-space-y-4"},N.length>100&&c.default.createElement("div",{className:"pi-text-center pi-py-2 pi-text-xs pi-text-gray-500 dark:pi-text-gray-400 pi-border-b pi-border-gray-200 dark:pi-border-gray-700"},h("TranscriptionView.Showing messages",{visible:w.length,total:N.length})),w.map((function(e,t){return c.default.createElement(r.motion.div,{key:e.id,layout:!0,initial:{opacity:0,y:20},animate:{opacity:1,y:0},transition:{duration:.3,layout:{duration:.25}},className:"pi-mb-4"},c.default.createElement("div",{className:"pi-mb-2"},c.default.createElement("span",{className:"pi-font-medium pi-text-xs pi-text-secondaryNeutral dark:pi-text-secondaryNeutralDark"},z(e.speakerNumber)?h("Common.Me","Me"):e.speaker)),c.default.createElement("div",{className:"pi-relative pi-p-3 pi-rounded-lg pi-text-xs pi-font-regular ".concat(z(e.speakerNumber)?"pi-text-gray-800 dark:pi-text-gray-100 pi-bg-gray-200 dark:pi-bg-gray-600":"pi-text-indigo-800 dark:pi-text-indigo-100 pi-bg-indigo-100 dark:pi-bg-indigo-700")},c.default.createElement("div",{className:"pi-flex pi-items-start pi-justify-between pi-gap-3"},c.default.createElement("div",{className:"pi-flex-1"},c.default.createElement(m,{text:e.text,isFinal:e.isFinal,speed:30})),c.default.createElement("div",{className:"pi-flex-shrink-0 pi-mt-1 pi-text-xs pi-font-regular ".concat(z(e.speakerNumber)?"pi-text-gray-800 dark:pi-text-gray-100 pi-bg-gray-200 dark:pi-bg-gray-600":"pi-text-indigo-800 dark:pi-text-indigo-100 pi-bg-indigo-100 dark:pi-bg-indigo-700")},(i=e.timestamp,a=Math.floor(i/60),n=Math.floor(i%60),"".concat(a.toString().padStart(2,"0"),":").concat(n.toString().padStart(2,"0")))))),!e.isFinal&&""!==e.text.trim()&&c.default.createElement(r.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},className:"pi-mt-1 pi-ml-3 pi-flex pi-items-center pi-gap-1"},c.default.createElement("span",{className:"pi-text-xs pi-text-gray-400 dark:pi-text-gray-500 pi-italic"},h("TranscriptionView.Is speaking","")),c.default.createElement("div",{className:"pi-inline-flex pi-items-center pi-gap-1"},c.default.createElement(r.motion.div,{className:"pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full",animate:{opacity:[.3,1,.3]},transition:{duration:1.5,repeat:1/0,delay:0}}),c.default.createElement(r.motion.div,{className:"pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full",animate:{opacity:[.3,1,.3]},transition:{duration:1.5,repeat:1/0,delay:.2}}),c.default.createElement(r.motion.div,{className:"pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full",animate:{opacity:[.3,1,.3]},transition:{duration:1.5,repeat:1/0,delay:.4}}))));var i,a,n})),c.default.createElement("div",{ref:H,className:"pi-pb-4"}))))),c.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-center pi-py-2"},c.default.createElement("button",{onClick:function(){return l.eventDispatch("phone-island-transcription-close",{})},className:"pi-bg-transparent dark:enabled:hover:pi-bg-gray-700/30 enabled:hover:pi-bg-gray-300/70 focus:pi-ring-offset-gray-200 dark:focus:pi-ring-gray-500 focus:pi-ring-gray-400 pi-text-secondaryNeutral pi-outline-none pi-border-transparent dark:pi-text-secondaryNeutralDark pi-h-12 pi-w-24 pi-rounded-fullpi-px-4 pi-py-2 pi-rounded-full pi-text-lg  pi-flex pi-items-center pi-gap-2 pi-transition-all pi-duration-200 pi-border pi-backdrop-blur-sm"},c.default.createElement(p.FontAwesomeIcon,{icon:s.faAngleUp,className:"pi-w-4 pi-h-4 pi-ml-1"}),h("Common.Close")))))))}));f.displayName="TranscriptionView",exports.default=f;
+"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"),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 i=require("../../node_modules/react-i18next/dist/es/useTranslation.js");require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var r=require("../../utils/customHooks/useEventListener.js"),a=require("../../utils/genericFunctions/eventDispatch.js");require("../../store/index.js");var n=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),s=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),l=require("../../node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs.js"),o=require("../../node_modules/framer-motion/dist/es/render/components/motion/proxy.mjs.js"),p=require("../../node_modules/react-redux/es/hooks/useSelector.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=u(t),c={initial:{height:0,opacity:0},animate:{height:"360px",opacity:1},exit:{height:0,opacity:0},transition:{duration:.1,ease:"easeOut"}},m={borderBottomLeftRadius:"20px",borderBottomRightRadius:"20px",transformOrigin:"top",overflow:"hidden"},f=function(e){var i=e.text,r=e.isFinal,a=e.speed,n=void 0===a?50:a,s=t.useState(""),l=s[0],o=s[1];return t.useEffect((function(){if(!r){o("");var e=0,t=setInterval((function(){e<i.length?(o(i.slice(0,e+1)),e++):clearInterval(t)}),n);return function(){return clearInterval(t)}}o(i)}),[i,r,n]),d.default.createElement("div",{className:"pi-inline-flex pi-items-center pi-flex-wrap"},d.default.createElement("span",null,l))},g=t.memo((function(u){var g=u.isVisible,b=p.useSelector((function(e){return e.island})),y=b.actionsExpanded,x=b.view,v=p.useSelector((function(e){return e.currentUser})),h=p.useSelector((function(e){return e.currentCall.startTime})),_=i.useTranslation().t,k=t.useState([]),N=k[0],E=k[1],w=t.useState([]),j=w[0],q=w[1],A=t.useState(!1),F=A[0],S=A[1],I=t.useState(!1),M=I[0],T=I[1],D=t.useState(0),L=D[0],H=D[1],C=t.useRef(null),P=t.useRef(null),R=t.useRef(null),V=t.useState(!0),O=V[0],U=V[1],W=function(){R.current=null,E([]),q([]),S(!1),T(!1),H(0),U(!0)},z=function(e){var t,i,r,a;return!(!v||!e)&&((null===(r=null===(i=null===(t=v.endpoints)||void 0===t?void 0:t.mainextension)||void 0===i?void 0:i[0])||void 0===r?void 0:r.id)===e||!!(null===(a=v.endpoints)||void 0===a?void 0:a.extension)&&Object.values(v.endpoints.extension).some((function(t){return t.id===e||t.exten===e})))};t.useEffect((function(){var t=Math.max(0,N.length-100),i=N.slice(t),r=e.__spreadArray([],i,!0).sort((function(e,t){return e.timestamp-t.timestamp}));q(r)}),[N]);var B=function(t){var i,r=Number(t.timestamp)||0,a=Number.isFinite(Number(t.channel_index))?Number(t.channel_index):-1,n=Number.isFinite(Number(t.segment_start))?Number(t.segment_start):r,s=t.uniqueid&&a>=0?"".concat(t.uniqueid,"_").concat(a,"_").concat(n.toFixed(3)):"".concat(t.uniqueid,"_").concat(r),l=(i=Number(h),!Number.isFinite(i)||i<=0?null:Math.max(0,Math.floor(Date.now()/1e3)-i)),o=r;if(null!==l){if(null===R.current)R.current=l-r;else{var p=l-(r+R.current),u=Math.max(-2,Math.min(2,p));R.current+=.2*u}o=r+(R.current||0),o=Math.max(0,Math.min(l,o))}var d={id:s,timestamp:o,channelIndex:a,segmentStart:n,speaker:t.speaker_name||"Unknown",speakerNumber:t.speaker_number||"",counterpart:t.speaker_counterpart_name||"",counterpartNumber:t.speaker_counterpart_number||"",text:t.transcription||"",isFinal:t.is_final||!1};E((function(t){var i=function(e){for(var i=t.length-1;i>=0;i-=1)if(e(t[i]))return i;return-1},r=function(e){return d.channelIndex>=0&&e.channelIndex>=0?e.channelIndex===d.channelIndex:d.speakerNumber&&e.speakerNumber?e.speakerNumber===d.speakerNumber:e.speaker===d.speaker},a=t.findIndex((function(e){return e.id===s}));if(-1!==a)return t[a].isFinal&&!d.isFinal?e.__spreadArray(e.__spreadArray([],t,!0),[e.__assign(e.__assign({},d),{id:"".concat(d.id,"_").concat(Date.now())})],!1):((o=e.__spreadArray([],t,!0))[a]=d,o);if(d.isFinal){var n=i((function(e){return e.isFinal&&r(e)&&e.text.trim()===d.text.trim()&&Math.abs(e.timestamp-d.timestamp)<=1}));if(-1!==n)return(o=e.__spreadArray([],t,!0))[n]=e.__assign(e.__assign({},d),{id:t[n].id}),o;var l=i((function(e){return!e.isFinal&&r(e)}));return-1!==l?((o=e.__spreadArray([],t,!0))[l]=e.__assign(e.__assign({},d),{id:t[l].id}),o):e.__spreadArray(e.__spreadArray([],t,!0),[d],!1)}var o,p=i((function(e){return!e.isFinal&&r(e)}));return-1!==p?((o=e.__spreadArray([],t,!0))[p]=e.__assign(e.__assign({},d),{id:t[p].id}),o):e.__spreadArray(e.__spreadArray([],t,!0),[d],!1)}))},G=Math.max(0,N.length-L);t.useEffect((function(){0!==N.length&&(O&&P.current?setTimeout((function(){P.current&&(P.current.scrollTop=P.current.scrollHeight)}),100):M&&!O&&S(!0))}),[N]),t.useEffect((function(){g&&N.length>0&&(U(!0),T(!1),S(!1))}),[g]),r.useEventListener("phone-island-conversation-transcription",(function(e){B(e)})),r.useEventListener("phone-island-transcription-opened",(function(){W()})),r.useEventListener("phone-island-transcription-closed",(function(){W()}));var J="pi-absolute pi-w-full pi-bg-elevationL2 pi-flex pi-flex-col pi-text-iconWhite dark:pi-text-iconWhiteDark pi-left-0 -pi-z-10 pi-pointer-events-auto ".concat("settings"===x||y?"pi-top-[17rem]":"pi-top-[13rem]");return d.default.createElement(d.default.Fragment,null,d.default.createElement(l.AnimatePresence,null,g&&d.default.createElement(o.motion.div,e.__assign({className:J,style:m},c),d.default.createElement("div",{className:"pi-h-full pi-rounded-lg pi-overflow-hidden pi-bg-elevationL2 dark:pi-bg-elevationL2Dark pi-relative pi-flex pi-flex-col pi-border-2 pi-border-gray-100 dark:pi-border-gray-600 pi-shadow-lg"},d.default.createElement("div",{className:"pi-flex-1 pi-pt-4 pi-px-4 pi-mt-8"},d.default.createElement("div",{className:"pi-h-60 pi-bg-gray-100 dark:pi-bg-gray-800 pi-rounded-lg pi-border pi-border-gray-200 dark:pi-border-gray-700 pi-overflow-hidden pi-flex pi-flex-col"},d.default.createElement(l.AnimatePresence,null,F&&M&&d.default.createElement(o.motion.div,{initial:{opacity:0,y:-10,scale:.9},animate:{opacity:1,y:0,scale:1},exit:{opacity:0,y:-10,scale:.9},className:"pi-absolute pi-top-16 pi-left-0 pi-right-0 pi-flex pi-justify-center pi-z-20"},d.default.createElement("button",{onClick:function(){P.current&&(P.current.scrollTop=P.current.scrollHeight,S(!1),T(!1),U(!0),H(N.length))},className:"pi-bg-phoneIslandActive dark:pi-bg-phoneIslandActiveDark hover:pi-bg-gray-500 dark:hover:pi-bg-gray-50 focus:pi-ring-emerald-500 dark:focus:pi-ring-emerald-300 pi-text-primaryInvert dark:pi-text-primaryInvertDark pi-px-4 pi-py-2 pi-rounded-full pi-text-sm pi-shadow-lg pi-flex pi-items-center pi-gap-2 pi-transition-all pi-duration-200 pi-border pi-backdrop-blur-sm"},d.default.createElement(n.FontAwesomeIcon,{icon:s.faArrowDown,className:"pi-w-4 pi-h-4"}),_(G>1?"TranscriptionView.New messages":"TranscriptionView.New message")))),d.default.createElement("div",{ref:P,onScroll:function(){if(P.current){var e=function(){if(!P.current)return!0;var e=P.current,t=e.scrollTop;return e.scrollHeight-t<=e.clientHeight+10}(),t=P.current;t.scrollTop,t.scrollHeight,t.clientHeight,e?(S(!1),T(!1),U(!0),H(N.length)):(T(!0),U(!1))}},className:"pi-flex-1 pi-p-4 ".concat(j.length>0?"pi-overflow-y-auto pi-scrollbar-thin pi-scrollbar-thumb-gray-400 pi-scrollbar-thumb-rounded-full pi-scrollbar-thumb-opacity-50 pi-scrollbar-track-gray-200 dark:pi-scrollbar-track-gray-900 pi-scrollbar-track-rounded-full pi-scrollbar-track-opacity-25":"pi-overflow-hidden")},0===j.length?d.default.createElement((function(){return d.default.createElement("div",{className:"pi-space-y-2 pi-animate-pulse"},d.default.createElement("div",{className:"pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-2/5"}),d.default.createElement("div",{className:"pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-4/5"}),d.default.createElement("div",{className:"pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-2/5"}),d.default.createElement("div",{className:"pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-4/5"}))}),null):d.default.createElement("div",{className:"pi-space-y-4"},N.length>100&&d.default.createElement("div",{className:"pi-text-center pi-py-2 pi-text-xs pi-text-gray-500 dark:pi-text-gray-400 pi-border-b pi-border-gray-200 dark:pi-border-gray-700"},_("TranscriptionView.Showing messages",{visible:j.length,total:N.length})),j.map((function(e,t){return d.default.createElement(o.motion.div,{key:e.id,layout:!0,initial:{opacity:0,y:20},animate:{opacity:1,y:0},transition:{duration:.3,layout:{duration:.25}},className:"pi-mb-4"},d.default.createElement("div",{className:"pi-mb-2"},d.default.createElement("span",{className:"pi-font-medium pi-text-xs pi-text-secondaryNeutral dark:pi-text-secondaryNeutralDark"},z(e.speakerNumber)?_("Common.Me","Me"):e.speaker)),d.default.createElement("div",{className:"pi-relative pi-p-3 pi-rounded-lg pi-text-xs pi-font-regular ".concat(z(e.speakerNumber)?"pi-text-gray-800 dark:pi-text-gray-100 pi-bg-gray-200 dark:pi-bg-gray-600":"pi-text-indigo-800 dark:pi-text-indigo-100 pi-bg-indigo-100 dark:pi-bg-indigo-700")},d.default.createElement("div",{className:"pi-flex pi-items-start pi-justify-between pi-gap-3"},d.default.createElement("div",{className:"pi-flex-1"},d.default.createElement(f,{text:e.text,isFinal:e.isFinal,speed:30})),d.default.createElement("div",{className:"pi-flex-shrink-0 pi-mt-1 pi-text-xs pi-font-regular ".concat(z(e.speakerNumber)?"pi-text-gray-800 dark:pi-text-gray-100 pi-bg-gray-200 dark:pi-bg-gray-600":"pi-text-indigo-800 dark:pi-text-indigo-100 pi-bg-indigo-100 dark:pi-bg-indigo-700")},(i=e.timestamp,r=Math.floor(i/60),a=Math.floor(i%60),"".concat(r.toString().padStart(2,"0"),":").concat(a.toString().padStart(2,"0")))))),!e.isFinal&&""!==e.text.trim()&&d.default.createElement(o.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},className:"pi-mt-1 pi-ml-3 pi-flex pi-items-center pi-gap-1"},d.default.createElement("span",{className:"pi-text-xs pi-text-gray-400 dark:pi-text-gray-500 pi-italic"},_("TranscriptionView.Is speaking","")),d.default.createElement("div",{className:"pi-inline-flex pi-items-center pi-gap-1"},d.default.createElement(o.motion.div,{className:"pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full",animate:{opacity:[.3,1,.3]},transition:{duration:1.5,repeat:1/0,delay:0}}),d.default.createElement(o.motion.div,{className:"pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full",animate:{opacity:[.3,1,.3]},transition:{duration:1.5,repeat:1/0,delay:.2}}),d.default.createElement(o.motion.div,{className:"pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full",animate:{opacity:[.3,1,.3]},transition:{duration:1.5,repeat:1/0,delay:.4}}))));var i,r,a})),d.default.createElement("div",{ref:C,className:"pi-pb-4"}))))),d.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-center pi-py-2"},d.default.createElement("button",{onClick:function(){return a.eventDispatch("phone-island-transcription-close",{})},className:"pi-bg-transparent dark:enabled:hover:pi-bg-gray-700/30 enabled:hover:pi-bg-gray-300/70 focus:pi-ring-offset-gray-200 dark:focus:pi-ring-gray-500 focus:pi-ring-gray-400 pi-text-secondaryNeutral pi-outline-none pi-border-transparent dark:pi-text-secondaryNeutralDark pi-h-12 pi-w-24 pi-rounded-fullpi-px-4 pi-py-2 pi-rounded-full pi-text-lg  pi-flex pi-items-center pi-gap-2 pi-transition-all pi-duration-200 pi-border pi-backdrop-blur-sm"},d.default.createElement(n.FontAwesomeIcon,{icon:s.faAngleUp,className:"pi-w-4 pi-h-4 pi-ml-1"}),_("Common.Close")))))))}));g.displayName="TranscriptionView",exports.default=g;
 //# sourceMappingURL=TranscriptionView.js.map