Formik and Yup libraries have been introduced to handle forms and their validation, respectively. This improves the clarity and robustness of form validation. Handled logic includes character restrictions, requirement conditions, and minimum and maximum length constraints for the 'username', 'email', and 'question' fields of the contact form.
20 lines
775 B
TypeScript
20 lines
775 B
TypeScript
import * as Yup from 'yup';
|
|
|
|
export const validationSchema = Yup.object().shape({
|
|
username: Yup.string()
|
|
.min(3, 'Username should be at least 3 characters')
|
|
.max(16, 'Username should not exceed 16 characters')
|
|
.matches(/^[a-zA-Z0-9_]*$/, 'Username should only include alphanumeric characters and underscore')
|
|
.required('Username is required'),
|
|
|
|
email: Yup.string()
|
|
.email('Invalid email')
|
|
.min(3, 'Email should be at least 3 characters')
|
|
.max(254, 'Email should not exceed 254 characters')
|
|
.required(),
|
|
|
|
question: Yup.string()
|
|
.min(10, 'Question should be at least 10 characters')
|
|
.max(2000, 'Question should not exceed 2000 characters')
|
|
.required('Question is required')
|
|
}); |