This commit splits the HookValidatedInput component into three separate functions to improve modularity and readability:
- `getValidationState`: Calculates the validation state ('default', 'success', 'error') based on whether the input is pristine and if there is an error message.
- `ValidatedInputAndTextArea`: Renders the TextInput or TextArea component, utilizing the `getValidationState` output.
- `ErrorMessage`: Displays validation error messages.
This refactoring enhances code maintainability and testability, and the updated structure is now implemented for the username field.
This resolves `Warning: validateDOMNesting(...): <form> cannot appear as a descendant of <form>.` warning in test output. There were two `<Form>` components nested in each other.
This commit introduces the user information step with the following fields:
(*) `userName` field
(*) `password` field
(*) add unit tests for create and edit mode
