-
Notifications
You must be signed in to change notification settings - Fork 8
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Integrate React 17.0.2 with LiveChat #36
Comments
Hello @abettinf 👋 Thanks for the report and sorry for any inconvenience. The problem on your screenshot is that you use the TypeScript code from our documentation example inside JavaScript code. Mainly the type annotation for the event handler which is highlighted is something that does not exist in JavaScript and just cannot be used there. You can simply delete the usage and import of The same example from our documentation without TypeScript language specfifc features will look like this: import { LiveChatWidget } from "@livechat/widget-react";
function App() {
function handleNewEvent(event) {
console.log("LiveChatWidget.onNewEvent", event);
}
return (
<LiveChatWidget
license="12345678"
visibility="maximized"
onNewEvent={handleNewEvent}
/>
);
} Let me know if we can help your team in anything else in case of integrating LiveChat into your website. |
Hi, I ran the npm I applied the code as follows: But I don't get the chat icon does not appear to start using it. What am I doing wrong or what do I need to apply? note: the license number I show in the image is not the real one we use for the chat, I do not put it for security reasons. |
Hi, no problem with not providing the license number directly. I was able to obtain your license details in our company’s CRM thanks to the company/product name: iProveedor. Using that information I see what is going on here in your situation 🙂 The problemCurrently, you should be able to see a message inside the developer console while running your website:
It means that the domain you are currently on ( The causeYou have enabled a feature called "trusted domains" which means that the LiveChat Chat Widget will be available only on the websites whose domains are explicitly specified in the list located here: https://my.livechatinc.com/settings/trusted-domains. This allows preventing someone from loading Chat Widget with your license on his website. The solutionIt is a good practice for website development purposes to add a |
Hello, you are right, LiveChat disabled message appears in the localhost console. So I deployed the changes to the test domain, however, the chat still does not appear, in this case LiveChat disabled message is no longer displayed in console. I appreciate all the collaboration you are providing and I trust that together we can find the solution, I look forward to your feedback. Thank you. |
Hi @abettinf, good to hear that the message is gone. I have entered the test domain you have on your screenshot and I don't see any sign of the existence of the LiveChat Chat Widget in the website code. I am not entirely sure when and how you render the Using your previous example from Did everything go properly with the deployment? Or maybe you have already removed this recent deployment with LiveChat Chat Widget from the test site? Please, use mentioned above method to validate if the LiveChat Chat Widget is actually loaded on the website and that its code is deployed together with the application code. Let me know how it goes 🙂 |
I am glad everything is working correctly now on your side 🙂 |
Hello LiveChat team, my development team and I, we want to integrate the LiveChat service to our web application developed with React version 17.0.2, we have followed the documentation: https://developers.livechat.com/docs/extending-chat-widget/chat-widget-adapters/react-adapter
However, we have not been successful, we get an error indicating that we must use TypeScript files (.tsx), but we are working with .jsx files.
In this order of ideas, we need your help to confirm if it is possible to integrate the LiveChat service with the current version of React.
Currently, we have the LiveChat service functional on our WordPress site iproveedor.com and we want that same chat to work on our web app https://app.iproveedor.com/login/index.html.
The text was updated successfully, but these errors were encountered: