feat(totp): Consistent user experience for TOTP setup#792
Conversation
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
| <?php | ||
| /* translators: 1: server date and time, 2: timezone. */ | ||
| printf( | ||
| esc_html__( 'Your server date and time is %1$s (%2$s). Please verify this is correct to ensure TOTP will work.', 'two-factor' ), |
There was a problem hiding this comment.
Moved this notice to the footer -- bellow the code input since that is where it could fail due to server time offset.
| ?> | ||
| </p> | ||
| <p> | ||
| <code><?php echo esc_html( $key ); ?></code> |
There was a problem hiding this comment.
This is now in own line for simple copy-paste. I also experimented with adding a "Copy" button next to it but decided to leave it to a follow-up pull request.
| </p> | ||
| </li> | ||
| <li> | ||
| <p><?php esc_html_e( 'Enter the code generated by the Authenticator app to complete the setup:', 'two-factor' ); ?></p> |
There was a problem hiding this comment.
This is now all part of the third step instead of being outside of the <ol>.
| <?php | ||
| printf( | ||
| /* translators: 1: server date and time */ | ||
| esc_html__( 'If the code is rejected, check that your web server time is accurate: %1$s. Your device and server times must match.', 'two-factor' ), |
There was a problem hiding this comment.
Reworded this from:
Your server date and time is %1$s (%2$s). Please verify this is correct to ensure TOTP will work.
so that:
- mention when this is relevant (if the code is rejected),
- explain why it is relevant (device and server time must match).
| esc_html__( 'If the code is rejected, check that your web server time is accurate: %1$s. Your device and server times must match.', 'two-factor' ), | ||
| sprintf( | ||
| '<time class="two-factor-server-datetime-epoch" datetime="%1$s">%2$s (%3$s)</time>', | ||
| esc_attr( wp_date( 'c' ) ), |
There was a problem hiding this comment.
Introduced datetime for standard timestamp string that can be useful for any dynamic updates in the future. I had it updating via JS every second from the initial timestamp but I realized that nothing was changing because we don't have the seconds in there.
| min-height: 205px; | ||
| } | ||
| </style> | ||
|
|
There was a problem hiding this comment.
All the JS and CSS was grouped under the inputs for consistency. Eventually we want to move them into external JS and CSS per #562.
3 participants
What?
Why?
Fixes #791.
How?
Testing Instructions
On a fresh WP setup with the plugin active:
Screenshots or screencast
Changelog Entry