feat(reader-registration-block): password, OTP, and verification flows by miguelpeixe · Pull Request #4452 · Automattic/newspack-plugin

miguelpeixe · 2026-02-04T16:18:36Z

All Submissions:

Have you followed the Newspack Contributing guideline?
Does your code follow the WordPress' coding standards and VIP Go coding standards?
Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

Refactors the Reader Registration block to support unified authentication and account verification flows.

The block will no longer provide 2 actions (sign up or sign in), but rather a single "Continue" button that can register the account or open the auth modal to continue authenticating from there.

If the account is being registered and the block is being used in a gated article that requires verification, the block will present an account verification flow.

Modal after entering email:

Page render if already logged in with an unverified account:

How to test the changes in this Pull Request:

Setup a content gate with registration access that doesn't require verification
Edit the layout and add a reader registration block
In a fresh session, visit a gated article and enter new email
Confirm the block renders a success message, refreshes and unlocks the content
Edit the gate to require account verification
Refresh the article page while logged in with the newly created reader account
Confirm you are gated again requiring verification
Click Send code and confirm the OTP modal opens
Enter the code and confirm that the page refreshes on success and the content is unlocked
In a fresh session, enter a new email and confirm the verification step renders in a modal
Click "Send code" and confirm you are able to go through

Other information:

Have you added an explanation of what your changes do and why you'd like us to include them?
Have you written new tests for your changes, as applicable?
Have you successfully ran tests with your changes locally?

Copilot

Pull request overview

This PR refactors the Reader Registration block to support a complete authentication flow, including password and OTP authentication for existing users. The changes extract reusable authentication utilities, add new UI states for OTP and password entry, and modify the block to handle returning users differently from new registrations.

Changes:

Refactored OTP input handling into reusable, exportable functions in otp-input.js
Created shared authentication utilities in auth-utils.js for OTP, password, and magic link handling
Added OTP and password authentication UI states to the Reader Registration block
Updated backend to detect whether existing users need password or OTP authentication

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
src/reader-activation-auth/otp-input.js	Refactored OTP input initialization into exportable functions for reusability
src/reader-activation-auth/auth-utils.js	New file containing shared authentication utilities (OTP, password, magic link handlers)
src/reader-activation-auth/auth-form.js	Updated to use shared authentication utilities from auth-utils.js
src/blocks/reader-registration/view.js	Implemented authentication flows with OTP and password states; fixed spelling errors
src/blocks/reader-registration/index.php	Added logic to determine authentication method for existing users; removed sign-in link
src/blocks/reader-registration/style.scss	Added styles for OTP and password authentication UI states
src/blocks/reader-registration/edit.js	Removed sign-in link UI from block editor
src/blocks/reader-registration/block.json	Removed signInLabel attribute; updated signedInLabel default

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

…TP and password actions

…tion block

Copilot

Pull request overview

Copilot reviewed 12 out of 12 changed files in this pull request and generated 8 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

…ion block

…ration modal

…ader registration

…witching

… is missing

thomasguillot · 2026-02-13T14:57:21Z

@miguelpeixe Obrigado!

dkoo

This looks great and works well! A couple of questions which may or not be blocking:

If you encounter the gate with a Registration block and enter an email address for an account for which you've previously verified by setting a password, you're correctly presented with the password prompt. The only thing that's weird with this is the "Go back" button. Clicking this returns to the first screen of the sign in modal, which feels like part of a different flow. In this scenario, I feel we should either hide the "Go back" button, or alter its behavior so that it simply closes the modal.

This probably wouldn't be a problem for new setups, but lots of sites have links with #register_modal to open the auth modal in their content gates. If you encounter the Registration gate after registering but before verifying, you can still see these links but they won't do anything. We're already hiding #signin_modal links with some CSS—can we also hide #register_modal links? Probably just need to add a selector like so:

body.logged-in a[href="#signin_modal"],
body.logged-in a[href="#register_modal"] {

An even better solution for this might be to allow the #register_modal links to open the same OTP verification modal as the Registration block if you're logged into an unverified account, but that might be more effort than it's worth.

miguelpeixe · 2026-02-19T12:40:08Z

Thank you for the review, @dkoo!

Clicking this returns to the first screen of the sign in modal, which feels like part of a different flow. In this scenario, I feel we should either hide the "Go back" button, or alter its behavior so that it simply closes the modal.

Good point. I removed the "Go back" button when in the verification state, because that would mean to enter an email while authenticated, which makes no sense. I didn't think to do that while authenticating because it's technically fine. Before I make the change, could you share your thoughts @thomasguillot?

If you encounter the Registration gate after registering but before verifying, you can still see these links but they won't do anything.

I think the ideal solution is to use a block compatible with account verification if the publisher enables that requirement. Even if we add support to the #register_modal to open the verification modal, there needs to be appropriate messaging. The reader won't click the "Register" button while logged in, expecting to run an account verification flow. Perhaps another block, similar to the My Account block that @laurelfulford built?

thomasguillot · 2026-02-19T15:33:01Z

If we're removing the "Go back" button (which I'm fine with), can we make the second Secondary button, a ghost button (Forget password)

dkoo · 2026-02-19T16:16:33Z

I think the ideal solution is to use a block compatible with account verification if the publisher enables that requirement. Even if we add support to the #register_modal to open the verification modal, there needs to be appropriate messaging. The reader won't click the "Register" button while logged in, expecting to run an account verification flow. Perhaps another block, similar to the My Account block that @laurelfulford built?

Good points, but in the meantime I think we should still at least hide these links for logged-in readers so there's no non-functional UI.

miguelpeixe · 2026-02-19T17:23:17Z

Thanks, both!

For consistency, in 141a7cc I'm opting to keep the "Go back" button and allow it to close the modal. I changed the verification modal as well, so it also preserves the button. Just like clicking the X, it'll also force a page refresh so it ensures the block renders the verification box after registration. WDYT?

Good points, but in the meantime I think we should still at least hide these links for logged-in readers so there's no non-functional UI.

Updated in 9644618

dkoo

This works for me! One thing I did notice is that typing an email into the Registration block then hitting the "enter" key seems to submit the form and bypass the JS handler—might want to double check that since it's an accessibility issue, but I don't think that's new to this PR.

miguelpeixe · 2026-02-20T12:26:40Z

Thanks, @dkoo! I'll look into the input "enter" key issue

github-actions · 2026-02-20T12:26:58Z

Hey @miguelpeixe, good job getting this PR merged! 🎉

Now, the needs-changelog label has been added to it.

Please check if this PR needs to be included in the "Upcoming Changes" and "Release Notes" doc. If it doesn't, simply remove the label.

If it does, please add an entry to our shared document, with screenshots and testing instructions if applicable, then remove the label.

Thank you! ❤️

# [6.35.0-alpha.1](v6.34.2...v6.35.0-alpha.1) (2026-03-05) ### Bug Fixes * allow deletion of payment method for Braintree ([63ceec3](63ceec3)) * apply Copilot suggestion for tests ([6133636](6133636)) * **avatar:** correct duotone selector to support custom colors ([#4513](#4513)) ([c4458d4](c4458d4)) * **byline:** update placeholder text to "Author Name" ([#4510](#4510)) ([727b1e8](727b1e8)) * **co-authors-plus:** sanitize user_login before building dummy email… ([#4520](#4520)) ([32c2602](32c2602)) * do not depend on _get() to return an array ([2816470](2816470)) * **dropdown-menu:** avoid overflow at bottom of viewport ([#4495](#4495)) ([a5ce464](a5ce464)) * enable payment method deletion for Braintree ([c50f094](c50f094)) * iframe editor compatiblity ([#4444](#4444)) ([12dfaba](12dfaba)) * **my-account:** don't show subscription payment notice in modal checkout ([#4500](#4500)) ([2cb3324](2cb3324)) * **my-account:** force white background color ([#4514](#4514)) ([02e2555](02e2555)) * **my-account:** resubscription validation in order-again template ([#4498](#4498)) ([36871fc](36871fc)) * **newspack-icon:** background color ([#4516](#4516)) ([8c5dc9c](8c5dc9c)) * **newspack-ui:** remove overflow when modal is open ([#4515](#4515)) ([0b2cbd3](0b2cbd3)) * prune read-only keys from sync queue ([bf81734](bf81734)) * remove unused 'edit' and 'save' actions from Braintree payment methods ([8f72a8d](8f72a8d)) * **snackbar:** autohide progress bar not always appearing ([#4504](#4504)) ([4eda60f](4eda60f)) ### Features * identify and enforce read-only items for Reader Data Library ([4f2ef8a](4f2ef8a)) * add featured image caption block ([#4519](#4519)) ([0b744ff](0b744ff)) * **author-profile:** avatar and social blocks for nested author profile ([#4448](#4448)) ([cff670b](cff670b)) * **content-gate:** comment restriction with metering support ([#4529](#4529)) ([714c8b7](714c8b7)) * **content-gate:** per-post access control exemption ([#4530](#4530)) ([636679b](636679b)) * **content-gate:** user access information ([#4542](#4542)) ([b49347e](b49347e)) * **content-gating:** group subscription invitations data structure + admin UI ([#4536](#4536)) ([e609e83](e609e83)) * **content-gating:** i3 designs for content gates list view ([#4512](#4512)) ([dcbb239](dcbb239)) * **corrections:** append corrections to Republication Tracker Tool content ([#4501](#4501)) ([71bd177](71bd177)) * data event handler registration and dispatching to integrations ([#4481](#4481)) ([7c79da6](7c79da6)) * **data-events:** add ActionScheduler logging and retry reason ([#4488](#4488)) ([e8af964](e8af964)) * **integrations:** make sure contact data is read from persistent data ([#4505](#4505)) ([c2ee26a](c2ee26a)) * **integrations:** start get fields abstraction and pull contact data ([#4470](#4470)) ([8ddcf23](8ddcf23)), closes [#4477](#4477) * **reader-registration-block:** password, OTP, and verification flows ([#4452](#4452)) ([fc4567e](fc4567e)) * reject changes to specific reader data keys ([fe52e12](fe52e12))

github-actions · 2026-03-05T19:50:53Z

🎉 This PR is included in version 6.35.0-alpha.1 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

# [6.35.0](v6.34.4...v6.35.0) (2026-03-16) ### Bug Fixes * allow deletion of payment method for Braintree ([63ceec3](63ceec3)) * apply Copilot suggestion for tests ([6133636](6133636)) * **avatar:** correct duotone selector to support custom colors ([#4513](#4513)) ([c4458d4](c4458d4)) * **byline:** update placeholder text to "Author Name" ([#4510](#4510)) ([727b1e8](727b1e8)) * **co-authors-plus:** sanitize user_login before building dummy email… ([#4520](#4520)) ([32c2602](32c2602)) * do not depend on _get() to return an array ([2816470](2816470)) * **dropdown-menu:** avoid overflow at bottom of viewport ([#4495](#4495)) ([a5ce464](a5ce464)) * enable payment method deletion for Braintree ([c50f094](c50f094)) * iframe editor compatiblity ([#4444](#4444)) ([12dfaba](12dfaba)) * **my-account:** don't show subscription payment notice in modal checkout ([#4500](#4500)) ([2cb3324](2cb3324)) * **my-account:** force white background color ([#4514](#4514)) ([02e2555](02e2555)) * **my-account:** resubscription validation in order-again template ([#4498](#4498)) ([36871fc](36871fc)) * **newspack-icon:** background color ([#4516](#4516)) ([8c5dc9c](8c5dc9c)) * **newspack-ui:** remove overflow when modal is open ([#4515](#4515)) ([0b2cbd3](0b2cbd3)) * prune read-only keys from sync queue ([bf81734](bf81734)) * remove unused 'edit' and 'save' actions from Braintree payment methods ([8f72a8d](8f72a8d)) * **snackbar:** autohide progress bar not always appearing ([#4504](#4504)) ([4eda60f](4eda60f)) ### Features * identify and enforce read-only items for Reader Data Library ([4f2ef8a](4f2ef8a)) * add featured image caption block ([#4519](#4519)) ([0b744ff](0b744ff)) * **author-profile:** avatar and social blocks for nested author profile ([#4448](#4448)) ([cff670b](cff670b)) * **content-gate:** comment restriction with metering support ([#4529](#4529)) ([714c8b7](714c8b7)) * **content-gate:** per-post access control exemption ([#4530](#4530)) ([636679b](636679b)) * **content-gate:** user access information ([#4542](#4542)) ([b49347e](b49347e)) * **content-gating:** group subscription invitations data structure + admin UI ([#4536](#4536)) ([e609e83](e609e83)) * **content-gating:** i3 designs for content gates list view ([#4512](#4512)) ([dcbb239](dcbb239)) * **corrections:** append corrections to Republication Tracker Tool content ([#4501](#4501)) ([71bd177](71bd177)) * data event handler registration and dispatching to integrations ([#4481](#4481)) ([7c79da6](7c79da6)) * **data-events:** add ActionScheduler logging and retry reason ([#4488](#4488)) ([e8af964](e8af964)) * **integrations:** make sure contact data is read from persistent data ([#4505](#4505)) ([c2ee26a](c2ee26a)) * **integrations:** start get fields abstraction and pull contact data ([#4470](#4470)) ([8ddcf23](8ddcf23)), closes [#4477](#4477) * **reader-registration-block:** password, OTP, and verification flows ([#4452](#4452)) ([fc4567e](fc4567e)) * reject changes to specific reader data keys ([fe52e12](fe52e12))

github-actions · 2026-03-16T18:22:17Z

🎉 This PR is included in version 6.35.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

feat(reader-registration-block): password and OTP authentication flows

6d9111f

miguelpeixe requested a review from Copilot February 4, 2026 16:18

Copilot started reviewing on behalf of miguelpeixe February 4, 2026 16:19 View session

Copilot AI reviewed Feb 4, 2026

View reviewed changes

miguelpeixe added 8 commits February 4, 2026 15:16

refactor: streamline authentication flow

4d64fb6

refactor(reader-registration): simplify authentication handling for O…

59d4284

…TP and password actions

Merge branch 'trunk' into feat/reader-registration-block-auth

b237730

chore: move inline gate content methods to trait for better organization

4889ffc

fix: enhance pending verification handling in registration block

0971c9c

refactor: improve UI and messaging for email verification in registra…

071c5e6

…tion block

feat: add method to check if gate requires account verification

266590b

feat: implement email verification handling in registration flow

b3fef56

miguelpeixe changed the title ~~feat(reader-registration-block): password and OTP authentication flows~~ feat(reader-registration-block): password, OTP, and verification flows Feb 5, 2026

miguelpeixe requested a review from Copilot February 5, 2026 22:17

Copilot started reviewing on behalf of miguelpeixe February 5, 2026 22:17 View session

Copilot AI reviewed Feb 5, 2026

View reviewed changes

miguelpeixe added 12 commits February 5, 2026 20:59

feat: streamline email verification resend functionality in registrat…

c9af5cb

…ion block

feat: enhance OTP verification process in reader registration flow

7e62e2c

feat: update UI and messaging for email verification in reader regist…

e34730f

…ration modal

refactor: remove login success messaging

b5b800e

feat: add account verification check and improve error handling in re…

f3c3edc

…ader registration

feat: ensure modal close callback is fired and the page reloads

3907d32

feat: improve modal close handling

d20bba3

feat: hide back buttons when user is authenticated to prevent email s…

6b7b4be

…witching

feat: add onClose callback to auth modal for improved close handling

66462e9

Merge branch 'trunk' into feat/reader-registration-block-auth

adb18fa

fix: remove duplicate method

bc91175

chore: update return documentation to clarify behavior when maxlength…

9fe33c7

… is missing

miguelpeixe requested a review from Copilot February 11, 2026 18:21

Copilot started reviewing on behalf of miguelpeixe February 11, 2026 18:21 View session

thomasguillot added [Status] Design Approved and removed [Status] Needs Design Review labels Feb 13, 2026

thomasguillot removed their request for review February 13, 2026 14:57

dkoo requested changes Feb 17, 2026

View reviewed changes

github-actions Bot added the [Status] Needs Changes or Feedback The issue or pull request needs action from the original creator label Feb 17, 2026

dkoo removed the [Status] Needs Review The issue or pull request needs to be reviewed label Feb 18, 2026

miguelpeixe requested review from dkoo and thomasguillot February 19, 2026 12:40

miguelpeixe added 3 commits February 19, 2026 14:04

Merge branch 'trunk' into feat/reader-registration-block-auth

654981a

fix: hide registration modal link for logged-in users

9644618

feat: allow the back button to close the modal

141a7cc

dkoo approved these changes Feb 19, 2026

View reviewed changes

github-actions Bot added [Status] Approved The pull request has been reviewed and is ready to merge and removed [Status] Needs Changes or Feedback The issue or pull request needs action from the original creator labels Feb 19, 2026

miguelpeixe merged commit fc4567e into trunk Feb 20, 2026
9 checks passed

miguelpeixe deleted the feat/reader-registration-block-auth branch February 20, 2026 12:26

github-actions Bot added the needs-changelog label Feb 20, 2026

miguelpeixe removed the needs-changelog label Feb 20, 2026

jason10lee mentioned this pull request Feb 26, 2026

fix: skip redirect from login modal #4450

Closed

6 tasks

Conversation

miguelpeixe commented Feb 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

All Submissions:

Changes proposed in this Pull Request:

How to test the changes in this Pull Request:

Other information:

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

thomasguillot commented Feb 13, 2026

Uh oh!

dkoo left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

miguelpeixe commented Feb 19, 2026

Uh oh!

thomasguillot commented Feb 19, 2026

Uh oh!

dkoo commented Feb 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

miguelpeixe commented Feb 19, 2026

Uh oh!

dkoo left a comment

Choose a reason for hiding this comment

Uh oh!

miguelpeixe commented Feb 20, 2026

Uh oh!

Uh oh!

github-actions Bot commented Feb 20, 2026

Uh oh!

github-actions Bot commented Mar 5, 2026

Uh oh!

github-actions Bot commented Mar 16, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

miguelpeixe commented Feb 4, 2026 •

edited

Loading

dkoo left a comment •

edited

Loading

dkoo commented Feb 19, 2026 •

edited

Loading