and the corresponding
if they exist\r\n if (renderedText.startsWith(\"\")) {\r\n renderedText = renderedText.substring(3);\r\n }\r\n if (renderedText.endsWith(\"
\\n\")) {\r\n renderedText = renderedText.substring(0, renderedText.length - 5);\r\n }\r\n\r\n return renderedText;\r\n }\r\n\r\n\r\n loadMoreSpeechBubble = () => {\r\n this.setState({loadToEnd : false});\r\n this.invokeSignalRMessage(['SendChatHistory', this.state.language.id, this.state.startLoad, Setup.messageLoadCount]);\r\n };\r\n\r\n /**\r\n * On startup a connection is made to the SignalR hub and event listeners is set up.\r\n */\r\n componentDidMount = () => {\r\n // SignalR connection config.\r\n const hubConnection = new SignalR.HubConnectionBuilder()\r\n .withUrl((process.env.NODE_ENV === 'development' ? Setup.apiEndpointDev : process.env.REACT_APP_TEST_BUILD ? Setup.apiEndpointTest : Setup.apiEndpointProd) +\r\n 'chat?token=' + this.state.token + '&userId=' + this.state.userId + '&chatAgentMode=' + this.state.chatAgentMode +\r\n '&clientKey=' + this.state.clientKey + '&domain=' + this.state.domain)\r\n .configureLogging(process.env.NODE_ENV === 'development' || process.env.REACT_APP_TEST_BUILD ? SignalR.LogLevel.Debug : SignalR.LogLevel.Error)\r\n .build();\r\n\r\n // Establishing connection to SignalR hub.\r\n this.setState({hubConnection}, () => {\r\n this.startChatConnection();\r\n\r\n // Event listener for when the connection is lost\r\n this.state.hubConnection.onclose((error) => {\r\n this.setState({connected: false}, () => {\r\n setTimeout(() => {\r\n this.startChatConnection();\r\n }, Setup.signalrConnectionRetryInterval);\r\n });\r\n });\r\n\r\n // Event listener for when the widget should disable retry\r\n this.state.hubConnection.on('DisableConnectionRetry', () => {\r\n this.setState({DisableConnectionRetry: true});\r\n window.parent.postMessage({'hideChatbot': true}, '*');\r\n });\r\n\r\n // Event listener for when the chat config is recieved.\r\n this.state.hubConnection.on('ChatConfig', (chatConfig, token) => {\r\n this.setState({token});\r\n window.parent.postMessage({'setChatToken': token}, '*');\r\n\r\n hubConnection.connection.baseUrl = (process.env.NODE_ENV === 'development' ? Setup.apiEndpointDev : process.env.REACT_APP_TEST_BUILD ? Setup.apiEndpointTest : Setup.apiEndpointProd) +\r\n 'chat?token=' + token+ '&userId=' + this.state.userId + '&chatAgentMode=' + this.state.chatAgentMode +\r\n '&clientKey=' + this.state.clientKey + '&domain=' + this.state.domain;\r\n\r\n if (this.state.chatConfig) {\r\n return;\r\n }\r\n\r\n this.setState({chatConfig});\r\n\r\n let language = this.state.language;\r\n let languageParam = this.state.languageParam;\r\n\r\n // First try to read the language from query parameter.\r\n if (!language && languageParam) {\r\n //override e-gb to en - language\r\n if(languageParam.toLowerCase() == \"en-gb\")\r\n {\r\n languageParam = \"en\";\r\n }\r\n language = chatConfig.chatConfigLanguageList.find((lang) => {\r\n return lang.language.languageCode.toLowerCase() === languageParam.toLowerCase() ||\r\n lang.language.languageCodeShort.toLowerCase() === languageParam.toLowerCase() ||\r\n lang.language.countryCode.toLowerCase() === languageParam.toLowerCase() ||\r\n lang.language.name.toLowerCase() === languageParam.toLowerCase();\r\n }).language;\r\n }\r\n\r\n // If no language found, set the first language in the chat config as selected.\r\n if (!language) {\r\n language = chatConfig.chatConfigLanguageList[0].language;\r\n }\r\n\r\n this.setState({language}, () => {\r\n this.invokeSignalRMessage(['SendChatHistory', this.state.language.id, this.state.startLoad, Setup.messageLoadCount]);\r\n });\r\n\r\n // Inject client html, script and css\r\n const head = document.getElementsByTagName('head')[0];\r\n\r\n if (chatConfig.clientScript && this.state.userId == null) {\r\n const clientScriptElement = document.createElement('script');\r\n clientScriptElement.text = chatConfig.clientScript;\r\n\r\n head.appendChild(clientScriptElement);\r\n }\r\n\r\n if (chatConfig.clientCss) {\r\n const clientStyleElement = document.createElement('style');\r\n clientStyleElement.appendChild(document.createTextNode(chatConfig.clientCss));\r\n\r\n head.appendChild(clientStyleElement);\r\n }\r\n\r\n if (chatConfig.clientHeaderHtml) {\r\n\r\n const linkElement = document.createElement('link');\r\n linkElement.href = chatConfig.clientHeaderHtml;\r\n linkElement.rel = 'stylesheet';\r\n\r\n head.appendChild(linkElement);\r\n }\r\n\r\n if(chatConfig.soundOnMessageReceived) {\r\n var x = document.createElement(\"AUDIO\");\r\n x.id = \"audio_messagereceived\";\r\n x.src = \"/sound/\" + chatConfig.messageReceivedSound;\r\n x.preload = \"auto\";\r\n document.body.appendChild(x);\r\n }\r\n\r\n });\r\n\r\n // Event listener for when user or chat agent starts or stop writing\r\n this.state.hubConnection.on('SendUserIsWriting', (isChatAgent, isWriting) => {\r\n if (isChatAgent) {\r\n this.setState({botWriting: isWriting});\r\n } else {\r\n this.setState({userWriting: isWriting});\r\n }\r\n });\r\n\r\n // Event listener for when messages are recieved.\r\n this.state.hubConnection.on('Send', (chatResponse) => {\r\n if (this.state.chatbotOpenState === false) {\r\n const showNewMsgIcon = isMobile ? this.state.chatConfig.showNewMsgIconMobile : this.state.chatConfig.showNewMsgIconDesktop;\r\n\r\n if (showNewMsgIcon) {\r\n window.parent.postMessage({'showNewMsgIcon': true}, '*');\r\n }\r\n }\r\n\r\n this.setState({loadToEnd: true});\r\n this.handleChatResponse(chatResponse);\r\n });\r\n\r\n // Event listener when chat history is received\r\n this.state.hubConnection.on('SendChatHistory', (chatResponseListResult) => {\r\n let speechBubbleList = this.state.speechBubbleList;\r\n\r\n if(this.state.loadToEnd == false) {\r\n chatResponseListResult.item2= chatResponseListResult.item2.reverse();\r\n }\r\n\r\n chatResponseListResult.item2.forEach((chatResponse) => {\r\n if(this.state.loadToEnd == false) {\r\n chatResponse.speechBubbleList= chatResponse.speechBubbleList.reverse();\r\n }\r\n speechBubbleList = this.handleChatResponse(chatResponse, speechBubbleList);\r\n });\r\n\r\n const startLoadCalc = this.state.startLoad + chatResponseListResult.item2.length;\r\n const loadMoreCalc = startLoadCalc < chatResponseListResult.item1;\r\n\r\n this.setState({totalCount: chatResponseListResult.item1,startLoad: startLoadCalc, loadMore: loadMoreCalc});\r\n\r\n this.setState({speechBubbleList}, () => {\r\n if (this.state.requestedWelcome === false && this.state.userId == null) {\r\n if (this.state.intentId) {\r\n this.sendIntent(this.state.intentId, ChatQuestionTypeEnum.customIntent);\r\n } else {\r\n this.sendWelcome();\r\n }\r\n\r\n this.setState({requestedWelcome: true});\r\n }\r\n });\r\n\r\n\r\n\r\n });\r\n\r\n // Event listener when a user likes a message\r\n this.state.hubConnection.on('SendChatResponseFeedback', (chatQuestionId, chatResponseFeedback) => {\r\n let speechBubbleList = this.state.speechBubbleList;\r\n\r\n const speechBubbleIndex = speechBubbleList.findIndex(sb => sb.chatQuestionId === chatQuestionId);\r\n if (speechBubbleIndex !== -1) {\r\n speechBubbleList[speechBubbleIndex].chatResponseFeedback = chatResponseFeedback;\r\n\r\n this.setState({speechBubbleList});\r\n }\r\n });\r\n\r\n // Event listener for when mail is sent.\r\n this.state.hubConnection.on('SendEmail', () => {\r\n this.setState({botWriting: false});\r\n\r\n let speechBubbleList = this.state.speechBubbleList;\r\n\r\n speechBubbleList.forEach((speechBubble) => {\r\n if (speechBubble.isMailResponse) {\r\n speechBubble.hidden = false;\r\n }\r\n });\r\n\r\n this.setState({speechBubbleList});\r\n });\r\n\r\n this.state.hubConnection.on('SendTrainingPhraseList', (trainingPhraseList) => {\r\n this.setState({trainingPhraseList: trainingPhraseList });\r\n });\r\n });\r\n\r\n };\r\n\r\n toggleChatbot = () => {\r\n this.setState((prevState) => ({\r\n isChatMinimized: !prevState.isChatMinimized\r\n }));\r\n };\r\n \r\n\r\n\r\n handleChatResponse = (chatResponse, speechBubbleList) => {\r\n\r\n if(chatResponse.isStream == true )\r\n {\r\n speechBubbleList = this.state.speechBubbleList;\r\n\r\n if(speechBubbleList!=null && speechBubbleList.length> 0 ) {\r\n\r\n const streamId = chatResponse.speechBubbleList[0].streamId;\r\n\r\n if(this.state.streamIdStopped.some((x) => x == streamId) )\r\n {\r\n return ;\r\n }\r\n\r\n if(chatResponse.speechBubbleList[0].index > 1) {\r\n\r\n let speechBubbleBuffer = this.state.speechBubbleBuffer;\r\n\r\n speechBubbleBuffer.push(chatResponse.speechBubbleList[0]);\r\n\r\n speechBubbleBuffer = speechBubbleBuffer.sort((a, b) => a.index - b.index);\r\n\r\n let lastSpeechBubble = speechBubbleList[speechBubbleList.length - 1];\r\n\r\n speechBubbleBuffer.forEach((item, index) => {\r\n\r\n lastSpeechBubble.index = (lastSpeechBubble.index == undefined || lastSpeechBubble.index == 0 ? 1 : lastSpeechBubble.index);\r\n\r\n const indexDiff = item.index - lastSpeechBubble.index;\r\n\r\n if (lastSpeechBubble && (lastSpeechBubble.isUser == undefined || lastSpeechBubble.isUser == false) && lastSpeechBubble.streamId == streamId && (indexDiff == 1) && item.isLastStream == false) {\r\n\r\n const lastSpeechBubbleMsg = lastSpeechBubble.messageList[0];\r\n const currentSpeechBubbleMsg = item.messageList[0];\r\n const speechBubbleContent = (lastSpeechBubbleMsg.contentSource ? lastSpeechBubbleMsg.contentSource : lastSpeechBubbleMsg.content) + (currentSpeechBubbleMsg.contentSource ? currentSpeechBubbleMsg.contentSource : currentSpeechBubbleMsg.content);\r\n\r\n speechBubbleList[speechBubbleList.length - 1].messageList[0].contentSource = speechBubbleContent;\r\n speechBubbleList[speechBubbleList.length - 1].messageList[0].content = this.markText(speechBubbleContent);\r\n speechBubbleList[speechBubbleList.length - 1].index = item.index;\r\n speechBubbleList[speechBubbleList.length - 1].isLastStream = item.isLastStream;\r\n speechBubbleBuffer = speechBubbleBuffer.filter(bufferItem => bufferItem.index !== item.index);\r\n\r\n }\r\n\r\n });\r\n\r\n let showStopMessage = true;\r\n\r\n if(chatResponse.speechBubbleList[0].isLastStream)\r\n {\r\n const currentSpeechBubbleContent = chatResponse.speechBubbleList[0].messageList[0].content;\r\n speechBubbleList[speechBubbleList.length - 1].messageList[0].contentSource = currentSpeechBubbleContent;\r\n speechBubbleList[speechBubbleList.length - 1].messageList[0].content = this.markText(currentSpeechBubbleContent);\r\n speechBubbleList[speechBubbleList.length - 1].isLastStream = true;\r\n\r\n let streamIdStopped = this.state.streamIdStopped;\r\n\r\n streamIdStopped.push(chatResponse.speechBubbleList[0].streamId);\r\n\r\n showStopMessage = false;\r\n\r\n this.setState({streamIdStopped});\r\n }\r\n\r\n this.setState({\r\n speechBubbleList: speechBubbleList,\r\n speechBubbleBuffer: speechBubbleBuffer,\r\n lastStreamId: streamId,\r\n showStopMessage,\r\n botWriting: speechBubbleList[speechBubbleList.length - 1].isLastStream || speechBubbleList[speechBubbleList.length - 1].messageList[0].contentSource == undefined ? false: true\r\n });\r\n\r\n return;\r\n }\r\n\r\n\r\n }\r\n\r\n }\r\n\r\n let delay = 0;\r\n\r\n const lastNonSuggestionSpeechBubbleIndex = chatResponse.speechBubbleList.map((speechBubble) => {\r\n return speechBubble.suggestion;\r\n }).lastIndexOf(null);\r\n\r\n //Id used in internal sorting for search bot layout\r\n const chatResponseDropId = uuidv4();\r\n\r\n chatResponse.speechBubbleList.forEach((speechBubble, i, array) => {\r\n // If any delay on speechbubble a 'is writing animation' speechbubble is shown.\r\n\r\n if (speechBubble.delay) {\r\n delay += speechBubble.delay;\r\n let botWriting = true;\r\n this.setState({botWriting});\r\n }\r\n\r\n if(this.state.loadToEnd == false)\r\n {\r\n if (speechBubble.suggestion) {\r\n speechBubble.hidden = true;\r\n }\r\n }\r\n\r\n speechBubble.dropId = chatResponseDropId;\r\n speechBubble.chatResponseId = chatResponse.id;\r\n speechBubble.integrationType = chatResponse.integrationType;\r\n\r\n speechBubble.index = i;\r\n\r\n speechBubble.dateTimeUtc = chatResponse.dateTimeUtc;\r\n\r\n // Sets if chat rating buttons should be shown.\r\n if (chatResponse.chatQuestionId &&\r\n speechBubble.index === lastNonSuggestionSpeechBubbleIndex &&\r\n !speechBubble.isUser &&\r\n speechBubble.lineBreakType !== LineBreakTypeEnum.carousel) {\r\n\r\n speechBubble.chatQuestionId = chatResponse.chatQuestionId;\r\n speechBubble.chatResponseFeedback = chatResponse.chatResponseFeedback;\r\n }\r\n\r\n if (speechBubble.index > 0) {\r\n speechBubble.index -= array.some(speechBubble => speechBubble.isUser) ? 1 : 0;\r\n }\r\n\r\n // Disables suggestions if in spectatormode.\r\n if (speechBubble.suggestion && this.state.userId) {\r\n speechBubble.disabled = true;\r\n }\r\n\r\n\r\n if (speechBubble.isGpt) {\r\n speechBubble.messageList = speechBubble.messageList.map(message => {\r\n return { ...message, content: this.markText(message.content) };\r\n });\r\n }\r\n\r\n\r\n // If state should be updated.\r\n if (speechBubbleList) {\r\n if(this.state.loadToEnd) {\r\n speechBubbleList.push(speechBubble);\r\n } else\r\n {\r\n if(speechBubbleList.find(x=>x.chatQuestionId ==speechBubble.chatQuestionId) == undefined|| speechBubble.id=='00000000-0000-0000-0000-000000000000' || speechBubble.chatQuestionId == null) {\r\n speechBubbleList.unshift(speechBubble);\r\n }\r\n }\r\n } else {\r\n // Sets delay on when to show the speechbubble.\r\n setTimeout(() => {\r\n speechBubbleList = this.state.speechBubbleList;\r\n\r\n // Hide suggestions if user speechbubble is recieved.\r\n if (speechBubble.isUser || this.state.loadToEnd == false) {\r\n speechBubbleList.forEach((sb) => {\r\n if (sb.suggestion) {\r\n sb.hidden = true;\r\n }\r\n });\r\n }\r\n\r\n if(this.state.loadToEnd) {\r\n speechBubbleList.push(speechBubble);\r\n }else\r\n {\r\n if(speechBubbleList.find(x=>x.chatQuestionId ==speechBubble.chatQuestionId) == undefined|| speechBubble.id=='00000000-0000-0000-0000-000000000000' || speechBubble.chatQuestionId == null) {\r\n speechBubbleList.unshift(speechBubble);\r\n }\r\n }\r\n\r\n this.setState({speechBubbleList});\r\n\r\n if (i === array.length - 1 ) {\r\n let botWriting = false;\r\n this.setState({botWriting});\r\n }\r\n\r\n }, delay);\r\n\r\n if(this.state.chatConfig.soundOnMessageReceived && chatResponse.speechBubbleList && chatResponse.speechBubbleList[0] && chatResponse.speechBubbleList[0].avatarName) {\r\n setTimeout(() => {\r\n console.log(\"Play sound: Chat message received (delay = \" + speechBubble.delay + \")\");\r\n this.playReceivedMessageSound();\r\n }, speechBubble.delay);\r\n }\r\n\r\n\r\n // Open chatbot if message is recieved from chat agent.\r\n if (!this.state.userId && chatResponse && chatResponse.intentId === null) {\r\n window.parent.postMessage({'openChatbot': true}, '*');\r\n }\r\n }\r\n });\r\n\r\n\r\n\r\n // close chatbot , action close\r\n if (!this.state.userId && chatResponse && chatResponse.closeChatbot) {\r\n window.parent.postMessage({'closeChatbot': true}, '*');\r\n }\r\n\r\n\r\n return speechBubbleList;\r\n };\r\n\r\n playReceivedMessageSound = () => {\r\n var audio = document.getElementById(\"audio_messagereceived\");\r\n audio.play();\r\n }\r\n\r\n startChatConnection = () => {\r\n if (this.state.disableConnectionRetry) {\r\n return;\r\n }\r\n\r\n this.state.hubConnection.start()\r\n .then(() => {\r\n this.setState({connected: true});\r\n this.setState({showConnectionLostMsg: false})\r\n }).catch(() => {\r\n setTimeout(() => {\r\n this.startChatConnection();\r\n }, Setup.signalrConnectionRetryInterval);\r\n });\r\n };\r\n\r\n\r\n getMessageSpeechBubble = (message) => {\r\n return {\r\n isUser: true,\r\n messageList: [\r\n {\r\n messageType: MessageType.text,\r\n content: message,\r\n }\r\n ]\r\n };\r\n };\r\n\r\n getFileMessageSpeechBubble = (filename, url) => {\r\n return {\r\n isUser: true,\r\n displayBackground: false,\r\n messageList: [\r\n {\r\n messageType: MessageType.file,\r\n filename:filename,\r\n url: url,\r\n lineBreak: 1\r\n }\r\n ]\r\n };\r\n };\r\n\r\n\r\n\r\n sendWelcome = () => {\r\n this.invokeSignalRMessage(['SendWelcome', this.state.language.languageCode, this.state.forceWelcomeMessage]);\r\n this.setState({forceWelcomeMessage: false});\r\n };\r\n\r\n sendUserIsWriting = (isWriting) => {\r\n this.invokeSignalRMessage(['SendUserIsWriting', isWriting]);\r\n };\r\n\r\n appendSendMessage = (speechBubble) => {\r\n\r\n this.setState({loadToEnd:true});\r\n\r\n let speechBubbleList = this.state.speechBubbleList;\r\n\r\n if(this.state.lastStreamId!=null)\r\n {\r\n let streamIdStopped = this.state.streamIdStopped\r\n\r\n streamIdStopped.push(this.state.lastStreamId);\r\n\r\n this.setState({streamIdStopped});\r\n }\r\n\r\n // Hides suggestions\r\n speechBubbleList.forEach((speechBubble) => {\r\n if (speechBubble.suggestion) {\r\n speechBubble.hidden = true;\r\n }\r\n });\r\n\r\n // Shows a message to the user that looks like they sent it.\r\n if (speechBubble) {\r\n speechBubble.lineBreakType = LineBreakTypeEnum.newLine;\r\n speechBubbleList.push(speechBubble);\r\n }\r\n\r\n this.setState({speechBubbleList});\r\n };\r\n\r\n stopMessage = () => {\r\n\r\n let streamIdStopped = this.state.streamIdStopped;\r\n\r\n if (!streamIdStopped.includes(this.state.lastStreamId)) {\r\n streamIdStopped.push(this.state.lastStreamId);\r\n this.setState({ streamIdStopped, botWriting: false });\r\n }\r\n \r\n this.setState({ showStopMessage: false });\r\n\r\n }\r\n /**\r\n * Gets called when a message is sent from the webclient.\r\n */\r\n sendMessage = (message, messageToDisplay, url) => {\r\n if (this.state.connected === false) {\r\n this.setState({showConnectionLostMsg: true});\r\n return false;\r\n }\r\n this.setState({loadToEnd: true});\r\n\r\n\r\n if (!this.state.userId) {\r\n\r\n const speechBubbleToDisplay = url ? this.getFileMessageSpeechBubble(messageToDisplay,url): this.getMessageSpeechBubble(messageToDisplay);\r\n this.appendSendMessage(speechBubbleToDisplay);\r\n\r\n this.setState({botWriting: true});\r\n\r\n }\r\n this.invokeSignalRMessage(['Send', message, this.state.language.languageCode, url, this.state.lastStreamId]);\r\n return true;\r\n };\r\n\r\n sendIntent = (intentId, chatQuestionType, messageToDisplay, speechBubble, hideSuggestions, chatMenuItemId) => {\r\n if (this.state.connected === false) {\r\n this.setState({showConnectionLostMsg: true});\r\n return;\r\n }\r\n\r\n this.setState({loadToEnd: true});\r\n\r\n let speechBubbleToDisplay;\r\n\r\n // Clone speechbubble and show as the user send it.\r\n if (speechBubble) {\r\n speechBubbleToDisplay = JSON.parse(JSON.stringify(speechBubble));\r\n speechBubbleToDisplay.isUser = true;\r\n speechBubbleToDisplay.index = 0;\r\n speechBubbleToDisplay.chatResponseId = null;\r\n speechBubbleToDisplay.suggestion = null;\r\n } else if (messageToDisplay) {\r\n speechBubbleToDisplay = this.getMessageSpeechBubble(messageToDisplay);\r\n }\r\n\r\n this.appendSendMessage(speechBubbleToDisplay);\r\n\r\n // Sends either id of suggestion or chat menu item clicked or null.\r\n let key = null;\r\n if (chatQuestionType === ChatQuestionTypeEnum.suggestion) {\r\n key = speechBubble.suggestion.id;\r\n } else if (chatQuestionType === ChatQuestionTypeEnum.menuItem) {\r\n key = chatMenuItemId;\r\n }\r\n\r\n this.invokeSignalRMessage(['SendIntent', intentId, this.state.language.languageCode, chatQuestionType, key, speechBubbleToDisplay]);\r\n };\r\n\r\n sendChatAgentIntent = (intentId) => {\r\n if (this.state.connected === false) {\r\n this.setState({showConnectionLostMsg: true});\r\n return false;\r\n }\r\n this.invokeSignalRMessage(['SendIntent', intentId, this.state.language.languageCode, ChatQuestionTypeEnum.customIntent, null, null]);\r\n return true;\r\n };\r\n\r\n sendChatResponseFeedback = (chatQuestionId, chatResponseFeedback) => {\r\n if (this.state.connected === false) {\r\n this.setState({showConnectionLostMsg: true});\r\n return;\r\n }\r\n\r\n let speechBubbleList = this.state.speechBubbleList;\r\n let speechBubble = speechBubbleList.find((sb => {\r\n return sb.chatQuestionId === chatQuestionId;\r\n }));\r\n\r\n if (speechBubble) {\r\n speechBubble.chatResponseFeedback = chatResponseFeedback === ChatResponseFeedbackEnum.notSet ? null : chatResponseFeedback;\r\n }\r\n\r\n this.setState({speechBubbleList}, () => {\r\n this.invokeSignalRMessage(['SendChatResponseFeedback', chatQuestionId, chatResponseFeedback]);\r\n });\r\n };\r\n\r\n languageSelected = (countryCode) => {\r\n if (this.state.connected === false) {\r\n this.setState({showConnectionLostMsg: true});\r\n return false;\r\n }\r\n\r\n const language = this.state.chatConfig.chatConfigLanguageList.map(ccl => ccl.language).find((lang) => {\r\n return lang.countryCode === countryCode;\r\n });\r\n\r\n window.parent.postMessage({'languageSelected': language.languageCode}, '*');\r\n\r\n this.setState({language, requestedWelcome: false, forceWelcomeMessage: true, speechBubbleList: [], startLoad: 0, trainingPhraseSuggestionList: []}, () => {\r\n this.invokeSignalRMessage(['SendChatHistory', this.state.language.id , this.state.startLoad, Setup.messageLoadCount]);\r\n });\r\n\r\n return true;\r\n };\r\n\r\n getTrainingPhraseList = (searchText) => {\r\n if (this.state.connected === false) {\r\n this.setState({showConnectionLostMsg: true});\r\n return;\r\n }\r\n this.invokeSignalRMessage(['GetTrainingPhraseList', searchText, this.state.language.languageCode]);\r\n };\r\n\r\n getChatResponse = (intentId) => {\r\n if (this.state.connected === false) {\r\n this.setState({showConnectionLostMsg: true});\r\n return;\r\n }\r\n\r\n return this.invokeSignalRMessage(['GetChatResponse', intentId, this.state.language.languageCode]);\r\n };\r\n\r\n uploadFileComplete(file, token, callback) {\r\n this.sendUserIsWriting(true);\r\n this.setState(this.state.chatAgentMode ? {botWriting: true} : {userWriting: true});\r\n\r\n return axios\r\n .post((process.env.NODE_ENV === 'development' ? Setup.apiEndpointDev : process.env.REACT_APP_TEST_BUILD ? Setup.apiEndpointTest : Setup.apiEndpointProd) + 'storage/upload/token/' + token , {file})\r\n .then(response => {\r\n this.sendUserIsWriting(false);\r\n this.setState(this.state.chatAgentMode ? {botWriting: false} : {userWriting: false});\r\n this.sendMessage(file.name, file.name, response.data)\r\n callback();\r\n })\r\n .catch(error => {\r\n this.setSnackbarErrorMessage(Localization[getLocalizationLanguageCode(this.state.language ? this.state.language.languageCode : null)]['chatInput.chatAttachment.uploadFileError']);\r\n this.sendUserIsWriting(false);\r\n this.setState(this.state.chatAgentMode ? {botWriting: false} : {userWriting: false});\r\n callback();\r\n })\r\n }\r\n\r\n toggleShowInfoPage = () => {\r\n this.setState({showInfoPage: !this.state.showInfoPage});\r\n };\r\n\r\n closeChatbot = () => {\r\n\r\n this.setState({isMaximized: false});\r\n window.parent.postMessage({'closeChatbot': true}, '*');\r\n\r\n };\r\n\r\n toggleMaxiChatbot = () => {\r\n window.parent.postMessage({'toggleMaxiChatbot': true}, '*');\r\n\r\n this.setState({isMaximized: !this.state.isMaximized});\r\n };\r\n\r\n setSnackbarErrorMessage = (errorMessage) => {\r\n this.setState({snackbarErrorMessage: errorMessage});\r\n };\r\n\r\n handleRootClick = () => {\r\n if (this.state.hadFirstClick === false) {\r\n\r\n if (this.state.welcomePreviewEnabled) {\r\n window.parent.postMessage({'disableWelcomePreview': true}, '*');\r\n this.setState({welcomePreviewEnabled: false});\r\n }\r\n\r\n this.setState({hadFirstClick: true});\r\n }\r\n };\r\n\r\n flushTrainingPhraseList = () => {\r\n this.setState({trainingPhraseList: []})\r\n }\r\n\r\n render() {\r\n\r\n const chatFieldSpectatorStyle = {\r\n width: '100%',\r\n maxWidth: '100%'\r\n };\r\n\r\n return (\r\n