EQM: Section form validation improvements

[nucleogenesis]

Overview

Follow-up to comments here.

Overall, this issue is to address the issues reported by Peter. The changes in that PR which introduced these issues are in this commit

At a high level, we need to be sure that the form's validation flags are being set appropriately as things happen. It feels to me like there are a lot more moving parts than should be necessary, but refactoring the whole thing proprly be more work than it's worth at this point, so some key things to consider:

• KTextbox props - showInvalidText is a sort of override saying "show errors no matter what when true", whereas invalidText is the text and invalid is just telling KTextbox "this is invalid, do with it what you will" (I'm sorry... I added that prop but now I regret it lol

• The error messages should show when the user needs to know it -- for example, when they're currently typing into the title box, if their title is a dupe, we show the error, but if they're not focusing it, then we hide it -- but if they click to submit, we focus the title and show the error.

• Cannot make sections with duplicate titles

• Improved validations UX (consider reaching out in #kolibri-dev for guidance if you have questions about the best UX for a particular item)

[nucleogenesis]

Be sure that we focus & scrollTo the topmost error validation.

Also include a "Are you sure?" message for top-most quiz.

[marcellamaki]

Example of focus/scroll to on mobile being particularly helpful. Also router navigation guards so that when a user can't accidentally (or unthinkingly) just close out of the modal and lose the quiz

mobile-quiz.mp4