silly-london-72463
01/20/2026, 2:00 AMconst BOTPRESS_CONFIG: BotpressConfig = {
botId: "dxxxxxxx",
configuration: {
version: "v2",
botName: "BCA Assistente Virtual",
botDescription:
"xxxxxxx.",
website: {
title: "",
link: "",
},
email: {
title: "info@xxxxx.com",
link: "info@xxxxxx.com",
},
phone: {},
...
proactiveBubbleDelayTime: 10,
},
clientId: "06xxxxxxxx",
selector: "#webchat",
};
const webchatStyles = `
#webchat .bpWebchat {
...
`;
export function BotpressChat({ locale }: BotpressChatProps) {
const isInitialized = useRef(false);
const botLocale = locale === "pt" ? "pt" : "en";
const clearBotpressStorage = useCallback(() => {
Object.keys(localStorage)
.filter((key) => key.startsWith("bp-webchat-"))
.forEach((key) => localStorage.removeItem(key));
}, []);
const initBotpress = useCallback(() => {
if (isInitialized.current || !window.botpress) return;
isInitialized.current = true;
clearBotpressStorage();
window.botpress.on("webchat:initialized", () => {
window.botpress.updateUser({
data: { locale: botLocale },
});
});
window.botpress.init(BOTPRESS_CONFIG);
}, [clearBotpressStorage, botLocale]);
return (
<>
<style dangerouslySetInnerHTML={{ __html: webchatStyles }} />
<div id="webchat" style={{ width: 500, height: 500 }} />
<Script
src="https://cdn.botpress.cloud/webchat/v3.5/inject.js"
strategy="afterInteractive"
onLoad={initBotpress}
/>
</>
);
}
Currently I have this on my website, it makes sense but documentation isnt great
The flow is in the attachments.
This isn't working and I'm getting crazy because there is no debug tools either.
https://cdn.discordapp.com/attachments/1462990014098178108/1462990014358229002/image.png?ex=697b67e0&is=697a1660&hm=167be485b6b5065e2df461b10f4ea9e62a93bb64e10f07747bd70a739cce74ca&silly-london-72463
01/20/2026, 2:00 AMwide-umbrella-5226
01/20/2026, 1:10 PMwide-umbrella-5226
01/20/2026, 1:10 PMsilly-london-72463
01/20/2026, 3:10 PMwide-umbrella-5226
01/20/2026, 3:11 PMwide-umbrella-5226
01/20/2026, 3:11 PMwide-umbrella-5226
01/20/2026, 3:11 PMsilly-london-72463
01/20/2026, 3:13 PMwide-umbrella-5226
01/20/2026, 3:13 PMwide-umbrella-5226
01/20/2026, 3:14 PMwide-umbrella-5226
01/20/2026, 3:14 PMsilly-london-72463
01/20/2026, 3:17 PMwide-umbrella-5226
01/20/2026, 4:09 PMsilly-london-72463
01/20/2026, 4:22 PMwide-umbrella-5226
01/20/2026, 4:24 PMwide-umbrella-5226
01/20/2026, 4:24 PMwide-umbrella-5226
01/20/2026, 4:24 PMwide-umbrella-5226
01/20/2026, 4:24 PMwide-umbrella-5226
01/20/2026, 4:24 PMwide-umbrella-5226
01/20/2026, 4:25 PMsilly-london-72463
01/20/2026, 5:03 PMsilly-london-72463
01/20/2026, 5:03 PMsilly-london-72463
01/20/2026, 5:05 PMwide-umbrella-5226
01/20/2026, 5:05 PMwide-umbrella-5226
01/20/2026, 5:05 PMwide-umbrella-5226
01/20/2026, 5:06 PMwide-umbrella-5226
01/20/2026, 5:06 PMwide-umbrella-5226
01/20/2026, 5:06 PMsilly-london-72463
01/20/2026, 5:10 PMwide-umbrella-5226
01/20/2026, 5:11 PMsilly-london-72463
01/20/2026, 5:13 PMsilly-london-72463
01/20/2026, 5:16 PMwide-umbrella-5226
01/20/2026, 5:41 PMwide-umbrella-5226
01/20/2026, 5:42 PMsilly-london-72463
01/20/2026, 5:43 PMsilly-london-72463
01/20/2026, 5:43 PMwide-umbrella-5226
01/20/2026, 5:44 PMwide-umbrella-5226
01/20/2026, 5:44 PMwide-umbrella-5226
01/20/2026, 5:44 PMwide-umbrella-5226
01/20/2026, 5:45 PMwide-umbrella-5226
01/20/2026, 5:45 PM