Implement contact integration to collection and dataset page

[ChengShi-1]

What this PR does / why we need it:

The goal is to replicate the Contact feature on the Collection Page and Dataset Page.

• contact button with tooltip
• contact form
• CAPTCHA mechanism
• notification

Which issue(s) this PR closes:

• Closes implement Collection Page: Contact button and form  #569

Special notes for your reviewer:

Not sure contact factory is written in a correct way or not to create contact repository

Suggestions on how to test this:

1. Perform the following tests in both Login and Logout states: If not logged in, there is an input box for emails
2. Verify that the Contact button:

• Exists on the page.
• Is clickable.

3. Validate form submission:

• Display errors and prevent submission if:
  • Required fields are empty.
  • The email format is incorrect.
  • The provided answer is incorrect.

4. Allow form submission if all inputs are correct:
   Show a success alert on the page after submission.

Does this PR introduce a user interface change? If mockups are available, please link/include them here:

Is there a release notes update needed for this change?:

No

Additional documentation:

[coveralls]

coverage: 97.636% (+0.4%) from 97.219%
when pulling 286305a on 569-implement-collection-page-contact-button-and-form
into 4338c7e on develop.

[g-saracca]

I left some suggestions to improve the code and organize it in a better way.
I think the way you name the contact repository methods is a bit confusing, ContactDTO, submitContactInfo, useSubmitContact. Maybe something more related to what you are doing which is sending feedback to the owners.
On the other hand I think you had a confusion between repositories and factories, factories is a convention that the project has to create or instantiate the components at page level.
And repositories must be created only once in these factories and passed through props to the component that wants to use it.

Also you can simplify success message with a toast instead of an alert.

Please take a look at all the comments first and then see what needs to be changed.
If you need any help let me know, after these changes I will analyze the UI and functionality in more depth.

[ChengShi-1]

@g-saracca Hi German, thanks for your feedback. I made changes regarding to reviews. Please help to check them again, ty!

[g-saracca]

Some more comments, thanks for addressing previous requested changes.

[g-saracca]

Is it ok to name it contact? isn't this the info that the use case return after success?
But isn't the same info you are sending?

[ChengShi-1]

It has a little bit difference, the reply message's body would be Hello ${User Name},\n\nYou have just been sent the following message from ${FromEmail} via the Root hosted dataset ... but I didn't use the reply message in Contact part in front end repo. I'll rename it somehow meaningful