npm - @d19n/webchat - Versions diffs - 1.0.4 → 1.0.5 - Mend

@d19n/webchat 1.0.4 → 1.0.5

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

package/dist/src/TwilioChat/Chat.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chat.js","sources":["../../../src/TwilioChat/Chat.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport linkifyHtml from 'linkify-html';\nimport { Col, Row } from 'react-bootstrap';\nimport { Lightbox } from \"react-modal-image\";\nimport { DebounceInput } from 'react-debounce-input';\nimport { BsFiletypePdf } from \"react-icons/bs\";\nimport { BsFiletypeTxt } from \"react-icons/bs\";\nimport { BsFiletypeMp4 } from \"react-icons/bs\";\nimport { BsFiletypeMp3 } from \"react-icons/bs\";\n\nimport moment from 'moment';\n\nconst icoYouFibre = new URL(\"./assets/images/svg/favicon.svg\", import.meta.url);\nconst icoUpload = new URL(\"./assets/images/svg/youfibre-upload.svg\", import.meta.url);\n\nconst Animation = styled.div`\n &, .animation {\n width: 100%;\n display: flex;\n flex-direction: column;\n position: inherit;\n margin-bottom: -9rem;\n animation: slideIn .1s cubic-bezier(0.41, 0.39, 0.53, 1.38) forwards;\n }\n @keyframes slideIn {\n from {\n margin-bottom: -9rem;\n }\n to {\n margin-bottom: 0rem;\n }\n }\n`;\n\nconst YFPost = styled.div`\n width: 100%;\n padding: 5px;\n flex: 0;\n display: flex;\n gap: 15px;\n img {\n flex: 0;\n width: 40px;\n height: 40px;\n -object-fit: fill;\n object-fit: fill;\n border-radius: 200px;\n padding: 9px;\n background-color: #ddf0fc;\n &.system {\n background-color: #f9f2eb;\n }\n }\n span {\n color: #263238;\n background-color: #ddf0fc;\n flex: 1;\n padding: 1rem;\n border-radius: 5px;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 100;\n display: block;\n word-break: break-word;\n a, a:visited, a:active {\n font-size: 1rem !important;\n text-decoration: underline;\n color: #005095;\n }\n &.system {\n color: #935610;\n background-color: #f9f2eb;\n }\n }\n button {\n border: 2px solid #08DE9E;\n cursor: pointer;\n &:hover {\n background-color: #08DE9E;\n }\n }\n small {\n font-size: 0.7rem !important;\n font-weight: 100;\n line-height: 0.8rem;\n color: #bcc8d0;\n }\n .action {\n width: 0.8rem;\n height: 0.8rem;\n opacity: 0.5;\n }\n .files {\n margin: 0.3rem 0rem 0rem 0rem !important;\n border-radius: 5px;\n background-color: #f4f7f9 !important;;\n padding: 0rem;\n overlay: none;\n display: flex;\n flex-direction: row !important;\n flex-wrap: wrap !important;\n align-content: flex-start !important;\n justify-content: space-evenly !important;\n align-items: flex-start !important;\n .file{\n width: 130px;\n height: 130px;\n object-fit: contain;\n opacity: 1;\n cursor: pointer;\n }\n }\n`;\n\nconst MyPost = styled.div`\n width: 100%;\n padding: 5px;\n flex: 0;\n display: flex;\n flex-direction: column;\n gap: 5px;\n img {\n flex: 0;\n width: 40px;\n height: 40px;\n opacity: 0;\n }\n span, button {\n display: block;\n background-color: #c1f7e7;\n flex: 0;\n padding: 5px;\n border-radius: 5px;\n color: #263238;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 100;\n min-width: 40%;\n word-break: break-word;\n b {\n font-weight: 900;\n }\n a, a:visited, a:active {\n font-size: 1rem !important;\n text-decoration: underline;\n color: #397040;\n }\n }\n input, select {\n font-size: 0.9rem;\n border: 1px solid #d5d5d5;\n border-radius: 5px;\n padding: 1px 4px;\n height: 30px;\n outline: none;\n &.invalid {\n border-bottom: 1px solid red;\n }\n &:focus{\n border-radius: 5px;\n }\n &:disabled{\n border: 1px solid #d9d9d9;\n }\n }\n select {\n cursor: pointer;\n background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 98% 50%;\n -moz-appearance: none; \n -webkit-appearance: none; \n appearance: none;\n }\n .loader {\n opacity: 1;\n }\n button {\n border: 1px solid #08DE9E;\n cursor: pointer;\n &:hover {\n background-color: #08DE9E;\n }\n &:disabled, &:disabled:hover {\n border: 1px solid #e1e1e1;\n background-color: #e1e1e1;\n cursor: default;\n }\n }\n small {\n font-size: 0.7rem !important;\n font-weight: 100;\n line-height: 0.8rem;\n color: #bcc8d0;\n }\n .action {\n width: 0.8rem;\n height: 0.8rem;\n opacity: 0.5;\n }\n .files {\n margin: 0rem !important;\n border-radius: 5px;\n background-color: #f4f7f9 !important;;\n padding: 0rem;\n overlay: none;\n display: flex;\n flex-direction: row !important;\n flex-wrap: wrap !important;\n align-content: flex-start !important;\n justify-content: space-evenly !important;\n align-items: flex-start !important;\n .file{\n width: 130px;\n height: 130px;\n object-fit: contain;\n opacity: 1;\n cursor: pointer;\n }\n }\n`;\n\nconst EventPost = styled.div`\n padding: 5px;\n flex: 0;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 5px;\n img {\n flex: 0;\n width: 40px;\n height: 40px;\n }\n span {\n display: block;\n background-color: #00468b;\n flex: 1;\n padding: 5px 15px;\n max-width: 80%;\n border-radius: 5px;\n color: #ffffff;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 100;\n text-align: center;\n flex-wrap: wrap;\n word-break: break-word;\n b {\n font-weight: 900;\n }\n }\n`;\n\nconst Splitter = styled.hr`\n width: 100%;\n height: 1px;\n background-color: unset;\n`;\n\ninterface Result {\n available: boolean \| null;\n salesStatus: boolean \| null;\n loading: boolean;\n chatActive: boolean;\n data: Array<{ label: string; value: string; }> \| null;\n}\n\nconst Chat = ({messages, chatUsername, chatConversationId, chatUserId, chatActive, setChatForm, buttonAction, resetFormValues = false, newMessages, API}) => {\n const formRef = useRef<any>(null);\n const [formValues, setFormValues] = useState({});\n const [postCode, setPostCode] = useState('');\n const [postCodeAddress, setPostCodeAddress] = useState('');\n const [invalidFields, setInvalidFields] =useState<Set<string>>(new Set());\n const [searchResult, setSearchResult] = useState<Result>({\n available: false,\n salesStatus: null,\n loading: false,\n chatActive: false,\n data: null,\n });\n const [openLightbox, setOpenLightbox] = useState(false);\n const lightboxUrl = useRef<string\|null>(null);\n\n useEffect(() => {\n setFormValues({});\n setPostCode('');\n }, [chatConversationId, resetFormValues]);\n\n useEffect(() => {\n postCode.length > 0\n ? loadOptionsAsync(postCode)\n : setSearchResult({\n ...searchResult,\n data: null,\n });\n }, [postCode]);\n\n const loadOptionsAsync = async(input) => {\n setSearchResult({\n ...searchResult,\n data: null,\n loading: true,\n });\n updateFormValues('address', 'text', null);\n try {\n API.get(`CrmModule/v2.0/premises/post-code-checker?searchString=${input}`)\n .then((response) => { \n const data = response?.map((category) => ({\n value:category.properties.PostalCode,\n label: category.properties.FullAddress,\n }));\n setSearchResult({\n ...searchResult,\n loading: false,\n data,\n });\n })\n .catch(function (error) {\n console.error('Error fetching ZIP codes:', error);\n setSearchResult({\n ...searchResult,\n loading: false,\n });\n });\n } catch (error) { console.error('Error fetching ZIP codes:', error); }\n };\n\n const validateInput = (type:string, data:any) => {\n if((typeof data === 'string' && data.length === 0) \|\| (typeof data === 'number' && data === 0)) return true;\n const regex = {\n 'select': /^[a-zA-Z0-9\\s\\-_,.!?()/@\"']+$/,\n 'text': /^[a-zA-Z0-9\\s\\-_,.!?()/@\"']+$/,\n 'email': /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.+-]+\\.[a-zA-Z0-9]{2,}$/,\n 'number': /^(?:1000000(?:\\.0{1,2})?\|[0-9]{1,6}(?:\\.\\d{1,2})?)$/,\n };\n return regex[type].test(data);\n };\n\n const updateFormValues = (action, type, value) => {\n formValues[action] = value;\n const tmpInvalidFields = invalidFields;\n validateInput(type, value)?tmpInvalidFields.delete(action):tmpInvalidFields.add(action); \n setInvalidFields(tmpInvalidFields); \n setFormValues({...formValues});\n setChatForm(formValues);\n };\n\n const validateForm = (form, values) => {\n if(form){\n let tmpValues:object = form.reduce((acc: any, item: any) => {\n if (item.action !== \"submit_form\") {\n acc[item.action] = (values[item.action] !== \"/\" && values[item.action]) \|\| null;\n }\n return acc;\n }, {});\n return !Object.values(tmpValues).some(value => value === null);\n }\n };\n\n const InlineSvg = ({ url, ...props }) => {\n const [svgContent, setSvgContent] = useState<string \| null>(null); \n useEffect(() => {\n const fetchSvg = async () => {\n try {\n const response = await fetch(url);\n const svgText = await response.text();\n setSvgContent(svgText);\n } catch (error) {\n console.error(\"Error loading SVG:\", error);\n }\n }; \n fetchSvg();\n }, [url]); \n return (\n <div {...props}\n dangerouslySetInnerHTML={{ __html: svgContent \|\| \"\" }}\n aria-hidden=\"true\"\n />\n );\n };\n\n const getIcon = (url:string) => {\n if(url && typeof window !== 'undefined'){\n const extension = url.split('.').pop()?.toLocaleLowerCase();\n switch(extension){\n case 'pdf': return <BsFiletypePdf className='file' onClick={() => window.open(url,'_blank')}/>; break;\n case 'txt': return <BsFiletypeTxt className='file' onClick={() => window.open(url,'_blank')}/>; break;\n case 'mp4': return <BsFiletypeMp4 className='file' onClick={() => window.open(url,'_blank')}/>; break;\n case 'mp3': return <BsFiletypeMp3 className='file' onClick={() => window.open(url,'_blank')}/>; break;\n case 'svg': return <InlineSvg className='file' url={url} onClick={() => window.open(url,'_blank')} />; break;\n default: return <img className='file' src={url} onClick={() => { lightboxUrl.current = url; setOpenLightbox(true);}} />; break;\n }\n }\n };\n\n const agentMessage = (item, isNew = false) => {\n return <>\n <YFPost key={item.messageId} className={`${isNew ? \"animation\" : \"\"}`}>\n <img src={icoYouFibre.toString()} />\n <Col className='p-0 m-0'>\n <div>\n {item.message && <span dangerouslySetInnerHTML={{ __html: linkifyHtml(item.message, { target: \"_blank\" }).replaceAll(/\\r\\n\|\\n/g, \"<br />\") }} />}\n </div>\n {Array.isArray(item.files) && item.files.length > 0 && <div className='files'>\n {item.files.map((file) => getIcon(file.url))}\n </div>}\n <Row className='justify-between w-100 p-0 m-0 mt-1'>\n <small dangerouslySetInnerHTML={{ __html: item.from }} />\n { item.createdAt && <small className='pt-1'>{moment(item.createdAt).format('HH:mm')}</small> }\n </Row>\n </Col>\n </YFPost>\n {isNew && <Splitter />}\n </>\n };\n\n const systemMessage = (item, isNew = false) => {\n return <>\n <YFPost key={item.messageId} className={`${isNew ? \"animation\" : \"\"}`}>\n <img className='system' src={icoYouFibre.toString()} />\n <Col className='p-0 m-0'>\n <div>\n {item.message && <span className='system' dangerouslySetInnerHTML={{ __html: linkifyHtml(item.message, { target: \"_blank\" }).replaceAll(/\\r\\n\|\\n/g, \"<br />\") }} />}\n </div>\n {Array.isArray(item.files) && item.files.length > 0 && <div className='files'>\n {item.files.map((file) => getIcon(file.url))}\n </div>}\n <Row className='justify-between w-100 p-0 m-0 mt-1'>\n <small dangerouslySetInnerHTML={{ __html: item.from }} />\n { item.createdAt && <small className='pt-1'>{moment(item.createdAt).format('HH:mm')}</small> }\n </Row>\n </Col>\n </YFPost>\n {isNew && <Splitter />}\n </>\n };\n\n const customerMessage = (item) => {\n return <>\n <MyPost key={item.messageId}>\n { !item.form && <>\n {item.message && <span dangerouslySetInnerHTML={{ __html: linkifyHtml(item.message, { target: \"_blank\" }).replaceAll(/\\r\\n\|\\n/g, \"<br />\") }} />}\n {Array.isArray(item.files) && item.files.length > 0 && <div className='files'>\n {item.files.map((file) => getIcon(file.url))}\n </div>}\n <Row className='justify-between w-100 p-0 m-0'>\n {item.from === 'Client' ? <small>Client</small> : <small dangerouslySetInnerHTML={{ __html: item.from }} /> }\n { item.createdAt && <small className='pt-1'>{moment(item.createdAt).format('HH:mm')}</small> }\n </Row></>}\n { item.form?.type === \"buttons\" && <>\n { item.form?.value.map((itm, i) => <button key={i} onClick={() => buttonAction(itm.action)} dangerouslySetInnerHTML={{ __html: itm.title }} />)}\n </>}\n { item.form?.type === \"form\" && <form ref={formRef} method='get' action='javascript:void(0);'>\n <div className='flex flex-column gap-5'>\n { item.form?.value.map((itm, i) => <> \n { itm?.type !== 'button' ? <><div dangerouslySetInnerHTML={{ __html: itm.title }} className='mt-2' />\n { (itm?.type === 'number' \|\| itm?.type === 'email' \|\| itm?.type === 'text') && \n <input\n onChange={(e) => updateFormValues(itm.action, itm?.type, e.target.value)}\n value={formValues[itm.action]}\n placeholder={itm.placeholder}\n maxLength={250}\n {...(itm?.required && { required: true })}\n {...(invalidFields.has(itm.action) && { className: 'invalid' })}\n {...(itm?.type === 'number' && { step: \"0.01\", min: 0, max: 1000000 })}\n type={itm?.type}\n key={i}\n />}\n { itm?.type === 'zip' && <>\n <DebounceInput\n required\n type=\"text\"\n placeholder={itm.placeholder}\n debounceTimeout={700}\n value={postCode}\n onChange={e => {\n setPostCode(e.target.value);\n setPostCodeAddress('');\n updateFormValues(itm.action, 'text', '/');\n }}\n />\n {postCode && <select\n required\n disabled={searchResult.data === null}\n defaultValue={itm.action}\n value={postCodeAddress}\n onChange={(e) => {\n setPostCodeAddress((e.target as HTMLSelectElement).value);\n updateFormValues(itm.action, 'select', (e.target as HTMLSelectElement).value);\n }}\n className={`mt-1 ${invalidFields.has(itm.action) && 'invalid'}`} key={i}>\n <option value={''} disabled selected>{searchResult.loading ? \"Loading...\" : !searchResult.data ? \"\" : \"Select your Address\"}</option>\n {searchResult.data && searchResult.data.map(item => (\n <option value={item.label}>\n {item.label as String}\n </option>\n ))}\n </select>}\n </>\n }\n { itm?.type === 'select' && <select required onChange={(e) => updateFormValues(itm.action, itm?.type, e.target.value)} defaultValue={formValues[itm.action]} value={formValues[itm.action]} key={i}>\n <option disabled selected hidden></option>\n {itm?.options && Object.entries(itm?.options).map(([key, title]) => (\n <option key={key} value={key}>\n {title as String}\n </option>\n ))}\n </select>\n }\n </> : \n <button type='submit' {...(invalidFields.size > 0 && !chatActive ? { disabled: true } : {disabled: false})} style={{marginTop: '15px'}}\n onClick={(e) => {\n const valid:boolean = validateForm(item.form?.value, formValues) \|\| false;\n invalidFields.size === 0 && buttonAction(itm.action);\n const target = e.target as HTMLButtonElement\n target.disabled = valid;\n }} >Submit</button>}\n \n </>)}\n </div>\n </form>}\n </MyPost>\n </>\n };\n\n const eventMessage = (item, isNew = false) => {\n return <>\n <EventPost key={item.messageId} className={`${isNew ? \"animation\" : \"\"}`}>\n <img src={icoYouFibre.toString()} /> {item.message && <span dangerouslySetInnerHTML={{ __html: item.message.replaceAll(/\\r\\n\|\\n/g, \"<br />\") }} />}\n </EventPost>\n {isNew && <Splitter />}\n </>\n };\n\n return (\n <> \n {openLightbox && <Lightbox\n medium={lightboxUrl.current}\n large={lightboxUrl.current}\n showRotate={true}\n onClose={() => setOpenLightbox(false)}\n />} \n {newMessages && <Animation>\n { newMessages.map((item, index) => <div key={index}>\n { Object.keys(messages).length > 0 && <Splitter /> } \n { item.senderType === \"AGENT\" && agentMessage(item) }\n { item.senderType === \"CUSTOMER\" && customerMessage(item) }\n { item.senderType === \"EVENT\" && eventMessage(item) } \n { item.senderType === \"SYSTEM\" && systemMessage(item) } \n </div> \n )}\n </Animation>}\n {messages && messages.map((item, index) => \n <>\n { item.senderType === \"AGENT\" && agentMessage(item) }\n { (item.senderType === \"CUSTOMER\" \|\| item.form) && customerMessage(item) }\n { item.senderType === \"EVENT\" && eventMessage(item) }\n { item.senderType === \"SYSTEM\" && systemMessage(item) } \n { (Object.keys(messages).length - 1) !== index && <Splitter /> }\n </>\n )}\n </>\n );\n};\n\nexport default Chat;\n"],"names":["icoYouFibre","URL","url","Animation","styled","div","templateObject_1","__makeTemplateObject","YFPost","templateObject_2","MyPost","templateObject_3","EventPost","templateObject_4","Splitter","hr","templateObject_5","Chat","_a","messages","chatUsername","chatConversationId","chatUserId","chatActive","setChatForm","buttonAction","_b","resetFormValues","newMessages","API","formRef","useRef","_c","useState","formValues","setFormValues","_d","postCode","setPostCode","_e","postCodeAddress","setPostCodeAddress","_f","Set","invalidFields","setInvalidFields","_g","available","salesStatus","loading","data","searchResult","setSearchResult","_h","openLightbox","setOpenLightbox","lightboxUrl","useEffect","length","loadOptionsAsync","__assign","input","__awaiter","updateFormValues","get","concat","then","response","map","category","value","properties","PostalCode","label","FullAddress","catch","error","console","action","type","tmpInvalidFields","select","text","email","number","test","validateInput","add","delete","InlineSvg","props","__rest","svgContent","setSvgContent","fetch","sent","svgText","error_1","React","createElement","dangerouslySetInnerHTML","__html","getIcon","window","split","pop","toLocaleLowerCase","BsFiletypePdf","className","onClick","open","BsFiletypeTxt","BsFiletypeMp4","BsFiletypeMp3","src","current","agentMessage","item","isNew","Fragment","key","messageId","toString","Col","message","linkifyHtml","target","replaceAll","Array","isArray","files","file","Row","from","createdAt","moment","format","systemMessage","customerMessage","form","itm","i","title","ref","method","onChange","e","placeholder","maxLength","required","has","step","min","max","DebounceInput","debounceTimeout","disabled","defaultValue","selected","hidden","options","Object","entries","size","style","marginTop","valid","values","tmpValues","reduce","acc","some","validateForm","eventMessage","Lightbox","medium","large","showRotate","onClose","index","keys","senderType"],"mappings":"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"}
1	+ {"version":3,"file":"Chat.js","sources":["../../../src/TwilioChat/Chat.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport linkifyHtml from 'linkify-html';\nimport { Col, Row } from 'react-bootstrap';\nimport { Lightbox } from \"react-modal-image\";\nimport { DebounceInput } from 'react-debounce-input';\nimport { BsFiletypePdf } from \"react-icons/bs\";\nimport { BsFiletypeTxt } from \"react-icons/bs\";\nimport { BsFiletypeMp4 } from \"react-icons/bs\";\nimport { BsFiletypeMp3 } from \"react-icons/bs\";\n\nimport moment from 'moment';\n\nconst icoYouFibre = new URL(\"./assets/images/svg/favicon.svg\", import.meta.url);\nconst icoUpload = new URL(\"./assets/images/svg/youfibre-upload.svg\", import.meta.url);\n\nconst Animation = styled.div`\n &, .animation {\n width: 100%;\n display: flex;\n flex-direction: column;\n position: inherit;\n margin-bottom: -9rem;\n animation: slideIn .1s cubic-bezier(0.41, 0.39, 0.53, 1.38) forwards;\n }\n @keyframes slideIn {\n from {\n margin-bottom: -9rem;\n }\n to {\n margin-bottom: 0rem;\n }\n }\n`;\n\nconst YFPost = styled.div`\n width: calc(100% - 20px);\n padding: 5px 10px;\n flex: 0;\n display: flex;\n gap: 15px;\n img {\n flex: 0;\n width: 25px;\n height: 25px;\n -object-fit: fill;\n object-fit: fill;\n border-radius: 200px;\n padding: 9px;\n background-color: #ddf0fc;\n &.system {\n background-color: #f9f2eb;\n }\n }\n span {\n color: #263238;\n background-color: #ddf0fc;\n flex: 1;\n padding: 1rem;\n border-radius: 5px;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 100;\n display: block;\n word-break: break-word;\n a, a:visited, a:active {\n font-size: 1rem !important;\n text-decoration: underline;\n color: #005095;\n }\n &.system {\n color: #935610;\n background-color: #f9f2eb;\n }\n }\n button {\n border: 2px solid #08DE9E;\n cursor: pointer;\n &:hover {\n background-color: #08DE9E;\n }\n }\n small {\n font-size: 0.75rem !important;\n font-weight: 100;\n line-height: 0.85rem;\n color: #bcc8d0;\n }\n .action {\n width: 0.8rem;\n height: 0.8rem;\n opacity: 0.5;\n }\n .files {\n margin: 0.3rem 0rem 0rem 0rem !important;\n border-radius: 5px;\n background-color: #f4f7f9 !important;;\n padding: 0rem;\n overlay: none;\n display: flex;\n flex-direction: row !important;\n flex-wrap: wrap !important;\n align-content: flex-start !important;\n justify-content: space-evenly !important;\n align-items: flex-start !important;\n .file{\n width: 130px;\n height: 130px;\n object-fit: contain;\n opacity: 1;\n cursor: pointer;\n }\n }\n`;\n\nconst MyPost = styled.div`\n width: calc(100% - 20px);\n padding: 5px 10px;\n flex: 0;\n display: flex;\n flex-direction: column;\n gap: 5px;\n img {\n flex: 0;\n width: 25px;\n height: 25px;\n opacity: 0;\n }\n span, button {\n display: block;\n background-color: #c1f7e7;\n flex: 0;\n padding: 5px;\n border-radius: 5px;\n color: #263238;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 100;\n min-width: 40%;\n word-break: break-word;\n b {\n font-weight: 900;\n }\n a, a:visited, a:active {\n font-size: 1rem !important;\n text-decoration: underline;\n color: #397040;\n }\n }\n input, select {\n font-size: 0.9rem;\n border: 1px solid #d5d5d5;\n border-radius: 5px;\n padding: 1px 4px;\n height: 30px;\n outline: none;\n &.invalid {\n border-bottom: 1px solid red;\n }\n &:focus{\n border-radius: 5px;\n }\n &:disabled{\n border: 1px solid #d9d9d9;\n }\n }\n select {\n cursor: pointer;\n background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 98% 50%;\n -moz-appearance: none; \n -webkit-appearance: none; \n appearance: none;\n }\n .loader {\n opacity: 1;\n }\n button {\n border: 1px solid #08DE9E;\n cursor: pointer;\n &:hover {\n background-color: #08DE9E;\n }\n &:disabled, &:disabled:hover {\n border: 1px solid #e1e1e1;\n background-color: #e1e1e1;\n cursor: default;\n }\n }\n small {\n font-size: 0.75rem !important;\n font-weight: 100;\n line-height: 0.85rem;\n color: #bcc8d0;\n }\n .action {\n width: 0.8rem;\n height: 0.8rem;\n opacity: 0.5;\n }\n .files {\n margin: 0rem !important;\n border-radius: 5px;\n background-color: #f4f7f9 !important;;\n padding: 0rem;\n overlay: none;\n display: flex;\n flex-direction: row !important;\n flex-wrap: wrap !important;\n align-content: flex-start !important;\n justify-content: space-evenly !important;\n align-items: flex-start !important;\n .file{\n width: 130px;\n height: 130px;\n object-fit: contain;\n opacity: 1;\n cursor: pointer;\n }\n }\n`;\n\nconst EventPost = styled.div`\n padding: 5px 10px;\n flex: 0;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 5px;\n img {\n flex: 0;\n width: 40px;\n height: 40px;\n }\n span {\n display: block;\n background-color: #00468b;\n flex: 1;\n padding: 5px 15px;\n max-width: 80%;\n border-radius: 5px;\n color: #ffffff;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 100;\n text-align: center;\n flex-wrap: wrap;\n word-break: break-word;\n b {\n font-weight: 900;\n }\n }\n`;\n\nconst Splitter = styled.hr`\n width: calc(100% - 20px);\n height: 1px;\n border: 0px;\n border-top: 1px solid #dbe4ea;\n outline: none;\n box-shadow: none;\n margin: 5px 0px;\n`;\n\nconst Box = styled.div`\n width: 100%;\n`;\n\ninterface Result {\n available: boolean \| null;\n salesStatus: boolean \| null;\n loading: boolean;\n chatActive: boolean;\n data: Array<{ label: string; value: string; }> \| null;\n}\n\nconst Chat = ({messages, chatUsername, chatConversationId, chatUserId, chatActive, setChatForm, buttonAction, resetFormValues = false, newMessages, API}) => {\n const formRef = useRef<any>(null);\n const [formValues, setFormValues] = useState({});\n const [postCode, setPostCode] = useState('');\n const [postCodeAddress, setPostCodeAddress] = useState('');\n const [invalidFields, setInvalidFields] =useState<Set<string>>(new Set());\n const [searchResult, setSearchResult] = useState<Result>({\n available: false,\n salesStatus: null,\n loading: false,\n chatActive: false,\n data: null,\n });\n const [openLightbox, setOpenLightbox] = useState(false);\n const lightboxUrl = useRef<string\|null>(null);\n\n useEffect(() => {\n setFormValues({});\n setPostCode('');\n }, [chatConversationId, resetFormValues]);\n\n useEffect(() => {\n postCode.length > 0\n ? loadOptionsAsync(postCode)\n : setSearchResult({\n ...searchResult,\n data: null,\n });\n }, [postCode]);\n\n const loadOptionsAsync = async(input) => {\n setSearchResult({\n ...searchResult,\n data: null,\n loading: true,\n });\n updateFormValues('address', 'text', null);\n try {\n API.get(`CrmModule/v2.0/premises/post-code-checker?searchString=${input}`)\n .then((response) => { \n const data = response?.map((category) => ({\n value:category.properties.PostalCode,\n label: category.properties.FullAddress,\n }));\n setSearchResult({\n ...searchResult,\n loading: false,\n data,\n });\n })\n .catch(function (error) {\n console.error('Error fetching ZIP codes:', error);\n setSearchResult({\n ...searchResult,\n loading: false,\n });\n });\n } catch (error) { console.error('Error fetching ZIP codes:', error); }\n };\n\n const validateInput = (type:string, data:any) => {\n if((typeof data === 'string' && data.length === 0) \|\| (typeof data === 'number' && data === 0)) return true;\n const regex = {\n 'select': /^[a-zA-Z0-9\\s\\-_,.!?()/@\"']+$/,\n 'text': /^[a-zA-Z0-9\\s\\-_,.!?()/@\"']+$/,\n 'email': /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.+-]+\\.[a-zA-Z0-9]{2,}$/,\n 'number': /^(?:1000000(?:\\.0{1,2})?\|[0-9]{1,6}(?:\\.\\d{1,2})?)$/,\n };\n return regex[type].test(data);\n };\n\n const updateFormValues = (action, type, value) => {\n formValues[action] = value;\n const tmpInvalidFields = invalidFields;\n validateInput(type, value)?tmpInvalidFields.delete(action):tmpInvalidFields.add(action); \n setInvalidFields(tmpInvalidFields); \n setFormValues({...formValues});\n setChatForm(formValues);\n };\n\n const validateForm = (form, values) => {\n if(form){\n let tmpValues:object = form.reduce((acc: any, item: any) => {\n if (item.action !== \"submit_form\") {\n acc[item.action] = (values[item.action] !== \"/\" && values[item.action]) \|\| null;\n }\n return acc;\n }, {});\n return !Object.values(tmpValues).some(value => value === null);\n }\n };\n\n const InlineSvg = ({ url, ...props }) => {\n const [svgContent, setSvgContent] = useState<string \| null>(null); \n useEffect(() => {\n const fetchSvg = async () => {\n try {\n const response = await fetch(url);\n const svgText = await response.text();\n setSvgContent(svgText);\n } catch (error) {\n console.error(\"Error loading SVG:\", error);\n }\n }; \n fetchSvg();\n }, [url]); \n return (\n <div {...props}\n dangerouslySetInnerHTML={{ __html: svgContent \|\| \"\" }}\n aria-hidden=\"true\"\n />\n );\n };\n\n const getIcon = (url:string) => {\n if(url && typeof window !== 'undefined'){\n const extension = url.split('.').pop()?.toLocaleLowerCase();\n switch(extension){\n case 'pdf': return <BsFiletypePdf className='file' onClick={() => window.open(url,'_blank')}/>; break;\n case 'txt': return <BsFiletypeTxt className='file' onClick={() => window.open(url,'_blank')}/>; break;\n case 'mp4': return <BsFiletypeMp4 className='file' onClick={() => window.open(url,'_blank')}/>; break;\n case 'mp3': return <BsFiletypeMp3 className='file' onClick={() => window.open(url,'_blank')}/>; break;\n case 'svg': return <InlineSvg className='file' url={url} onClick={() => window.open(url,'_blank')} />; break;\n default: return <img className='file' src={url} onClick={() => { lightboxUrl.current = url; setOpenLightbox(true);}} alt='' />; break;\n }\n }\n };\n\n const agentMessage = (item, isNew = false) => {\n return <>\n <YFPost key={item.messageId} className={`${isNew ? \"animation\" : \"\"}`}>\n <img src={icoYouFibre.toString()} />\n <Col className='p-0 m-0 text-left'>\n <div>\n {item.message && <span dangerouslySetInnerHTML={{ __html: linkifyHtml(item.message, { target: \"_blank\" }).replaceAll(/\\r\\n\|\\n/g, \"<br />\") }} />}\n </div>\n {Array.isArray(item.files) && item.files.length > 0 && <div className='files'>\n {item.files.map((file) => getIcon(file.url))}\n </div>}\n <Row className='flex-center-justified w-100 p-0 m-0 mt-1'>\n <small dangerouslySetInnerHTML={{ __html: item.from }} />\n { item.createdAt && <small className='pt-1'>{moment(item.createdAt).format('HH:mm')}</small> }\n </Row>\n </Col>\n </YFPost>\n {isNew && <Splitter />}\n </>\n };\n\n const systemMessage = (item, isNew = false) => {\n return <>\n <YFPost key={item.messageId} className={`${isNew ? \"animation\" : \"\"}`}>\n <img className='system' src={icoYouFibre.toString()} alt='' />\n <Col className='p-0 m-0 text-left'>\n <div>\n {item.message && <span className='system' dangerouslySetInnerHTML={{ __html: linkifyHtml(item.message, { target: \"_blank\" }).replaceAll(/\\r\\n\|\\n/g, \"<br />\") }} />}\n </div>\n {Array.isArray(item.files) && item.files.length > 0 && <div className='files'>\n {item.files.map((file) => getIcon(file.url))}\n </div>}\n <Row className='flex-center-justified w-100 p-0 m-0 mt-1'>\n <small dangerouslySetInnerHTML={{ __html: item.from }} />\n { item.createdAt && <small className='pt-1'>{moment(item.createdAt).format('HH:mm')}</small> }\n </Row>\n </Col>\n </YFPost>\n {isNew && <Splitter />}\n </>\n };\n\n const customerMessage = (item) => {\n return <>\n <MyPost key={item.messageId}>\n { !item.form && <>\n {item.message && <span className=\"text-left\" dangerouslySetInnerHTML={{ __html: linkifyHtml(item.message, { target: \"_blank\" }).replaceAll(/\\r\\n\|\\n/g, \"<br />\") }} />}\n {Array.isArray(item.files) && item.files.length > 0 && <div className='files'>\n {item.files.map((file) => getIcon(file.url))}\n </div>}\n <Row className='flex-center-justified w-100 p-0 m-0'>\n {item.from === 'Client' ? <small>Client</small> : <small dangerouslySetInnerHTML={{ __html: item.from }} /> }\n { item.createdAt && <small className='pt-1'>{moment(item.createdAt).format('HH:mm')}</small> }\n </Row></>}\n { item.form?.type === \"buttons\" && <>\n { item.form?.value.map((itm, i) => <button key={i} onClick={() => buttonAction(itm.action)} dangerouslySetInnerHTML={{ __html: itm.title }} />)}\n </>}\n { item.form?.type === \"form\" && <form ref={formRef} method='get' action='javascript:void(0);'>\n <div className='flex flex-column gap-5 fs-1'>\n { item.form?.value.map((itm, i) => <> \n { itm?.type !== 'button' ? <><div dangerouslySetInnerHTML={{ __html: itm.title }} className='text-left mt-2' />\n { (itm?.type === 'number' \|\| itm?.type === 'email' \|\| itm?.type === 'text') && \n <input\n onChange={(e) => updateFormValues(itm.action, itm?.type, e.target.value)}\n value={formValues[itm.action]}\n placeholder={itm.placeholder}\n maxLength={250}\n {...(itm?.required && { required: true })}\n {...(invalidFields.has(itm.action) && { className: 'invalid' })}\n {...(itm?.type === 'number' && { step: \"0.01\", min: 0, max: 1000000 })}\n type={itm?.type}\n key={i}\n />}\n { itm?.type === 'zip' && <>\n <DebounceInput\n required\n type=\"text\"\n placeholder={itm.placeholder}\n debounceTimeout={700}\n value={postCode}\n onChange={e => {\n setPostCode(e.target.value);\n setPostCodeAddress('');\n updateFormValues(itm.action, 'text', '/');\n }}\n />\n {postCode && <select\n required\n disabled={searchResult.data === null}\n defaultValue={itm.action}\n value={postCodeAddress}\n onChange={(e) => {\n setPostCodeAddress((e.target as HTMLSelectElement).value);\n updateFormValues(itm.action, 'select', (e.target as HTMLSelectElement).value);\n }}\n className={`mt-1 ${invalidFields.has(itm.action) && 'invalid'}`} key={i}>\n <option value={''} disabled selected>{searchResult.loading ? \"Loading...\" : !searchResult.data ? \"\" : \"Select your Address\"}</option>\n {searchResult.data && searchResult.data.map(item => (\n <option value={item.label}>\n {item.label as String}\n </option>\n ))}\n </select>}\n </>\n }\n { itm?.type === 'select' && <select required onChange={(e) => updateFormValues(itm.action, itm?.type, e.target.value)} defaultValue={formValues[itm.action]} value={formValues[itm.action]} key={i}>\n <option disabled selected hidden></option>\n {itm?.options && Object.entries(itm?.options).map(([key, title]) => (\n <option key={key} value={key}>\n {title as String}\n </option>\n ))}\n </select>\n }\n </> : \n <button type='submit' {...(invalidFields.size > 0 && !chatActive ? { disabled: true } : {disabled: false})} style={{marginTop: '15px'}}\n onClick={(e) => {\n const valid:boolean = validateForm(item.form?.value, formValues) \|\| false;\n invalidFields.size === 0 && buttonAction(itm.action);\n const target = e.target as HTMLButtonElement\n target.disabled = valid;\n }} >Submit</button>}\n \n </>)}\n </div>\n </form>}\n </MyPost>\n </>\n };\n\n const eventMessage = (item, isNew = false) => {\n return <>\n <EventPost key={item.messageId} className={`${isNew ? \"animation\" : \"\"}`}>\n <img src={icoYouFibre.toString()} alt='' /> {item.message && <span dangerouslySetInnerHTML={{ __html: item.message.replaceAll(/\\r\\n\|\\n/g, \"<br />\") }} />}\n </EventPost>\n {isNew && <Splitter />}\n </>\n };\n\n return (\n <> \n {openLightbox && <Lightbox\n medium={lightboxUrl.current}\n large={lightboxUrl.current}\n showRotate={true}\n onClose={() => setOpenLightbox(false)}\n />} \n {newMessages && <Animation>\n { newMessages.map((item, index) => <Box key={index}>\n { Object.keys(messages).length > 0 && <Splitter /> } \n { item.senderType === \"AGENT\" && agentMessage(item) }\n { item.senderType === \"CUSTOMER\" && customerMessage(item) }\n { item.senderType === \"EVENT\" && eventMessage(item) } \n { item.senderType === \"SYSTEM\" && systemMessage(item) } \n </Box> \n )}\n </Animation>}\n {messages && messages.map((item, index) => \n <Box key={index}>\n { item.senderType === \"AGENT\" && agentMessage(item) }\n { (item.senderType === \"CUSTOMER\" \|\| item.form) && customerMessage(item) }\n { item.senderType === \"EVENT\" && eventMessage(item) }\n { item.senderType === \"SYSTEM\" && systemMessage(item) } \n { (Object.keys(messages).length - 1) !== index && <Splitter /> }\n </Box>\n )}\n </>\n );\n};\n\nexport default Chat;\n"],"names":["icoYouFibre","URL","url","Animation","styled","div","templateObject_1","__makeTemplateObject","YFPost","templateObject_2","MyPost","templateObject_3","EventPost","templateObject_4","Splitter","hr","templateObject_5","Box","templateObject_6","Chat","_a","messages","chatUsername","chatConversationId","chatUserId","chatActive","setChatForm","buttonAction","_b","resetFormValues","newMessages","API","formRef","useRef","_c","useState","formValues","setFormValues","_d","postCode","setPostCode","_e","postCodeAddress","setPostCodeAddress","_f","Set","invalidFields","setInvalidFields","_g","available","salesStatus","loading","data","searchResult","setSearchResult","_h","openLightbox","setOpenLightbox","lightboxUrl","useEffect","length","loadOptionsAsync","__assign","input","__awaiter","updateFormValues","get","concat","then","response","map","category","value","properties","PostalCode","label","FullAddress","catch","error","console","action","type","tmpInvalidFields","select","text","email","number","test","validateInput","add","delete","InlineSvg","props","__rest","svgContent","setSvgContent","fetch","sent","svgText","error_1","React","createElement","dangerouslySetInnerHTML","__html","getIcon","window","split","pop","toLocaleLowerCase","BsFiletypePdf","className","onClick","open","BsFiletypeTxt","BsFiletypeMp4","BsFiletypeMp3","src","current","alt","agentMessage","item","isNew","Fragment","key","messageId","toString","Col","message","linkifyHtml","target","replaceAll","Array","isArray","files","file","Row","from","createdAt","moment","format","systemMessage","customerMessage","form","itm","i","title","ref","method","onChange","e","placeholder","maxLength","required","has","step","min","max","DebounceInput","debounceTimeout","disabled","defaultValue","selected","hidden","options","Object","entries","size","style","marginTop","valid","values","tmpValues","reduce","acc","some","validateForm","eventMessage","Lightbox","medium","large","showRotate","onClose","index","keys","senderType"],"mappings":"8vBAaA,IAAMA,EAAc,IAAIC,IAAI,8CAA+CC,KACzD,IAAID,IAAI,sDAAuDC,KAEjF,gBAAMC,EAAYC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,yVAAA,CAAA,4VAmBtBC,EAASJ,EAAOC,IAAGI,IAAAA,EAAAF,EAAA,CAAA,6nDAAA,CAAA,goDAgFnBG,EAASN,EAAOC,IAAGM,IAAAA,EAAAJ,EAAA,CAAA,ooFAAA,CAAA,uoFA0GnBK,EAAYR,EAAOC,IAAGQ,IAAAA,EAAAN,EAAA,CAAA,gkBAAA,CAAA,mkBAiCtBO,EAAWV,EAAOW,GAAEC,IAAAA,EAAAT,EAAA,CAAA,gKAAA,CAAA,mKAUpBU,EAAMb,EAAOC,IAAGa,IAAAA,EAAAX,EAAA,CAAA,sBAAA,CAAA,yBAYhBY,EAAO,SAACC,GAAC,IAAAC,EAAQD,EAAAC,SAAcD,EAAAE,aAAA,IAAEC,EAAkBH,EAAAG,mBAAYH,EAAAI,eAAEC,eAAYC,EAAWN,EAAAM,YAAEC,EAAYP,EAAAO,aAAEC,EAAAR,EAAAS,gBAAAA,OAAe,IAAAD,GAAQA,EAAEE,EAAWV,EAAAU,YAAEC,EAAGX,EAAAW,IAC/IC,EAAUC,EAAY,MACtBC,EAA8BC,EAAS,CAAA,GAAtCC,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAC1BI,EAA0BH,EAAS,IAAlCI,EAAQD,EAAA,GAAEE,EAAWF,EAAA,GACtBG,EAAwCN,EAAS,IAAhDO,EAAeD,EAAA,GAAEE,EAAkBF,EAAA,GACpCG,EAAmCT,EAAsB,IAAIU,KAA5DC,EAAaF,EAAA,GAAEG,OAChBC,EAAkCb,EAAiB,CACvDc,WAAW,EACXC,YAAa,KACbC,SAAS,EACT1B,YAAY,EACZ2B,KAAM,OALDC,EAAYL,EAAA,GAAEM,OAOfC,EAAkCpB,GAAS,GAA1CqB,EAAYD,EAAA,GAAEE,EAAeF,EAAA,GAC9BG,GAAczB,EAAoB,MAExC0B,EAAU,WACRtB,EAAc,CAAA,GACdG,EAAY,GACd,EAAG,CAACjB,EAAoBM,IAExB8B,EAAU,WACRpB,EAASqB,OAAS,EACdC,GAAiBtB,GACjBe,EAAeQ,EAAAA,EAAA,CAAA,EACZT,IACHD,KAAM,OAEZ,EAAG,CAACb,IAEJ,IAAMsB,GAAmB,SAAME,GAAK,OAAAC,OAAA,OAAA,OAAA,EAAA,qCAClCV,EAAeQ,EAAAA,EAAA,CAAA,EACVT,GAAY,CACfD,KAAM,KACND,SAAS,KAEXc,GAAiB,UAAW,OAAQ,MACpC,IACElC,EAAImC,IAAI,0DAAAC,OAA0DJ,IACjEK,KAAK,SAACC,GACL,IAAMjB,EAAOiB,aAAQ,EAARA,EAAUC,IAAI,SAACC,GAAa,MAAA,CACvCC,MAAMD,EAASE,WAAWC,WAC1BC,MAAOJ,EAASE,WAAWG,YAFY,GAIzCtB,EAAeQ,EAAAA,EAAA,CAAA,EACVT,GAAY,CACfF,SAAS,EACTC,KAAIA,IAER,GACCyB,MAAM,SAAUC,GACfC,QAAQD,MAAM,4BAA6BA,GAC3CxB,SACKD,GAAY,CACfF,SAAS,IAEb,EACF,CAAE,MAAO2B,GAASC,QAAQD,MAAM,4BAA6BA,EAAQ,gBAcjEb,GAAmB,SAACe,EAAQC,EAAMT,GACtCpC,EAAW4C,GAAUR,EACrB,IAAMU,EAAmBpC,GAbL,SAACmC,EAAa7B,GAClC,MAAoB,iBAATA,GAAqC,IAAhBA,EAAKQ,QAAkC,iBAATR,GAA8B,IAATA,GACrE,CACZ+B,OAAU,gCACVC,KAAQ,gCACRC,MAAS,uDACTC,OAAU,uDAECL,GAAMM,KAAKnC,EAC1B,CAKEoC,CAAcP,EAAMT,GAAuCU,EAAiBO,IAAIT,GAArDE,EAAiBQ,OAAOV,GACnDjC,EAAiBmC,GACjB7C,EAAayB,EAAA,GAAK1B,IAClBV,EAAYU,EACd,EAcMuD,GAAY,SAACvE,GAAE,IAAAlB,EAAGkB,EAAAlB,IAAK0F,EAAKC,EAAAzE,EAAf,SACXQ,EAA8BO,EAAwB,MAArD2D,EAAUlE,EAAA,GAAEmE,EAAanE,EAAA,GAahC,OAZA+B,EAAU,WACSK,OAAA,OAAA,OAAA,EAAA,oEAEI,6BAAA,CAAA,EAAMgC,MAAM9F,WACb,MAAA,CAAA,EADCkB,EAAA6E,OACcb,sBAAzBc,EAAU9E,EAAA6E,OAChBF,EAAcG,kCAEdnB,QAAQD,MAAM,qBAAsBqB,8BAI1C,EAAG,CAACjG,IAEFkG,EAAAC,cAAA,MAAAvC,EAAA,CAAA,EAAS8B,EAAK,CACZU,wBAAyB,CAAEC,OAAQT,GAAc,kBACrC,SAGlB,EAEMU,GAAU,SAACtG,SACf,GAAGA,GAAyB,oBAAXuG,OAEf,OADsC,QAApBrF,EAAAlB,EAAIwG,MAAM,KAAKC,aAAK,IAAAvF,OAAA,EAAAA,EAAEwF,qBAEtC,IAAK,MAAO,OAAOR,EAAAC,cAACQ,EAAa,CAACC,UAAU,OAAOC,QAAS,WAAM,OAAAN,OAAOO,KAAK9G,EAAI,SAAhB,IAClE,IAAK,MAAO,OAAOkG,EAAAC,cAACY,EAAa,CAACH,UAAU,OAAOC,QAAS,WAAM,OAAAN,OAAOO,KAAK9G,EAAI,SAAhB,IAClE,IAAK,MAAO,OAAOkG,EAAAC,cAACa,EAAa,CAACJ,UAAU,OAAOC,QAAS,WAAM,OAAAN,OAAOO,KAAK9G,EAAI,SAAhB,IAClE,IAAK,MAAO,OAAOkG,EAAAC,cAACc,EAAa,CAACL,UAAU,OAAOC,QAAS,WAAM,OAAAN,OAAOO,KAAK9G,EAAI,SAAhB,IAClE,IAAK,MAAO,OAAOkG,EAAAC,cAACV,GAAS,CAACmB,UAAU,OAAO5G,IAAKA,EAAK6G,QAAS,WAAM,OAAAN,OAAOO,KAAK9G,EAAI,SAAhB,IACxE,QAAS,OAAOkG,EAAAC,cAAA,MAAA,CAAKS,UAAU,OAAOM,IAAKlH,EAAK6G,QAAS,WAAQrD,GAAY2D,QAAUnH,EAAKuD,GAAgB,EAAM,EAAG6D,IAAI,KAG/H,EAEMC,GAAe,SAACC,EAAMC,GAC1B,YAD0B,IAAAA,IAAAA,GAAA,GACnBrB,EAAAC,cAAAD,EAAAsB,SAAA,KACLtB,EAAAC,cAAC7F,GAAOmH,IAAKH,EAAKI,UAAWd,UAAW,UAAGW,EAAQ,YAAc,KAC/DrB,EAAAC,cAAA,MAAA,CAAKe,IAAKpH,EAAY6H,aACtBzB,EAAAC,cAACyB,EAAG,CAAChB,UAAU,qBACbV,EAAAC,cAAA,MAAA,KACGmB,EAAKO,SAAW3B,EAAAC,cAAA,OAAA,CAAMC,wBAAyB,CAAEC,OAAQyB,EAAYR,EAAKO,QAAS,CAAEE,OAAQ,WAAYC,WAAW,WAAY,cAElIC,MAAMC,QAAQZ,EAAKa,QAAUb,EAAKa,MAAMzE,OAAS,GAAMwC,EAAAC,cAAA,MAAA,CAAKS,UAAU,SACpEU,EAAKa,MAAM/D,IAAI,SAACgE,GAAS,OAAA9B,GAAQ8B,EAAKpI,IAAb,IAE5BkG,EAAAC,cAACkC,EAAG,CAACzB,UAAU,4CACbV,EAAAC,cAAA,QAAA,CAAOC,wBAAyB,CAAEC,OAAQiB,EAAKgB,QAC7ChB,EAAKiB,WAAarC,EAAAC,cAAA,QAAA,CAAOS,UAAU,QAAQ4B,EAAOlB,EAAKiB,WAAWE,OAAO,aAIhFlB,GAASrB,EAAAC,cAACvF,EAAQ,MAEvB,EAEM8H,GAAgB,SAACpB,EAAMC,GAC3B,YAD2B,IAAAA,IAAAA,GAAA,GACpBrB,EAAAC,cAAAD,EAAAsB,SAAA,KACLtB,EAAAC,cAAC7F,GAAOmH,IAAKH,EAAKI,UAAWd,UAAW,UAAGW,EAAQ,YAAc,KAC/DrB,EAAAC,cAAA,MAAA,CAAKS,UAAU,SAASM,IAAKpH,EAAY6H,WAAYP,IAAI,KACzDlB,EAAAC,cAACyB,EAAG,CAAChB,UAAU,qBACbV,EAAAC,cAAA,MAAA,KACGmB,EAAKO,SAAW3B,wBAAMU,UAAU,SAASR,wBAAyB,CAAEC,OAAQyB,EAAYR,EAAKO,QAAS,CAAEE,OAAQ,WAAYC,WAAW,WAAY,cAErJC,MAAMC,QAAQZ,EAAKa,QAAUb,EAAKa,MAAMzE,OAAS,GAAMwC,EAAAC,cAAA,MAAA,CAAKS,UAAU,SACpEU,EAAKa,MAAM/D,IAAI,SAACgE,GAAS,OAAA9B,GAAQ8B,EAAKpI,IAAb,IAE5BkG,EAAAC,cAACkC,EAAG,CAACzB,UAAU,4CACbV,EAAAC,cAAA,QAAA,CAAOC,wBAAyB,CAAEC,OAAQiB,EAAKgB,QAC7ChB,EAAKiB,WAAarC,EAAAC,cAAA,QAAA,CAAOS,UAAU,QAAQ4B,EAAOlB,EAAKiB,WAAWE,OAAO,aAIhFlB,GAASrB,EAAAC,cAACvF,EAAQ,MAEvB,EAEM+H,GAAkB,SAACrB,eACvB,OAAOpB,EAAAC,cAAAD,EAAAsB,SAAA,KACLtB,EAAAC,cAAC3F,EAAM,CAACiH,IAAKH,EAAKI,YACbJ,EAAKsB,MAAQ1C,EAAAC,cAAAD,EAAAsB,SAAA,KACbF,EAAKO,SAAW3B,EAAAC,cAAA,OAAA,CAAMS,UAAU,YAAYR,wBAAyB,CAAEC,OAAQyB,EAAYR,EAAKO,QAAS,CAAEE,OAAQ,WAAYC,WAAW,WAAY,aACtJC,MAAMC,QAAQZ,EAAKa,QAAUb,EAAKa,MAAMzE,OAAS,GAAMwC,EAAAC,cAAA,MAAA,CAAKS,UAAU,SACpEU,EAAKa,MAAM/D,IAAI,SAACgE,GAAS,OAAA9B,GAAQ8B,EAAKpI,IAAb,IAE5BkG,EAAAC,cAACkC,EAAG,CAACzB,UAAU,uCACA,WAAdU,EAAKgB,KAAoBpC,uCAAwBA,EAAAC,cAAA,QAAA,CAAOC,wBAAyB,CAAEC,OAAQiB,EAAKgB,QAC/FhB,EAAKiB,WAAarC,EAAAC,cAAA,QAAA,CAAOS,UAAU,QAAQ4B,EAAOlB,EAAKiB,WAAWE,OAAO,YAEvD,aAAX,QAATvH,EAAAoG,EAAKsB,YAAI,IAAA1H,OAAA,EAAAA,EAAE6D,OAAuBmB,EAAAC,cAAAD,EAAAsB,SAAA,KACvB,QAAT9F,EAAA4F,EAAKsB,YAAI,IAAAlH,OAAA,EAAAA,EAAE4C,MAAMF,IAAI,SAACyE,EAAKC,GAAM,OAAA5C,EAAAC,cAAA,SAAA,CAAQsB,IAAKqB,EAAGjC,QAAS,WAAM,OAAApF,EAAaoH,EAAI/D,OAAjB,EAA0BsB,wBAAyB,CAAEC,OAAQwC,EAAIE,QAAhG,IAEf,kBAApB/G,EAAAsF,EAAKsB,2BAAM7D,OAAoBmB,EAAAC,cAAA,OAAA,CAAM6C,IAAKlH,EAASmH,OAAO,MAAMnE,OAAO,uBACvEoB,EAAAC,cAAA,MAAA,CAAKS,UAAU,+BACF,UAATU,EAAKsB,YAAI,IAAAxG,OAAA,EAAAA,EAAEkC,MAAMF,IAAI,SAACyE,EAAKC,GAAM,OAAA5C,EAAAC,cAAAD,EAAAsB,SAAA,KACjB,YAAdqB,aAAG,EAAHA,EAAK9D,MAAoBmB,EAAAC,cAAAD,EAAAsB,SAAA,KAAEtB,EAAAC,cAAA,MAAA,CAAKC,wBAAyB,CAAEC,OAAQwC,EAAIE,OAASnC,UAAU,oBAC3E,YAAdiC,eAAAA,EAAK9D,OAAmC,WAAd8D,aAAG,EAAHA,EAAK9D,OAAkC,UAAd8D,aAAG,EAAHA,EAAK9D,QAC3DmB,EAAAC,cAAA,QAAAvC,EAAA,CACEsF,SAAU,SAACC,GAAM,OAAApF,GAAiB8E,EAAI/D,OAAQ+D,aAAG,EAAHA,EAAK9D,KAAMoE,EAAEpB,OAAOzD,MAAjD,EACjBA,MAAOpC,EAAW2G,EAAI/D,QACtBsE,YAAaP,EAAIO,YACjBC,UAAW,MACNR,aAAG,EAAHA,EAAKS,WAAY,CAAEA,UAAU,GAC7B1G,EAAc2G,IAAIV,EAAI/D,SAAW,CAAE8B,UAAW,WAChC,YAAdiC,aAAG,EAAHA,EAAK9D,OAAqB,CAAEyE,KAAM,OAAQC,IAAK,EAAGC,IAAK,KAAU,CACtE3E,KAAM8D,aAAG,EAAHA,EAAK9D,KACX0C,IAAKqB,KAES,SAAdD,aAAG,EAAHA,EAAK9D,OAAkBmB,EAAAC,cAAAD,EAAAsB,SAAA,KACvBtB,EAAAC,cAACwD,gBAAa,CACZL,UAAQ,EACRvE,KAAK,OACLqE,YAAaP,EAAIO,YACjBQ,gBAAiB,IACjBtF,MAAOjC,EACP6G,SAAU,SAAAC,GACR7G,EAAY6G,EAAEpB,OAAOzD,OACrB7B,EAAmB,IACnBsB,GAAiB8E,EAAI/D,OAAQ,OAAQ,IACvC,IAEDzC,GAAY6D,EAAAC,cAAA,SAAA,CACXmD,UAAQ,EACRO,SAAgC,OAAtB1G,EAAaD,KACvB4G,aAAcjB,EAAI/D,OAClBR,MAAO9B,EACP0G,SAAU,SAACC,GACT1G,EAAoB0G,EAAEpB,OAA6BzD,OACnDP,GAAiB8E,EAAI/D,OAAQ,SAAWqE,EAAEpB,OAA6BzD,MACzE,EACAsC,UAAW,eAAQhE,EAAc2G,IAAIV,EAAI/D,SAAW,WAAa2C,IAAKqB,GACtE5C,EAAAC,cAAA,SAAA,CAAQ7B,MAAO,GAAIuF,UAAQ,EAACE,UAAQ,GAAE5G,EAAaF,QAAU,aAAgBE,EAAaD,KAAY,sBAAL,IAChGC,EAAaD,MAAQC,EAAaD,KAAKkB,IAAI,SAAAkD,GAAQ,OAClDpB,EAAAC,cAAA,SAAA,CAAQ7B,MAAOgD,EAAK7C,OACnB6C,EAAK7C,MAF4C,KAQxC,YAAdoE,aAAG,EAAHA,EAAK9D,OAAqBmB,EAAAC,cAAA,SAAA,CAAQmD,UAAQ,EAACJ,SAAU,SAACC,GAAM,OAAApF,GAAiB8E,EAAI/D,OAAQ+D,eAAAA,EAAK9D,KAAMoE,EAAEpB,OAAOzD,MAAjD,EAAyDwF,aAAc5H,EAAW2G,EAAI/D,QAASR,MAAOpC,EAAW2G,EAAI/D,QAAS2C,IAAKqB,GAC7L5C,EAAAC,cAAA,SAAA,CAAQ0D,UAAQ,EAACE,UAAQ,EAACC,QAAM,KAC/BnB,aAAG,EAAHA,EAAKoB,UAAWC,OAAOC,QAAQtB,aAAG,EAAHA,EAAKoB,SAAS7F,IAAI,SAAClD,OAACuG,EAAGvG,EAAA,GAAE6H,EAAK7H,EAAA,GAAM,OAClEgF,EAAAC,cAAA,SAAA,CAAQsB,IAAKA,EAAKnD,MAAOmD,GACxBsB,EAFiE,KAQxE7C,EAAAC,cAAA,SAAAvC,EAAA,CAAQmB,KAAK,UAAcnC,EAAcwH,KAAO,IAAM7I,EAAc,CAAEsI,UAAU,GAAS,CAACA,UAAU,GAAO,CAAEQ,MAAO,CAACC,UAAW,QAC9HzD,QAAS,SAACsC,SACFoB,EArKD,SAAC3B,EAAM4B,GAC1B,GAAG5B,EAAK,CACN,IAAI6B,EAAmB7B,EAAK8B,OAAO,SAACC,EAAUrD,GAI5C,MAHoB,gBAAhBA,EAAKxC,SACP6F,EAAIrD,EAAKxC,QAAmC,MAAxB0F,EAAOlD,EAAKxC,SAAmB0F,EAAOlD,EAAKxC,SAAY,MAEtE6F,CACT,EAAG,CAAA,GACH,OAAQT,OAAOM,OAAOC,GAAWG,KAAK,SAAAtG,GAAS,OAAU,OAAVA,CAAA,EACjD,CACF,CA2JsCuG,CAAsB,UAATvD,EAAKsB,YAAI,IAAA1H,OAAA,EAAAA,EAAEoD,MAAOpC,KAAe,EAC7C,IAAvBU,EAAcwH,MAAc3I,EAAaoH,EAAI/D,QAC9BqE,EAAEpB,OACV8B,SAAWU,CACpB,IAAC,UA9D8B,MAqE7C,EAEMO,GAAe,SAACxD,EAAMC,GAC1B,YAD0B,IAAAA,IAAAA,GAAA,GACnBrB,EAAAC,cAAAD,EAAAsB,SAAA,KACLtB,EAAAC,cAACzF,GAAU+G,IAAKH,EAAKI,UAAWd,UAAW,UAAGW,EAAQ,YAAc,KAClErB,EAAAC,cAAA,MAAA,CAAKe,IAAKpH,EAAY6H,WAAYP,IAAI,SAAOE,EAAKO,SAAW3B,EAAAC,cAAA,OAAA,CAAMC,wBAAyB,CAAEC,OAAQiB,EAAKO,QAAQG,WAAW,WAAY,cAE3IT,GAASrB,EAAAC,cAACvF,EAAQ,MAEvB,EAEA,OACEsF,EAAAC,cAAAD,EAAAsB,SAAA,KACGlE,GAAgB4C,EAAAC,cAAC4E,EAAQ,CACxBC,OAAQxH,GAAY2D,QACpB8D,MAAOzH,GAAY2D,QACnB+D,YAAY,EACZC,QAAS,WAAM,OAAA5H,GAAgB,EAAhB,IAEhB3B,GAAesE,EAAAC,cAAClG,OACb2B,EAAYwC,IAAI,SAACkD,EAAM8D,GAAU,OAAAlF,EAAAC,cAACpF,EAAG,CAAC0G,IAAK2D,GACzClB,OAAOmB,KAAKlK,GAAUuC,OAAS,GAAKwC,EAAAC,cAACvF,EAAQ,MACzB,UAApB0G,EAAKgE,YAA0BjE,GAAaC,GACxB,aAApBA,EAAKgE,YAA6B3C,GAAgBrB,GAC9B,UAApBA,EAAKgE,YAA0BR,GAAaxD,GACxB,WAApBA,EAAKgE,YAA2B5C,GAAcpB,GALf,IASpCnG,GAAYA,EAASiD,IAAI,SAACkD,EAAM8D,GAC/B,OAAAlF,EAAAC,cAACpF,EAAG,CAAC0G,IAAK2D,GACY,UAApB9D,EAAKgE,YAA0BjE,GAAaC,IACvB,aAApBA,EAAKgE,YAA6BhE,EAAKsB,OAASD,GAAgBrB,GAC7C,UAApBA,EAAKgE,YAA0BR,GAAaxD,GACxB,WAApBA,EAAKgE,YAA2B5C,GAAcpB,GAC7C4C,OAAOmB,KAAKlK,GAAUuC,OAAS,IAAO0H,GAAUlF,EAAAC,cAACvF,QALpD,GAUR"}

package/dist/src/TwilioChat/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{__makeTemplateObject as e,__awaiter as n,__assign as t,__generator as o,__spreadArray as r}from"../../node_modules/tslib/tslib.es6.js";import a,{useContext as i,useRef as l,useState as c,useEffect as s}from"react";import{io as d}from"../../node_modules/socket.io-client/build/esm/index.js";import u from"../../_virtual/browser.js";import m from"../../node_modules/styled-components/dist/styled-components.browser.esm.js";import p from"../context/GlobalContext.js";import g from"../../node_modules/linkify-html/dist/linkify-html.js";import f from"./Chat.js";import h from"../../_virtual/moment.js";import{toastrMsg as x}from"../utils/alert.js";import v from"../NotificationBar/index.js";import{isStagingOrDevelopment as b}from"../utils/helperFn.js";import{d as w}from"../../_virtual/index.js";import y,{setConfig as I}from"../api/api.js";import S from"axios";import{useDropzone as E}from"../../node_modules/react-dropzone/dist/es/index.js";import C from"../../node_modules/uuid/dist/esm-browser/v4.js";import k from"../../node_modules/react-bootstrap/esm/Row.js";var T,N,_,A,O,M,U,D,R,L=new URL("./assets/images/svg/favicon.svg",import.meta.url),j=new URL("./assets/images/svg/chat.svg",import.meta.url),F=new URL("./assets/images/png/ico-close.png",import.meta.url),z=new URL("./assets/images/gif/loader-transparent.gif",import.meta.url),W=new URL("./assets/images/svg/youfibre-upload.svg",import.meta.url),B=new URL("./assets/images/svg/close.svg",import.meta.url),G=new URL("./assets/audio/notification.wav",import.meta.url),P=m.div(T||(T=e(["\n  width: 100%;\n  max-width: 700px;\n  height: 100%;\n  position: relative;\n  margin: 0px auto;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  \n  &.direction-column-reverse { flex-direction: column-reverse; }\n  &.content-end { justify-content: end; }\n\n"],["\n  width: 100%;\n  max-width: 700px;\n  height: 100%;\n  position: relative;\n  margin: 0px auto;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  \n  &.direction-column-reverse { flex-direction: column-reverse; }\n  &.content-end { justify-content: end; }\n\n"]))),Y=m(P)(N||(N=e(["\n  overflow-y: auto;\n"],["\n  overflow-y: auto;\n"]))),V=m.div(_||(_=e(["\n  position: fixed;\n  bottom: 40px;\n  right: 40px;\n  z-index: 100;\n  display: flex;\n  flex-direction: column;\n  align-items: end;\n  gap: 15px;\n"],["\n  position: fixed;\n  bottom: 40px;\n  right: 40px;\n  z-index: 100;\n  display: flex;\n  flex-direction: column;\n  align-items: end;\n  gap: 15px;\n"]))),H=m.div(A||(A=e(["\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: #08DE9E;\n  width: 50px;\n  height: 50px;\n  border-radius: 100px;\n  cursor: pointer;\n  -webkit-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  -moz-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  -webkit-user-select: none;\n  user-select: none;  \n  img {\n    position: absolute;\n    -moz-transition: all 0.3s ease;\n    transition: all 0.3s ease;\n\t\t&.icon-hover {\n      width: 15px;\n      height: 15px;\n\t\t\ttransform: rotate(180deg) scale(.5);\n\t\t\topacity: 0;\n\t\t}\n\t\t&.icon-default {\n      width: 20px;\n      height: 20px;\n\t\t\ttransform: rotate(0deg) scale(1);\n\t\t\topacity: 1;\n\t\t}\n  }\n  &:hover {\n    -webkit-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n    -moz-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n    box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  }\n  &.open {\n\t\t.icon-hover {\n\t\t\ttransform: rotate(0deg) scale(1);\n\t\t\topacity: 1;\n\t\t}\n\t\t.icon-default {\n\t\t\ttransform: rotate(180deg) scale(.5);\n\t\t\topacity: 0;\n\t\t}\n  }\n  &.fullscreen {\n    display: none;\n  }\n\n  .unread {\n    background-color: red;\n    padding: 3px;\n    display: flex;\n    width: 20px;\n    height: 20px;\n    aspect-ratio: 1 / 1;\n    border-radius: 200px;\n    color: #ffffff;\n    position: absolute;\n    top: -4px;\n    right: -2px;\n    font-size: 0.7rem !important;\n    line-height: 0.5rem !important;\n    flex-direction: row;\n    align-content: center;\n    justify-content: center;\n    align-items: center;\n    -webkit-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    -moz-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    animation: pulseAnimation 1.5s infinite;\n    @keyframes pulseAnimation {\n      0% {\n        transform: scale(1);\n      }\n      50% {\n        transform: scale(1.1);\n      }\n      100% {\n        transform: scale(1);\n      }\n    }\n  }\n"],["\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: #08DE9E;\n  width: 50px;\n  height: 50px;\n  border-radius: 100px;\n  cursor: pointer;\n  -webkit-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  -moz-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  -webkit-user-select: none;\n  user-select: none;  \n  img {\n    position: absolute;\n    -moz-transition: all 0.3s ease;\n    transition: all 0.3s ease;\n\t\t&.icon-hover {\n      width: 15px;\n      height: 15px;\n\t\t\ttransform: rotate(180deg) scale(.5);\n\t\t\topacity: 0;\n\t\t}\n\t\t&.icon-default {\n      width: 20px;\n      height: 20px;\n\t\t\ttransform: rotate(0deg) scale(1);\n\t\t\topacity: 1;\n\t\t}\n  }\n  &:hover {\n    -webkit-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n    -moz-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n    box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  }\n  &.open {\n\t\t.icon-hover {\n\t\t\ttransform: rotate(0deg) scale(1);\n\t\t\topacity: 1;\n\t\t}\n\t\t.icon-default {\n\t\t\ttransform: rotate(180deg) scale(.5);\n\t\t\topacity: 0;\n\t\t}\n  }\n  &.fullscreen {\n    display: none;\n  }\n\n  .unread {\n    background-color: red;\n    padding: 3px;\n    display: flex;\n    width: 20px;\n    height: 20px;\n    aspect-ratio: 1 / 1;\n    border-radius: 200px;\n    color: #ffffff;\n    position: absolute;\n    top: -4px;\n    right: -2px;\n    font-size: 0.7rem !important;\n    line-height: 0.5rem !important;\n    flex-direction: row;\n    align-content: center;\n    justify-content: center;\n    align-items: center;\n    -webkit-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    -moz-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    animation: pulseAnimation 1.5s infinite;\n    @keyframes pulseAnimation {\n      0% {\n        transform: scale(1);\n      }\n      50% {\n        transform: scale(1.1);\n      }\n      100% {\n        transform: scale(1);\n      }\n    }\n  }\n"]))),q=m.div(O||(O=e(["\n  display: flex;\n  flex-direction: column;\n  background-color: #ffffff;\n  width: 350px;\n  height: 550px;\n  border-radius: 5px;\n  -webkit-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  -moz-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  max-width: 0px;\n  max-height: 0px;\n  overflow: hidden;\n  transition: max-height 0.5s ease-in-out;\n  &.show {\n    max-width: 350px;\n    max-height: 540px;\n  }\n  .cover {\n    background: rgba(255, 255, 255, 0.2);\n    position: absolute;\n    z-index: 92;\n    padding: 1rem;\n    width: 100%;\n    height: calc(100% - 65px);\n    border-radius: 5px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    -webkit-user-select: none;\n    user-select: none;\n    text-align: center;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    &.closed {\n      background: rgba(255, 255, 255, 0.9);\n      button { margin-top: 2rem; }\n    }\n    &.upload {\n      background: rgba(9, 222, 158, 0.9);\n      button { margin-top: 2rem; }\n    }\n    animation: showCover .4s cubic-bezier(0.41, 0.39, 0.53, 1.38) forwards;\n      \n    @keyframes showCover {\n      from {\n        opacity: 0;\n      }\n      to {\n        opacity: 1;\n      }\n    }\n  }\n  .files {\n    margin: 0.5rem;\n    border-radius: 5px;\n    background-color: #c1f7e7;\n    padding: 0rem;\n    overlay: none;\n    display: flex;  \n    flex-direction: column;\n    justify-content: center;\n    gap: 0rem;\n    .file {\n      display: flex;\n      flex-direction: row;\n      border-radius: 3px;\n      justify-content: space-between;\n      align-items: center;\n      margin: 0.2rem;\n      padding: 0.2rem 0.5rem;\n      gap: 1rem;\n      &:hover {\n        background-color: #ffffff;\n      }\n      .fileName {\n        font-size: 0.7rem !important;\n        line-height: 0.8rem;\n        word-break: keep-all;\n        display: block;\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n      .action {\n        width: 0.8rem;\n        height: 0.8rem;\n        opacity: 0.7;\n        cursor: pointer;\n        &:hover {\n          opacity: 1;\n        }\n      }\n\n    }\n  }\n  &.fullscreen {\n    max-width: 100% !important;\n    max-height: 100% !important;\n    position: fixed;\n    left: 0px;\n    top: 0px;\n    width: 100%;\n    height: 100%;\n    border-radius: 0px;\n    // @media (max-width: 768px) {\n    //   #listOfMessages {\n    //     max-height: calc(100vh - 210px);\n    //   }\n    //   .chat-content-container {\n    //     padding-bottom: 4rem;\n    //   }\n    // }\n    .cover {\n        &.closed {\n            height: 100%;\n        }\n    }\n  }\n  @media (max-width: 576px) {\n    position: fixed;\n    z-index: 100;\n    bottom: 0px;\n    right: 0px;\n    width: 100%;\n    height: 100%;\n    border-radius: 0px;\n    &.show {\n      max-width: 100%;\n      max-height: 100%;\n    }\n    .cover {\n      &.closed, &.upload {\n        height: 100%;\n      }\n    }\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n  background-color: #ffffff;\n  width: 350px;\n  height: 550px;\n  border-radius: 5px;\n  -webkit-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  -moz-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  max-width: 0px;\n  max-height: 0px;\n  overflow: hidden;\n  transition: max-height 0.5s ease-in-out;\n  &.show {\n    max-width: 350px;\n    max-height: 540px;\n  }\n  .cover {\n    background: rgba(255, 255, 255, 0.2);\n    position: absolute;\n    z-index: 92;\n    padding: 1rem;\n    width: 100%;\n    height: calc(100% - 65px);\n    border-radius: 5px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    -webkit-user-select: none;\n    user-select: none;\n    text-align: center;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    &.closed {\n      background: rgba(255, 255, 255, 0.9);\n      button { margin-top: 2rem; }\n    }\n    &.upload {\n      background: rgba(9, 222, 158, 0.9);\n      button { margin-top: 2rem; }\n    }\n    animation: showCover .4s cubic-bezier(0.41, 0.39, 0.53, 1.38) forwards;\n      \n    @keyframes showCover {\n      from {\n        opacity: 0;\n      }\n      to {\n        opacity: 1;\n      }\n    }\n  }\n  .files {\n    margin: 0.5rem;\n    border-radius: 5px;\n    background-color: #c1f7e7;\n    padding: 0rem;\n    overlay: none;\n    display: flex;  \n    flex-direction: column;\n    justify-content: center;\n    gap: 0rem;\n    .file {\n      display: flex;\n      flex-direction: row;\n      border-radius: 3px;\n      justify-content: space-between;\n      align-items: center;\n      margin: 0.2rem;\n      padding: 0.2rem 0.5rem;\n      gap: 1rem;\n      &:hover {\n        background-color: #ffffff;\n      }\n      .fileName {\n        font-size: 0.7rem !important;\n        line-height: 0.8rem;\n        word-break: keep-all;\n        display: block;\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n      .action {\n        width: 0.8rem;\n        height: 0.8rem;\n        opacity: 0.7;\n        cursor: pointer;\n        &:hover {\n          opacity: 1;\n        }\n      }\n\n    }\n  }\n  &.fullscreen {\n    max-width: 100% !important;\n    max-height: 100% !important;\n    position: fixed;\n    left: 0px;\n    top: 0px;\n    width: 100%;\n    height: 100%;\n    border-radius: 0px;\n    // @media (max-width: 768px) {\n    //   #listOfMessages {\n    //     max-height: calc(100vh - 210px);\n    //   }\n    //   .chat-content-container {\n    //     padding-bottom: 4rem;\n    //   }\n    // }\n    .cover {\n        &.closed {\n            height: 100%;\n        }\n    }\n  }\n  @media (max-width: 576px) {\n    position: fixed;\n    z-index: 100;\n    bottom: 0px;\n    right: 0px;\n    width: 100%;\n    height: 100%;\n    border-radius: 0px;\n    &.show {\n      max-width: 100%;\n      max-height: 100%;\n    }\n    .cover {\n      &.closed, &.upload {\n        height: 100%;\n      }\n    }\n  }\n"]))),J=m.div(M||(M=e(["\n  background-color: #08DE9E;\n  width: 100%;\n  padding: 15px;\n  color: #ffffff;\n  flex: 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 15px;\n  -webkit-box-shadow: -2px 2px 5px 1px rgba(0,0,0,0.2);\n  box-shadow: -2px 2px 5px 1px rgba(0,0,0,0.2);\n  z-index: 91;\n  img {\n    width: 40px;\n    height: 40px;\n    -object-fit: fill;\n    object-fit: fill;\n    padding: 7px;\n    border-radius: 200px;\n    cursor: pointer;\n    background-color: #FFFFFF;\n    &.close {\n      display: none;\n      background-color: transparent;\n    }\n  }\n  a {\n    &:hover {\n      text-decoration: none !important;\n      cursor: pointer;\n    }\n  }\n  span {\n    padding: 0px;\n  }\n  @media (max-width: 576px) {\n    img {\n      &.close {\n        display: block;\n      }\n    }\n  }\n"],["\n  background-color: #08DE9E;\n  width: 100%;\n  padding: 15px;\n  color: #ffffff;\n  flex: 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 15px;\n  -webkit-box-shadow: -2px 2px 5px 1px rgba(0,0,0,0.2);\n  box-shadow: -2px 2px 5px 1px rgba(0,0,0,0.2);\n  z-index: 91;\n  img {\n    width: 40px;\n    height: 40px;\n    -object-fit: fill;\n    object-fit: fill;\n    padding: 7px;\n    border-radius: 200px;\n    cursor: pointer;\n    background-color: #FFFFFF;\n    &.close {\n      display: none;\n      background-color: transparent;\n    }\n  }\n  a {\n    &:hover {\n      text-decoration: none !important;\n      cursor: pointer;\n    }\n  }\n  span {\n    padding: 0px;\n  }\n  @media (max-width: 576px) {\n    img {\n      &.close {\n        display: block;\n      }\n    }\n  }\n"]))),K=m.div(U||(U=e(["\n  width: 100%;\n  padding: 0;\n  color: #000000;\n  flex: 1;\n  display: flex;\n  flex-direction: column-reverse;\n  overflow-x: hidden;\n  .chat-content-container {\n    padding-bottom: 1.8rem;\n  }\n  button {\n    display: block;\n    background-color: #c1f7e7;\n    flex: 0;\n    padding: 5px;\n    border-radius: 5px;\n    color: #263238;\n    font-weight: 100;\n    font-size: 1rem;\n    line-height: 1.5rem;\n    font-weight: 100;\n    min-width: 40%;\n    border: 2px solid #08DE9E;\n    cursor: pointer;\n    &:hover {\n      background-color: #08DE9E;\n    }\n  }\n  @media (max-width: 768px) {\n    overflow-y: hidden;\n    .chat-content-container {\n      overflow-y: auto;\n      // padding-bottom: 0;\n    }\n  }\n"],["\n  width: 100%;\n  padding: 0;\n  color: #000000;\n  flex: 1;\n  display: flex;\n  flex-direction: column-reverse;\n  overflow-x: hidden;\n  .chat-content-container {\n    padding-bottom: 1.8rem;\n  }\n  button {\n    display: block;\n    background-color: #c1f7e7;\n    flex: 0;\n    padding: 5px;\n    border-radius: 5px;\n    color: #263238;\n    font-weight: 100;\n    font-size: 1rem;\n    line-height: 1.5rem;\n    font-weight: 100;\n    min-width: 40%;\n    border: 2px solid #08DE9E;\n    cursor: pointer;\n    &:hover {\n      background-color: #08DE9E;\n    }\n  }\n  @media (max-width: 768px) {\n    overflow-y: hidden;\n    .chat-content-container {\n      overflow-y: auto;\n      // padding-bottom: 0;\n    }\n  }\n"]))),Z=m.form(D||(D=e(["\n  background-color: #f4f7f9;\n  width: 100%;\n  flex: 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 10px;\n  padding: 5px;\n  .action {\n    width: 1.3rem;\n    height: 1.3rem;\n    cursor: pointer;\n    opacity: 0.7;\n    -webkit-user-select: none;\n    user-select: none;\n    &:hover {\n      opacity: 0.7;\n    }\n  }\n  input {\n    background-color: rgba(0,0,0,0);\n    border: none;\n    border-bottom: 1px solid rgba(0,0,0,0);\n    outline: 0px;\n    padding: 0px;\n    margin-left: 15px;\n    font-size: 0.9rem;\n    font-weight: 100;\n    flex: 1;\n    &.invalid {\n      border-bottom: 1px solid red;\n    }\n  }\n  button {\n    min-width: 90px;\n    background-color: #09de9e;\n    flex: 0;\n    font-size: 1rem;\n    &:hover {\n      background-color: #08c98f;\n    }\n    &:disabled, &:disabled:hover {\n      background-color: rgba(0,0,0,0.05);\n      color: #aabbcc !important;\n    }\n  }\n  @media (max-width: 576px) {\n    padding: 15px;\n  }\n  // @media (max-width: 768px) {\n  //   &.form-fullscreen {\n  //     position: fixed;\n  //     bottom: 0;\n  //   }\n  // }  \n"],["\n  background-color: #f4f7f9;\n  width: 100%;\n  flex: 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 10px;\n  padding: 5px;\n  .action {\n    width: 1.3rem;\n    height: 1.3rem;\n    cursor: pointer;\n    opacity: 0.7;\n    -webkit-user-select: none;\n    user-select: none;\n    &:hover {\n      opacity: 0.7;\n    }\n  }\n  input {\n    background-color: rgba(0,0,0,0);\n    border: none;\n    border-bottom: 1px solid rgba(0,0,0,0);\n    outline: 0px;\n    padding: 0px;\n    margin-left: 15px;\n    font-size: 0.9rem;\n    font-weight: 100;\n    flex: 1;\n    &.invalid {\n      border-bottom: 1px solid red;\n    }\n  }\n  button {\n    min-width: 90px;\n    background-color: #09de9e;\n    flex: 0;\n    font-size: 1rem;\n    &:hover {\n      background-color: #08c98f;\n    }\n    &:disabled, &:disabled:hover {\n      background-color: rgba(0,0,0,0.05);\n      color: #aabbcc !important;\n    }\n  }\n  @media (max-width: 576px) {\n    padding: 15px;\n  }\n  // @media (max-width: 768px) {\n  //   &.form-fullscreen {\n  //     position: fixed;\n  //     bottom: 0;\n  //   }\n  // }  \n"]))),Q=m.div(R||(R=e(["\n  width: 100%;\n  display: flex;\n  flex-direction: row-reverse;\n  small {\n    position: absolute;\n    margin-top: -1.6rem;\n    margin-right: 1rem;\n    font-size: 0.7rem !important;\n    font-weight: 100;\n    line-height: 0.8rem;\n    color: #015e9c;\n    background-color: #ddf0fc;\n    border: 1px solid #ffffff;\n    border-radius: 100px;\n    padding: 5px 15px;\n    z-index: 50;\n  }\n"],["\n  width: 100%;\n  display: flex;\n  flex-direction: row-reverse;\n  small {\n    position: absolute;\n    margin-top: -1.6rem;\n    margin-right: 1rem;\n    font-size: 0.7rem !important;\n    font-weight: 100;\n    line-height: 0.8rem;\n    color: #015e9c;\n    background-color: #ddf0fc;\n    border: 1px solid #ffffff;\n    border-radius: 100px;\n    padding: 5px 15px;\n    z-index: 50;\n  }\n"]))),X=function(e){var m,T=e.host,N=e.clientId,_=e.clientSecret,A=e.customToken,O=e.websocketUrl;e.postcodeSchemaId,e.source;var M=e.fullscreen,U=void 0!==M&&M,D=i(p),R=l(null),X=c(!1),$=X[0],ee=X[1],ne=c(null),te=ne[0],oe=ne[1],re=c(!1),ae=re[0],ie=re[1],le=c(null);le[0];var ce=le[1],se=c(null),de=se[0],ue=se[1],me=c(null),pe=me[0],ge=me[1],fe=c(!1),he=fe[0],xe=fe[1],ve=c(!1),be=ve[0],we=ve[1],ye=c(!1),Ie=ye[0],Se=ye[1],Ee=c(U),Ce=Ee[0],ke=Ee[1],Te=c({}),Ne=Te[0],_e=Te[1],Ae=c(""),Oe=Ae[0],Me=Ae[1],Ue=c(null),De=Ue[0],Re=Ue[1],Le=c(null),je=Le[0],Fe=Le[1],ze=c(null),We=ze[0],Be=ze[1],Ge=c([]),Pe=Ge[0],Ye=Ge[1],Ve=c(!1),He=Ve[0],qe=Ve[1],Je=c(!1),Ke=Je[0],Ze=Je[1],Qe=c(null),Xe=Qe[0],$e=Qe[1],en=c(!1),nn=en[0],tn=en[1],on=c(null),rn=on[0],an=on[1],ln=c(!1),cn=ln[0],sn=ln[1],dn=c(!0),un=dn[0],mn=dn[1],pn=c(null),gn=pn[0],fn=pn[1],hn=c(!1),xn=hn[0],vn=hn[1],bn=c(-1),wn=bn[0],yn=bn[1],In=l("");l(0);var Sn=l(null),En=l(Ce),Cn=l(!0),kn=["jpg","jpeg","png","pdf","gif","txt","mp4","mp3"],Tn=w.useTime({interval:1}).seconds,Nn=c(!1),_n=Nn[0],An=Nn[1],On=l(null),Mn=[{createdAt:h(new Date).format(),message:null,fromId:"Client",senderType:"CUSTOMER",form:{type:"buttons",value:[{title:"I am the account holder",action:"old_customer"},{title:"I am not the account holder",action:"not_customer"},{title:"I am new here",action:"new_customer"}]},messageId:"1"},{senderType:"AGENT",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:"Welcome to YouFibre!<br />We're going to ask you some questions to ensure we get you through to the right team, so please bear with us!<br />Are you the account holder?",form:null,messageId:"0"}],Un={SALES:"Sales",TECH_SUPPORT:"Tech Support",INSTALLS_AND_SERVICE_VISITS:"Installs & Service Visits",MANAGE_MY_ACCOUNT:"Manage My Account",BILLING:"Billing",CANCELLATION:"Cancellation",COMPLAINT:"Complaint"},Dn={NEW_CUSTOMER:"New customer",ACCOUNT_HOLDER:"Account holder",NOT_ACCOUNT_HOLDER:"Not the account holder"},Rn=c(Mn),Ln=Rn[0],jn=Rn[1],Fn=c(null),zn=Fn[0],Wn=Fn[1],Bn=l(Ln),Gn=l(null),Pn=l(null),Yn=function(){try{Gn.current&&Gn.current.scrollIntoView({behavior:"smooth"})}catch(e){}};s(function(){if("undefined"!=typeof document&&"undefined"!=typeof window){if(xn&&-1!==wn){localStorage.getItem("title")||localStorage.setItem("title","undefined"!=typeof document&&document.getElementsByTagName("title")[0].textContent||"");return Sn.current=window.setInterval(function(){var e=In.current;if(e){var n=(wn+1)%e.length;document.title=e.slice(n)+" "+e.slice(0,n),yn(n)}},200),function(){Sn.current&&clearInterval(Sn.current)}}Sn.current=null,In.current=""}},[wn]),s(function(){I(T,N,_,A),S.get("https://strapi.youfibre.com/api/information").then(function(e){D.setAppMessages(e.data)}).catch(function(e){D.setAppMessages(null)}),Jn();var e="undefined"!=typeof window?window.location.href:"",n=new MutationObserver(function(){"undefined"!=typeof window&&e!==window.location.href&&(e=window.location.href,Jn())});return"undefined"!=typeof document&&n.observe(document.body,{childList:!0,subtree:!0}),function(){return n.disconnect()}},[]),s(function(){fn(D.appMessages),mn(!qn())},[D.appMessages]),s(function(){mn(!qn())},[Tn]),s(function(){!un&&!pe&&nt()},[un]);var Vn=(new Date).toLocaleString("en-GB",{timeZone:"Europe/London",hour:"2-digit",minute:"2-digit",second:"2-digit",hour12:!1}),Hn=function(e){if(e){var n=e.split(":").map(Number);return 3600*n[0]+60*n[1]+n[2]}},qn=function(){var e,n,t,o,r;if((null===(e=D.appMessages)||void 0===e?void 0:e.chat_off_mode_toggle)&&Vn&&(null===(n=D.appMessages)||void 0===n?void 0:n.chat_off_mode_start)&&(null===(t=D.appMessages)||void 0===t?void 0:t.chat_off_mode_end)){var a=Hn(Vn),i=Hn(null===(o=D.appMessages)||void 0===o?void 0:o.chat_off_mode_start),l=Hn(null===(r=D.appMessages)||void 0===r?void 0:r.chat_off_mode_end);return i<l?a>=i&&a<l:a>=i||a<l}return!1},Jn=function(){"undefined"!=typeof window&&an(new URLSearchParams(window.location.search))};s(function(){if(""===(null==rn?void 0:rn.get("youFibreChat"))){n(void 0,void 0,void 0,function(){return o(this,function(e){switch(e.label){case 0:return[4,new Promise(function(e){var n;localStorage.setItem("chatUsername",rn.get("chatUsername")),localStorage.setItem("chatUserId",rn.get("chatUserId")),localStorage.setItem("chatSessionId",rn.get("chatSessionId")),localStorage.setItem("conversationId",rn.get("conversationId")),localStorage.setItem("caseId",rn.get("caseId")),localStorage.setItem("participantId",rn.get("participantId")),Re(rn.get("participantId")),D.goSetRegistrationData(t(t({},D.goGetRegistrationData()),{twilioChat:t(t({},(null===(n=D.goGetRegistrationData())||void 0===n?void 0:n.twilioChat)||null),{chatUsername:rn.get("chatUsername")||null,chatSessionId:rn.get("chatSessionId")||null,chatUserId:rn.get("chatUserId")||null,conversationId:rn.get("conversationId")||null,caseId:rn.get("caseId")||null,participantId:rn.get("participantId")||null})})),e()})];case 1:return e.sent(),Kn(),[2]}})})}else rn&&0===Object.keys(rn).length&&Kn()},[rn]);var Kn=function(){n(void 0,void 0,void 0,function(){var e,n,r,a,i;return o(this,function(o){switch(o.label){case 0:if(!localStorage.getItem("conversationId"))return[3,4];o.label=1;case 1:return o.trys.push([1,3,,4]),[4,y.get("ChatModule/v1.0/gateway/conversation/".concat(localStorage.getItem("conversationId")))];case 2:return(e=o.sent())?("CLOSED"===(null===(a=null===(r=null==e?void 0:e.data)||void 0===r?void 0:r.properties)||void 0===a?void 0:a.Status)?nt():D.goSetRegistrationData(t(t({},D.goGetRegistrationData()),{twilioChat:t(t({},(null===(i=D.goGetRegistrationData())||void 0===i?void 0:i.twilioChat)||null),{chatUsername:localStorage.getItem("chatUsername")||null,chatSessionId:localStorage.getItem("chatSessionId")||null,chatUserId:localStorage.getItem("participantId")||null,conversationId:localStorage.getItem("conversationId")||null,caseId:localStorage.getItem("caseId")||null,participantId:localStorage.getItem("participantId")||null})})),xe(!1),[3,4]):(console.log("Can't check conversation!"),[2,null]);case 3:return n=o.sent(),console.log("Error fetching conversation status: ",n),[3,4];case 4:return[2]}})}),localStorage.removeItem("title"),ue(localStorage.getItem("conversationId")||null),ge(localStorage.getItem("caseId")||null),Re(localStorage.getItem("participantId")||null),On.current=localStorage.getItem("agentId")||null,$e(localStorage.getItem("chatSessionId")||null),localStorage.getItem("conversationId")&&localStorage.getItem("participantId")&&ie(!0),localStorage.getItem("chatUsername")&&Be(localStorage.getItem("chatUsername")),localStorage.getItem("chatUserType")&&Fe(localStorage.getItem("chatUserType")||"NEW_CUSTOMER"),_e({full_name:localStorage.getItem("chatUsername"),email:localStorage.getItem("chatEmail"),category:localStorage.getItem("chatCategory"),address:localStorage.getItem("chatAddress"),last_bill:localStorage.getItem("chatLastBill")}),localStorage.getItem("chatMessages")?jn(JSON.parse(localStorage.getItem("chatMessages")||"")):localStorage.setItem("chatMessages",JSON.stringify(Ln)),localStorage.getItem("conversationId")&&Zn(localStorage.getItem("conversationId"),"onLoad"),document.addEventListener("visibilitychange",function(){var e;"visible"===document.visibilityState?(Cn.current=!0,"undefined"!=typeof document&&En.current&&localStorage.getItem("title")&&(vn(!1),yn(-1),sn(!1),document.title=localStorage.getItem("title")||"",null===(e=document.getElementById("inputMessage"))||void 0===e||e.focus(),setTimeout(function(){return localStorage.removeItem("title")},1e3)),localStorage.getItem("conversationId")&&Zn(localStorage.getItem("conversationId"),"visibilitychange")):Cn.current=!1})},Zn=function(e,t){return n(void 0,void 0,void 0,function(){var r,a,i,l;return o(this,function(c){switch(c.label){case 0:return c.trys.push([0,6,,7]),e?[4,y.get("NotificationModule/v2.0/records/Conversation/".concat(e,'/links?targetEntities=["Message"]'))]:[3,4];case 1:return(r=c.sent())?(console.log("getAllMessages: ".concat(t),r),[4,Promise.all(null===(l=null==r?void 0:r.Message)||void 0===l?void 0:l.dbRecords.map(function(e){return n(void 0,void 0,void 0,function(){var n,t,r,a,i;return o(this,function(o){switch(o.label){case 0:return n={createdAt:null==e?void 0:e.createdAt,from:null===(t=null==e?void 0:e.properties)||void 0===t?void 0:t.From},[4,Xn(null===(r=null==e?void 0:e.properties)||void 0===r?void 0:r.Files)];case 1:return[2,(n.files=o.sent(),n.message=null===(a=null==e?void 0:e.properties)||void 0===a?void 0:a.Body,n.form=null,n.messageId=null==e?void 0:e.id,n.fromId=null===(i=null==e?void 0:e.createdBy)||void 0===i?void 0:i.id,n.senderType="EVENT"===e.type?"EVENT":e.properties.SenderType,n)]}})})}))]):[3,3];case 2:a=c.sent(),!En.current&&Object.keys(a).length>0&&sn(!0),a=a.sort(function(e,n){return new Date(n.createdAt).getTime()-new Date(e.createdAt).getTime()}),jn(a),localStorage.setItem("allMessages",JSON.stringify(a)),c.label=3;case 3:return[3,5];case 4:jn(Mn),c.label=5;case 5:return[3,7];case 6:return i=c.sent(),console.log("Error fetching messages:",i),[3,7];case 7:return[2]}})})};s(function(){"undefined"!=typeof document&&(U?(document.body.style.overflow="hidden",document.documentElement.style.overflow="hidden"):(document.body.style.overflow="",document.documentElement.style.overflow=""))},[U]);var Qn;s(function(){var e,n,t,o;if(De){var r=Xe||C();$e(r),localStorage.setItem("chatSessionId",r),Pn.current||(Pn.current=(void 0===(o=r)&&(o=null),d("".concat(O,"/ChatWebsocketModule/TwilioChatWebsocket/v1.0"),{path:"/ws",query:{clientId:o},reconnection:!0,reconnectionAttempts:1/0,reconnectionDelay:1e3,reconnectionDelayMax:5e3,timeout:1e4}))),null===(e=Pn.current)||void 0===e||e.on("connect",function(){console.log("Connected to WebSocket server")}),null===(n=Pn.current)||void 0===n||n.on("connect_error",function(e){console.log("Connect error due to ".concat(e.message)),Pn.current=null}),null===(t=Pn.current)||void 0===t||t.on("disconnect",function(e){console.log("Disconnected: ".concat(e)),Pn.current=null})}},[De]),s(function(){n(void 0,void 0,void 0,function(){var e,t;return o(this,function(r){return Pn.current&&pe&&(Pn.current.emit("joinRoom",pe),!Pn.current.listeners("case-event-".concat(pe)).length&&(null===(e=Pn.current)||void 0===e||e.on("case-event-".concat(pe),function(e){if(e.caseId===localStorage.getItem("caseId"))switch(e.type){case"CASE_UPDATED":On.current=e.data.properties.OwnerId,localStorage.setItem("agentId",On.current||"");break;case"CONVERSATION_CLOSED":Se(!0);break;case"MESSAGE_CREATED":$n(e.data)}})),!Pn.current.listeners("web-chat-input-".concat(pe)).length&&(null===(t=Pn.current)||void 0===t||t.on("web-chat-input-".concat(pe),function(e){return n(void 0,void 0,void 0,function(){return o(this,function(n){return e.caseId===pe&&"AGENT"===e.sender&&An(!0),[2]})})}))),[2]})})},[pe]),s(function(){n(void 0,void 0,void 0,function(){return o(this,function(e){try{Qn=!!_n&&setTimeout(function(){An(!1),clearTimeout(Qn)},1500)}catch(e){console.log("Error fetching data:",e)}return[2]})})},[_n]),s(function(){Bn.current=Ln},[Ln]),s(function(){n(void 0,void 0,void 0,function(){var e;return o(this,function(n){try{Ln.length&&pe&&Pn.current&&(null===(e=Pn.current)||void 0===e||e.emit("web-chat-input",{caseId:pe,conversationId:de,message:Oe,sender:"CUSTOMER"}))}catch(e){console.log("Error fetching data:",e)}return[2]})})},[Oe]);var Xn=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return n(void 0,r([],e,!0),void 0,function(e){var n,t,a;return void 0===e&&(e=null),o(this,function(o){switch(o.label){case 0:return o.trys.push([0,4,,5]),n=[],e?[4,y.get("SchemaModule/v1.0/db/File/many?ids=".concat(e))]:[3,2];case 1:return(t=o.sent())?(console.log("tmpFiles response:",t),Object.keys(t).length&&t.map(function(e){var t,o;n=r(r([],n,!0),[{id:(null==e?void 0:e.id)||"",type:(null===(t=null==e?void 0:e.properties)||void 0===t?void 0:t.Mimetype)||"",url:(null===(o=null==e?void 0:e.properties)||void 0===o?void 0:o.Url)||""}],!1)}),[2,0!==Object.keys(n).length?n:[]]):(console.log("Can't close conversation!"),[3,3]);case 2:return[2,[]];case 3:return[3,5];case 4:return a=o.sent(),console.log("Error fetching files:",a),[2,[]];case 5:return[2]}})})},$n=function(e){return n(void 0,void 0,void 0,function(){var n,t,r,a,i;return o(this,function(o){switch(o.label){case 0:if(!e||Bn.current.some(function(n){return n.messageId===e.id}))return[3,6];o.label=1;case 1:return o.trys.push([1,5,,6]),"CLOSED"===(null===(i=null===(a=null===(r=null==e?void 0:e.Conversation)||void 0===r?void 0:r.dbRecords[0])||void 0===a?void 0:a.properties)||void 0===i?void 0:i.Status)&&Se(!0),n=[],e.properties.Files?[4,Xn(e.properties.Files)]:[3,3];case 2:return n=o.sent(),0===Object.keys(n).length&&(n=null),et(e,n),[3,4];case 3:et(e,n),o.label=4;case 4:return[3,6];case 5:return t=o.sent(),console.log("Error fetching message:",t),[3,6];case 6:return[2]}})})},et=function(e,n){var t={senderType:"EVENT"!==e.type?e.properties.SenderType:e.type,createdAt:h(new Date).format(),from:"EVENT"!==e.type?e.properties.From:e.type,message:"EVENT"!==e.type?e.properties.Body:e.title,form:null,files:n,messageId:e.id,fromId:"EVENT"!==e.type?e.createdBy.id:"YouFibre"};En.current&&Cn.current||sn(!0),Wn(r(r([],zn||[],!0),[t],!1)),setTimeout(function(){Wn(null),jn(r([t],Bn.current,!0)),localStorage.setItem("chatMessages",JSON.stringify(r([t],Bn.current,!0))),xe(!1),Yn()},400)};s(function(){if("undefined"!=typeof document)if(localStorage.getItem("title")||localStorage.setItem("title","undefined"!=typeof document&&document.getElementsByTagName("title")[0].textContent||""),cn){var e=new Audio(G.toString());e.setAttribute("crossorigin","anonymous"),e.play().catch(function(e){console.log("User interaction required before playing sound")}),document.title="New message | YouFibre"}else document.title=localStorage.getItem("title")||"",Yn()},[cn]),s(function(){n(void 0,void 0,void 0,function(){var e;return o(this,function(n){try{"undefined"!=typeof window&&"undefined"!=typeof document&&(Ce?(window.innerWidth<577&&(document.body.style.overflow="hidden"),Sn.current&&clearInterval(Sn.current),localStorage.getItem("title")&&(document.title=localStorage.getItem("title")||""),vn(!1),yn(-1),sn(!1),null===(e=document.getElementById("inputMessage"))||void 0===e||e.focus(),setTimeout(function(){return localStorage.removeItem("title")},1e3)):(document.body.style.overflow="",tn(!1),Se(!1))),Yn(),En.current=Ce}catch(e){console.log("Error fetching data:",e)}return[2]})})},[Ce]);var nt=function(){Pn.current&&pe&&(Pn.current.emit("leaveRoom",pe),Pn.current.removeAllListeners()),ue(null),ge(null),Ye([]),Ze(!Ke),ee(!1),oe(null),R.current=null,localStorage.removeItem("chatEmail"),localStorage.removeItem("conversationId"),localStorage.removeItem("caseId"),localStorage.removeItem("participantId"),localStorage.removeItem("chatUsername"),localStorage.removeItem("twilio_token"),localStorage.removeItem("chatMessages"),localStorage.removeItem("chatUserType"),localStorage.removeItem("chatCategory"),localStorage.removeItem("chatAddress"),localStorage.removeItem("chatLastBill"),localStorage.removeItem("agentId"),localStorage.removeItem("chatSessionId"),Be(null),Fe(null),Re(null),_e({}),xe(!1),ie(!0),ce(null),On.current=null,Me(""),localStorage.setItem("chatMessages",JSON.stringify(Mn)),Wn(null),jn(Mn),Yn(),U&&ke(!0),D.goSetRegistrationData(t(t({},D.goGetRegistrationData()),{twilioChat:null}))},tt=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return n(void 0,r([],e,!0),void 0,function(e){var t,r;return void 0===e&&(e=null),o(this,function(a){if(Oe.length>0||e||Object.keys(Pe).length>0){"undefined"!=typeof document&&(null===(r=document.getElementById("inputMessage"))||void 0===r||r.focus()),(t=new u).append("conversationSid",localStorage.getItem("conversationId")),t.append("message",Oe||e),t.append("from",localStorage.getItem("chatUsername")),t.append("sender","CUSTOMER"),Me(""),we(!0);try{Object.keys(Pe).length>0&&Pe.map(function(e){return n(void 0,void 0,void 0,function(){return o(this,function(n){return t.append("files",e),[2]})})})}catch(e){}try{y.post("ChatModule/v1.0/gateway/conversation/".concat(localStorage.getItem("conversationId"),"/message/send"),t,{headers:{"Content-Type":"multipart/form-data"}}).then(function(e){e?(Ye([]),ie(!0),we(!1),xe(!1)):(mn(!qn()),nt(),console.log("Conversation is closed"))}).catch(function(e){mn(!qn()),console.log("Send a Message:",e)})}catch(e){console.log("Error loading SVG:",e)}}return[2]})})},ot=function(){return n(void 0,void 0,void 0,function(){var e,r,a;return o(this,function(i){switch(i.label){case 0:return xe(!0),localStorage.setItem("chatUsername",Ne.full_name),Be(Ne.full_name),localStorage.setItem("chatEmail",Ne.email),localStorage.setItem("chatCategory",Ne.category),localStorage.setItem("chatAddress",Ne.address),localStorage.setItem("chatLastBill",Ne.last_bill),[4,(p=Ne.email,n(void 0,void 0,void 0,function(){var e;return o(this,function(n){switch(n.label){case 0:return n.trys.push([0,2,,3]),[4,y.get("ChatModule/v1.0/gateway/token?identity=".concat(p,"&source=twilio"))];case 1:return[2,n.sent()||null];case 2:return e=n.sent(),console.log("Error fetching token:",e),[3,3];case 3:return[2]}})}))];case 1:return(e=i.sent())?(localStorage.setItem("twilio_token",e),ce(e),[4,(l=Ne.full_name,c=Ne.email,s=Ne.address,d=Ne.last_bill,u=je,m=Ne.category,n(void 0,void 0,void 0,function(){var e,n;return o(this,function(t){switch(t.label){case 0:return t.trys.push([0,2,,3]),[4,y.post("ChatModule/v1.0/gateway/conversation/create",{source:"twilio",channel:"WEB_CHAT",identifier:c||null,DpaCustomerName:l||null,DpaCustomerEmail:c||null,DpaCustomerAddress:s||null,DpaCustomerLastBill:d||null,DpaCustomerType:u||null,DpaCustomerCategory:m||null})];case 1:return(e=t.sent())?[2,e||null]:(console.log("Can't create conversation!"),mn(!1),[2,null]);case 2:return n=t.sent(),mn(!1),x(n.message.replaceAll("OdinApiError:",""),"error"),[3,3];case 3:return[2]}})}))]):[3,3];case 2:return(r=i.sent())?(ie(!0),Re(null==r?void 0:r.participantId),localStorage.setItem("conversationId",null==r?void 0:r.conversationId),localStorage.setItem("caseId",null==r?void 0:r.caseId),localStorage.setItem("participantId",null==r?void 0:r.participantId),ge(null==r?void 0:r.caseId),ue(null==r?void 0:r.conversationId),D.goSetRegistrationData(t(t({},D.goGetRegistrationData()),{twilioChat:t(t({},null===(a=D.goGetRegistrationData())||void 0===a?void 0:a.twilioChat),{chatUsername:Ne.full_name,chatSessionId:Xe,chatUserId:null==r?void 0:r.participantId,conversationId:null==r?void 0:r.conversationId,caseId:null==r?void 0:r.caseId,participantId:null==r?void 0:r.participantId})})),new Promise(function(e){jn(function(n){return e(),[]}),tt(R.current)}).then(function(){et({type:"EVENT",title:"Waiting for the agent to join the chat."},null)})):mn(!qn()),[3,4];case 3:xe(!1),i.label=4;case 4:return[2]}var l,c,s,d,u,m,p})})},rt=E({noClick:!0,noKeyboard:!0,onDrop:function(e){pe&&(e=(e=(e=e.filter(function(e){return e.size<10485760?e:x("Maximum file size is ".concat(10,"MB"),"error")})).filter(function(e){return kn.some(function(n){return e.name.endsWith(n)})?e:x("Unsupported File extension","error")})).filter(function(e){return 0===Object.keys(Pe.filter(function(n){return n.name===e.name})).length}),Object.keys(Pe).length+Object.keys(e).length<6?Ye(r(r([],Pe,!0),e,!0)):x("Maximum ".concat(5," files"),"warning"),qe(!1))}}),at=rt.getRootProps,it=rt.getInputProps,lt=rt.open;return a.createElement(a.Fragment,null,(void 0===process.env.GATSBY_TWILIO_CHAT_VERSION||"1"===process.env.GATSBY_TWILIO_CHAT_VERSION)&&a.createElement(V,null,a.createElement(q,t({className:"".concat(Ce?"show":""," ").concat(U?"fullscreen":"")},at(),{onDragOver:function(){return pe&&qe(!0)},onMouseLeave:function(){return qe(!1)}}),a.createElement(J,null,a.createElement(P,{className:"justify-between"},a.createElement(k,{className:"p-0 m-0 align-items-center"},a.createElement("div",null,a.createElement("img",{src:L.toString()}),a.createElement("span",null," YouFibre"))),a.createElement(k,{className:"p-0 m-0 align-items-center"},!de&&Object.keys(Ln).length>2&&a.createElement("button",{onClick:function(){return nt()},className:"small"},"Back"),de&&a.createElement("button",{onClick:function(){return tn(!0)},className:"small"},"End conversation"),!U&&a.createElement("img",{src:F.toString(),className:"close",onClick:function(){return ke(!Ce)}})))),a.createElement(v,{type:"chat"}),a.createElement(K,null,a.createElement(P,{className:"direction-column-reverse content-end chat-content-container"},a.createElement("div",{ref:Gn}),a.createElement(f,{messages:Ln,chatUsername:We,chatUserId:De,chatConversationId:de,resetFormValues:Ke,setChatForm:_e,buttonAction:function(e){if(un||pe||b())switch(e){case"new_customer":!function(){Fe("NEW_CUSTOMER"),localStorage.setItem("chatUserType","NEW_CUSTOMER");var e=r([{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:null,form:{type:"form",value:[{title:"Name",action:"full_name",placeholder:null,type:"text",required:!0},{title:"Email",action:"email",placeholder:null,type:"email",required:!0},{title:"Enter your Postcode",action:"address",placeholder:"Example: SW1 4EN",type:"zip",required:!0},{title:"What do you need help with today?",action:"category",placeholder:null,type:"select",required:!0,options:{SALES:"Sales",TECH_SUPPORT:"Tech Support",COMPLAINT:"Complaint"}},{title:"Submit",action:"submit_form",type:"button"}]},messageId:"3"},{senderType:"AGENT",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:"We're so happy to hear from you! So that we can provide the best possible support, please provide us with the following information.",form:null,messageId:"2"},{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"Client",fromId:"Client",message:"I am new here",form:null,messageId:"1"}],Ln.slice(1),!0);Wn(r(r([],zn||[],!0),[e[0]],!1)),setTimeout(function(){Wn(null),jn(e)},400),localStorage.setItem("chatMessages",JSON.stringify(e))}();break;case"not_customer":!function(){Fe("NOT_ACCOUNT_HOLDER"),localStorage.setItem("chatUserType","NOT_ACCOUNT_HOLDER");var e=r([{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:null,form:{type:"form",value:[{title:"Name",action:"full_name",placeholder:null,type:"text",required:!0},{title:"Email",action:"email",placeholder:null,type:"email",required:!0},{title:"Enter your Postcode",action:"address",placeholder:"Example: SW1 4EN",type:"zip",required:!0},{title:"What do you need help with today?",action:"category",placeholder:null,type:"select",required:!0,options:{SALES:"Sales",TECH_SUPPORT:"Tech Support",COMPLAINT:"Complaint"}},{title:"Submit",action:"submit_form",type:"button"}]},messageId:"3"},{senderType:"AGENT",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:"We're so happy to hear from you! So that we can provide the best possible support, please provide us with the following information.",form:null,messageId:"2"},{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"Client",fromId:"Client",message:"I am not the account holder",form:null,messageId:"1"}],Ln.slice(1),!0);Wn(r(r([],zn||[],!0),[e[0]],!1)),setTimeout(function(){Wn(null),jn(e)},400),localStorage.setItem("chatMessages",JSON.stringify(e))}();break;case"old_customer":!function(){Fe("ACCOUNT_HOLDER"),localStorage.setItem("chatUserType","ACCOUNT_HOLDER");var e=r([{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:null,form:{type:"form",value:[{title:"Name",action:"full_name",placeholder:null,type:"text",required:!0},{title:"Email",action:"email",placeholder:null,type:"email",required:!0},{title:"Enter your Postcode",action:"address",placeholder:"Example: SW1 4EN",type:"zip",required:!0},{title:"What was the total value of your last bill?",action:"last_bill",placeholder:"Total amount of your last bill",type:"number",required:!0},{title:"What do you need help with today?",action:"category",placeholder:null,type:"select",required:!0,options:{SALES:"Sales",TECH_SUPPORT:"Tech Support",INSTALLS_AND_SERVICE_VISITS:"Installs & Service Visits",MANAGE_MY_ACCOUNT:"Manage My Account",BILLING:"Billing",CANCELLATION:"Cancellation",COMPLAINT:"Complaint"}},{title:"Submit",action:"submit_form",type:"button"}]},messageId:"3"},{senderType:"AGENT",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:"We're so happy to hear from you! So that we can provide the best possible support, please provide us with the following information.",form:null,messageId:"2"},{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"Client",fromId:"Client",message:"I am the account holder",form:null,messageId:"1"}],Ln.slice(1),!0);Wn(r(r([],zn||[],!0),[e[0]],!1)),setTimeout(function(){Wn(null),jn(e)},400),localStorage.setItem("chatMessages",JSON.stringify(e))}();break;case"submit_form":Ne.full_name&&Ne.address&&"/"!==Ne.address&&Ne.email&&("ACCOUNT_HOLDER"===localStorage.getItem("chatUserType")&&void 0!==Ne.last_bill||"ACCOUNT_HOLDER"!==localStorage.getItem("chatUserType"))&&Ne.category&&je&&(R.current="<b>".concat(Dn[je],"</b><br /><b>Full name</b>: ").concat(Ne.full_name,"<br /><b>Email</b>: ").concat(Ne.email,"<br /><b>Address</b>: ").concat(Ne.address,"<br />").concat(void 0!==Ne.last_bill?"<b>What was the total value of your last bill</b>: "+Ne.last_bill+"<br />":"","<b>What do you need help with today</b>: ").concat(Un[Ne.category]),n(void 0,void 0,void 0,function(){var e;return o(this,function(n){switch(n.label){case 0:return n.trys.push([0,2,,3]),xe(!0),[4,y.get("SupportModule/v1.0/Case/outage/verify?contactEmailAddress=".concat(Ne.email)).then(function(e){var n,t,o;return xe(!1),200===(null===(n=null==e?void 0:e.data)||void 0===n?void 0:n.statusCode)&&(null===(t=null==e?void 0:e.data)||void 0===t?void 0:t.data)?(ee(!0),oe(null===(o=null==e?void 0:e.data)||void 0===o?void 0:o.message),!0):(ot(),!1)}).catch(function(e){console.log("Outage Message:",e)})];case 1:return n.sent(),[3,3];case 2:return e=n.sent(),console.log("Error fetching outage: ",e),[3,3];case 3:return[2]}})}))}else nt()},newMessages:zn,chatActive:un,API:y}))),_n&&Ce&&a.createElement(Q,null,a.createElement("small",null,"Agent is typing...")),ae&&!Ie&&!(null===(m=Ln[0])||void 0===m?void 0:m.form)&&a.createElement(Z,{className:"".concat(U?"form-fullscreen":"")},a.createElement(Y,null,a.createElement("input",{id:"inputMessage",className:"",autoComplete:"off",maxLength:500,onChange:function(e){return Me(e.target.value)},value:Oe,type:"text",placeholder:"Write a reply..."}),a.createElement("input",t({},it())),a.createElement("img",{className:"action",alt:"Add attachment",src:W.toString(),onClick:function(){return lt()}}),a.createElement("button",{type:"submit",onClick:function(e){return function(e){e.preventDefault(),tt()}(e)},disabled:be||!1},be?a.createElement("img",{src:z.toString(),width:16,height:16}):"Send"))),Object.keys(Pe).length>0&&a.createElement("div",{className:"files"},Pe.map(function(e){return a.createElement("div",{className:"file",key:e.name},a.createElement("div",{className:"fileName"},e.name),a.createElement("img",{className:"action",src:B.toString(),onClick:function(){return n=e.name,t=Pe.filter(function(e){return e.name!==n}),void Ye(t);var n,t}}))})),He&&pe&&Ce&&a.createElement("div",{className:"cover upload"},a.createElement("h4",null,"Drag and drop your files here"),a.createElement("p",null,"Maximum ",5," files. Limit ",10,"MB per file."),a.createElement("p",null,"Supported files: ",kn&&kn.map(function(e,n){return!["mp4","mp3"].some(function(n){return n===e})&&(0===n?e:", ".concat(e))}))),he&&Ce&&a.createElement("div",{className:"cover"},a.createElement("img",{className:"make-it-white",src:z.toString(),width:14,height:14})),Ie&&Ce&&a.createElement("div",{className:"cover closed"},a.createElement("h4",null,"Conversation is closed"),a.createElement("span",null,"This chat has now closed. If you need any help, feel free to start a new chat.",a.createElement("br",null),"We're always happy to assist you!"),a.createElement("button",{onClick:function(){Se(!1),nt()}},"Create new")),$&&te&&a.createElement("div",{className:"cover closed"},a.createElement("h4",null,"Outage in your area"),a.createElement("span",null,te),a.createElement("button",{onClick:function(){nt()},className:"blue-bg"},"Got It - Close Chat"),a.createElement("button",{onClick:function(){ee(!1),oe(null),ot()}},"Still Need Help - Start Chat")),nn&&Ce&&a.createElement("div",{className:"cover closed"},a.createElement("h4",null,"Close conversation"),a.createElement("span",null,"Are you sure you want to end this conversation?"),a.createElement("button",{onClick:function(){tn(!1)}},"Cancel"),a.createElement("button",{onClick:function(){tn(!1),function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];n(void 0,r([],e,!0),void 0,function(e){var n;return void 0===e&&(e="CUSTOMER"),o(this,function(t){switch(t.label){case 0:return t.trys.push([0,2,,3]),[4,y.post("ChatModule/v1.0/gateway/conversation/".concat(localStorage.getItem("conversationId"),"/close"),{closedBy:e})];case 1:return t.sent()?(nt(),[3,3]):(console.log("Can't close conversation!"),[2,null]);case 2:return n=t.sent(),console.log("Error closing conversation:",n),[3,3];case 3:return[2]}})})}("CUSTOMER"),nt()},className:"blue-bg"},"Confirm")),!un&&Ce&&!pe&&gn&&!b()&&a.createElement("div",{className:"cover closed"},a.createElement("h4",null,"Out of service"),a.createElement("span",{dangerouslySetInnerHTML:{__html:g(gn.chat_off_mode_text,{target:"_blank"}).replaceAll(/\r\n|\n/g,"<br />")}}),!U&&a.createElement("button",{onClick:function(){return ke(!1)}},"Close chat"))),a.createElement(H,{onClick:function(){return Ie&&(nt(),Se(!1)),ee(!$),void ke(!Ce)},className:"YFChat ".concat(Ce?"open":""," ").concat(U?"fullscreen":"")},a.createElement("img",{src:j.toString(),className:"icon-default"}),a.createElement("img",{src:F.toString(),className:"icon-hover"}),cn&&a.createElement("small",{className:"unread"},"1"))))};export{X as default};
+import{__makeTemplateObject as e,__awaiter as n,__assign as t,__generator as o,__spreadArray as r}from"../../node_modules/tslib/tslib.es6.js";import a,{useContext as i,useRef as l,useState as c,useEffect as s}from"react";import{io as d}from"../../node_modules/socket.io-client/build/esm/index.js";import u from"../../_virtual/browser.js";import m from"../../node_modules/styled-components/dist/styled-components.browser.esm.js";import p from"../context/GlobalContext.js";import g from"../../node_modules/linkify-html/dist/linkify-html.js";import f from"./Chat.js";import h from"../../_virtual/moment.js";import{toastrMsg as x}from"../utils/alert.js";import v from"../NotificationBar/index.js";import{isStagingOrDevelopment as b}from"../utils/helperFn.js";import{d as w}from"../../_virtual/index.js";import y,{setConfig as I}from"../api/api.js";import S from"axios";import{useDropzone as E}from"../../node_modules/react-dropzone/dist/es/index.js";import"../assets/styles/fonts.css.js";import"../assets/styles/app.scss.js";import C from"../../node_modules/uuid/dist/esm-browser/v4.js";import k from"../../node_modules/react-bootstrap/esm/Row.js";var N,T,_,A,O,M,U,D,R,L=new URL("./assets/images/svg/favicon.svg",import.meta.url),j=new URL("./assets/images/svg/chat.svg",import.meta.url),F=new URL("./assets/images/png/ico-close.png",import.meta.url),z=new URL("./assets/images/gif/loader-transparent.gif",import.meta.url),W=new URL("./assets/images/svg/youfibre-upload.svg",import.meta.url),B=new URL("./assets/images/svg/close.svg",import.meta.url),G=new URL("./assets/audio/notification.wav",import.meta.url),P=m.div(N||(N=e(["\n  width: 100%;\n  max-width: 700px;\n  height: 100%;\n  position: relative;\n  margin: 0px auto;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  \n  &.direction-column-reverse { flex-direction: column-reverse; }\n  &.content-end { justify-content: end; }\n\n"],["\n  width: 100%;\n  max-width: 700px;\n  height: 100%;\n  position: relative;\n  margin: 0px auto;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  \n  &.direction-column-reverse { flex-direction: column-reverse; }\n  &.content-end { justify-content: end; }\n\n"]))),Y=m(P)(T||(T=e(["\n  overflow-y: auto;\n"],["\n  overflow-y: auto;\n"]))),V=m.div(_||(_=e(["\n  position: fixed;\n  bottom: 40px;\n  right: 40px;\n  z-index: 100;\n  display: flex;\n  flex-direction: column;\n  align-items: end;\n  gap: 15px;\n"],["\n  position: fixed;\n  bottom: 40px;\n  right: 40px;\n  z-index: 100;\n  display: flex;\n  flex-direction: column;\n  align-items: end;\n  gap: 15px;\n"]))),H=m.div(A||(A=e(["\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: #08DE9E;\n  width: 50px;\n  height: 50px;\n  border-radius: 100px;\n  cursor: pointer;\n  -webkit-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  -moz-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  -webkit-user-select: none;\n  user-select: none;  \n  img {\n    position: absolute;\n    -moz-transition: all 0.3s ease;\n    transition: all 0.3s ease;\n\t\t&.icon-hover {\n      width: 15px;\n      height: 15px;\n\t\t\ttransform: rotate(180deg) scale(.5);\n\t\t\topacity: 0;\n\t\t}\n\t\t&.icon-default {\n      width: 20px;\n      height: 20px;\n\t\t\ttransform: rotate(0deg) scale(1);\n\t\t\topacity: 1;\n\t\t}\n  }\n  &:hover {\n    -webkit-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n    -moz-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n    box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  }\n  &.open {\n\t\t.icon-hover {\n\t\t\ttransform: rotate(0deg) scale(1);\n\t\t\topacity: 1;\n\t\t}\n\t\t.icon-default {\n\t\t\ttransform: rotate(180deg) scale(.5);\n\t\t\topacity: 0;\n\t\t}\n  }\n  &.fullscreen {\n    display: none;\n  }\n\n  .unread {\n    background-color: red;\n    padding: 3px;\n    display: flex;\n    width: 20px;\n    height: 20px;\n    aspect-ratio: 1 / 1;\n    border-radius: 200px;\n    color: #ffffff;\n    position: absolute;\n    top: -4px;\n    right: -2px;\n    font-size: 11px !important;\n    line-height: 0.5rem !important;\n    flex-direction: row;\n    align-content: center;\n    justify-content: center;\n    align-items: center;\n    -webkit-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    -moz-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    animation: pulseAnimation 1.5s infinite;\n    @keyframes pulseAnimation {\n      0% {\n        transform: scale(1);\n      }\n      50% {\n        transform: scale(1.1);\n      }\n      100% {\n        transform: scale(1);\n      }\n    }\n  }\n"],["\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: #08DE9E;\n  width: 50px;\n  height: 50px;\n  border-radius: 100px;\n  cursor: pointer;\n  -webkit-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  -moz-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n  -webkit-user-select: none;\n  user-select: none;  \n  img {\n    position: absolute;\n    -moz-transition: all 0.3s ease;\n    transition: all 0.3s ease;\n\t\t&.icon-hover {\n      width: 15px;\n      height: 15px;\n\t\t\ttransform: rotate(180deg) scale(.5);\n\t\t\topacity: 0;\n\t\t}\n\t\t&.icon-default {\n      width: 20px;\n      height: 20px;\n\t\t\ttransform: rotate(0deg) scale(1);\n\t\t\topacity: 1;\n\t\t}\n  }\n  &:hover {\n    -webkit-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n    -moz-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n    box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  }\n  &.open {\n\t\t.icon-hover {\n\t\t\ttransform: rotate(0deg) scale(1);\n\t\t\topacity: 1;\n\t\t}\n\t\t.icon-default {\n\t\t\ttransform: rotate(180deg) scale(.5);\n\t\t\topacity: 0;\n\t\t}\n  }\n  &.fullscreen {\n    display: none;\n  }\n\n  .unread {\n    background-color: red;\n    padding: 3px;\n    display: flex;\n    width: 20px;\n    height: 20px;\n    aspect-ratio: 1 / 1;\n    border-radius: 200px;\n    color: #ffffff;\n    position: absolute;\n    top: -4px;\n    right: -2px;\n    font-size: 11px !important;\n    line-height: 0.5rem !important;\n    flex-direction: row;\n    align-content: center;\n    justify-content: center;\n    align-items: center;\n    -webkit-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    -moz-box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    box-shadow: 2px 1px 8px 0px rgba(0, 0, 0, 0.27);\n    animation: pulseAnimation 1.5s infinite;\n    @keyframes pulseAnimation {\n      0% {\n        transform: scale(1);\n      }\n      50% {\n        transform: scale(1.1);\n      }\n      100% {\n        transform: scale(1);\n      }\n    }\n  }\n"]))),q=m.div(O||(O=e(["\n  display: flex;\n  flex-direction: column;\n  background-color: #ffffff;\n  width: 350px;\n  height: 550px;\n  border-radius: 5px;\n  -webkit-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  -moz-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  max-width: 0px;\n  max-height: 0px;\n  overflow: hidden;\n  transition: max-height 0.5s ease-in-out;\n  &.show {\n    max-width: 350px;\n    max-height: 540px;\n  }\n  .cover {\n    background: rgba(255, 255, 255, 0.2);\n    position: absolute;\n    z-index: 92;\n    padding: 14px;\n    width: calc(100% - 28px);\n    height: calc(100% - 93px);\n    border-radius: 5px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    -webkit-user-select: none;\n    user-select: none;\n    text-align: center;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    &.closed {\n      background: rgba(255, 255, 255, 0.9);\n      button { margin-top: 2rem; }\n    }\n    &.upload {\n      background: rgba(9, 222, 158, 0.9);\n      button { margin-top: 2rem; }\n    }\n    animation: showCover .4s cubic-bezier(0.41, 0.39, 0.53, 1.38) forwards;\n      \n    @keyframes showCover {\n      from {\n        opacity: 0;\n      }\n      to {\n        opacity: 1;\n      }\n    }\n  }\n  .files {\n    margin: 0.5rem;\n    border-radius: 5px;\n    background-color: #c1f7e7;\n    padding: 0rem;\n    overlay: none;\n    display: flex;  \n    flex-direction: column;\n    justify-content: center;\n    gap: 0rem;\n    .file {\n      display: flex;\n      flex-direction: row;\n      border-radius: 3px;\n      justify-content: space-between;\n      align-items: center;\n      margin: 0.2rem;\n      padding: 0.2rem 0.5rem;\n      gap: 14px;\n      &:hover {\n        background-color: #ffffff;\n      }\n      .fileName {\n        font-size: 11px !important;\n        line-height: 12px;\n        word-break: keep-all;\n        display: block;\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n      .action {\n        width: 12px;\n        height: 12px;\n        opacity: 0.7;\n        cursor: pointer;\n        &:hover {\n          opacity: 1;\n        }\n      }\n\n    }\n  }\n  &.fullscreen {\n    max-width: 100% !important;\n    max-height: 100% !important;\n    position: fixed;\n    left: 0px;\n    top: 0px;\n    width: 100%;\n    height: 100%;\n    border-radius: 0px;\n    // @media (max-width: 768px) {\n    //   #listOfMessages {\n    //     max-height: calc(100vh - 210px);\n    //   }\n    //   .chat-content-container {\n    //     padding-bottom: 4rem;\n    //   }\n    // }\n    .cover {\n        &.closed {\n            height: 100%;\n        }\n    }\n  }\n  @media (max-width: 576px) {\n    position: fixed;\n    z-index: 100;\n    bottom: 0px;\n    right: 0px;\n    width: 100%;\n    height: 100%;\n    border-radius: 0px;\n    &.show {\n      max-width: 100%;\n      max-height: 100%;\n    }\n    .cover {\n      &.closed, &.upload {\n        height: 100%;\n      }\n    }\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n  background-color: #ffffff;\n  width: 350px;\n  height: 550px;\n  border-radius: 5px;\n  -webkit-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  -moz-box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  box-shadow: 2px 1px 12px 0px rgba(0, 0, 0, 0.35);\n  max-width: 0px;\n  max-height: 0px;\n  overflow: hidden;\n  transition: max-height 0.5s ease-in-out;\n  &.show {\n    max-width: 350px;\n    max-height: 540px;\n  }\n  .cover {\n    background: rgba(255, 255, 255, 0.2);\n    position: absolute;\n    z-index: 92;\n    padding: 14px;\n    width: calc(100% - 28px);\n    height: calc(100% - 93px);\n    border-radius: 5px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    -webkit-user-select: none;\n    user-select: none;\n    text-align: center;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    &.closed {\n      background: rgba(255, 255, 255, 0.9);\n      button { margin-top: 2rem; }\n    }\n    &.upload {\n      background: rgba(9, 222, 158, 0.9);\n      button { margin-top: 2rem; }\n    }\n    animation: showCover .4s cubic-bezier(0.41, 0.39, 0.53, 1.38) forwards;\n      \n    @keyframes showCover {\n      from {\n        opacity: 0;\n      }\n      to {\n        opacity: 1;\n      }\n    }\n  }\n  .files {\n    margin: 0.5rem;\n    border-radius: 5px;\n    background-color: #c1f7e7;\n    padding: 0rem;\n    overlay: none;\n    display: flex;  \n    flex-direction: column;\n    justify-content: center;\n    gap: 0rem;\n    .file {\n      display: flex;\n      flex-direction: row;\n      border-radius: 3px;\n      justify-content: space-between;\n      align-items: center;\n      margin: 0.2rem;\n      padding: 0.2rem 0.5rem;\n      gap: 14px;\n      &:hover {\n        background-color: #ffffff;\n      }\n      .fileName {\n        font-size: 11px !important;\n        line-height: 12px;\n        word-break: keep-all;\n        display: block;\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n      .action {\n        width: 12px;\n        height: 12px;\n        opacity: 0.7;\n        cursor: pointer;\n        &:hover {\n          opacity: 1;\n        }\n      }\n\n    }\n  }\n  &.fullscreen {\n    max-width: 100% !important;\n    max-height: 100% !important;\n    position: fixed;\n    left: 0px;\n    top: 0px;\n    width: 100%;\n    height: 100%;\n    border-radius: 0px;\n    // @media (max-width: 768px) {\n    //   #listOfMessages {\n    //     max-height: calc(100vh - 210px);\n    //   }\n    //   .chat-content-container {\n    //     padding-bottom: 4rem;\n    //   }\n    // }\n    .cover {\n        &.closed {\n            height: 100%;\n        }\n    }\n  }\n  @media (max-width: 576px) {\n    position: fixed;\n    z-index: 100;\n    bottom: 0px;\n    right: 0px;\n    width: 100%;\n    height: 100%;\n    border-radius: 0px;\n    &.show {\n      max-width: 100%;\n      max-height: 100%;\n    }\n    .cover {\n      &.closed, &.upload {\n        height: 100%;\n      }\n    }\n  }\n"]))),J=m.div(M||(M=e(["\n  background-color: #08DE9E;\n  width: calc(100% - 30px);\n  padding: 15px;\n  color: #ffffff;\n  flex: 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 15px;\n  -webkit-box-shadow: -2px 2px 5px 1px rgba(0,0,0,0.2);\n  box-shadow: -2px 2px 5px 1px rgba(0,0,0,0.2);\n  z-index: 91;\n  img {\n    width: 30px;\n    height: 30px;\n    -object-fit: fill;\n    object-fit: fill;\n    padding: 7px;\n    border-radius: 200px;\n    cursor: pointer;\n    background-color: #FFFFFF;\n    &.close {\n      display: none;\n      background-color: transparent;\n    }\n  }\n  button {\n    font-size: 0.9rem;\n  }\n  a {\n    &:hover {\n      text-decoration: none !important;\n      cursor: pointer;\n    }\n  }\n  span {\n    padding: 0px;\n  }\n  @media (max-width: 576px) {\n    img {\n      &.close {\n        display: block;\n      }\n    }\n  }\n"],["\n  background-color: #08DE9E;\n  width: calc(100% - 30px);\n  padding: 15px;\n  color: #ffffff;\n  flex: 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 15px;\n  -webkit-box-shadow: -2px 2px 5px 1px rgba(0,0,0,0.2);\n  box-shadow: -2px 2px 5px 1px rgba(0,0,0,0.2);\n  z-index: 91;\n  img {\n    width: 30px;\n    height: 30px;\n    -object-fit: fill;\n    object-fit: fill;\n    padding: 7px;\n    border-radius: 200px;\n    cursor: pointer;\n    background-color: #FFFFFF;\n    &.close {\n      display: none;\n      background-color: transparent;\n    }\n  }\n  button {\n    font-size: 0.9rem;\n  }\n  a {\n    &:hover {\n      text-decoration: none !important;\n      cursor: pointer;\n    }\n  }\n  span {\n    padding: 0px;\n  }\n  @media (max-width: 576px) {\n    img {\n      &.close {\n        display: block;\n      }\n    }\n  }\n"]))),K=m.div(U||(U=e(["\n  width: 100%;\n  padding: 0;\n  color: #000000;\n  flex: 1;\n  display: flex;\n  flex-direction: column-reverse;\n  overflow-x: hidden;\n  .chat-content-container {\n    padding-bottom: 1.8rem;\n  }\n  button {\n    display: block;\n    background-color: #c1f7e7;\n    flex: 0;\n    padding: 5px;\n    border-radius: 5px;\n    color: #263238;\n    font-weight: 100;\n    font-size: 1rem;\n    line-height: 18px;\n    font-weight: 100;\n    min-width: 40%;\n    border: 2px solid #08DE9E;\n    cursor: pointer;\n    &:hover {\n      background-color: #08DE9E;\n    }\n  }\n  @media (max-width: 768px) {\n    overflow-y: hidden;\n    .chat-content-container {\n      overflow-y: auto;\n      // padding-bottom: 0;\n    }\n  }\n"],["\n  width: 100%;\n  padding: 0;\n  color: #000000;\n  flex: 1;\n  display: flex;\n  flex-direction: column-reverse;\n  overflow-x: hidden;\n  .chat-content-container {\n    padding-bottom: 1.8rem;\n  }\n  button {\n    display: block;\n    background-color: #c1f7e7;\n    flex: 0;\n    padding: 5px;\n    border-radius: 5px;\n    color: #263238;\n    font-weight: 100;\n    font-size: 1rem;\n    line-height: 18px;\n    font-weight: 100;\n    min-width: 40%;\n    border: 2px solid #08DE9E;\n    cursor: pointer;\n    &:hover {\n      background-color: #08DE9E;\n    }\n  }\n  @media (max-width: 768px) {\n    overflow-y: hidden;\n    .chat-content-container {\n      overflow-y: auto;\n      // padding-bottom: 0;\n    }\n  }\n"]))),Z=m.form(D||(D=e(["\n  background-color: #f4f7f9;\n  width: calc(100% - 10px);\n  flex: 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 10px;\n  padding: 5px;\n  .action {\n    width: 1.3rem;\n    height: 1.3rem;\n    cursor: pointer;\n    opacity: 0.7;\n    -webkit-user-select: none;\n    user-select: none;\n    &:hover {\n      opacity: 0.7;\n    }\n  }\n  input {\n    background-color: rgba(0,0,0,0);\n    border: none;\n    border-bottom: 1px solid rgba(0,0,0,0);\n    outline: 0px;\n    padding: 0px;\n    margin-left: 15px;\n    font-size: 0.9rem;\n    font-weight: 100;\n    flex: 1;\n    &.invalid {\n      border-bottom: 1px solid red;\n    }\n  }\n  button {\n    min-width: 90px;\n    background-color: #09de9e;\n    flex: 0;\n    font-size: 0.9rem;\n    &:hover {\n      background-color: #08c98f;\n    }\n    &:disabled, &:disabled:hover {\n      background-color: rgba(0,0,0,0.05);\n      color: #aabbcc !important;\n    }\n  }\n"],["\n  background-color: #f4f7f9;\n  width: calc(100% - 10px);\n  flex: 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 10px;\n  padding: 5px;\n  .action {\n    width: 1.3rem;\n    height: 1.3rem;\n    cursor: pointer;\n    opacity: 0.7;\n    -webkit-user-select: none;\n    user-select: none;\n    &:hover {\n      opacity: 0.7;\n    }\n  }\n  input {\n    background-color: rgba(0,0,0,0);\n    border: none;\n    border-bottom: 1px solid rgba(0,0,0,0);\n    outline: 0px;\n    padding: 0px;\n    margin-left: 15px;\n    font-size: 0.9rem;\n    font-weight: 100;\n    flex: 1;\n    &.invalid {\n      border-bottom: 1px solid red;\n    }\n  }\n  button {\n    min-width: 90px;\n    background-color: #09de9e;\n    flex: 0;\n    font-size: 0.9rem;\n    &:hover {\n      background-color: #08c98f;\n    }\n    &:disabled, &:disabled:hover {\n      background-color: rgba(0,0,0,0.05);\n      color: #aabbcc !important;\n    }\n  }\n"]))),Q=m.div(R||(R=e(["\n  width: 100%;\n  display: flex;\n  flex-direction: row-reverse;\n  small {\n    position: absolute;\n    margin-top: -1.6rem;\n    margin-right: 14px;\n    font-size: 11px !important;\n    font-weight: 100;\n    line-height: 12px;\n    color: #015e9c;\n    background-color: #ddf0fc;\n    border: 1px solid #ffffff;\n    border-radius: 100px;\n    padding: 5px 15px;\n    z-index: 50;\n  }\n"],["\n  width: 100%;\n  display: flex;\n  flex-direction: row-reverse;\n  small {\n    position: absolute;\n    margin-top: -1.6rem;\n    margin-right: 14px;\n    font-size: 11px !important;\n    font-weight: 100;\n    line-height: 12px;\n    color: #015e9c;\n    background-color: #ddf0fc;\n    border: 1px solid #ffffff;\n    border-radius: 100px;\n    padding: 5px 15px;\n    z-index: 50;\n  }\n"]))),X=function(e){var m,N=e.host,T=e.clientId,_=e.clientSecret,A=e.customToken,O=e.websocketUrl;e.postcodeSchemaId,e.source;var M=e.fullscreen,U=void 0!==M&&M,D=i(p),R=l(null),X=c(!1),$=X[0],ee=X[1],ne=c(null),te=ne[0],oe=ne[1],re=c(!1),ae=re[0],ie=re[1],le=c(null);le[0];var ce=le[1],se=c(null),de=se[0],ue=se[1],me=c(null),pe=me[0],ge=me[1],fe=c(!1),he=fe[0],xe=fe[1],ve=c(!1),be=ve[0],we=ve[1],ye=c(!1),Ie=ye[0],Se=ye[1],Ee=c(U),Ce=Ee[0],ke=Ee[1],Ne=c({}),Te=Ne[0],_e=Ne[1],Ae=c(""),Oe=Ae[0],Me=Ae[1],Ue=c(null),De=Ue[0],Re=Ue[1],Le=c(null),je=Le[0],Fe=Le[1],ze=c(null),We=ze[0],Be=ze[1],Ge=c([]),Pe=Ge[0],Ye=Ge[1],Ve=c(!1),He=Ve[0],qe=Ve[1],Je=c(!1),Ke=Je[0],Ze=Je[1],Qe=c(null),Xe=Qe[0],$e=Qe[1],en=c(!1),nn=en[0],tn=en[1],on=c(null),rn=on[0],an=on[1],ln=c(!1),cn=ln[0],sn=ln[1],dn=c(!0),un=dn[0],mn=dn[1],pn=c(null),gn=pn[0],fn=pn[1],hn=c(!1),xn=hn[0],vn=hn[1],bn=c(-1),wn=bn[0],yn=bn[1],In=l("");l(0);var Sn=l(null),En=l(Ce),Cn=l(!0),kn=["jpg","jpeg","png","pdf","gif","txt","mp4","mp3"],Nn=w.useTime({interval:1}).seconds,Tn=c(!1),_n=Tn[0],An=Tn[1],On=l(null),Mn=[{createdAt:h(new Date).format(),message:null,fromId:"Client",senderType:"CUSTOMER",form:{type:"buttons",value:[{title:"I am the account holder",action:"old_customer"},{title:"I am not the account holder",action:"not_customer"},{title:"I am new here",action:"new_customer"}]},messageId:"1"},{senderType:"AGENT",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:"Welcome to YouFibre!<br />We're going to ask you some questions to ensure we get you through to the right team, so please bear with us!<br />Are you the account holder?",form:null,messageId:"0"}],Un={SALES:"Sales",TECH_SUPPORT:"Tech Support",INSTALLS_AND_SERVICE_VISITS:"Installs & Service Visits",MANAGE_MY_ACCOUNT:"Manage My Account",BILLING:"Billing",CANCELLATION:"Cancellation",COMPLAINT:"Complaint"},Dn={NEW_CUSTOMER:"New customer",ACCOUNT_HOLDER:"Account holder",NOT_ACCOUNT_HOLDER:"Not the account holder"},Rn=c(Mn),Ln=Rn[0],jn=Rn[1],Fn=c(null),zn=Fn[0],Wn=Fn[1],Bn=l(Ln),Gn=l(null),Pn=l(null),Yn=function(){try{Gn.current&&Gn.current.scrollIntoView({behavior:"smooth"})}catch(e){}};s(function(){if("undefined"!=typeof document&&"undefined"!=typeof window){if(xn&&-1!==wn){localStorage.getItem("title")||localStorage.setItem("title","undefined"!=typeof document&&document.getElementsByTagName("title")[0].textContent||"");return Sn.current=window.setInterval(function(){var e=In.current;if(e){var n=(wn+1)%e.length;document.title=e.slice(n)+" "+e.slice(0,n),yn(n)}},200),function(){Sn.current&&clearInterval(Sn.current)}}Sn.current=null,In.current=""}},[wn]),s(function(){I(N,T,_,A),S.get("https://strapi.youfibre.com/api/information").then(function(e){D.setAppMessages(e.data)}).catch(function(e){D.setAppMessages(null)}),Jn();var e="undefined"!=typeof window?window.location.href:"",n=new MutationObserver(function(){"undefined"!=typeof window&&e!==window.location.href&&(e=window.location.href,Jn())});return"undefined"!=typeof document&&n.observe(document.body,{childList:!0,subtree:!0}),function(){return n.disconnect()}},[]),s(function(){fn(D.appMessages),mn(!qn())},[D.appMessages]),s(function(){mn(!qn())},[Nn]),s(function(){!un&&!pe&&nt()},[un]);var Vn=(new Date).toLocaleString("en-GB",{timeZone:"Europe/London",hour:"2-digit",minute:"2-digit",second:"2-digit",hour12:!1}),Hn=function(e){if(e){var n=e.split(":").map(Number);return 3600*n[0]+60*n[1]+n[2]}},qn=function(){var e,n,t,o,r;if((null===(e=D.appMessages)||void 0===e?void 0:e.chat_off_mode_toggle)&&Vn&&(null===(n=D.appMessages)||void 0===n?void 0:n.chat_off_mode_start)&&(null===(t=D.appMessages)||void 0===t?void 0:t.chat_off_mode_end)){var a=Hn(Vn),i=Hn(null===(o=D.appMessages)||void 0===o?void 0:o.chat_off_mode_start),l=Hn(null===(r=D.appMessages)||void 0===r?void 0:r.chat_off_mode_end);return i<l?a>=i&&a<l:a>=i||a<l}return!1},Jn=function(){"undefined"!=typeof window&&an(new URLSearchParams(window.location.search))};s(function(){if(""===(null==rn?void 0:rn.get("youFibreChat"))){n(void 0,void 0,void 0,function(){return o(this,function(e){switch(e.label){case 0:return[4,new Promise(function(e){var n;localStorage.setItem("chatUsername",rn.get("chatUsername")),localStorage.setItem("chatUserId",rn.get("chatUserId")),localStorage.setItem("chatSessionId",rn.get("chatSessionId")),localStorage.setItem("conversationId",rn.get("conversationId")),localStorage.setItem("caseId",rn.get("caseId")),localStorage.setItem("participantId",rn.get("participantId")),Re(rn.get("participantId")),D.goSetRegistrationData(t(t({},D.goGetRegistrationData()),{twilioChat:t(t({},(null===(n=D.goGetRegistrationData())||void 0===n?void 0:n.twilioChat)||null),{chatUsername:rn.get("chatUsername")||null,chatSessionId:rn.get("chatSessionId")||null,chatUserId:rn.get("chatUserId")||null,conversationId:rn.get("conversationId")||null,caseId:rn.get("caseId")||null,participantId:rn.get("participantId")||null})})),e()})];case 1:return e.sent(),Kn(),[2]}})})}else rn&&0===Object.keys(rn).length&&Kn()},[rn]);var Kn=function(){n(void 0,void 0,void 0,function(){var e,n,r,a,i;return o(this,function(o){switch(o.label){case 0:if(!localStorage.getItem("conversationId"))return[3,4];o.label=1;case 1:return o.trys.push([1,3,,4]),[4,y.get("ChatModule/v1.0/gateway/conversation/".concat(localStorage.getItem("conversationId")))];case 2:return(e=o.sent())?("CLOSED"===(null===(a=null===(r=null==e?void 0:e.data)||void 0===r?void 0:r.properties)||void 0===a?void 0:a.Status)?nt():D.goSetRegistrationData(t(t({},D.goGetRegistrationData()),{twilioChat:t(t({},(null===(i=D.goGetRegistrationData())||void 0===i?void 0:i.twilioChat)||null),{chatUsername:localStorage.getItem("chatUsername")||null,chatSessionId:localStorage.getItem("chatSessionId")||null,chatUserId:localStorage.getItem("participantId")||null,conversationId:localStorage.getItem("conversationId")||null,caseId:localStorage.getItem("caseId")||null,participantId:localStorage.getItem("participantId")||null})})),xe(!1),[3,4]):(console.log("Can't check conversation!"),[2,null]);case 3:return n=o.sent(),console.log("Error fetching conversation status: ",n),[3,4];case 4:return[2]}})}),localStorage.removeItem("title"),ue(localStorage.getItem("conversationId")||null),ge(localStorage.getItem("caseId")||null),Re(localStorage.getItem("participantId")||null),On.current=localStorage.getItem("agentId")||null,$e(localStorage.getItem("chatSessionId")||null),localStorage.getItem("conversationId")&&localStorage.getItem("participantId")&&ie(!0),localStorage.getItem("chatUsername")&&Be(localStorage.getItem("chatUsername")),localStorage.getItem("chatUserType")&&Fe(localStorage.getItem("chatUserType")||"NEW_CUSTOMER"),_e({full_name:localStorage.getItem("chatUsername"),email:localStorage.getItem("chatEmail"),category:localStorage.getItem("chatCategory"),address:localStorage.getItem("chatAddress"),last_bill:localStorage.getItem("chatLastBill")}),localStorage.getItem("chatMessages")?jn(JSON.parse(localStorage.getItem("chatMessages")||"")):localStorage.setItem("chatMessages",JSON.stringify(Ln)),localStorage.getItem("conversationId")&&Zn(localStorage.getItem("conversationId")),document.addEventListener("visibilitychange",function(){var e;"visible"===document.visibilityState?(Cn.current=!0,"undefined"!=typeof document&&En.current&&localStorage.getItem("title")&&(vn(!1),yn(-1),sn(!1),document.title=localStorage.getItem("title")||"",null===(e=document.getElementById("inputMessage"))||void 0===e||e.focus(),setTimeout(function(){return localStorage.removeItem("title")},1e3)),localStorage.getItem("conversationId")&&Zn(localStorage.getItem("conversationId"))):Cn.current=!1})},Zn=function(e,t){return n(void 0,void 0,void 0,function(){var t,r,a,i;return o(this,function(l){switch(l.label){case 0:return l.trys.push([0,6,,7]),e?[4,y.get("NotificationModule/v2.0/records/Conversation/".concat(e,'/links?targetEntities=["Message"]'))]:[3,4];case 1:return(t=l.sent())?[4,Promise.all(null===(i=null==t?void 0:t.Message)||void 0===i?void 0:i.dbRecords.map(function(e){return n(void 0,void 0,void 0,function(){var n,t,r,a,i;return o(this,function(o){switch(o.label){case 0:return n={createdAt:null==e?void 0:e.createdAt,from:null===(t=null==e?void 0:e.properties)||void 0===t?void 0:t.From},[4,Xn(null===(r=null==e?void 0:e.properties)||void 0===r?void 0:r.Files)];case 1:return[2,(n.files=o.sent(),n.message=null===(a=null==e?void 0:e.properties)||void 0===a?void 0:a.Body,n.form=null,n.messageId=null==e?void 0:e.id,n.fromId=null===(i=null==e?void 0:e.createdBy)||void 0===i?void 0:i.id,n.senderType="EVENT"===e.type?"EVENT":e.properties.SenderType,n)]}})})}))]:[3,3];case 2:r=l.sent(),!En.current&&Object.keys(r).length>0&&sn(!0),r=r.sort(function(e,n){return new Date(n.createdAt).getTime()-new Date(e.createdAt).getTime()}),jn(r),localStorage.setItem("allMessages",JSON.stringify(r)),l.label=3;case 3:return[3,5];case 4:jn(Mn),l.label=5;case 5:return[3,7];case 6:return a=l.sent(),console.log("Error fetching messages:",a),[3,7];case 7:return[2]}})})};s(function(){"undefined"!=typeof document&&(U?(document.body.style.overflow="hidden",document.documentElement.style.overflow="hidden"):(document.body.style.overflow="",document.documentElement.style.overflow=""))},[U]);var Qn;s(function(){var e,n,t,o;if(De){var r=Xe||C();$e(r),localStorage.setItem("chatSessionId",r),Pn.current||(Pn.current=(void 0===(o=r)&&(o=null),d("".concat(O,"/ChatWebsocketModule/TwilioChatWebsocket/v1.0"),{path:"/ws",query:{clientId:o},reconnection:!0,reconnectionAttempts:1/0,reconnectionDelay:1e3,reconnectionDelayMax:5e3,timeout:1e4}))),null===(e=Pn.current)||void 0===e||e.on("connect",function(){console.log("Connected to WebSocket server")}),null===(n=Pn.current)||void 0===n||n.on("connect_error",function(e){console.log("Connect error due to ".concat(e.message)),Pn.current=null}),null===(t=Pn.current)||void 0===t||t.on("disconnect",function(e){console.log("Disconnected: ".concat(e)),Pn.current=null})}},[De]),s(function(){n(void 0,void 0,void 0,function(){var e,t;return o(this,function(r){return Pn.current&&pe&&(Pn.current.emit("joinRoom",pe),!Pn.current.listeners("case-event-".concat(pe)).length&&(null===(e=Pn.current)||void 0===e||e.on("case-event-".concat(pe),function(e){if(e.caseId===localStorage.getItem("caseId"))switch(e.type){case"CASE_UPDATED":On.current=e.data.properties.OwnerId,localStorage.setItem("agentId",On.current||"");break;case"CONVERSATION_CLOSED":Se(!0);break;case"MESSAGE_CREATED":$n(e.data)}})),!Pn.current.listeners("web-chat-input-".concat(pe)).length&&(null===(t=Pn.current)||void 0===t||t.on("web-chat-input-".concat(pe),function(e){return n(void 0,void 0,void 0,function(){return o(this,function(n){return e.caseId===pe&&"AGENT"===e.sender&&An(!0),[2]})})}))),[2]})})},[pe]),s(function(){n(void 0,void 0,void 0,function(){return o(this,function(e){try{Qn=!!_n&&setTimeout(function(){An(!1),clearTimeout(Qn)},1500)}catch(e){console.log("Error fetching data:",e)}return[2]})})},[_n]),s(function(){Bn.current=Ln},[Ln]),s(function(){n(void 0,void 0,void 0,function(){var e;return o(this,function(n){try{Ln.length&&pe&&Pn.current&&(null===(e=Pn.current)||void 0===e||e.emit("web-chat-input",{caseId:pe,conversationId:de,message:Oe,sender:"CUSTOMER"}))}catch(e){console.log("Error fetching data:",e)}return[2]})})},[Oe]);var Xn=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return n(void 0,r([],e,!0),void 0,function(e){var n,t,a;return void 0===e&&(e=null),o(this,function(o){switch(o.label){case 0:return o.trys.push([0,4,,5]),n=[],e?[4,y.get("SchemaModule/v1.0/db/File/many?ids=".concat(e))]:[3,2];case 1:return(t=o.sent())?(Object.keys(t).length&&t.map(function(e){var t,o;n=r(r([],n,!0),[{id:(null==e?void 0:e.id)||"",type:(null===(t=null==e?void 0:e.properties)||void 0===t?void 0:t.Mimetype)||"",url:(null===(o=null==e?void 0:e.properties)||void 0===o?void 0:o.Url)||""}],!1)}),[2,0!==Object.keys(n).length?n:[]]):(console.log("Can't close conversation!"),[3,3]);case 2:return[2,[]];case 3:return[3,5];case 4:return a=o.sent(),console.log("Error fetching files:",a),[2,[]];case 5:return[2]}})})},$n=function(e){return n(void 0,void 0,void 0,function(){var n,t,r,a,i;return o(this,function(o){switch(o.label){case 0:if(!e||Bn.current.some(function(n){return n.messageId===e.id}))return[3,6];o.label=1;case 1:return o.trys.push([1,5,,6]),"CLOSED"===(null===(i=null===(a=null===(r=null==e?void 0:e.Conversation)||void 0===r?void 0:r.dbRecords[0])||void 0===a?void 0:a.properties)||void 0===i?void 0:i.Status)&&Se(!0),n=[],e.properties.Files?[4,Xn(e.properties.Files)]:[3,3];case 2:return n=o.sent(),0===Object.keys(n).length&&(n=null),et(e,n),[3,4];case 3:et(e,n),o.label=4;case 4:return[3,6];case 5:return t=o.sent(),console.log("Error fetching message:",t),[3,6];case 6:return[2]}})})},et=function(e,n){var t={senderType:"EVENT"!==e.type?e.properties.SenderType:e.type,createdAt:h(new Date).format(),from:"EVENT"!==e.type?e.properties.From:e.type,message:"EVENT"!==e.type?e.properties.Body:e.title,form:null,files:n,messageId:e.id,fromId:"EVENT"!==e.type?e.createdBy.id:"YouFibre"};En.current&&Cn.current||sn(!0),Wn(r(r([],zn||[],!0),[t],!1)),setTimeout(function(){Wn(null),jn(r([t],Bn.current,!0)),localStorage.setItem("chatMessages",JSON.stringify(r([t],Bn.current,!0))),xe(!1),Yn()},400)};s(function(){if("undefined"!=typeof document)if(localStorage.getItem("title")||localStorage.setItem("title","undefined"!=typeof document&&document.getElementsByTagName("title")[0].textContent||""),cn){var e=new Audio(G.toString());e.setAttribute("crossorigin","anonymous"),e.play().catch(function(e){console.log("User interaction required before playing sound")}),document.title="New message | YouFibre"}else document.title=localStorage.getItem("title")||"",Yn()},[cn]),s(function(){n(void 0,void 0,void 0,function(){var e;return o(this,function(n){try{"undefined"!=typeof window&&"undefined"!=typeof document&&(Ce?(window.innerWidth<577&&(document.body.style.overflow="hidden"),Sn.current&&clearInterval(Sn.current),localStorage.getItem("title")&&(document.title=localStorage.getItem("title")||""),vn(!1),yn(-1),sn(!1),null===(e=document.getElementById("inputMessage"))||void 0===e||e.focus(),setTimeout(function(){return localStorage.removeItem("title")},1e3)):(document.body.style.overflow="",tn(!1),Se(!1))),Yn(),En.current=Ce}catch(e){console.log("Error fetching data:",e)}return[2]})})},[Ce]);var nt=function(){Pn.current&&pe&&(Pn.current.emit("leaveRoom",pe),Pn.current.removeAllListeners()),ue(null),ge(null),Ye([]),Ze(!Ke),ee(!1),oe(null),R.current=null,localStorage.removeItem("chatEmail"),localStorage.removeItem("conversationId"),localStorage.removeItem("caseId"),localStorage.removeItem("participantId"),localStorage.removeItem("chatUsername"),localStorage.removeItem("twilio_token"),localStorage.removeItem("chatMessages"),localStorage.removeItem("chatUserType"),localStorage.removeItem("chatCategory"),localStorage.removeItem("chatAddress"),localStorage.removeItem("chatLastBill"),localStorage.removeItem("agentId"),localStorage.removeItem("chatSessionId"),Be(null),Fe(null),Re(null),_e({}),xe(!1),ie(!0),ce(null),On.current=null,Me(""),localStorage.setItem("chatMessages",JSON.stringify(Mn)),Wn(null),jn(Mn),Yn(),U&&ke(!0),D.goSetRegistrationData(t(t({},D.goGetRegistrationData()),{twilioChat:null}))},tt=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return n(void 0,r([],e,!0),void 0,function(e){var t,r;return void 0===e&&(e=null),o(this,function(a){if(Oe.length>0||e||Object.keys(Pe).length>0){"undefined"!=typeof document&&(null===(r=document.getElementById("inputMessage"))||void 0===r||r.focus()),(t=new u).append("conversationSid",localStorage.getItem("conversationId")),t.append("message",Oe||e),t.append("from",localStorage.getItem("chatUsername")),t.append("sender","CUSTOMER"),Me(""),we(!0);try{Object.keys(Pe).length>0&&Pe.map(function(e){return n(void 0,void 0,void 0,function(){return o(this,function(n){return t.append("files",e),[2]})})})}catch(e){}try{y.post("ChatModule/v1.0/gateway/conversation/".concat(localStorage.getItem("conversationId"),"/message/send"),t,{headers:{"Content-Type":"multipart/form-data"}}).then(function(e){e?(Ye([]),ie(!0),we(!1),xe(!1)):(mn(!qn()),nt(),console.log("Conversation is closed"))}).catch(function(e){mn(!qn()),console.log("Send a Message:",e)})}catch(e){console.log("Error loading SVG:",e)}}return[2]})})},ot=function(){return n(void 0,void 0,void 0,function(){var e,r,a;return o(this,function(i){switch(i.label){case 0:return xe(!0),localStorage.setItem("chatUsername",Te.full_name),Be(Te.full_name),localStorage.setItem("chatEmail",Te.email),localStorage.setItem("chatCategory",Te.category),localStorage.setItem("chatAddress",Te.address),localStorage.setItem("chatLastBill",Te.last_bill),[4,(p=Te.email,n(void 0,void 0,void 0,function(){var e;return o(this,function(n){switch(n.label){case 0:return n.trys.push([0,2,,3]),[4,y.get("ChatModule/v1.0/gateway/token?identity=".concat(p,"&source=twilio"))];case 1:return[2,n.sent()||null];case 2:return e=n.sent(),console.log("Error fetching token:",e),[3,3];case 3:return[2]}})}))];case 1:return(e=i.sent())?(localStorage.setItem("twilio_token",e),ce(e),[4,(l=Te.full_name,c=Te.email,s=Te.address,d=Te.last_bill,u=je,m=Te.category,n(void 0,void 0,void 0,function(){var e,n;return o(this,function(t){switch(t.label){case 0:return t.trys.push([0,2,,3]),[4,y.post("ChatModule/v1.0/gateway/conversation/create",{source:"twilio",channel:"WEB_CHAT",identifier:c||null,DpaCustomerName:l||null,DpaCustomerEmail:c||null,DpaCustomerAddress:s||null,DpaCustomerLastBill:d||null,DpaCustomerType:u||null,DpaCustomerCategory:m||null})];case 1:return(e=t.sent())?[2,e||null]:(console.log("Can't create conversation!"),mn(!1),[2,null]);case 2:return n=t.sent(),mn(!1),x(n.message.replaceAll("OdinApiError:",""),"error"),[3,3];case 3:return[2]}})}))]):[3,3];case 2:return(r=i.sent())?(ie(!0),Re(null==r?void 0:r.participantId),localStorage.setItem("conversationId",null==r?void 0:r.conversationId),localStorage.setItem("caseId",null==r?void 0:r.caseId),localStorage.setItem("participantId",null==r?void 0:r.participantId),ge(null==r?void 0:r.caseId),ue(null==r?void 0:r.conversationId),D.goSetRegistrationData(t(t({},D.goGetRegistrationData()),{twilioChat:t(t({},null===(a=D.goGetRegistrationData())||void 0===a?void 0:a.twilioChat),{chatUsername:Te.full_name,chatSessionId:Xe,chatUserId:null==r?void 0:r.participantId,conversationId:null==r?void 0:r.conversationId,caseId:null==r?void 0:r.caseId,participantId:null==r?void 0:r.participantId})})),new Promise(function(e){jn(function(n){return e(),[]}),tt(R.current)}).then(function(){et({type:"EVENT",title:"Waiting for the agent to join the chat."},null)})):mn(!qn()),[3,4];case 3:xe(!1),i.label=4;case 4:return[2]}var l,c,s,d,u,m,p})})},rt=E({noClick:!0,noKeyboard:!0,onDrop:function(e){pe&&(e=(e=(e=e.filter(function(e){return e.size<10485760?e:x("Maximum file size is ".concat(10,"MB"),"error")})).filter(function(e){return kn.some(function(n){return e.name.endsWith(n)})?e:x("Unsupported File extension","error")})).filter(function(e){return 0===Object.keys(Pe.filter(function(n){return n.name===e.name})).length}),Object.keys(Pe).length+Object.keys(e).length<6?Ye(r(r([],Pe,!0),e,!0)):x("Maximum ".concat(5," files"),"warning"),qe(!1))}}),at=rt.getRootProps,it=rt.getInputProps,lt=rt.open;return a.createElement(a.Fragment,null,(void 0===process.env.GATSBY_TWILIO_CHAT_VERSION||"1"===process.env.GATSBY_TWILIO_CHAT_VERSION)&&a.createElement(V,null,a.createElement(q,t({className:"".concat(Ce?"show":""," ").concat(U?"fullscreen":"")},at(),{onDragOver:function(){return pe&&qe(!0)},onMouseLeave:function(){return qe(!1)}}),a.createElement(J,null,a.createElement(P,{className:"flex-center-justified"},a.createElement(k,{className:"p-0 m-0 flex-align-center"},a.createElement("div",{className:"flex-center-justified gap-5"},a.createElement("img",{src:L.toString(),alt:""}),a.createElement("span",{className:"dark-color"}," YouFibre"))),a.createElement(k,{className:"p-0 m-0 flex flex-align-center"},!de&&Object.keys(Ln).length>2&&a.createElement("button",{onClick:function(){return nt()},className:"small"},"Back"),de&&a.createElement("button",{onClick:function(){return tn(!0)},className:"small"},"End conversation"),!U&&a.createElement("img",{src:F.toString(),className:"close",onClick:function(){return ke(!Ce)},alt:""})))),a.createElement(v,{type:"chat"}),a.createElement(K,null,a.createElement(P,{className:"direction-column-reverse content-end chat-content-container"},a.createElement("div",{ref:Gn}),a.createElement(f,{messages:Ln,chatUsername:We,chatUserId:De,chatConversationId:de,resetFormValues:Ke,setChatForm:_e,buttonAction:function(e){if(un||pe||b())switch(e){case"new_customer":!function(){Fe("NEW_CUSTOMER"),localStorage.setItem("chatUserType","NEW_CUSTOMER");var e=r([{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:null,form:{type:"form",value:[{title:"Name",action:"full_name",placeholder:null,type:"text",required:!0},{title:"Email",action:"email",placeholder:null,type:"email",required:!0},{title:"Enter your Postcode",action:"address",placeholder:"Example: SW1 4EN",type:"zip",required:!0},{title:"What do you need help with today?",action:"category",placeholder:null,type:"select",required:!0,options:{SALES:"Sales",TECH_SUPPORT:"Tech Support",COMPLAINT:"Complaint"}},{title:"Submit",action:"submit_form",type:"button"}]},messageId:"3"},{senderType:"AGENT",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:"We're so happy to hear from you! So that we can provide the best possible support, please provide us with the following information.",form:null,messageId:"2"},{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"Client",fromId:"Client",message:"I am new here",form:null,messageId:"1"}],Ln.slice(1),!0);Wn(r(r([],zn||[],!0),[e[0]],!1)),setTimeout(function(){Wn(null),jn(e)},400),localStorage.setItem("chatMessages",JSON.stringify(e))}();break;case"not_customer":!function(){Fe("NOT_ACCOUNT_HOLDER"),localStorage.setItem("chatUserType","NOT_ACCOUNT_HOLDER");var e=r([{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:null,form:{type:"form",value:[{title:"Name",action:"full_name",placeholder:null,type:"text",required:!0},{title:"Email",action:"email",placeholder:null,type:"email",required:!0},{title:"Enter your Postcode",action:"address",placeholder:"Example: SW1 4EN",type:"zip",required:!0},{title:"What do you need help with today?",action:"category",placeholder:null,type:"select",required:!0,options:{SALES:"Sales",TECH_SUPPORT:"Tech Support",COMPLAINT:"Complaint"}},{title:"Submit",action:"submit_form",type:"button"}]},messageId:"3"},{senderType:"AGENT",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:"We're so happy to hear from you! So that we can provide the best possible support, please provide us with the following information.",form:null,messageId:"2"},{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"Client",fromId:"Client",message:"I am not the account holder",form:null,messageId:"1"}],Ln.slice(1),!0);Wn(r(r([],zn||[],!0),[e[0]],!1)),setTimeout(function(){Wn(null),jn(e)},400),localStorage.setItem("chatMessages",JSON.stringify(e))}();break;case"old_customer":!function(){Fe("ACCOUNT_HOLDER"),localStorage.setItem("chatUserType","ACCOUNT_HOLDER");var e=r([{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:null,form:{type:"form",value:[{title:"Name",action:"full_name",placeholder:null,type:"text",required:!0},{title:"Email",action:"email",placeholder:null,type:"email",required:!0},{title:"Enter your Postcode",action:"address",placeholder:"Example: SW1 4EN",type:"zip",required:!0},{title:"What was the total value of your last bill?",action:"last_bill",placeholder:"Total amount of your last bill",type:"number",required:!0},{title:"What do you need help with today?",action:"category",placeholder:null,type:"select",required:!0,options:{SALES:"Sales",TECH_SUPPORT:"Tech Support",INSTALLS_AND_SERVICE_VISITS:"Installs & Service Visits",MANAGE_MY_ACCOUNT:"Manage My Account",BILLING:"Billing",CANCELLATION:"Cancellation",COMPLAINT:"Complaint"}},{title:"Submit",action:"submit_form",type:"button"}]},messageId:"3"},{senderType:"AGENT",createdAt:h(new Date).format(),from:"YouFibre",fromId:"YouFibre",message:"We're so happy to hear from you! So that we can provide the best possible support, please provide us with the following information.",form:null,messageId:"2"},{senderType:"CUSTOMER",createdAt:h(new Date).format(),from:"Client",fromId:"Client",message:"I am the account holder",form:null,messageId:"1"}],Ln.slice(1),!0);Wn(r(r([],zn||[],!0),[e[0]],!1)),setTimeout(function(){Wn(null),jn(e)},400),localStorage.setItem("chatMessages",JSON.stringify(e))}();break;case"submit_form":Te.full_name&&Te.address&&"/"!==Te.address&&Te.email&&("ACCOUNT_HOLDER"===localStorage.getItem("chatUserType")&&void 0!==Te.last_bill||"ACCOUNT_HOLDER"!==localStorage.getItem("chatUserType"))&&Te.category&&je&&(R.current="<b>".concat(Dn[je],"</b><br /><b>Full name</b>: ").concat(Te.full_name,"<br /><b>Email</b>: ").concat(Te.email,"<br /><b>Address</b>: ").concat(Te.address,"<br />").concat(void 0!==Te.last_bill?"<b>What was the total value of your last bill</b>: "+Te.last_bill+"<br />":"","<b>What do you need help with today</b>: ").concat(Un[Te.category]),n(void 0,void 0,void 0,function(){var e;return o(this,function(n){switch(n.label){case 0:return n.trys.push([0,2,,3]),xe(!0),[4,y.get("SupportModule/v1.0/Case/outage/verify?contactEmailAddress=".concat(Te.email)).then(function(e){var n,t,o;return xe(!1),200===(null===(n=null==e?void 0:e.data)||void 0===n?void 0:n.statusCode)&&(null===(t=null==e?void 0:e.data)||void 0===t?void 0:t.data)?(ee(!0),oe(null===(o=null==e?void 0:e.data)||void 0===o?void 0:o.message),!0):(ot(),!1)}).catch(function(e){console.log("Outage Message:",e)})];case 1:return n.sent(),[3,3];case 2:return e=n.sent(),console.log("Error fetching outage: ",e),[3,3];case 3:return[2]}})}))}else nt()},newMessages:zn,chatActive:un,API:y}))),_n&&Ce&&a.createElement(Q,null,a.createElement("small",null,"Agent is typing...")),ae&&!Ie&&!(null===(m=Ln[0])||void 0===m?void 0:m.form)&&a.createElement(Z,{className:"".concat(U?"form-fullscreen":"")},a.createElement(Y,null,a.createElement("input",{id:"inputMessage",className:"",autoComplete:"off",maxLength:500,onChange:function(e){return Me(e.target.value)},value:Oe,type:"text",placeholder:"Write a reply..."}),a.createElement("input",t({},it())),a.createElement("img",{className:"action",alt:"Add attachment",src:W.toString(),onClick:function(){return lt()}}),a.createElement("button",{type:"submit",onClick:function(e){return function(e){e.preventDefault(),tt()}(e)},disabled:be||!1},be?a.createElement("img",{src:z.toString(),width:16,height:16}):"Send"))),Object.keys(Pe).length>0&&a.createElement("div",{className:"files"},Pe.map(function(e){return a.createElement("div",{className:"file",key:e.name},a.createElement("div",{className:"fileName"},e.name),a.createElement("img",{className:"action",src:B.toString(),onClick:function(){return n=e.name,t=Pe.filter(function(e){return e.name!==n}),void Ye(t);var n,t},alt:""}))})),He&&pe&&Ce&&a.createElement("div",{className:"cover dark-color upload"},a.createElement("h4",{className:"mb-10"},"Drag and drop your files here"),a.createElement("p",{className:"mb-10"},"Maximum ",5," files. Limit ",10,"MB per file."),a.createElement("p",null,"Supported files: ",kn&&kn.map(function(e,n){return!["mp4","mp3"].some(function(n){return n===e})&&(0===n?e:", ".concat(e))}))),he&&Ce&&a.createElement("div",{className:"cover"},a.createElement("img",{className:"make-it-white",src:z.toString(),width:14,height:14,alt:""})),Ie&&Ce&&a.createElement("div",{className:"cover dark-color closed"},a.createElement("h4",{className:"mb-10"},"Conversation is closed"),a.createElement("span",{className:"mb-10"},"This chat has now closed. If you need any help, feel free to start a new chat.",a.createElement("br",null),"We're always happy to assist you!"),a.createElement("button",{onClick:function(){Se(!1),nt()}},"Create new")),$&&te&&a.createElement("div",{className:"cover dark-color closed"},a.createElement("h4",{className:"mb-10"},"Outage in your area"),a.createElement("span",{className:"mb-10"},te),a.createElement("button",{onClick:function(){nt()},className:"blue-bg"},"Got It - Close Chat"),a.createElement("button",{onClick:function(){ee(!1),oe(null),ot()}},"Still Need Help - Start Chat")),nn&&Ce&&a.createElement("div",{className:"cover dark-color closed"},a.createElement("h4",{className:"mb-10"},"Close conversation"),a.createElement("span",{className:"mb-10"},"Are you sure you want to end this conversation?"),a.createElement("button",{onClick:function(){tn(!1)}},"Cancel"),a.createElement("button",{onClick:function(){tn(!1),function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];n(void 0,r([],e,!0),void 0,function(e){var n;return void 0===e&&(e="CUSTOMER"),o(this,function(t){switch(t.label){case 0:return t.trys.push([0,2,,3]),[4,y.post("ChatModule/v1.0/gateway/conversation/".concat(localStorage.getItem("conversationId"),"/close"),{closedBy:e})];case 1:return t.sent()?(nt(),[3,3]):(console.log("Can't close conversation!"),[2,null]);case 2:return n=t.sent(),console.log("Error closing conversation:",n),[3,3];case 3:return[2]}})})}("CUSTOMER"),nt()},className:"blue-bg"},"Confirm")),!un&&Ce&&!pe&&gn&&!b()&&a.createElement("div",{className:"cover dark-color closed"},a.createElement("h4",{className:"mb-10"},"Out of service"),a.createElement("span",{className:"mb-10",dangerouslySetInnerHTML:{__html:g(gn.chat_off_mode_text,{target:"_blank"}).replaceAll(/\r\n|\n/g,"<br />")}}),!U&&a.createElement("button",{onClick:function(){return ke(!1)}},"Close chat"))),a.createElement(H,{onClick:function(){return Ie&&(nt(),Se(!1)),ee(!$),void ke(!Ce)},className:"YFChat ".concat(Ce?"open":""," ").concat(U?"fullscreen":"")},a.createElement("img",{src:j.toString(),className:"icon-default",alt:""}),a.createElement("img",{src:F.toString(),className:"icon-hover",alt:""}),cn&&a.createElement("small",{className:"unread"},"1"))))};export{X as default};
 //# sourceMappingURL=index.js.map