- 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/ChatInput.js

@@ -4,20 +4,20 @@
     // Anders moet je ervoor zorgen dat MaterialIconManager.js eerder wordt geladen
     // en iconManager beschikbaar is via window.iconManager
 
-    // Voeg stylesheet toe voor ChatInput-specifieke stijlen
-    const addStylesheet = () => {
-        if (!document.querySelector('link[href*="chat-input.css"]')) {
-            const link = document.createElement('link');
-            link.rel = 'stylesheet';
-            link.href = '/static/assets/css/chat-input.css';
-            document.head.appendChild(link);
-        }
-    };
+// Voeg stylesheet toe voor ChatInput-specifieke stijlen
+const addStylesheet = () => {
+    if (!document.querySelector('link[href*="chat-input.css"]')) {
+        const link = document.createElement('link');
+        link.rel = 'stylesheet';
+        link.href = '/static/assets/css/chat-input.css';
+        document.head.appendChild(link);
+    }
+};
 
-    // Laad de stylesheet
-    addStylesheet();
+// Laad de stylesheet
+addStylesheet();
 
-    export const ChatInput = {
+export const ChatInput = {
     name: 'ChatInput',
     components: {
         'dynamic-form': window.DynamicForm
@@ -29,6 +29,22 @@
         if (window.iconManager && this.formData && this.formData.icon) {
             window.iconManager.ensureIconsLoaded({}, [this.formData.icon]);
         }
+
+        // Maak een benoemde handler voor betere cleanup
+        this.languageChangeHandler = (event) => {
+            if (event.detail && event.detail.language) {
+                this.handleLanguageChange(event);
+            }
+        };
+
+        // Luister naar taalwijzigingen
+        document.addEventListener('language-changed', this.languageChangeHandler);
+    },
+    beforeUnmount() {
+        // Verwijder event listener bij unmount met de benoemde handler
+        if (this.languageChangeHandler) {
+            document.removeEventListener('language-changed', this.languageChangeHandler);
+        }
     },
     props: {
         currentMessage: {
@@ -41,7 +57,7 @@
         },
         placeholder: {
             type: String,
-            default: 'Typ je bericht hier... (Enter om te verzenden, Shift+Enter voor nieuwe regel)'
+            default: 'Typ je bericht hier... - Enter om te verzenden, Shift+Enter voor nieuwe regel'
         },
         maxLength: {
             type: Number,
@@ -103,7 +119,10 @@
     data() {
         return {
             localMessage: this.currentMessage,
-            formValues: {}
+            formValues: {},
+            translatedPlaceholder: this.placeholder,
+            isTranslating: false,
+            languageChangeHandler: null
         };
     },
     computed: {
@@ -150,6 +169,56 @@
         }
     },
     methods: {
+        handleLanguageChange(event) {
+            if (event.detail && event.detail.language) {
+                this.translatePlaceholder(event.detail.language);
+            }
+        },
+
+        async translatePlaceholder(language) {
+            // Voorkom dubbele vertaling
+            if (this.isTranslating) {
+                console.log('Placeholder vertaling al bezig, overslaan...');
+                return;
+            }
+
+            // Zet de vertaling vlag
+            this.isTranslating = true;
+
+            // Gebruik de originele placeholder als basis voor vertaling
+            const originalText = this.placeholder;
+
+            try {
+                // Controleer of TranslationClient beschikbaar is
+                if (!window.TranslationClient || typeof window.TranslationClient.translate !== 'function') {
+                    console.error('TranslationClient.translate is niet beschikbaar voor placeholder');
+                    return;
+                }
+
+                // Gebruik TranslationClient zonder UI indicator
+                const apiPrefix = window.chatConfig?.apiPrefix || '';
+                const response = await window.TranslationClient.translate(
+                    originalText,
+                    language,
+                    null, // source_lang (auto-detect)
+                    'chat_input_placeholder', // context
+                    apiPrefix // API prefix voor tenant routing
+                );
+
+                if (response.success) {
+                    // Update de placeholder
+                    this.translatedPlaceholder = response.translated_text;
+                } else {
+                    console.error('Vertaling placeholder mislukt:', response.error);
+                }
+            } catch (error) {
+                console.error('Fout bij vertalen placeholder:', error);
+            } finally {
+                // Reset de vertaling vlag
+                this.isTranslating = false;
+            }
+        },
+
         initFormValues() {
             if (this.formData && this.formData.fields) {
                 console.log('Initializing form values for fields:', this.formData.fields);
@@ -300,7 +369,7 @@
                         ref="messageInput"
                         v-model="localMessage"
                         @keydown="handleKeydown"
-                        :placeholder="placeholder"
+                        :placeholder="translatedPlaceholder"
                         rows="1"
                         :disabled="isLoading"
                         :maxlength="maxLength"