feedback

Author: latin-panda

packages/web-forms/locales/strings_en.json

@@ -48,11 +48,11 @@
     "developer_comment": "Displays the GPS longitude coordinate. {longitude} is the numeric longitude value."
   },
   "validation_message.required.error": {
-    "string": "Condition not satisfied: required",
+    "string": "This field is required.",
     "developer_comment": "Default error shown when a required field has no value and the form designer did not specify a custom message."
   },
   "validation_message.constraint.error": {
-    "string": "Condition not satisfied: constraint",
+    "string": "This value doesn't meet the constraint.",
     "developer_comment": "Default error shown when a field's value fails a constraint and the form designer did not specify a custom message."
   },
   "map_async.load_error.message": {

packages/web-forms/src/components/common/ValidationMessage.i18n.json

@@ -1,10 +1,10 @@
 {
   "validation_message.required.error": {
-    "string": "Condition not satisfied: required",
+    "string": "This field is required.",
     "developer_comment": "Default error shown when a required field has no value and the form designer did not specify a custom message."
   },
   "validation_message.constraint.error": {
-    "string": "Condition not satisfied: constraint",
+    "string": "This value doesn't meet the constraint.",
     "developer_comment": "Default error shown when a field's value fails a constraint and the form designer did not specify a custom message."
   }
 }

packages/web-forms/src/components/common/ValidationMessage.vue

@@ -26,17 +26,22 @@ const defaultMessage = computed(() => {
 	if (!props.violation || props.violation.message) {
 		return null;
 	}
-	return t(`validation_message.${props.violation.condition}.error`);
+
+	if (props.violation.condition === 'required') {
+		return t('validation_message.required.error')
+	}
+
+	return t('validation_message.constraint.error');
 });
 </script>
 
 <template>
 	<div :class="{ 'validation-placeholder': addPlaceholder }">
 		<span v-show="showMessage" class="validation-message">
-			<template v-if="defaultMessage">{{ defaultMessage }}</template>
-			<template v-else-if="violation?.message">
+			<template v-if="violation?.message">
 				<MarkdownBlock v-for="elem in violation.message.formatted" :key="elem.id" :elem="elem" />
 			</template>
+			<template v-else-if="defaultMessage">{{ defaultMessage }}</template>
 		</span>
 	</div>
 </template>

packages/xforms-engine/src/lib/reactivity/createTranslationState.ts

@@ -59,24 +59,24 @@ export const createTranslationState = (
 	const languageNames = evaluator.getLanguages();
 	const explicitDefaultLanguageName = evaluator.getExplicitDefaultLanguage();
 
-	let initialActiveLanguage: ActiveLanguage;
+	let defaultLanguage: ActiveLanguage;
 	let languages: FormLanguages;
 
 	if (activeLanguageName == null) {
-		initialActiveLanguage = { isSyntheticDefault: true, language: '', isDefault: false };
-		languages = [initialActiveLanguage];
+		defaultLanguage = { isSyntheticDefault: true, language: '', isDefault: false };
+		languages = [defaultLanguage];
 	} else {
 		const formLanguages = languageNames.map((language) => ({
 			language,
 			locale: extractLocale(language),
 			isDefault: language === explicitDefaultLanguageName,
 		}));
 
-		initialActiveLanguage = formLanguages.find((l) => l.language === activeLanguageName)!;
+		defaultLanguage = formLanguages.find((l) => l.language === activeLanguageName)!;
 		languages = formLanguages as [FormLanguage, ...FormLanguage[]];
 	}
 
-	const [getActiveLanguage, baseSetActiveLanguage] = createSignal(initialActiveLanguage);
+	const [getActiveLanguage, baseSetActiveLanguage] = createSignal(defaultLanguage);
 
 	const setActiveLanguage: SimpleAtomicStateSetter<FormLanguage> = (value) => {
 		return baseSetActiveLanguage(value);