- Translations completed for Front-End, Configs (e.g. Forms) and free text.

- Allowed_languages and default_language now part of Tenant Make iso Tenant
- Introduction of Translation into Traicie Selection Specialist

eveai_chat_client/static/assets/js/components/MessageHistory.js

@@ -27,12 +27,21 @@ export const MessageHistory = {
     data() {
         return {
             isAtBottom: true,
-            unreadCount: 0
+            unreadCount: 0,
+            originalFirstMessage: null,
+            isTranslating: false, // Vlag om dubbele vertaling te voorkomen
+            languageChangeHandler: null // Referentie voor cleanup
         };
     },
     mounted() {
         this.scrollToBottom();
         this.setupScrollListener();
+        this.listenForLanguageChanges();
+
+        // Sla de originele inhoud van het eerste bericht op als er maar één bericht is
+        if (this.messages.length === 1 && this.messages[0].sender === 'ai') {
+            this.originalFirstMessage = this.messages[0].content;
+        }
     },
     updated() {
         if (this.autoScroll && this.isAtBottom) {
@@ -40,6 +49,73 @@ export const MessageHistory = {
         }
     },
     methods: {
+        listenForLanguageChanges() {
+            // Maak een benoemde handler voor cleanup
+            this.languageChangeHandler = (event) => {
+                if (event.detail && event.detail.language) {
+                    this.translateFirstMessageIfNeeded(event.detail.language);
+                }
+            };
+
+            document.addEventListener('language-changed', this.languageChangeHandler);
+        },
+
+        async translateFirstMessageIfNeeded(language) {
+            // Voorkom dubbele vertaling
+            if (this.isTranslating) {
+                console.log('Vertaling al bezig, overslaan...');
+                return;
+            }
+
+            // Alleen vertalen als er precies één bericht is en het is van de AI
+            if (this.messages.length === 1 && this.messages[0].sender === 'ai') {
+                const firstMessage = this.messages[0];
+
+                // Controleer of we een origineel bericht hebben om te vertalen
+                const contentToTranslate = this.originalFirstMessage || firstMessage.content;
+
+                // Sla het originele bericht op als we dat nog niet hebben gedaan
+                if (!this.originalFirstMessage) {
+                    this.originalFirstMessage = contentToTranslate;
+                }
+
+                // Zet de vertaling vlag
+                this.isTranslating = true;
+
+                try {
+                    // Controleer of de vertaalclient beschikbaar is
+                    if (!window.TranslationClient || typeof window.TranslationClient.translate !== 'function') {
+                        console.error('TranslationClient.translate is niet beschikbaar');
+                        return;
+                    }
+
+                    console.log(`Vertalen van eerste bericht naar ${language}`);
+
+                    // Vertaal het bericht met de juiste context
+                    const response = await window.TranslationClient.translate(
+                        contentToTranslate,
+                        language,
+                        null, // source_lang (auto-detect)
+                        'first_message', // context
+                        this.apiPrefix // API prefix voor tenant routing
+                    );
+
+                    if (response.success) {
+                        console.log('Vertaling van eerste bericht voltooid:', response.translated_text);
+                        // Update het bericht zonder een indicator te tonen
+                        firstMessage.content = response.translated_text;
+                    } else {
+                        console.error('Vertaling van eerste bericht mislukt:', response.error);
+                    }
+                } catch (error) {
+                    console.error('Fout bij het vertalen van eerste bericht:', error);
+                } finally {
+                    // Reset de vertaling vlag
+                    this.isTranslating = false;
+                }
+            }
+        },
+
         scrollToBottom() {
             const container = this.$refs.messagesContainer;
             if (container) {
@@ -98,6 +174,11 @@ export const MessageHistory = {
         if (container) {
             container.removeEventListener('scroll', this.handleScroll);
         }
+
+        // Cleanup language change listener
+        if (this.languageChangeHandler) {
+            document.removeEventListener('language-changed', this.languageChangeHandler);
+        }
     },
     template: `
         <div class="message-history-container">