diff --git a/copilot-widget/README.md b/copilot-widget/README.md
index f6238bbcd..804b106fb 100644
--- a/copilot-widget/README.md
+++ b/copilot-widget/README.md
@@ -43,6 +43,9 @@ It's a simple React application that can be used in any webpage as a widget. To
}, // @optional: user object – this info will be used in the chat
containerProps: {}, // @optional: `HTMLProps`
warnBeforeClose: true, // @optional: Set to false if you don't want to warn the user before closing the chat
+ onClose: () => {
+ console.log('Closing chat window.');
+ } // @optional: Callback before closing the chat
});
};
diff --git a/copilot-widget/lib/components/ChatHeader.tsx b/copilot-widget/lib/components/ChatHeader.tsx
index a8aa911a7..73f75a1cf 100644
--- a/copilot-widget/lib/components/ChatHeader.tsx
+++ b/copilot-widget/lib/components/ChatHeader.tsx
@@ -13,8 +13,7 @@ import { useLang } from "@lib/contexts/LocalesProvider";
import { useConfigData } from "@lib/contexts/ConfigData.tsx";
import { useSocket } from "@lib/contexts/SocketProvider";
-function WarnBeforeCloseDialog() {
- const [, , SetState] = useWidgetState();
+function WarnBeforeCloseDialog({ onClose }: { onClose: () => void }) {
const { get } = useLang();
return (
@@ -33,13 +32,7 @@ function WarnBeforeCloseDialog() {
- {
- SetState(false);
- }}
- >
- {get("yes-exit")}
-
+ {get("yes-exit")}
{get("no-cancel")}
@@ -84,6 +77,15 @@ export default function ChatHeader() {
const [, , SetState] = useWidgetState();
const { data } = useInitialData();
const config = useConfigData();
+
+ const onClose = () => {
+ SetState(false);
+
+ if (config.onClose !== undefined) {
+ config.onClose();
+ }
+ };
+
return (
@@ -92,11 +94,11 @@ export default function ChatHeader() {
{config?.warnBeforeClose === false ? (
- SetState(false)}>
+
) : (
-
+
)}
diff --git a/copilot-widget/lib/locales/de.locale.ts b/copilot-widget/lib/locales/de.locale.ts
new file mode 100644
index 000000000..dd59154b5
--- /dev/null
+++ b/copilot-widget/lib/locales/de.locale.ts
@@ -0,0 +1,13 @@
+import { TranslatableMessages } from "./types";
+
+export const deLocale: TranslatableMessages = {
+ ok: "OK",
+ agree: "Zustimmen",
+ cancel: "Stornieren",
+ "yes-exit": "Beenden",
+ "yes-reset": "Chat zurücksetzen",
+ "no-cancel": "Stornieren",
+ "are-you-sure": "Möchten Sie den Chat beenden?",
+ recording: "Aufzeichnung...",
+ "thank-you": "Danke!",
+};
diff --git a/copilot-widget/lib/locales/en.locale.ts b/copilot-widget/lib/locales/en.locale.ts
index b88512d75..25e734125 100644
--- a/copilot-widget/lib/locales/en.locale.ts
+++ b/copilot-widget/lib/locales/en.locale.ts
@@ -1,13 +1,13 @@
import { TranslatableMessages } from "./types";
export const enLocale: TranslatableMessages = {
- ok: "Ok",
+ ok: "OK",
agree: "Agree",
cancel: "Cancel",
- "yes-exit": "Yes, exit",
- "yes-reset": "Yes, reset",
- "no-cancel": "No, cancel",
+ "yes-exit": "Exit",
+ "yes-reset": "Reset",
+ "no-cancel": "Cancel",
"are-you-sure": "Are you sure?",
- recording: "Recording",
- "thank-you": "Thank you",
+ recording: "Recording...",
+ "thank-you": "Thanks!",
};
diff --git a/copilot-widget/lib/locales/fr.locale.ts b/copilot-widget/lib/locales/fr.locale.ts
new file mode 100644
index 000000000..7e445f70b
--- /dev/null
+++ b/copilot-widget/lib/locales/fr.locale.ts
@@ -0,0 +1,13 @@
+import { TranslatableMessages } from "./types";
+
+export const frLocale: TranslatableMessages = {
+ ok: "D'accord",
+ agree: "Accepter",
+ cancel: "Annuler",
+ "yes-exit": "Oui, sors",
+ "yes-reset": "Oui, réinitialiser",
+ "no-cancel": "Non, annule",
+ "are-you-sure": "Es-tu sûr?",
+ recording: "Enregistrement...",
+ "thank-you": "Merci!",
+};
diff --git a/copilot-widget/lib/locales/helper.ts b/copilot-widget/lib/locales/helper.ts
index 53d65fb26..6860b52f9 100644
--- a/copilot-widget/lib/locales/helper.ts
+++ b/copilot-widget/lib/locales/helper.ts
@@ -1,11 +1,15 @@
import { enLocale } from "./en.locale";
import { arLocale } from "./ar.locale";
import { nlLocale } from "./nl.locale.ts";
+import { frLocale } from "./fr.locale.ts";
+import { deLocale } from "./de.locale.ts";
const locales = {
en: enLocale,
ar: arLocale,
nl: nlLocale,
+ fr: frLocale,
+ de: deLocale,
};
export type LangType = keyof typeof locales;
diff --git a/copilot-widget/lib/locales/nl.locale.ts b/copilot-widget/lib/locales/nl.locale.ts
index 41a50315d..3d3dd2174 100644
--- a/copilot-widget/lib/locales/nl.locale.ts
+++ b/copilot-widget/lib/locales/nl.locale.ts
@@ -1,11 +1,11 @@
import { TranslatableMessages } from "./types";
export const nlLocale: TranslatableMessages = {
- ok: "Ok",
+ ok: "OK",
agree: "Akkoord",
cancel: "Annuleren",
"yes-exit": "Beëindigen",
- "yes-reset": "Reset chat",
+ "yes-reset": "Reset",
"no-cancel": "Annuleren",
"are-you-sure": "Wil je de chat beëindigen?",
recording: "Aan het opnemen...",
diff --git a/copilot-widget/lib/screens/ChatScreen.tsx b/copilot-widget/lib/screens/ChatScreen.tsx
index 7654f4681..4f70e0295 100644
--- a/copilot-widget/lib/screens/ChatScreen.tsx
+++ b/copilot-widget/lib/screens/ChatScreen.tsx
@@ -44,7 +44,7 @@ export default function ChatScreen() {
>
{
- // If there are initial message, show it.
+ // If there are initial messages, show them.
initialMessage &&
}
void;
containerProps?: React.DetailedHTMLProps<
React.HTMLAttributes,
HTMLDivElement