Improve UI and wording for clarity

Problem/Motivation

The module works very well, but I've heard from clients that users get a little confused with the wording and interface when setting up the email OTP. I believe some of the text could be improved to make the workflow clearer for users.

Steps to reproduce

1. When user is enabling email OTP for the first time, the checkbox label is not very clear. I've heard that users usually expect to receive an access code when they submit this form, probably to verify they own the email address they're enabling email OTP for.

However, they get surprised when they receive an email saying OTP is enabled, and they didn't get the access code they were expecting. We know an access code is not supposed to be sent when enabling, but users may get confused with that message.

2. For an user who has already enabled email OTP, when they log in to the site, they will see the following interface to send the authentication code.

Although the button "Verify" is clearly disabled, having the input element there requesting the authentication code at this moment is a bit misleading. I've heard user see that and they think the authentication code has already been sent, so they keep checking their email, until they realize they still need to click the button "Send". Some of them even think they may received the authentication code in a different email address, since there's no indication of what email address the authentication code is sent.

3. After the authentication code has been sent, the user is finally able to add the authentication code and verify it. But similar to the above, we don't let the user know what email address the email was sent to. We also don't say anything about how long the authentication code is valid.

Proposed resolution

Improve the interfaces and texts above to make them clearer for users, according to the proposed user interface changes below.

Remaining tasks

None.

User interface changes

1. Modify the wording on the email OTP setup page, making it clear that the action will enable email OTP right away.

2. On the interface to send the authentication code, remove the authentication code input element, and add a text informing the user that they must click on the button to send the authentication code to their email address. Show a masked version of their email address, for enhanced privacy protection. It's debatable if we should keep the button "Verify", but we can keep it as disabled, even to avoid breaking the current tests.

3. On the interface to verify the authentication code, we let the user know that the authentication code has been sent to their email address (again, a masked version of it), and also make clear when the authentication code will expire (based on the module's configuration).

API changes

None.

Data model changes

None.