Add Send Email Preview feature #31021

lezama · 2023-05-28T16:01:53Z

Part of Automattic/wp-calypso#76134

Proposed changes:

Adds a "Preview" button to the Pre Publish Newsletter Panel.
The "Preview" button opens a "Send a test email" modal showing the current user email and a "Send" button.

Future iteration will use WordPress/gutenberg#50605

Other information:

Have you written new tests for your changes, if applicable?
Have you checked the E2E test CI results, and verified that your changes do not break them?
Have you tested your changes on WordPress.com, if applicable (if so, you'll see a generated comment below with a script to run)?

Jetpack product discussion

peKye1-6z-p2

Does this pull request change what data or activity we track or use?

No

Testing instructions:

Build/Run this branch on your test site.
Create a new post on your self-hosted site.
Click Publish, in Pre Publish, click "Preview" at the bottom of the Newsletter panel.
A "Send a test email" modal should open.
Click on the "Send" button.
You should receive a test email!

github-actions · 2023-05-28T16:03:09Z

Are you an Automattician? Please test your changes on all WordPress.com environments to help mitigate accidental explosions.

To test on WoA, go to the Plugins menu on a WordPress.com Simple site. Click on the "Upload" button and follow the upgrade flow to be able to upload, install, and activate the Jetpack plugin. Once the plugin is active, go to Jetpack > Jetpack Beta > Jetpack and enable the add/preview-email-v2 branch.
To test on Simple, run the following command on your sandbox:
```
bin/jetpack-downloader test jetpack add/preview-email-v2
```

Interested in more tips and information?

In your local development environment, use the jetpack rsync command to sync your changes to a WoA dev blog.
Read more about our development workflow here: PCYsg-eg0-p2
Figure out when your changes will be shipped to customers here: PCYsg-eg5-p2

github-actions · 2023-05-28T16:03:25Z

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

✅ Include a description of your PR changes.
⚠️ All commits were linted before commit.
✅ Add a "[Status]" label (In Progress, Needs Team Review, ...).
✅ Add testing instructions.
✅ Specify whether this PR includes any changes to data or privacy.
✅ Add changelog entries to affected projects

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

The e2e test report can be found here. Please note that it can take a few minutes after the e2e tests checks are complete for the report to be available.

Once your PR is ready for review, check one last time that all required checks (other than "Required review") appearing at the bottom of this PR are passing or skipped.
Then, add the "[Status] Needs Team Review" label and ask someone from your team review the code. Once reviewed, it can then be merged.
If you need an extra review from someone familiar with the codebase, you can update the labels from "[Status] Needs Team Review" to "[Status] Needs Review", and in that case Jetpack Approvers will do a final review of your PR.

Jetpack plugin:

Next scheduled release: July 5, 2023.
Scheduled code freeze: June 26, 2023.

projects/plugins/jetpack/extensions/blocks/subscriptions/preview-email.js

edanzer

This is testing as expected, and I'm signing off on that basis. Code changes look right too, but I can see that Jetpack crew already signed off on the code, and they know Jetpack much better than me.

Note: I did have an issue where /send-email-preview/ endpoint did not work initially. I had to reset permalinks to get it working. But I don't that issue is specific to this PR.

crisbusquets · 2023-06-30T16:13:29Z

Moved the button to the Newsletter PrePublish panel.

Hi @lezama !
Can we change it to a link that provides more context? For example:

I wouldn't use a button, the information architecture feels weird —the button component in the pre-publish panel seems to only be used for the two main actions (Publish or Cancel).

What do you think?

lezama · 2023-07-03T15:06:21Z

I copied the button from the Social Preview panel above so they had similar patterns.

Happy to do whatever, maybe change both 😆

crisbusquets · 2023-07-03T15:21:43Z

I copied the button from the Social Preview panel above so they had similar patterns.
Happy to do whatever, maybe change both 😆

Oh! I wasn't aware this one existed 🥲

Do you know who worked on that? I prefer to use links instead of buttons, but I'd like to know the reason behind the Social Previews design.

Also, are we able to change or add additional text to the Newsletter accordion?

lezama · 2023-07-03T17:12:26Z

Do you know who worked on that? I prefer to use links instead of buttons, but I'd like to know the reason behind the Social Previews design.

Looks like @manzoorwanijk did the coding.

Also, are we able to change or add additional text to the Newsletter accordion?

yes, we can easily add something like the Social one has.

crisbusquets · 2023-07-04T09:03:38Z

Do you know who worked on that? I prefer to use links instead of buttons, but I'd like to know the reason behind the Social Previews design.

Looks like @manzoorwanijk did the coding.

Also, are we able to change or add additional text to the Newsletter accordion?

yes, we can easily add something like the Social one has.

Cool, thanks!

I've reviewed it again, and I'm ok with using the button. A link would be less prominent, and I guess we want people to be aware they can preview the email they're going to send.

Can we add Preview what this newsletter will look like before sending it to your audience. on the top of the first radio button?

Figma file (last frame on the right)

lezama · 2023-07-04T11:18:44Z

the buttons would change who receives/access the newsletter, maybe we should add two texts?

crisbusquets · 2023-07-04T13:37:59Z

the buttons would change who receives/access the newsletter, maybe we should add two texts?

I don't understand this 😅 Do you mean the radio buttons?

lezama · 2023-07-04T14:30:51Z

it confuses me that the text is not next to the button, it makes me think that the options there are just for the Preview 🤷

crisbusquets · 2023-07-04T14:37:44Z

it confuses me that the text is not next to the button, it makes me think that the options there are just for the Preview 🤷

Oh, ok. Now I get it 😬

Maybe the other way around is better?

lezama · 2023-07-04T14:57:11Z

I like it better! 🤝

lezama · 2023-07-04T14:57:58Z

I guess we should avoid "your" here too 😁

lezama requested a review from a team May 28, 2023 16:01

github-actions bot added [Block] Subscriptions [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ labels May 28, 2023

github-actions bot added the [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! label May 28, 2023

lezama mentioned this pull request May 29, 2023

Send Email Preview Endpoint #31028

Merged

3 tasks

lezama commented May 29, 2023

View reviewed changes

projects/plugins/jetpack/extensions/blocks/subscriptions/preview-email.js Outdated Show resolved Hide resolved

lezama force-pushed the add/preview-email-v2 branch 2 times, most recently from f129afb to d6a8b72 Compare May 30, 2023 00:38

lezama changed the base branch from trunk to add/preview-email-endpoint May 30, 2023 00:39

lezama removed the [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! label May 30, 2023

github-actions bot added the [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! label May 30, 2023

lezama added [Status] In Progress and removed [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! labels May 30, 2023

github-actions bot added the [Tests] Includes Tests label May 30, 2023

lezama force-pushed the add/preview-email-endpoint branch from 3a57e43 to 7faf279 Compare June 1, 2023 12:15

lezama force-pushed the add/preview-email-v2 branch from b04ac83 to ad742f2 Compare June 1, 2023 16:37

github-actions bot added [JS Package] Boost Score Api Admin Page React-powered dashboard under the Jetpack menu RNA labels Jun 1, 2023

lezama force-pushed the add/preview-email-endpoint branch 2 times, most recently from 4cb108b to 2f7c719 Compare June 1, 2023 17:00

lezama force-pushed the add/preview-email-v2 branch 2 times, most recently from 9947dc5 to c920115 Compare June 1, 2023 17:31

github-actions bot added the Docs label Jun 1, 2023

lezama force-pushed the add/preview-email-endpoint branch from 57a1a34 to daf75d3 Compare June 1, 2023 19:52

Base automatically changed from add/preview-email-endpoint to trunk June 1, 2023 20:05

lezama closed this in #31028 Jun 1, 2023

github-actions bot removed the [Status] In Progress label Jun 1, 2023

jeherve assigned lezama Jun 21, 2023

jeherve added the [Pri] Normal label Jun 21, 2023

edanzer approved these changes Jun 21, 2023

View reviewed changes

lezama merged commit 29a0617 into trunk Jun 21, 2023

lezama deleted the add/preview-email-v2 branch June 21, 2023 22:44

github-actions bot removed the [Status] Ready to Merge Go ahead, you can push that green button! label Jun 21, 2023

github-actions bot added this to the jetpack/12.3 milestone Jun 21, 2023

lezama mentioned this pull request Jun 21, 2023

Fix send email preview endpoint #31499

Merged

3 tasks

jeherve mentioned this pull request Oct 6, 2023

Subscriptions: preview new post emails when editing posts #15086

Closed

crisbusquets mentioned this pull request Jul 17, 2024

Newsletter: Enhance email preview #38370

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add Send Email Preview feature #31021

Add Send Email Preview feature #31021

lezama commented May 28, 2023 •

edited by samiff

Loading

github-actions bot commented May 28, 2023 •

edited

Loading

github-actions bot commented May 28, 2023 •

edited

Loading

edanzer left a comment

crisbusquets commented Jun 30, 2023 •

edited

Loading

lezama commented Jul 3, 2023

crisbusquets commented Jul 3, 2023

lezama commented Jul 3, 2023

crisbusquets commented Jul 4, 2023

lezama commented Jul 4, 2023

crisbusquets commented Jul 4, 2023

lezama commented Jul 4, 2023

crisbusquets commented Jul 4, 2023

lezama commented Jul 4, 2023

lezama commented Jul 4, 2023

Add Send Email Preview feature #31021

Add Send Email Preview feature #31021

Conversation

lezama commented May 28, 2023 • edited by samiff Loading

Proposed changes:

Other information:

Jetpack product discussion

Does this pull request change what data or activity we track or use?

Testing instructions:

github-actions bot commented May 28, 2023 • edited Loading

github-actions bot commented May 28, 2023 • edited Loading

edanzer left a comment

Choose a reason for hiding this comment

crisbusquets commented Jun 30, 2023 • edited Loading

lezama commented Jul 3, 2023

crisbusquets commented Jul 3, 2023

lezama commented Jul 3, 2023

crisbusquets commented Jul 4, 2023

lezama commented Jul 4, 2023

crisbusquets commented Jul 4, 2023

lezama commented Jul 4, 2023

crisbusquets commented Jul 4, 2023

lezama commented Jul 4, 2023

lezama commented Jul 4, 2023

lezama commented May 28, 2023 •

edited by samiff

Loading

github-actions bot commented May 28, 2023 •

edited

Loading

github-actions bot commented May 28, 2023 •

edited

Loading

crisbusquets commented Jun 30, 2023 •

edited

Loading