Skip to content

Commit

Permalink
feat(ras-acc): make auth flow UI text filterable (#3070)
Browse files Browse the repository at this point in the history
This PR makes the previously hard-coded reader activation auth flow text filterable
  • Loading branch information
chickenn00dle authored Apr 20, 2024
1 parent bccb560 commit 507fd5a
Showing 1 changed file with 110 additions and 39 deletions.
149 changes: 110 additions & 39 deletions includes/reader-activation/class-reader-activation.php
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,13 @@ final class Reader_Activation {
*/
private static $is_new_reader_auth = false;

/**
* UI labels for reader auth flow.
*
* @var mixed[]
*/
private static $reader_auth_labels = [];

/**
* Initialize hooks.
*/
Expand Down Expand Up @@ -154,23 +161,7 @@ public static function enqueue_scripts() {
NEWSPACK_PLUGIN_VERSION,
true
);
$labels = [
'invalid_email' => __( 'Please enter a valid email address.', 'newspack-plugin' ),
'invalid_password' => __( 'Please enter a password.', 'newspack-plugin' ),
'blocked_popup' => __( 'The popup has been blocked. Allow popups for the site and try again.', 'newspack-plugin' ),
'code_resent' => __( 'Code resent! Check your inbox.', 'newspack-plugin' ),
'create_account' => __( 'Create an account', 'newspack-plugin' ),
'signin' => [
'title' => __( 'Sign in', 'newspack-plugin' ),
'success_title' => __( 'Success! You’re signed in.', 'newspack-plugin' ),
],
'register' => [
'title' => __( 'Create an account', 'newspack-plugin' ),
'success_title' => __( 'Success! Your account was created and you’re signed in.', 'newspack-plugin' ),
'success_description' => __( 'In the future, you’ll sign in with a magic link, or a code sent to your email. If you’d rather use a password, you can set one below.', 'newspack-plugin' ),
],
];
\wp_localize_script( self::AUTH_SCRIPT_HANDLE, 'newspack_reader_auth_labels', $labels );
\wp_localize_script( self::AUTH_SCRIPT_HANDLE, 'newspack_reader_auth_labels', self::get_reader_auth_labels() );
\wp_script_add_data( self::AUTH_SCRIPT_HANDLE, 'async', true );
\wp_script_add_data( self::AUTH_SCRIPT_HANDLE, 'amp-plus', true );
\wp_enqueue_style(
Expand All @@ -181,17 +172,94 @@ public static function enqueue_scripts() {
);
}

/**
* Get reader activation auth flow labels.
*
* @param string|null $key Key of the label to return (optional).
*
* @return mixed[]|string The label string or an array of labels keyed by string.
*/
private static function get_reader_auth_labels( $key = null ) {
if ( empty( self::$reader_auth_labels ) ) {
$default_labels = [
'title' => __( 'Sign in', 'newspack-plugin' ),
'invalid_email' => __( 'Please enter a valid email address.', 'newspack-plugin' ),
'invalid_password' => __( 'Please enter a password.', 'newspack-plugin' ),
'invalid_display' => __( 'Display name cannot match your email address. Please choose a different display name.', 'newspack-plugin' ),
'blocked_popup' => __( 'The popup has been blocked. Allow popups for the site and try again.', 'newspack-plugin' ),
'code_resent' => __( 'Code resent! Check your inbox.', 'newspack-plugin' ),
'create_account' => __( 'Create an account', 'newspack-plugin' ),
'signin' => [
'title' => __( 'Sign in', 'newspack-plugin' ),
'success_title' => __( 'Success! You’re signed in.', 'newspack-plugin' ),
'success_message' => __( 'Login successful!', 'newspack-plugin' ),
'continue' => __( 'Continue', 'newspack-plugin' ),
'resend_code' => __( 'Resend code', 'newspack-plugin' ),
'otp' => __( 'Email me a one-time code instead', 'newspack-plugin' ),
'otp_title' => __( 'Enter the code sent to your email.', 'newspack-plugin' ),
'forgot_password' => __( 'Forgot password', 'newspack-plugin' ),
'create_account' => __( 'Create an account', 'newspack-plugin' ),
'register' => __( 'Sign in to an existing account', 'newspack-plugin' ),
'go_back' => __( 'Go back', 'newspack-plugin' ),
'set_password' => __( 'Set a password (optional)', 'newspack-plugin' ),
],
'register' => [
'title' => __( 'Create an account', 'newspack-plugin' ),
'success_title' => __( 'Success! Your account was created and you’re signed in.', 'newspack-plugin' ),
'success_description' => __( 'In the future, you’ll sign in with a magic link, or a code sent to your email. If you’d rather use a password, you can set one below.', 'newspack-plugin' ),
],
'verify' => __( 'Thank you for verifying your account!', 'newspack-plugin' ),
'magic_link' => __( 'Please check your inbox for an authentication link.', 'newspack-plugin' ),
'password_reset_interval' => __( 'Please wait a moment before requesting another password reset email.', 'newspack-plugin' ),
'account_link' => [
'signedin' => __( 'My Account', 'newspack-plugin' ),
'signedout' => __( 'Sign In', 'newspack-plugin' ),
],
'newsletters' => __( 'Subscribe to our newsletter', 'newspack-plugin' ),
];

/**
* Filters the global labels for reader activation auth flow.
*
* @param mixed[] $labels Labels keyed by name.
*/
$filtered_labels = apply_filters( 'newspack_reader_activation_auth_labels', $default_labels );

foreach ( $default_labels as $key => $label ) {
if ( isset( $filtered_labels[ $key ] ) ) {
if ( is_array( $label ) && is_array( $filtered_labels[ $key ] ) ) {
self::$reader_auth_labels[ $key ] = array_merge( $label, $filtered_labels[ $key ] );
} elseif ( is_string( $label ) && is_string( $filtered_labels[ $key ] ) ) {
self::$reader_auth_labels[ $key ] = $filtered_labels[ $key ];
} else {
// If filtered label type doesn't match, fallback to default.
self::$reader_auth_labels[ $key ] = $label;
}
} else {
self::$reader_auth_labels[ $key ] = $label;
}
}
}

if ( ! $key ) {
return self::$reader_auth_labels;
}

return self::$reader_auth_labels[ $key ] ?? '';
}

/**
* Get settings config with default values.
*
* @return mixed[] Settings default values keyed by their name.
*/
private static function get_settings_config() {
$label = self::get_reader_auth_labels( 'newsletters' );
$settings_config = [
'enabled' => false,
'enabled_account_link' => true,
'account_link_menu_locations' => [ 'tertiary-menu' ],
'newsletters_label' => __( 'Subscribe to our newsletters:', 'newspack-plugin' ),
'newsletters_label' => $label,
'use_custom_lists' => false,
'newsletter_lists' => [],
'terms_text' => '',
Expand Down Expand Up @@ -752,7 +820,7 @@ public static function set_reader_verified( $user_or_user_id ) {

\update_user_meta( $user->ID, self::EMAIL_VERIFIED, true );

WooCommerce_Connection::add_wc_notice( __( 'Thank you for verifying your account!', 'newspack-plugin' ), 'success' );
WooCommerce_Connection::add_wc_notice( self::get_reader_auth_labels( 'verify' ), 'success' );

/**
* Fires after a reader's email address is verified.
Expand Down Expand Up @@ -994,10 +1062,7 @@ private static function get_account_link() {
return self::get_element_class_name( $parts );
};

$labels = [
'signedin' => \__( 'My Account', 'newspack-plugin' ),
'signedout' => \__( 'Sign In', 'newspack-plugin' ),
];
$labels = self::get_reader_auth_labels( 'account_link' );
$label = \is_user_logged_in() ? 'signedin' : 'signedout';

$link = '<a class="' . \esc_attr( $class() ) . '" data-labels="' . \esc_attr( htmlspecialchars( \wp_json_encode( $labels ), ENT_QUOTES, 'UTF-8' ) ) . '" href="' . \esc_url_raw( $account_url ?? '#' ) . '" data-newspack-reader-account-link>';
Expand Down Expand Up @@ -1062,6 +1127,7 @@ public static function render_auth_form() {
// phpcs:enable

$referer = \wp_parse_url( \wp_get_referer() );
$labels = self::get_reader_auth_labels( 'signin' );
?>
<div class="newspack-ui newspack-reader-auth">
<div class="newspack-ui__box newspack-ui__box--success newspack-ui__box--text-center" data-action="success">
Expand All @@ -1086,7 +1152,7 @@ public static function render_auth_form() {
<input type="hidden" name="action" />
<p data-action="otp">
<strong>
<?php esc_html_e( 'Enter the code sent to your email.', 'newspack-plugin' ); ?>
<?php echo esc_html( $labels['otp_title'] ); ?>
</strong>
</p>
<div data-action="signin register">
Expand Down Expand Up @@ -1121,16 +1187,16 @@ public static function render_auth_form() {
);
?>
</p>
<button type="submit" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--primary" data-action="register signin pwd otp"><?php \esc_html_e( 'Continue', 'newspack-plugin' ); ?></button>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--secondary" data-action="otp" data-send-code><?php \esc_html_e( 'Resend code', 'newspack-plugin' ); ?></button>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--secondary" data-action="pwd" data-send-code><?php \esc_html_e( 'Email me a one-time code instead', 'newspack-plugin' ); ?></button>
<a class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--secondary" data-action="pwd" href="<?php echo \esc_url( \wp_lostpassword_url() ); ?>"><?php \esc_html_e( 'Forgot password', 'newspack-plugin' ); ?></a>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--tertiary newspack-ui__last-child" data-action="signin" data-set-action="register"><?php \esc_html_e( 'Create an account', 'newspack-plugin' ); ?></button>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--tertiary newspack-ui__last-child" data-action="register" data-set-action="signin"><?php \esc_html_e( 'Sign in to an existing account', 'newspack-plugin' ); ?></button>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--tertiary newspack-ui__last-child" data-action="otp pwd" data-back><?php \esc_html_e( 'Go back', 'newspack-plugin' ); ?></button>
<button type="submit" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--primary" data-action="register signin pwd otp"><?php echo \esc_html( $labels['continue'] ); ?></button>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--secondary" data-action="otp" data-send-code><?php echo \esc_html( $labels['resend_code'] ); ?></button>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--secondary" data-action="pwd" data-send-code><?php echo \esc_html( $labels['otp'] ); ?></button>
<a class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--secondary" data-action="pwd" href="<?php echo \esc_url( \wp_lostpassword_url() ); ?>"><?php echo \esc_html( $labels['forgot_password'] ); ?></a>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--tertiary newspack-ui__last-child" data-action="signin" data-set-action="register"><?php echo \esc_html( $labels['create_account'] ); ?></button>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--tertiary newspack-ui__last-child" data-action="register" data-set-action="signin"><?php echo \esc_html( $labels['register'] ); ?></button>
<button type="button" class="newspack-ui__button newspack-ui__button--wide newspack-ui__button--tertiary newspack-ui__last-child" data-action="otp pwd" data-back><?php echo \esc_html( $labels['go_back'] ); ?></button>
</form>
<a href="#" class="auth-callback newspack-ui__button newspack-ui__button--wide newspack-ui__button--primary" data-action="success"><?php \esc_html_e( 'Continue', 'newspack-plugin' ); ?></a>
<a href="#" class="set-password newspack-ui__button newspack-ui__button--wide newspack-ui__button--secondary" data-action="success"><?php \esc_html_e( 'Set a password (optional)', 'newspack-plugin' ); ?></a>
<a href="#" class="auth-callback newspack-ui__button newspack-ui__button--wide newspack-ui__button--primary" data-action="success"><?php echo \esc_html( $labels['continue'] ); ?></a>
<a href="#" class="set-password newspack-ui__button newspack-ui__button--wide newspack-ui__button--secondary" data-action="success"><?php echo \esc_html( $labels['set_password'] ); ?></a>
</div>
<?php
}
Expand All @@ -1153,12 +1219,13 @@ public static function render_auth_modal() {
}

$terms = self::get_auth_footer();
$label = self::get_reader_auth_labels( 'title' );
?>
<div class="newspack-ui newspack-ui__modal-container newspack-reader-auth-modal">
<div class="newspack-ui__modal-container__overlay"></div>
<div class="newspack-ui__modal newspack-ui__modal--small">
<div class="newspack-ui__modal__header">
<h2><?php _e( 'Sign In', 'newspack-plugin' ); ?></h2>
<h2><?php echo \esc_html( $label ); ?></h2>
<button class="newspack-ui__modal__close">
<span class="screen-reader-text"><?php esc_html_e( 'Close', 'newspack-plugin' ); ?></span>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-hidden="true" focusable="false">
Expand Down Expand Up @@ -1213,7 +1280,8 @@ public static function get_auth_footer() {
private static function send_auth_form_response( $data = [], $message = false ) {
$is_error = \is_wp_error( $data );
if ( empty( $message ) ) {
$message = $is_error ? $data->get_error_message() : __( 'Login successful!', 'newspack-plugin' );
$labels = self::get_reader_auth_labels( 'signin' );
$message = $is_error ? $data->get_error_message() : $labels['success_message'];
}
\wp_send_json( compact( 'message', 'data' ), \is_wp_error( $data ) ? 400 : 200 );
}
Expand All @@ -1238,12 +1306,13 @@ private static function send_auth_form_response( $data = [], $message = false )
* }
*/
public static function render_subscription_lists_inputs( $lists = [], $checked = [], $config = [] ) {
$label = self::get_reader_auth_labels( 'newsletters' );
$config = \wp_parse_args(
$config,
[
'title' => '',
'name' => 'lists',
'single_label' => __( 'Subscribe to our newsletter', 'newspack-plugin' ),
'single_label' => $label,
'show_description' => true,
]
);
Expand Down Expand Up @@ -1418,6 +1487,8 @@ public static function process_auth_form() {
'authenticated' => 0,
];

$magic_link_label = self::get_reader_auth_labels( 'magic_link' );

switch ( $action ) {
case 'signin':
if ( self::is_reader_without_password( $user ) ) {
Expand Down Expand Up @@ -1447,7 +1518,7 @@ public static function process_auth_form() {
if ( true !== $sent ) {
return self::send_auth_form_response( new \WP_Error( 'unauthorized', \is_wp_error( $sent ) ? $sent->get_error_message() : __( 'We encountered an error sending an authentication link. Please try again.', 'newspack-plugin' ) ) );
}
return self::send_auth_form_response( $payload, __( 'Please check your inbox for an authentication link.', 'newspack-plugin' ) );
return self::send_auth_form_response( $payload, $magic_link_label );
case 'register':
$metadata = [ 'registration_method' => 'auth-form' ];
if ( ! empty( $lists ) ) {
Expand Down Expand Up @@ -1739,7 +1810,7 @@ public static function validate_user_data( $data, $update, $user_id, $userdata )
*/
public static function better_display_name_error( $message ) {
if ( 'Display name cannot be changed to email address due to privacy concern.' === $message ) {
return __( 'Display name cannot match your email address. Please choose a different display name.', 'newspack-plugin' );
return self::get_reader_auth_labels( 'invalid_display' );
}

return $message;
Expand Down Expand Up @@ -1938,7 +2009,7 @@ public static function set_password_reset_mail_content_type() {
*/
public static function rate_limit_lost_password( $errors, $user_data ) {
if ( $user_data && self::is_reader_email_rate_limited( $user_data ) ) {
$errors->add( 'newspack_password_reset_interval', __( 'Please wait a moment before requesting another password reset email.', 'newspack-plugin' ) );
$errors->add( 'newspack_password_reset_interval', self::get_reader_auth_labels( 'password_reset_interval' ) );
} else {
\update_user_meta( $user_data->ID, self::LAST_EMAIL_DATE, time() );
}
Expand Down

0 comments on commit 507fd5a

Please sign in to comment.