diff --git a/frontend/src/components/TranslationFields.vue b/frontend/src/components/TranslationFields.vue index 449df90..515cd96 100644 --- a/frontend/src/components/TranslationFields.vue +++ b/frontend/src/components/TranslationFields.vue @@ -18,9 +18,21 @@ const emit = defineEmits<{ 'update:translations': [value: TranslationMap]; }>(); -const { t } = useI18n(); +const { locale, t } = useI18n(); +const fallbackLanguage: Language = { code: 'en', name: 'English', enabled: true, isDefault: true, sortOrder: 0 }; const visibleLanguages = computed(() => props.languages.filter((language) => language.enabled)); -const defaultLanguage = computed(() => visibleLanguages.value.find((language) => language.isDefault) ?? visibleLanguages.value[0]); +const defaultLanguage = computed(() => visibleLanguages.value.find((language) => language.isDefault) ?? visibleLanguages.value[0] ?? fallbackLanguage); +const currentLanguage = computed(() => { + const currentLocale = String(locale.value || defaultLanguage.value.code); + return visibleLanguages.value.find((language) => language.code === currentLocale) ?? defaultLanguage.value; +}); +const isDefaultLanguage = computed(() => currentLanguage.value.code === defaultLanguage.value.code); +const currentValue = computed({ + get: () => fieldValue(currentLanguage.value), + set: (value: string) => updateField(currentLanguage.value, value) +}); +const currentPlaceholder = computed(() => fieldPlaceholder(currentLanguage.value)); +const currentRequired = computed(() => Boolean(props.required && (isDefaultLanguage.value || props.baseValue.trim() === ''))); function fieldValue(language: Language): string { if (language.code === defaultLanguage.value?.code) { @@ -58,23 +70,19 @@ function updateField(language: Language, value: string) { emit('update:translations', nextTranslations); } -function inputValue(event: Event): string { - return event.target instanceof HTMLInputElement ? event.target.value : ''; -}