Form validation not updationg when values are updated. but errors on load correctly

Solution 1:

The issue is occurring because your not actually resetting

let errors = initialErrorsProps;

In valueValidator.tsx like you think you are.

When you do

errors.email = 'Email name required';

You're actually updating is the reference to the initialErrorsProps const. So you'll see when you resubmit after failed validation, errors is already filled with the previous values.

This occurs because objects are passed by reference. More details are here: https://stackoverflow.com/a/13104500/7528450

A simple solution would be just to set your object at the beginning of the method:

let errors = {
   username: '',
   email: '',
};