diff --git a/frontend/src/app/dashboard/glossaries/EditGlossaryDialog.tsx b/frontend/src/app/dashboard/glossaries/EditGlossaryDialog.tsx index f322fb7..42a7f31 100644 --- a/frontend/src/app/dashboard/glossaries/EditGlossaryDialog.tsx +++ b/frontend/src/app/dashboard/glossaries/EditGlossaryDialog.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useState, useCallback, useRef } from 'react'; +import { useState, useCallback, useRef, useEffect } from 'react'; import { Dialog, DialogContent, @@ -27,6 +27,13 @@ interface EditGlossaryDialogProps { isSaving: boolean; } +/** Get the display target for a term based on the selected target language */ +function getDisplayTarget(term: { target: string; translations?: Record }, lang: string): string { + if (lang === 'multi' || lang === 'en') return term.target; + const translations = term.translations || {}; + return translations[lang] || term.target; +} + export function EditGlossaryDialog({ open, onOpenChange, @@ -39,14 +46,19 @@ export function EditGlossaryDialog({ const [targetLanguage, setTargetLanguage] = useState('multi'); const [terms, setTerms] = useState([]); const fileInputRef = useRef(null); - const isInitialized = useRef(false); + // Initialize when glossary changes if (glossary && !isInitialized.current) { setName(glossary.name); setSourceLanguage(glossary.source_language || 'fr'); setTargetLanguage(glossary.target_language || 'multi'); - setTerms(glossary.terms.map(t => ({ source: t.source, target: t.target }))); + // Store terms with full translations data + setTerms(glossary.terms.map(t => ({ + source: t.source, + target: t.target, + translations: t.translations || {}, + }))); isInitialized.current = true; } @@ -54,11 +66,28 @@ export function EditGlossaryDialog({ isInitialized.current = false; } + // When target language changes, remap displayed targets from translations dict + const handleTargetLanguageChange = useCallback((newLang: string) => { + setTargetLanguage(newLang); + // Don't remap if multi or en — those use the default target field + if (newLang === 'multi' || newLang === 'en') return; + setTerms(prev => prev.map(t => { + const translations = (t as any).translations || {}; + const langTarget = translations[newLang]; + if (langTarget) { + // Show the language-specific translation as the target + return { source: t.source, target: langTarget, translations }; + } + // No translation for this language — keep the default English target + return t; + })); + }, []); + const handleSave = useCallback(async () => { if (!glossary || !name.trim()) return; - + const validTerms = terms.filter(t => t.source.trim() && t.target.trim()); - + await onSave(glossary.id, { name: name.trim(), source_language: sourceLanguage, @@ -69,7 +98,7 @@ export function EditGlossaryDialog({ const handleExport = useCallback(() => { if (!glossary) return; - + const glossaryWithCurrentTerms: Glossary = { ...glossary, name, @@ -77,11 +106,11 @@ export function EditGlossaryDialog({ id: `temp-${i}`, source: t.source, target: t.target, - translations: t.translations || {}, + translations: (t as any).translations || {}, created_at: null, })), }; - + exportGlossaryToCsv(glossaryWithCurrentTerms); }, [glossary, name, terms]); @@ -132,7 +161,7 @@ export function EditGlossaryDialog({ }); }; reader.readAsText(file); - + e.target.value = ''; }, [toast]); @@ -144,7 +173,7 @@ export function EditGlossaryDialog({ Edit Glossary - Update the glossary name and term pairs. + Update the glossary name, language pair, and terms. @@ -179,7 +208,7 @@ export function EditGlossaryDialog({