Trim and validate locked fields (if they are required)

This commit is contained in:
Jérémy Munsch 2023-09-05 11:41:08 +02:00
parent 9aa660fdb2
commit 182c56b72c
No known key found for this signature in database
GPG key ID: 18361AF3BFEC0FEC

View file

@ -166,6 +166,7 @@ class ContactDetailsScreen extends React.Component {
const contact = Object.assign({}, this.state.contact);
const defaultForms = Form.getAll(InputStatus.DEFAULT);
const lockedForms = Form.getAll(InputStatus.LOCKED);
console.debug('save Contact');
@ -181,19 +182,27 @@ class ContactDetailsScreen extends React.Component {
console.debug('invalid prop email');
error = error.concat(i18n.t('error.invalid_email_address') + '.\n');
}
if (contact.firstname && contact.firstname.length >= 255) {
console.debug('invalid prop invalid_firstname');
error = error.concat(i18n.t('contact.invalid_firstname') + '.\n');
}
if (contact.lastname && contact.lastname.length >= 255) {
console.debug('invalid prop lastname');
error = error.concat(i18n.t('contact.invalid_lastname') + '.\n');
}
if (contact.phone && contact.phone.length >= 255) {
console.debug('invalid prop phone');
error = error.concat(i18n.t('contact.invalid_phone') + '.\n');
}
const lockedFields = ['firstname', 'lastname', 'phone'];
lockedFields.forEach(fieldName => {
const form = lockedForms.find(inputForm => inputForm.name === fieldName);
if (!form) {
throw new Error(`failed to get form ${fieldName}`);
}
if (contact[fieldName]?.length) {
contact[fieldName] = contact[fieldName].trim();
}
if (form.required && !contact[fieldName]?.length) {
error = error.concat(
i18n.t('contact_details_s.input_required', {
placeholder: form.placeholder[i18n.locale],
}) + '.\n',
);
}
if (contact[fieldName] && contact[fieldName]?.length >= 255) {
console.debug(`invalid prop invalid_${fieldName}`);
error = error.concat(i18n.t(`contact.invalid_${fieldName}`) + '.\n');
}
});
contact.data.forEach(input => {
const formToValidate = defaultForms.find(
@ -208,18 +217,21 @@ class ContactDetailsScreen extends React.Component {
);
}
if (
input?.value?.length &&
input?.value?.length > 255 &&
(formToValidate.type === InputType.EMAIL ||
formToValidate.type === InputType.PHONE ||
formToValidate.type === InputType.TEXT)
formToValidate.type === InputType.EMAIL ||
formToValidate.type === InputType.PHONE ||
formToValidate.type === InputType.TEXT
) {
console.debug('invalid data ', input.formSlug);
error = error.concat(
i18n.t('contact_details_s.input_too_long', {
placeholder: formToValidate.placeholder[i18n.locale],
}) + '.\n',
);
if (input?.value?.length) {
input.value = input.value.trim();
}
if (input?.value?.length > 255) {
console.debug('invalid data ', input.formSlug);
error = error.concat(
i18n.t('contact_details_s.input_too_long', {
placeholder: formToValidate.placeholder[i18n.locale],
}) + '.\n',
);
}
}
if (
input?.value?.length &&
@ -1075,36 +1087,39 @@ class ContactDetailsScreen extends React.Component {
keyboardType,
isVisible,
) {
/** @type {typeof import('./../Models/Contact').ContactData} */
const contact = this.state.contact;
/** @type {Array<import('./../Models/Contact').InputDataType>} */
const allInputs = this.state.allInputs;
const changeText = text => {
if (isDefault) {
const dataIndex = contact.data.findIndex(
input => input.formSlug === slug,
);
// * Set value on data.
contact.data[dataIndex].value = text;
console.debug('data ', contact.data[dataIndex].value);
} else {
// * Set value on model
contact[slug] = text;
console.debug('prop ', contact[slug]);
}
allInputs[index].value = text;
this.setState({
contact: contact,
allInputs: allInputs,
});
};
return this.wrapper(
placeHolder,
requiredStr,
isVisible,
<TextInput
value={this.state.allInputs[index].value}
onChangeText={text => {
text = text.trim();
/** @type {typeof import('./../Models/Contact').ContactData} */
const contact = this.state.contact;
if (isDefault) {
const dataIndex = contact.data.findIndex(
input => input.formSlug === slug,
);
// * Set value on data.
contact.data[dataIndex].value = text;
console.debug('data ', contact.data[dataIndex].value);
} else {
// * Set value on model
contact[slug] = text;
console.debug('prop ', contact[slug]);
}
/** @type {Array<import('./../Models/Contact').InputDataType>} */
const allInputs = this.state.allInputs;
allInputs[index].value = text;
this.setState({
contact: contact,
allInputs: allInputs,
});
}}
onEndEditing={event =>
changeText((event.nativeEvent?.text ?? '').trim())
}
onChangeText={changeText}
style={{ ...styles.input, ...{ display: isVisible ? 'flex' : 'none' } }}
placeholder={`${placeHolder} ${requiredStr}`}
autoCapitalize={'none'}