Bug: submitting a form after an error

[pbastia]

Describe the Bug:

The form submit logic is broken when the form has had errors.
This was fixed (the dirty way) for anything using the MultiStepFormWithTasklist component in #438

• Fix (fast and dirty): add an onError={() => setCanContinue(false)} on each of the impacted forms
• Fix (better but a bit more work): refactor the ReportingStepButtons component to include the logic for "canContinue" and the useEffect. To submit the form, we'll just need to grab a ref for the button with the submit tag and call click() on it if we can continue.
  This way we can remove all the external logic on all the form components

Probability:

(How likely the bug is to happen, scored from 1-5. For example, probability of 5 is something like "it happens to all users every time they log in." whereas probability of 1 "only happens to certain users when a really specific and unlikely path is followed.")

Impact:

(How bad the bug is when it does happen, scored from 1-5. For example, effect of 5 is "the entire app crashes and makes it unusable for all users" or "the bug causes the wrong data to be saved, with critical information (e.g. payment) being affected." whereas effect of 1 is "It makes some styling look a little bit weird.")

Steps to reproduce the behaviour:

1. Step Lets use common phrasing #1
2. Step Add missing topics #2
3. Step Add project lifecycle badge #3

Screenshots:

Additional information:

OS: [e.g. iOS]
Browser: [e.g. chrome, safari]
Version: [e.g. 22]

Additional Context

[pbastia]

This card might address #476 too