npm - @nethesis/phone-island - Versions diffs - 1.1.5 → 1.1.6 - Mend

@nethesis/phone-island 1.1.5 → 1.1.6

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 (321) hide show

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":"mrCAkB2D,WACzD,IAAMA,EAAWC,EAAAA,cACTC,EAAMC,qBAERC,EAAuBC,EAAAA,YAAY,SAACC,GAAqB,OAAAA,eAAAA,EAAOC,WAAW,GAC3EC,EAA2BH,EAAAA,YAAY,SAACC,GAAqB,OAAAA,eAAAA,EAAOG,KAAK,GAIzEC,EAAwBC,OAAOC,MAAKR,eAAAA,EAAiBS,gBAAiB,CAAE,GAAEC,OAC9E,SAACC,GAAO,OAACC,EAAAA,QAAQZ,EAAgBS,cAAcE,GAAI,GAG/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,EAAA,gFAEpC,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,+BAoBZ5C,EAASO,YAAYsC,2BAA2BpB,GAChDU,gBAAc,sCAAuC,CAAA,GACrDW,WAAW,WACTZ,EAAAA,sBAAsBT,aAAqB,EAArBA,EAAuBV,GAAIc,GACjDM,gBAAc,6BAA8B,CAAA,EAC7C,EAAE,KACHA,gBAAc,6BAA8B,CAAA,KAEZ,YAAhCV,eAAAA,EAAuBD,OACU,cAAhCC,eAAAA,EAAuBD,OACoB,cAAX,QAA/BuB,EAAA3C,eAAAA,EAAiB2B,sBAAc,IAAAgB,OAAA,EAAAA,EAAEvB,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,IAAI,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,IAIHiC,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");require("../../node_modules/react-redux/es/index.js");var t=require("../../node_modules/@fortawesome/react-fontawesome/dist/index.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"}))};
+"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/dist/index.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"),c=require("../../utils/genericFunctions/localStorage.js");require("../../node_modules/tslib/tslib.es6.js"),require("../../store/index.js");var d=require("../CustomThemedTooltip.js");require("../../node_modules/i18next/dist/esm/i18next.js"),require("../../node_modules/react-i18next/dist/es/context.js");var s=require("../../node_modules/react-i18next/dist/es/useTranslation.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 m=u(e);exports.default=function(u){u.isTransferView;var f=p.useSelector(function(e){return e.webrtc}).sipcall,g=s.useTranslation().t,v=p.useSelector(function(e){return e.player.remoteAudio}),y=e.useState(c.getJSONItem("phone-island-audio-input-device").deviceId||null),h=y[0],x=y[1],k=e.useState(c.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!"),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){I(e.deviceId)});var w=function(e){E(e),null==v||v.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){w(e.deviceId)});var N=e.useState([]),S=N[0],j=N[1];e.useEffect(function(){var e=function(){navigator.mediaDevices.enumerateDevices().then(function(e){j(e)}).catch(function(e){console.error("error",e)})};return e(),navigator.mediaDevices.addEventListener("devicechange",e),function(){navigator.mediaDevices.removeEventListener("devicechange",e)}},[b,h]);var C=p.useSelector(function(e){return e.darkTheme}).theme,F=function(e){l.eventDispatch("phone-island-theme-change",{selectedTheme:e})},q=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(q?"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")),S.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")),S.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 F("dark")},"data-stop-propagation":!0},"dark"===C&&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"!==C?"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 F("light")},"data-stop-propagation":!0},"light"===C&&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"!==C?"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(d.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("../../node_modules/react-redux/es/index.js"),require("../../node_modules/@fortawesome/react-fontawesome/dist/index.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");
+"use strict";require("react"),require("../../node_modules/react-redux/es/index.js"),require("../../node_modules/@fortawesome/react-fontawesome/dist/index.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/i18next/dist/esm/i18next.js"),require("../../node_modules/react-i18next/dist/es/context.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");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))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../node_modules/i18next/dist/esm/i18next.js"),require("../node_modules/react-i18next/dist/es/context.js");var t=require("../node_modules/react-i18next/dist/es/useTranslation.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=n(e);exports.default=function(n){var i=n.text,a=t.useTranslation().t,l=e.useState(!1),u=l[0],s=l[1],c=e.useRef(null),o=e.useRef(null),p="unknown"===i?a("TextScroll.unknown"):i,f=e.useCallback(function(){if(c.current&&o.current){var e=o.current.scrollWidth-c.current.clientWidth>5;s(e||p.length>12)}else s(p.length>12)},[p,12]);e.useLayoutEffect(function(){f()},[p,f]),e.useEffect(function(){if("undefined"!=typeof ResizeObserver){var e=new ResizeObserver(function(){f()});return c.current&&e.observe(c.current),o.current&&e.observe(o.current),function(){return e.disconnect()}}},[p,f]);var d=e.useMemo(function(){return"".concat(Math.max(8,Math.ceil(p.length/2)),"s")},[p]);return r.default.createElement("div",{ref:c,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"},p),r.default.createElement("span",{className:"pi-pr-6","aria-hidden":"true"},p)),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"},p),r.default.createElement("span",{ref:o,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":"~~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,YAAY,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,EAAG,CAACP,EAV0B,KAY9BQ,EAAAA,gBAAgB,WACdP,GACF,EAAG,CAACD,EAAgBC,IAEpBQ,EAAAA,UAAU,WACR,GAA8B,oBAAnBC,eAAX,CAIA,IAAMC,EAAW,IAAID,eAAe,WAClCT,GACF,GAUA,OARIJ,EAAaM,SACfQ,EAASC,QAAQf,EAAaM,SAG5BJ,EAAWI,SACbQ,EAASC,QAAQb,EAAWI,SAGvB,WAAM,OAAAQ,EAASE,YAAY,CAdjC,CAeH,EAAG,CAACb,EAAgBC,IAEpB,IAAMa,EAAiBC,EAAOA,QAC5B,WAAM,MAAA,GAAAC,OAAGC,KAAKC,IAAI,EAAGD,KAAKE,KAAKnB,EAAeO,OAAS,IAAG,IAAG,EAC7D,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":"0XAU8C,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,YAAY,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,EAAG,CAACP,EAV0B,KAY9BQ,EAAAA,gBAAgB,WACdP,GACF,EAAG,CAACD,EAAgBC,IAEpBQ,EAAAA,UAAU,WACR,GAA8B,oBAAnBC,eAAX,CAIA,IAAMC,EAAW,IAAID,eAAe,WAClCT,GACF,GAUA,OARIJ,EAAaM,SACfQ,EAASC,QAAQf,EAAaM,SAG5BJ,EAAWI,SACbQ,EAASC,QAAQb,EAAWI,SAGvB,WAAM,OAAAQ,EAASE,YAAY,CAdjC,CAeH,EAAG,CAACb,EAAgBC,IAEpB,IAAMa,EAAiBC,EAAOA,QAC5B,WAAM,MAAA,GAAAC,OAAGC,KAAKC,IAAI,EAAGD,KAAKE,KAAKnB,EAAeO,OAAS,IAAG,IAAG,EAC7D,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("../../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/dist/index.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],C=D[1],P=t.useRef(null),R=t.useRef(null),V=t.useRef(null),H=t.useState(!0),O=H[0],U=H[1],W=function(){V.current=null,E([]),q([]),S(!1),T(!1),C(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===V.current)V.current=l-r;else{var p=l-(r+V.current),u=Math.max(-2,Math.min(2,p));V.current+=.2*u}o=r+(V.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&&R.current?setTimeout(function(){R.current&&(R.current.scrollTop=R.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(){R.current&&(R.current.scrollTop=R.current.scrollHeight,S(!1),T(!1),U(!0),C(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:R,onScroll:function(){if(R.current){var e=function(){if(!R.current)return!0;var e=R.current,t=e.scrollTop;return e.scrollHeight-t<=e.clientHeight+10}();e?(S(!1),T(!1),U(!0),C(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:P,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;
+"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/i18next/dist/esm/i18next.js"),require("../../node_modules/react-i18next/dist/es/context.js");var i=require("../../node_modules/react-i18next/dist/es/useTranslation.js"),r=require("../../utils/customHooks/useEventListener.js"),a=require("../../utils/genericFunctions/eventDispatch.js");require("../../store/index.js");var n=require("../../node_modules/@fortawesome/react-fontawesome/dist/index.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,y=p.useSelector(function(e){return e.island}),b=y.actionsExpanded,x=y.view,v=p.useSelector(function(e){return e.currentUser}),h=p.useSelector(function(e){return e.currentCall.startTime}),k=i.useTranslation().t,_=t.useState([]),N=_[0],E=_[1],w=t.useState([]),j=w[0],A=w[1],F=t.useState(!1),S=F[0],q=F[1],I=t.useState(!1),M=I[0],T=I[1],D=t.useState(0),L=D[0],C=D[1],R=t.useRef(null),V=t.useRef(null),H=t.useRef(null),O=t.useState(!0),P=O[0],U=O[1],z=function(){H.current=null,E([]),A([]),q(!1),T(!1),C(0),U(!0)},B=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});A(r)},[N]);var W=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===H.current)H.current=l-r;else{var p=l-(r+H.current),u=Math.max(-2,Math.min(2,p));H.current+=.2*u}o=r+(H.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&&(P&&V.current?setTimeout(function(){V.current&&(V.current.scrollTop=V.current.scrollHeight)},100):M&&!P&&q(!0))},[N]),t.useEffect(function(){g&&N.length>0&&(U(!0),T(!1),q(!1))},[g]),r.useEventListener("phone-island-conversation-transcription",function(e){W(e)}),r.useEventListener("phone-island-transcription-opened",function(){z()}),r.useEventListener("phone-island-transcription-closed",function(){z()});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||b?"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,S&&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(){V.current&&(V.current.scrollTop=V.current.scrollHeight,q(!1),T(!1),U(!0),C(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"}),k(G>1?"TranscriptionView.New messages":"TranscriptionView.New message")))),d.default.createElement("div",{ref:V,onScroll:function(){if(V.current){var e=function(){if(!V.current)return!0;var e=V.current,t=e.scrollTop;return e.scrollHeight-t<=e.clientHeight+10}();e?(q(!1),T(!1),U(!0),C(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"},k("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"},B(e.speakerNumber)?k("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(B(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(B(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"},k("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:R,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"}),k("Common.Close")))))))});g.displayName="TranscriptionView",exports.default=g;
 //# sourceMappingURL=TranscriptionView.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TranscriptionView.js","sources":["../../../src/components/TranscriptionView/TranscriptionView.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { FC, memo, useState, useEffect, useRef } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState } from '../../store'\nimport { motion, AnimatePresence } from 'framer-motion'\nimport { useTranslation } from 'react-i18next'\nimport { useEventListener, eventDispatch } from '../../utils'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faAngleUp, faArrowDown } from '@fortawesome/free-solid-svg-icons'\n\nconst ANIMATION_CONFIG = {\n initial: { height: 0, opacity: 0 },\n animate: { height: '360px', opacity: 1 },\n exit: { height: 0, opacity: 0 },\n transition: {\n duration: 0.1,\n ease: 'easeOut',\n },\n}\n\nconst STYLE_CONFIG = {\n borderBottomLeftRadius: '20px',\n borderBottomRightRadius: '20px',\n transformOrigin: 'top',\n overflow: 'hidden',\n} as const\n\ninterface TranscriptionViewProps {\n isVisible: boolean\n}\n\ninterface TranscriptionMessage {\n id: string\n timestamp: number\n channelIndex: number\n segmentStart: number\n speaker: string\n speakerNumber: string\n counterpart: string\n counterpartNumber: string\n text: string\n isFinal: boolean\n}\n\nconst TypewriterText: FC<{ text: string; isFinal: boolean; speed?: number }> = ({\n text,\n isFinal,\n speed = 50,\n}) => {\n const [displayText, setDisplayText] = useState('')\n\n useEffect(() => {\n if (isFinal) {\n setDisplayText(text)\n return\n }\n\n setDisplayText('')\n let currentIndex = 0\n\n const typeInterval = setInterval(() => {\n if (currentIndex < text.length) {\n setDisplayText(text.slice(0, currentIndex + 1))\n currentIndex++\n } else {\n clearInterval(typeInterval)\n }\n }, speed)\n\n return () => clearInterval(typeInterval)\n }, [text, isFinal, speed])\n\n return (\n <div className='pi-inline-flex pi-items-center pi-flex-wrap'>\n <span>{displayText}</span>\n </div>\n )\n}\n\nconst TranscriptionView: FC<TranscriptionViewProps> = memo(({ isVisible }) => {\n const { actionsExpanded, view } = useSelector((state: RootState) => state.island)\n const currentUser = useSelector((state: RootState) => state.currentUser)\n const currentCallStartTime = useSelector((state: RootState) => state.currentCall.startTime)\n const { t } = useTranslation()\n\n const [allMessages, setAllMessages] = useState<TranscriptionMessage[]>([])\n const [visibleMessages, setVisibleMessages] = useState<TranscriptionMessage[]>([])\n const [hasNewContent, setHasNewContent] = useState(false)\n const [userScrolled, setUserScrolled] = useState(false)\n const [lastSeenMessageIndex, setLastSeenMessageIndex] = useState(0)\n const messagesEndRef = useRef<HTMLDivElement>(null)\n const scrollContainerRef = useRef<HTMLDivElement>(null)\n const timestampCorrectionRef = useRef<number \| null>(null)\n const [autoScroll, setAutoScroll] = useState(true)\n\n const MAX_VISIBLE_MESSAGES = 100\n\n const resetTranscriptionState = () => {\n timestampCorrectionRef.current = null\n setAllMessages([])\n setVisibleMessages([])\n setHasNewContent(false)\n setUserScrolled(false)\n setLastSeenMessageIndex(0)\n setAutoScroll(true)\n }\n\n const getLocalCallElapsedSeconds = () => {\n const start = Number(currentCallStartTime)\n if (!Number.isFinite(start) \|\| start <= 0) {\n return null\n }\n return Math.max(0, Math.floor(Date.now() / 1000) - start)\n }\n\n\n // Function to check if a speaker number belongs to current user\n const isMyNumber = (speakerNumber: string): boolean => {\n if (!currentUser \|\| !speakerNumber) return false\n\n // Check main extension from endpoints\n if (currentUser.endpoints?.mainextension?.[0]?.id === speakerNumber) return true\n\n // Check other extensions in endpoints\n if (currentUser.endpoints?.extension) {\n return Object.values(currentUser.endpoints.extension).some(\n (ext: any) => ext.id === speakerNumber \|\| ext.exten === speakerNumber,\n )\n }\n\n return false\n }\n\n // Update visible messages when all messages change.\n // Sort all messages (finals + interims) chronologically so that concurrent\n // speakers always appear in the correct time order.\n useEffect(() => {\n const startIndex = Math.max(0, allMessages.length - MAX_VISIBLE_MESSAGES)\n const recentMessages = allMessages.slice(startIndex)\n // JS Array.sort is stable: messages with equal timestamps keep insertion order.\n const sorted = [...recentMessages].sort((a, b) => a.timestamp - b.timestamp)\n setVisibleMessages(sorted)\n }, [allMessages])\n\n // Handle incoming transcription messages\n const addTranscriptionMessage = (data: any) => {\n const rawTimestamp = Number(data.timestamp) \|\| 0\n const channelIndex = Number.isFinite(Number(data.channel_index)) ? Number(data.channel_index) : -1\n const segmentStart = Number.isFinite(Number(data.segment_start))\n ? Number(data.segment_start)\n : rawTimestamp\n const uniqueId =\n data.uniqueid && channelIndex >= 0\n ? `${data.uniqueid}_${channelIndex}_${segmentStart.toFixed(3)}`\n : `${data.uniqueid}_${rawTimestamp}`\n const localElapsed = getLocalCallElapsedSeconds()\n let correctedTimestamp = rawTimestamp\n\n // Keep transcription timestamps aligned to local call timer, avoiding progressive drift.\n if (localElapsed !== null) {\n if (timestampCorrectionRef.current === null) {\n timestampCorrectionRef.current = localElapsed - rawTimestamp\n } else {\n const predicted = rawTimestamp + timestampCorrectionRef.current\n const error = localElapsed - predicted\n const boundedError = Math.max(-2, Math.min(2, error))\n timestampCorrectionRef.current += boundedError * 0.2\n }\n\n correctedTimestamp = rawTimestamp + (timestampCorrectionRef.current \|\| 0)\n correctedTimestamp = Math.max(0, Math.min(localElapsed, correctedTimestamp))\n }\n\n const message: TranscriptionMessage = {\n id: uniqueId,\n timestamp: correctedTimestamp,\n channelIndex,\n segmentStart,\n speaker: data.speaker_name \|\| 'Unknown',\n speakerNumber: data.speaker_number \|\| '',\n counterpart: data.speaker_counterpart_name \|\| '',\n counterpartNumber: data.speaker_counterpart_number \|\| '',\n text: data.transcription \|\| '',\n isFinal: data.is_final \|\| false,\n }\n\n setAllMessages((prevMessages) => {\n const findLastIndex = (predicate: (message: TranscriptionMessage) => boolean) => {\n for (let index = prevMessages.length - 1; index >= 0; index -= 1) {\n if (predicate(prevMessages[index])) {\n return index\n }\n }\n return -1\n }\n\n const isSameSpeakerStream = (existingMessage: TranscriptionMessage) => {\n if (message.channelIndex >= 0 && existingMessage.channelIndex >= 0) {\n return existingMessage.channelIndex === message.channelIndex\n }\n\n if (message.speakerNumber && existingMessage.speakerNumber) {\n return existingMessage.speakerNumber === message.speakerNumber\n }\n\n return existingMessage.speaker === message.speaker\n }\n\n // 1. Exact match by segment identity – update in place, but never\n // overwrite an already-finalized message with a new interim.\n const existingMessageIndex = prevMessages.findIndex((msg) => msg.id === uniqueId)\n if (existingMessageIndex !== -1) {\n const existing = prevMessages[existingMessageIndex]\n if (existing.isFinal && !message.isFinal) {\n // UniqueId collision: the existing segment was finalized but the\n // backend started a new interim with a colliding id. Treat it as\n // a brand-new message so the final bubble is preserved.\n return [...prevMessages, { ...message, id: `${message.id}_${Date.now()}` }]\n }\n const updatedMessages = [...prevMessages]\n updatedMessages[existingMessageIndex] = message\n return updatedMessages\n }\n\n // 2. Final message path\n if (message.isFinal) {\n // Check for a duplicate final with identical text and close timestamp\n const similarFinalIndex = findLastIndex(\n (existing) =>\n existing.isFinal &&\n isSameSpeakerStream(existing) &&\n existing.text.trim() === message.text.trim() &&\n Math.abs(existing.timestamp - message.timestamp) <= 1,\n )\n if (similarFinalIndex !== -1) {\n const updatedMessages = [...prevMessages]\n updatedMessages[similarFinalIndex] = {\n ...message,\n id: prevMessages[similarFinalIndex].id,\n }\n return updatedMessages\n }\n\n // Replace the active interim from the same speaker (the \"speaking\" bubble)\n const activeInterimIndex = findLastIndex(\n (existing) => !existing.isFinal && isSameSpeakerStream(existing),\n )\n if (activeInterimIndex !== -1) {\n const updatedMessages = [...prevMessages]\n updatedMessages[activeInterimIndex] = {\n ...message,\n id: prevMessages[activeInterimIndex].id,\n }\n return updatedMessages\n }\n\n // No interim to replace – just append.\n return [...prevMessages, message]\n }\n\n // 3. Interim message path – keep at most one active interim per speaker/channel.\n const activeInterimIndex = findLastIndex(\n (existing) => !existing.isFinal && isSameSpeakerStream(existing),\n )\n if (activeInterimIndex !== -1) {\n const updatedMessages = [...prevMessages]\n updatedMessages[activeInterimIndex] = {\n ...message,\n id: prevMessages[activeInterimIndex].id,\n }\n return updatedMessages\n }\n\n return [...prevMessages, message]\n })\n }\n\n // Check if user is at the bottom of the scroll area\n const isAtBottom = () => {\n if (!scrollContainerRef.current) return true\n const { scrollTop, scrollHeight, clientHeight } = scrollContainerRef.current\n return scrollHeight - scrollTop <= clientHeight + 10 // 10px tolerance\n }\n\n // Handle scroll events to detect user scrolling\n const handleScroll = () => {\n if (!scrollContainerRef.current) return\n\n const atBottom = isAtBottom()\n if (atBottom) {\n // User is at bottom, clear indicators and enable auto-scroll\n setHasNewContent(false)\n setUserScrolled(false)\n setAutoScroll(true)\n setLastSeenMessageIndex(allMessages.length)\n } else {\n setUserScrolled(true)\n setAutoScroll(false)\n }\n }\n\n // Scroll to bottom function\n const scrollToBottom = () => {\n if (scrollContainerRef.current) {\n scrollContainerRef.current.scrollTop = scrollContainerRef.current.scrollHeight\n\n // Update state\n setHasNewContent(false)\n setUserScrolled(false)\n setAutoScroll(true)\n setLastSeenMessageIndex(allMessages.length)\n }\n }\n\n // Calculate unseen messages count\n const unseenMessagesCount = Math.max(0, allMessages.length - lastSeenMessageIndex)\n\n // Auto-scroll to bottom when new messages arrive\n useEffect(() => {\n if (allMessages.length === 0) return\n\n if (autoScroll && scrollContainerRef.current) {\n // Auto-scroll to bottom immediately for new messages\n setTimeout(() => {\n if (scrollContainerRef.current) {\n scrollContainerRef.current.scrollTop = scrollContainerRef.current.scrollHeight\n }\n }, 100)\n } else if (userScrolled && !autoScroll) {\n // If user has scrolled up and there's a new message, show the indicator\n setHasNewContent(true)\n }\n }, [allMessages])\n\n useEffect(() => {\n if (isVisible && allMessages.length > 0) {\n setAutoScroll(true)\n setUserScrolled(false)\n setHasNewContent(false)\n }\n }, [isVisible])\n\n // Listen for transcription events\n useEventListener('phone-island-conversation-transcription', (data: any) => {\n addTranscriptionMessage(data)\n })\n\n useEventListener('phone-island-transcription-opened', () => {\n resetTranscriptionState()\n })\n\n useEventListener('phone-island-transcription-closed', () => {\n resetTranscriptionState()\n })\n\n\n // Format timestamp - converts seconds from call start to MM:SS format\n const formatTimestamp = (timestamp: number) => {\n const minutes = Math.floor(timestamp / 60)\n const seconds = Math.floor(timestamp % 60)\n return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`\n }\n\n // Skeleton component for loading state\n const TranscriptionSkeleton: FC = () => (\n <div className='pi-space-y-2 pi-animate-pulse'>\n {/* First shorter bar /}\n <div className='pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-2/5'></div>\n {/ Second longer bar /}\n <div className='pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-4/5'></div>\n {/ First shorter bar /}\n <div className='pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-2/5'></div>\n {/ Third medium bar /}\n <div className='pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-4/5'></div>\n </div>\n )\n\n const containerClassName = `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 ${\n view === 'settings' \|\| actionsExpanded ? 'pi-top-[17rem]' : 'pi-top-[13rem]'\n }`\n\n return (\n <>\n <AnimatePresence>\n {isVisible && (\n <motion.div className={containerClassName} style={STYLE_CONFIG} {...ANIMATION_CONFIG}>\n <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'>\n {/ Main Content Card /}\n <div className='pi-flex-1 pi-pt-4 pi-px-4 pi-mt-8'>\n <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'>\n <AnimatePresence>\n {hasNewContent && userScrolled && (\n <motion.div\n initial={{ opacity: 0, y: -10, scale: 0.9 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, y: -10, scale: 0.9 }}\n className='pi-absolute pi-top-16 pi-left-0 pi-right-0 pi-flex pi-justify-center pi-z-20'\n >\n <button\n onClick={scrollToBottom}\n 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'\n >\n <FontAwesomeIcon icon={faArrowDown} className='pi-w-4 pi-h-4' />\n {unseenMessagesCount > 1\n ? t('TranscriptionView.New messages')\n : t('TranscriptionView.New message')}\n </button>\n </motion.div>\n )}\n </AnimatePresence>\n\n <div\n ref={scrollContainerRef}\n onScroll={handleScroll}\n className={`pi-flex-1 pi-p-4 ${\n visibleMessages.length > 0\n ? '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'\n : 'pi-overflow-hidden'\n }`}\n >\n {visibleMessages.length === 0 ? (\n <TranscriptionSkeleton />\n ) : (\n <div className='pi-space-y-4'>\n {/ Show indicator if there are more messages than displayed /}\n {allMessages.length > MAX_VISIBLE_MESSAGES && (\n <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'>\n {t('TranscriptionView.Showing messages', {\n visible: visibleMessages.length,\n total: allMessages.length,\n })}\n </div>\n )}\n\n {visibleMessages.map((message, index) => (\n <motion.div\n key={message.id}\n layout\n initial={{ opacity: 0, y: 20 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.3, layout: { duration: 0.25 } }}\n className='pi-mb-4'\n >\n {/ Speaker Name /}\n <div className='pi-mb-2'>\n <span className='pi-font-medium pi-text-xs pi-text-secondaryNeutral dark:pi-text-secondaryNeutralDark'>\n {isMyNumber(message.speakerNumber)\n ? t('Common.Me', 'Me')\n : message.speaker}\n </span>\n </div>\n\n {/ Message Bubble with Background /}\n <div\n className={`pi-relative pi-p-3 pi-rounded-lg pi-text-xs pi-font-regular ${\n isMyNumber(message.speakerNumber)\n ? 'pi-text-gray-800 dark:pi-text-gray-100 pi-bg-gray-200 dark:pi-bg-gray-600'\n : 'pi-text-indigo-800 dark:pi-text-indigo-100 pi-bg-indigo-100 dark:pi-bg-indigo-700'\n }`}\n >\n <div className='pi-flex pi-items-start pi-justify-between pi-gap-3'>\n <div className='pi-flex-1'>\n <TypewriterText\n text={message.text}\n isFinal={message.isFinal}\n speed={30}\n />\n </div>\n {/ Timestamp on the right /}\n <div\n className={`pi-flex-shrink-0 pi-mt-1 pi-text-xs pi-font-regular ${\n isMyNumber(message.speakerNumber)\n ? 'pi-text-gray-800 dark:pi-text-gray-100 pi-bg-gray-200 dark:pi-bg-gray-600'\n : 'pi-text-indigo-800 dark:pi-text-indigo-100 pi-bg-indigo-100 dark:pi-bg-indigo-700'\n }`}\n >\n {formatTimestamp(message.timestamp)}\n </div>\n </div>\n </div>\n\n {!message.isFinal && message.text.trim() !== '' && (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n className='pi-mt-1 pi-ml-3 pi-flex pi-items-center pi-gap-1'\n >\n <span className='pi-text-xs pi-text-gray-400 dark:pi-text-gray-500 pi-italic'>\n {t('TranscriptionView.Is speaking', '')}\n </span>\n <div className='pi-inline-flex pi-items-center pi-gap-1'>\n <motion.div\n className='pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full'\n animate={{ opacity: [0.3, 1, 0.3] }}\n transition={{ duration: 1.5, repeat: Infinity, delay: 0 }}\n />\n <motion.div\n className='pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full'\n animate={{ opacity: [0.3, 1, 0.3] }}\n transition={{ duration: 1.5, repeat: Infinity, delay: 0.2 }}\n />\n <motion.div\n className='pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full'\n animate={{ opacity: [0.3, 1, 0.3] }}\n transition={{ duration: 1.5, repeat: Infinity, delay: 0.4 }}\n />\n </div>\n </motion.div>\n )}\n </motion.div>\n ))}\n <div ref={messagesEndRef} className='pi-pb-4' />\n </div>\n )}\n </div>\n </div>\n </div>\n\n {/ Footer with Close Button */}\n <div className='pi-flex pi-items-center pi-justify-center pi-py-2'>\n <button\n onClick={() => eventDispatch('phone-island-transcription-close', {})}\n 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'\n >\n <FontAwesomeIcon icon={faAngleUp} className='pi-w-4 pi-h-4 pi-ml-1' />\n {t('Common.Close')}\n </button>\n </div>\n </div>\n </motion.div>\n )}\n </AnimatePresence>\n </>\n )\n})\n\nTranscriptionView.displayName = 'TranscriptionView'\n\nexport default TranscriptionView\n"],"names":["ANIMATION_CONFIG","initial","height","opacity","animate","exit","transition","duration","ease","STYLE_CONFIG","borderBottomLeftRadius","borderBottomRightRadius","transformOrigin","overflow","TypewriterText","_a","text","isFinal","_b","speed","_c","useState","displayText","setDisplayText","useEffect","currentIndex","typeInterval","setInterval","length","slice","clearInterval","React","createElement","className","TranscriptionView","memo","isVisible","useSelector","state","island","actionsExpanded","view","currentUser","currentCallStartTime","currentCall","startTime","t","useTranslation","allMessages","setAllMessages","_d","visibleMessages","setVisibleMessages","_e","hasNewContent","setHasNewContent","_f","userScrolled","setUserScrolled","_g","lastSeenMessageIndex","setLastSeenMessageIndex","messagesEndRef","useRef","scrollContainerRef","timestampCorrectionRef","_h","autoScroll","setAutoScroll","resetTranscriptionState","current","isMyNumber","speakerNumber","endpoints","mainextension","id","extension","Object","values","some","ext","exten","startIndex","Math","max","recentMessages","sorted","__spreadArray","sort","a","b","timestamp","addTranscriptionMessage","data","start","rawTimestamp","Number","channelIndex","isFinite","channel_index","segmentStart","segment_start","uniqueId","uniqueid","concat","toFixed","localElapsed","floor","Date","now","correctedTimestamp","error","boundedError","min","message","speaker","speaker_name","speaker_number","counterpart","speaker_counterpart_name","counterpartNumber","speaker_counterpart_number","transcription","is_final","prevMessages","findLastIndex","predicate","index","isSameSpeakerStream","existingMessage","existingMessageIndex","findIndex","msg","__assign","updatedMessages","similarFinalIndex","existing","trim","abs","activeInterimIndex_1","activeInterimIndex","unseenMessagesCount","setTimeout","scrollTop","scrollHeight","useEventListener","containerClassName","Fragment","AnimatePresence","motion","div","style","y","scale","onClick","FontAwesomeIcon","icon","faArrowDown","ref","onScroll","atBottom","isAtBottom","visible","total","map","key","layout","minutes","seconds","toString","padStart","repeat","Infinity","delay","eventDispatch","faAngleUp","displayName"],"mappings":"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"}
1	+ {"version":3,"file":"TranscriptionView.js","sources":["../../../src/components/TranscriptionView/TranscriptionView.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { FC, memo, useState, useEffect, useRef } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState } from '../../store'\nimport { motion, AnimatePresence } from 'framer-motion'\nimport { useTranslation } from 'react-i18next'\nimport { useEventListener, eventDispatch } from '../../utils'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faAngleUp, faArrowDown } from '@fortawesome/free-solid-svg-icons'\n\nconst ANIMATION_CONFIG = {\n initial: { height: 0, opacity: 0 },\n animate: { height: '360px', opacity: 1 },\n exit: { height: 0, opacity: 0 },\n transition: {\n duration: 0.1,\n ease: 'easeOut' as const,\n },\n}\n\nconst STYLE_CONFIG = {\n borderBottomLeftRadius: '20px',\n borderBottomRightRadius: '20px',\n transformOrigin: 'top',\n overflow: 'hidden',\n} as const\n\ninterface TranscriptionViewProps {\n isVisible: boolean\n}\n\ninterface TranscriptionMessage {\n id: string\n timestamp: number\n channelIndex: number\n segmentStart: number\n speaker: string\n speakerNumber: string\n counterpart: string\n counterpartNumber: string\n text: string\n isFinal: boolean\n}\n\nconst TypewriterText: FC<{ text: string; isFinal: boolean; speed?: number }> = ({\n text,\n isFinal,\n speed = 50,\n}) => {\n const [displayText, setDisplayText] = useState('')\n\n useEffect(() => {\n if (isFinal) {\n setDisplayText(text)\n return\n }\n\n setDisplayText('')\n let currentIndex = 0\n\n const typeInterval = setInterval(() => {\n if (currentIndex < text.length) {\n setDisplayText(text.slice(0, currentIndex + 1))\n currentIndex++\n } else {\n clearInterval(typeInterval)\n }\n }, speed)\n\n return () => clearInterval(typeInterval)\n }, [text, isFinal, speed])\n\n return (\n <div className='pi-inline-flex pi-items-center pi-flex-wrap'>\n <span>{displayText}</span>\n </div>\n )\n}\n\nconst TranscriptionView: FC<TranscriptionViewProps> = memo(({ isVisible }) => {\n const { actionsExpanded, view } = useSelector((state: RootState) => state.island)\n const currentUser = useSelector((state: RootState) => state.currentUser)\n const currentCallStartTime = useSelector((state: RootState) => state.currentCall.startTime)\n const { t } = useTranslation()\n\n const [allMessages, setAllMessages] = useState<TranscriptionMessage[]>([])\n const [visibleMessages, setVisibleMessages] = useState<TranscriptionMessage[]>([])\n const [hasNewContent, setHasNewContent] = useState(false)\n const [userScrolled, setUserScrolled] = useState(false)\n const [lastSeenMessageIndex, setLastSeenMessageIndex] = useState(0)\n const messagesEndRef = useRef<HTMLDivElement>(null)\n const scrollContainerRef = useRef<HTMLDivElement>(null)\n const timestampCorrectionRef = useRef<number \| null>(null)\n const [autoScroll, setAutoScroll] = useState(true)\n\n const MAX_VISIBLE_MESSAGES = 100\n\n const resetTranscriptionState = () => {\n timestampCorrectionRef.current = null\n setAllMessages([])\n setVisibleMessages([])\n setHasNewContent(false)\n setUserScrolled(false)\n setLastSeenMessageIndex(0)\n setAutoScroll(true)\n }\n\n const getLocalCallElapsedSeconds = () => {\n const start = Number(currentCallStartTime)\n if (!Number.isFinite(start) \|\| start <= 0) {\n return null\n }\n return Math.max(0, Math.floor(Date.now() / 1000) - start)\n }\n\n\n // Function to check if a speaker number belongs to current user\n const isMyNumber = (speakerNumber: string): boolean => {\n if (!currentUser \|\| !speakerNumber) return false\n\n // Check main extension from endpoints\n if (currentUser.endpoints?.mainextension?.[0]?.id === speakerNumber) return true\n\n // Check other extensions in endpoints\n if (currentUser.endpoints?.extension) {\n return Object.values(currentUser.endpoints.extension).some(\n (ext: any) => ext.id === speakerNumber \|\| ext.exten === speakerNumber,\n )\n }\n\n return false\n }\n\n // Update visible messages when all messages change.\n // Sort all messages (finals + interims) chronologically so that concurrent\n // speakers always appear in the correct time order.\n useEffect(() => {\n const startIndex = Math.max(0, allMessages.length - MAX_VISIBLE_MESSAGES)\n const recentMessages = allMessages.slice(startIndex)\n // JS Array.sort is stable: messages with equal timestamps keep insertion order.\n const sorted = [...recentMessages].sort((a, b) => a.timestamp - b.timestamp)\n setVisibleMessages(sorted)\n }, [allMessages])\n\n // Handle incoming transcription messages\n const addTranscriptionMessage = (data: any) => {\n const rawTimestamp = Number(data.timestamp) \|\| 0\n const channelIndex = Number.isFinite(Number(data.channel_index)) ? Number(data.channel_index) : -1\n const segmentStart = Number.isFinite(Number(data.segment_start))\n ? Number(data.segment_start)\n : rawTimestamp\n const uniqueId =\n data.uniqueid && channelIndex >= 0\n ? `${data.uniqueid}_${channelIndex}_${segmentStart.toFixed(3)}`\n : `${data.uniqueid}_${rawTimestamp}`\n const localElapsed = getLocalCallElapsedSeconds()\n let correctedTimestamp = rawTimestamp\n\n // Keep transcription timestamps aligned to local call timer, avoiding progressive drift.\n if (localElapsed !== null) {\n if (timestampCorrectionRef.current === null) {\n timestampCorrectionRef.current = localElapsed - rawTimestamp\n } else {\n const predicted = rawTimestamp + timestampCorrectionRef.current\n const error = localElapsed - predicted\n const boundedError = Math.max(-2, Math.min(2, error))\n timestampCorrectionRef.current += boundedError * 0.2\n }\n\n correctedTimestamp = rawTimestamp + (timestampCorrectionRef.current \|\| 0)\n correctedTimestamp = Math.max(0, Math.min(localElapsed, correctedTimestamp))\n }\n\n const message: TranscriptionMessage = {\n id: uniqueId,\n timestamp: correctedTimestamp,\n channelIndex,\n segmentStart,\n speaker: data.speaker_name \|\| 'Unknown',\n speakerNumber: data.speaker_number \|\| '',\n counterpart: data.speaker_counterpart_name \|\| '',\n counterpartNumber: data.speaker_counterpart_number \|\| '',\n text: data.transcription \|\| '',\n isFinal: data.is_final \|\| false,\n }\n\n setAllMessages((prevMessages) => {\n const findLastIndex = (predicate: (message: TranscriptionMessage) => boolean) => {\n for (let index = prevMessages.length - 1; index >= 0; index -= 1) {\n if (predicate(prevMessages[index])) {\n return index\n }\n }\n return -1\n }\n\n const isSameSpeakerStream = (existingMessage: TranscriptionMessage) => {\n if (message.channelIndex >= 0 && existingMessage.channelIndex >= 0) {\n return existingMessage.channelIndex === message.channelIndex\n }\n\n if (message.speakerNumber && existingMessage.speakerNumber) {\n return existingMessage.speakerNumber === message.speakerNumber\n }\n\n return existingMessage.speaker === message.speaker\n }\n\n // 1. Exact match by segment identity – update in place, but never\n // overwrite an already-finalized message with a new interim.\n const existingMessageIndex = prevMessages.findIndex((msg) => msg.id === uniqueId)\n if (existingMessageIndex !== -1) {\n const existing = prevMessages[existingMessageIndex]\n if (existing.isFinal && !message.isFinal) {\n // UniqueId collision: the existing segment was finalized but the\n // backend started a new interim with a colliding id. Treat it as\n // a brand-new message so the final bubble is preserved.\n return [...prevMessages, { ...message, id: `${message.id}_${Date.now()}` }]\n }\n const updatedMessages = [...prevMessages]\n updatedMessages[existingMessageIndex] = message\n return updatedMessages\n }\n\n // 2. Final message path\n if (message.isFinal) {\n // Check for a duplicate final with identical text and close timestamp\n const similarFinalIndex = findLastIndex(\n (existing) =>\n existing.isFinal &&\n isSameSpeakerStream(existing) &&\n existing.text.trim() === message.text.trim() &&\n Math.abs(existing.timestamp - message.timestamp) <= 1,\n )\n if (similarFinalIndex !== -1) {\n const updatedMessages = [...prevMessages]\n updatedMessages[similarFinalIndex] = {\n ...message,\n id: prevMessages[similarFinalIndex].id,\n }\n return updatedMessages\n }\n\n // Replace the active interim from the same speaker (the \"speaking\" bubble)\n const activeInterimIndex = findLastIndex(\n (existing) => !existing.isFinal && isSameSpeakerStream(existing),\n )\n if (activeInterimIndex !== -1) {\n const updatedMessages = [...prevMessages]\n updatedMessages[activeInterimIndex] = {\n ...message,\n id: prevMessages[activeInterimIndex].id,\n }\n return updatedMessages\n }\n\n // No interim to replace – just append.\n return [...prevMessages, message]\n }\n\n // 3. Interim message path – keep at most one active interim per speaker/channel.\n const activeInterimIndex = findLastIndex(\n (existing) => !existing.isFinal && isSameSpeakerStream(existing),\n )\n if (activeInterimIndex !== -1) {\n const updatedMessages = [...prevMessages]\n updatedMessages[activeInterimIndex] = {\n ...message,\n id: prevMessages[activeInterimIndex].id,\n }\n return updatedMessages\n }\n\n return [...prevMessages, message]\n })\n }\n\n // Check if user is at the bottom of the scroll area\n const isAtBottom = () => {\n if (!scrollContainerRef.current) return true\n const { scrollTop, scrollHeight, clientHeight } = scrollContainerRef.current\n return scrollHeight - scrollTop <= clientHeight + 10 // 10px tolerance\n }\n\n // Handle scroll events to detect user scrolling\n const handleScroll = () => {\n if (!scrollContainerRef.current) return\n\n const atBottom = isAtBottom()\n if (atBottom) {\n // User is at bottom, clear indicators and enable auto-scroll\n setHasNewContent(false)\n setUserScrolled(false)\n setAutoScroll(true)\n setLastSeenMessageIndex(allMessages.length)\n } else {\n setUserScrolled(true)\n setAutoScroll(false)\n }\n }\n\n // Scroll to bottom function\n const scrollToBottom = () => {\n if (scrollContainerRef.current) {\n scrollContainerRef.current.scrollTop = scrollContainerRef.current.scrollHeight\n\n // Update state\n setHasNewContent(false)\n setUserScrolled(false)\n setAutoScroll(true)\n setLastSeenMessageIndex(allMessages.length)\n }\n }\n\n // Calculate unseen messages count\n const unseenMessagesCount = Math.max(0, allMessages.length - lastSeenMessageIndex)\n\n // Auto-scroll to bottom when new messages arrive\n useEffect(() => {\n if (allMessages.length === 0) return\n\n if (autoScroll && scrollContainerRef.current) {\n // Auto-scroll to bottom immediately for new messages\n setTimeout(() => {\n if (scrollContainerRef.current) {\n scrollContainerRef.current.scrollTop = scrollContainerRef.current.scrollHeight\n }\n }, 100)\n } else if (userScrolled && !autoScroll) {\n // If user has scrolled up and there's a new message, show the indicator\n setHasNewContent(true)\n }\n }, [allMessages])\n\n useEffect(() => {\n if (isVisible && allMessages.length > 0) {\n setAutoScroll(true)\n setUserScrolled(false)\n setHasNewContent(false)\n }\n }, [isVisible])\n\n // Listen for transcription events\n useEventListener('phone-island-conversation-transcription', (data: any) => {\n addTranscriptionMessage(data)\n })\n\n useEventListener('phone-island-transcription-opened', () => {\n resetTranscriptionState()\n })\n\n useEventListener('phone-island-transcription-closed', () => {\n resetTranscriptionState()\n })\n\n\n // Format timestamp - converts seconds from call start to MM:SS format\n const formatTimestamp = (timestamp: number) => {\n const minutes = Math.floor(timestamp / 60)\n const seconds = Math.floor(timestamp % 60)\n return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`\n }\n\n // Skeleton component for loading state\n const TranscriptionSkeleton: FC = () => (\n <div className='pi-space-y-2 pi-animate-pulse'>\n {/* First shorter bar /}\n <div className='pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-2/5'></div>\n {/ Second longer bar /}\n <div className='pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-4/5'></div>\n {/ First shorter bar /}\n <div className='pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-2/5'></div>\n {/ Third medium bar /}\n <div className='pi-h-4 pi-bg-gray-200 dark:pi-bg-gray-700 pi-rounded pi-w-4/5'></div>\n </div>\n )\n\n const containerClassName = `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 ${\n view === 'settings' \|\| actionsExpanded ? 'pi-top-[17rem]' : 'pi-top-[13rem]'\n }`\n\n return (\n <>\n <AnimatePresence>\n {isVisible && (\n <motion.div className={containerClassName} style={STYLE_CONFIG} {...ANIMATION_CONFIG}>\n <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'>\n {/ Main Content Card /}\n <div className='pi-flex-1 pi-pt-4 pi-px-4 pi-mt-8'>\n <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'>\n <AnimatePresence>\n {hasNewContent && userScrolled && (\n <motion.div\n initial={{ opacity: 0, y: -10, scale: 0.9 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, y: -10, scale: 0.9 }}\n className='pi-absolute pi-top-16 pi-left-0 pi-right-0 pi-flex pi-justify-center pi-z-20'\n >\n <button\n onClick={scrollToBottom}\n 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'\n >\n <FontAwesomeIcon icon={faArrowDown} className='pi-w-4 pi-h-4' />\n {unseenMessagesCount > 1\n ? t('TranscriptionView.New messages')\n : t('TranscriptionView.New message')}\n </button>\n </motion.div>\n )}\n </AnimatePresence>\n\n <div\n ref={scrollContainerRef}\n onScroll={handleScroll}\n className={`pi-flex-1 pi-p-4 ${\n visibleMessages.length > 0\n ? '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'\n : 'pi-overflow-hidden'\n }`}\n >\n {visibleMessages.length === 0 ? (\n <TranscriptionSkeleton />\n ) : (\n <div className='pi-space-y-4'>\n {/ Show indicator if there are more messages than displayed /}\n {allMessages.length > MAX_VISIBLE_MESSAGES && (\n <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'>\n {t('TranscriptionView.Showing messages', {\n visible: visibleMessages.length,\n total: allMessages.length,\n })}\n </div>\n )}\n\n {visibleMessages.map((message, index) => (\n <motion.div\n key={message.id}\n layout\n initial={{ opacity: 0, y: 20 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.3, layout: { duration: 0.25 } }}\n className='pi-mb-4'\n >\n {/ Speaker Name /}\n <div className='pi-mb-2'>\n <span className='pi-font-medium pi-text-xs pi-text-secondaryNeutral dark:pi-text-secondaryNeutralDark'>\n {isMyNumber(message.speakerNumber)\n ? t('Common.Me', 'Me')\n : message.speaker}\n </span>\n </div>\n\n {/ Message Bubble with Background /}\n <div\n className={`pi-relative pi-p-3 pi-rounded-lg pi-text-xs pi-font-regular ${\n isMyNumber(message.speakerNumber)\n ? 'pi-text-gray-800 dark:pi-text-gray-100 pi-bg-gray-200 dark:pi-bg-gray-600'\n : 'pi-text-indigo-800 dark:pi-text-indigo-100 pi-bg-indigo-100 dark:pi-bg-indigo-700'\n }`}\n >\n <div className='pi-flex pi-items-start pi-justify-between pi-gap-3'>\n <div className='pi-flex-1'>\n <TypewriterText\n text={message.text}\n isFinal={message.isFinal}\n speed={30}\n />\n </div>\n {/ Timestamp on the right /}\n <div\n className={`pi-flex-shrink-0 pi-mt-1 pi-text-xs pi-font-regular ${\n isMyNumber(message.speakerNumber)\n ? 'pi-text-gray-800 dark:pi-text-gray-100 pi-bg-gray-200 dark:pi-bg-gray-600'\n : 'pi-text-indigo-800 dark:pi-text-indigo-100 pi-bg-indigo-100 dark:pi-bg-indigo-700'\n }`}\n >\n {formatTimestamp(message.timestamp)}\n </div>\n </div>\n </div>\n\n {!message.isFinal && message.text.trim() !== '' && (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n className='pi-mt-1 pi-ml-3 pi-flex pi-items-center pi-gap-1'\n >\n <span className='pi-text-xs pi-text-gray-400 dark:pi-text-gray-500 pi-italic'>\n {t('TranscriptionView.Is speaking', '')}\n </span>\n <div className='pi-inline-flex pi-items-center pi-gap-1'>\n <motion.div\n className='pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full'\n animate={{ opacity: [0.3, 1, 0.3] }}\n transition={{ duration: 1.5, repeat: Infinity, delay: 0 }}\n />\n <motion.div\n className='pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full'\n animate={{ opacity: [0.3, 1, 0.3] }}\n transition={{ duration: 1.5, repeat: Infinity, delay: 0.2 }}\n />\n <motion.div\n className='pi-w-1 pi-h-1 pi-bg-gray-400 dark:pi-bg-gray-500 pi-rounded-full'\n animate={{ opacity: [0.3, 1, 0.3] }}\n transition={{ duration: 1.5, repeat: Infinity, delay: 0.4 }}\n />\n </div>\n </motion.div>\n )}\n </motion.div>\n ))}\n <div ref={messagesEndRef} className='pi-pb-4' />\n </div>\n )}\n </div>\n </div>\n </div>\n\n {/ Footer with Close Button */}\n <div className='pi-flex pi-items-center pi-justify-center pi-py-2'>\n <button\n onClick={() => eventDispatch('phone-island-transcription-close', {})}\n 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'\n >\n <FontAwesomeIcon icon={faAngleUp} className='pi-w-4 pi-h-4 pi-ml-1' />\n {t('Common.Close')}\n </button>\n </div>\n </div>\n </motion.div>\n )}\n </AnimatePresence>\n </>\n )\n})\n\nTranscriptionView.displayName = 'TranscriptionView'\n\nexport default TranscriptionView\n"],"names":["ANIMATION_CONFIG","initial","height","opacity","animate","exit","transition","duration","ease","STYLE_CONFIG","borderBottomLeftRadius","borderBottomRightRadius","transformOrigin","overflow","TypewriterText","_a","text","isFinal","_b","speed","_c","useState","displayText","setDisplayText","useEffect","currentIndex","typeInterval","setInterval","length","slice","clearInterval","React","createElement","className","TranscriptionView","memo","isVisible","useSelector","state","island","actionsExpanded","view","currentUser","currentCallStartTime","currentCall","startTime","t","useTranslation","allMessages","setAllMessages","_d","visibleMessages","setVisibleMessages","_e","hasNewContent","setHasNewContent","_f","userScrolled","setUserScrolled","_g","lastSeenMessageIndex","setLastSeenMessageIndex","messagesEndRef","useRef","scrollContainerRef","timestampCorrectionRef","_h","autoScroll","setAutoScroll","resetTranscriptionState","current","isMyNumber","speakerNumber","endpoints","mainextension","id","extension","Object","values","some","ext","exten","startIndex","Math","max","recentMessages","sorted","__spreadArray","sort","a","b","timestamp","addTranscriptionMessage","data","start","rawTimestamp","Number","channelIndex","isFinite","channel_index","segmentStart","segment_start","uniqueId","uniqueid","concat","toFixed","localElapsed","floor","Date","now","correctedTimestamp","error","boundedError","min","message","speaker","speaker_name","speaker_number","counterpart","speaker_counterpart_name","counterpartNumber","speaker_counterpart_number","transcription","is_final","prevMessages","findLastIndex","predicate","index","isSameSpeakerStream","existingMessage","existingMessageIndex","findIndex","msg","__assign","updatedMessages","similarFinalIndex","existing","trim","abs","activeInterimIndex_1","activeInterimIndex","unseenMessagesCount","setTimeout","scrollTop","scrollHeight","useEventListener","containerClassName","Fragment","AnimatePresence","motion","div","style","y","scale","onClick","FontAwesomeIcon","icon","faArrowDown","ref","onScroll","atBottom","isAtBottom","visible","total","map","key","layout","minutes","seconds","toString","padStart","repeat","Infinity","delay","eventDispatch","faAngleUp","displayName"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../node_modules/@fortawesome/react-fontawesome/dist/index.js"),r=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.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");var i=require("../../node_modules/react-i18next/dist/es/useTranslation.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../node_modules/@babel/runtime/helpers/slicedToArray.js");var s=a(e);exports.default=function(e){var a=e.className,l=void 0===a?"":a,o=e.title,d=e.message,n=i.useTranslation().t;return s.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-center pi-bg-gray-100 dark:pi-bg-gray-800 pi-rounded-lg pi-border pi-border-gray-300 dark:pi-border-gray-700 ".concat(l)},s.default.createElement("div",{className:"pi-flex pi-flex-col pi-items-center pi-justify-center pi-space-y-4 pi-p-8"},s.default.createElement(t.FontAwesomeIcon,{icon:r.faVideoSlash,className:"pi-text-3xl pi-text-gray-400 dark:pi-text-gray-600"}),s.default.createElement("div",{className:"pi-text-center pi-space-y-2"},s.default.createElement("h3",{className:"pi-text-lg pi-font-semibold pi-text-gray-700 dark:pi-text-gray-300"},o||n("VideoStreaming.Video not available")),s.default.createElement("p",{className:"pi-text-sm pi-text-gray-500 dark:pi-text-gray-400 pi-max-w-xs"},d||n("VideoStreaming.The video feed is currently unavailable")))))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../node_modules/@fortawesome/react-fontawesome/dist/index.js"),a=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js");require("../../node_modules/i18next/dist/esm/i18next.js"),require("../../node_modules/react-i18next/dist/es/context.js");var i=require("../../node_modules/react-i18next/dist/es/useTranslation.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=r(e);exports.default=function(e){var r=e.className,d=void 0===r?"":r,n=e.title,o=e.message,l=i.useTranslation().t;return s.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-center pi-bg-gray-100 dark:pi-bg-gray-800 pi-rounded-lg pi-border pi-border-gray-300 dark:pi-border-gray-700 ".concat(d)},s.default.createElement("div",{className:"pi-flex pi-flex-col pi-items-center pi-justify-center pi-space-y-4 pi-p-8"},s.default.createElement(t.FontAwesomeIcon,{icon:a.faVideoSlash,className:"pi-text-3xl pi-text-gray-400 dark:pi-text-gray-600"}),s.default.createElement("div",{className:"pi-text-center pi-space-y-2"},s.default.createElement("h3",{className:"pi-text-lg pi-font-semibold pi-text-gray-700 dark:pi-text-gray-300"},n||l("VideoStreaming.Video not available")),s.default.createElement("p",{className:"pi-text-sm pi-text-gray-500 dark:pi-text-gray-400 pi-max-w-xs"},o||l("VideoStreaming.The video feed is currently unavailable")))))};
 //# sourceMappingURL=index.js.map