Merge branch 'feat/sync_cloud' of github.com:openchatai/OpenCopilot i…

…nto feat/sync_cloud

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
        });
      };
    </script>

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() {
         </DialogHeader>
         <div className="flex flex-row items-center justify-center gap-2">
           <Button asChild variant="destructive" className="font-semibold">
-            <DialogClose
-              onClick={() => {
-                SetState(false);
-              }}
-            >
-              {get("yes-exit")}
-            </DialogClose>
+            <DialogClose onClick={onClose}>{get("yes-exit")}</DialogClose>
           </Button>
           <Button asChild variant="secondary" className="font-semibold">
             <DialogClose>{get("no-cancel")}</DialogClose>
@@ -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 (
     <header className="border-b border-b-black/10 w-full">
       <div className="p-2 w-full flex items-center justify-between">
@@ -92,11 +94,11 @@ export default function ChatHeader() {
         </h1>
         <div className="flex items-center gap-3">
           {config?.warnBeforeClose === false ? (
-            <button onClick={() => SetState(false)}>
+            <button onClick={onClose}>
               <X size={20} />
             </button>
           ) : (
-            <WarnBeforeCloseDialog />
+            <WarnBeforeCloseDialog onClose={onClose} />
           )}
         </div>
       </div>

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!",
+};

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!",
 };

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!",
+};

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;
 

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...",

copilot-widget/lib/screens/ChatScreen.tsx

@@ -44,7 +44,7 @@ export default function ChatScreen() {
       >
         <div className="flex flex-1 w-full min-h-fit mt-auto flex-col py-2 max-h-full items-center gap-1 last:fade-in-right">
           {
-            // If there are initial message, show it.
+            // If there are initial messages, show them.
             initialMessage && <BotInitialMessage message={initialMessage} />
           }
           <Map

copilot-widget/lib/types/options.ts

@@ -13,6 +13,7 @@ export type Options = {
   debug?: boolean;
   language?: LangType;
   warnBeforeClose?: boolean;
+  onClose?: () => void;
   containerProps?: React.DetailedHTMLProps<
     React.HTMLAttributes<HTMLDivElement>,
     HTMLDivElement