LG-13196 Enhanced IPP Ready to Verify Email

[gina-yamada]

🎫 Ticket

LG-13196 Implementation: EIPP "You're ready to verify in person" Barcode email

🛠 Summary of changes

1. Updated the Ready to Verify In Person Email to handle Enhanced IPP
2. Determine if flow is IPP or Enhanced IPP and conditionally display the version of Your Ready to Verify In Person Email
3. Update variable name in code from is_eipp to is_enhanced_ipp as agreed on by team (see Slack thread) -- This should have no affect on the Ready to Verify View but please confirm nothing broke as a result

Notice: The Ready to Verify Email Reminder will be handled in LG-13606.

📜 Testing Plan

To inspect the template for design and content

Then pick: in_person_ready_to_verify and you change languages via the drop down in the top left (to confirm existing behavior is working as expected)

Then pick: in_person_ready_to_verify_enhanced_ipp_enabled and you change languages via the drop down in the top left (to confirm new behavior is working as expected)

Confirm the Ready to Verify Email for IPP is not affected

• Step 4 Start the server
• Step 5 Visit http://localhost:3000/rails/mailers/user_mailer/in_person_ready_to_verify
• Step 6 Inspect English, Spanish, French, and Spanish. Design + Content should look like this Figma mock.

Inspect the Ready to Verify Email for EIPP to approve template and content

• Step 8 Visit http://localhost:3000/rails/mailers/user_mailer/in_person_ready_to_verify_enhanced_ipp_enabled
• Step 9 Inspect English, Spanish, French, and Spanish. Design + Content should look like this Figma mock
• Step 10 Visit http://localhost:3000/rails/mailers/user_mailer/in_person_ready_to_verify_reminder and confirm that the ready to verify reminder email is not affected. It should look like the IPP template in step 6. It will be handled in LG-13606.
• Step 11 Be sure to set the code back to it's original state before proceeding

To test the conditionally logic in the flow 🔴 please test this out 🔴

Confirm the IPP Flow Displays the Ready to Verify Email for IPP (Existing behavior is not affected)

• Step 1 Spin up this branch AND identity-oidc-sinatra. Visit http://localhost:9292/
• Step 2 Pick anything except Enhanced In-Person Proofing. (It likely won't even be an option until you get to step 6 below.) Sign in. Set up an account and move through IPP to create a barcode.
• Step 3 Check that the existing behavior, content, template is not affected: Inspect the Ready to Verify Email to ensure style, content, layout, etc is the same as this Figma - See Current Barcode page.
• Step 4 After inspecting the email- confirm the Ready to view is not affected. Confirm the enrollment code is not “3141-59”-that it is much longer and that you see the additional section with all of the new icons. I changed some variable names and resolved merge conflicts- just a quick inspect/sanity check is enough to confirm it is not affected.
• Step 5 Cancel the barcode the Ready to Verify page. Sign out by going to /account.
• Step 6 Kill all servers

Confirm the EIPP Flow Displays the Ready to Verify Email for EIPP (New behavior is working as expected)

• Step 7 In identity-oidc-sinatra set eipp_allowed to true in .env
• Step 8 Spin up this branch AND identity-oidc-sinatra. Visit http://localhost:9292/
• Step 9 Pick Enhanced In-Person Proofing and sign in. Set up an account and move through IPP to create a barcode.
• Step 10 Inspect the Ready to Verify email to ensure style, content, layout, etc is the same as this Figma.
• Step 11 After inspecting the email- confirm the Ready to view is not affected. Confirm the enrollment code is “3141-59” (for EIPP) and that you see the additional section with all of the new icons. I changed some variable names and resolved conflicts- just a quick inspect/sanity check is enough to confirm it is not affected.

👀 Screenshots

If relevant, include a screenshot or screen capture of the changes.

EIPP Ready to Verify **Email**

IPP Ready to Verify **Email** (To confirm existing email is not affected)

EIPP Ready to Verify **View** (To confirm existing view is not affected)

IPP Ready to Verify **View** (To confirm existing view is not affected)

[rutvigupta-design]

@gina-yamada this looks great! I noticed two tiny things:

• For the EIPP email, can we please confirm that the bottom spacing in the "What to expect at the Post Office" section is 32px (2 rem)?
• For the IPP email, I see the spacing at the bottom of the "What to expect at the Post Office" section is really tight (should be 32px too). I'm not sure if this was like this before, or if the EIPP email changes had an impact here but would be great if we could check! :)

[gina-yamada]

@gina-yamada this looks great! I noticed two tiny things:

• For the EIPP email, can we please confirm that the bottom spacing in the "What to expect at the Post Office" section is 32px (2 rem)?
• For the IPP email, I see the spacing at the bottom of the "What to expect at the Post Office" section is really tight (should be 32px too). I'm not sure if this was like this before, or if the EIPP email changes had an impact here but would be great if we could check! :)

For the EIPP email: Check out the image below. The red vertical line has a padding of 2 rem. Let me know if you want to inspect while running or if you meant a different spot.

For the IPP email: I missed the padding. I added it- check out the screenshots below. The form is the same template. If I add padding to one section for one view (EIPP) it can affect the other (IPP) view. That is why I decided to take screenshots of both the IPP version and EIPP version.

Spanish

French

Chinese

[rutvigupta-design]

@gina-yamada thanks so much for confirming the EIPP padding and fixing the padding in the IPP email! Translations and everything LGTM! 🎉

[eileen-nava]

Approved. 👏🏻 I left some non-blocking feedback.

[aduth]

The other utilities in this file follow from USWDS. AFAIK, border-top-width-0 doesn't exist in USWDS. But border-top-0 does.

Suggested change

	.border-top-width-0 {
	border-top: 0;
	}
	.border-top-0 {
	@include u-border-top(0);
	}

[gina-yamada]

PR# 10839 handles this comment.

[aduth]

td width is deprecated, and I don't think it expected units to be provided (hard to verify since the spec doesn't document the attribute anymore)

[gina-yamada]

PR# 10839 handles this comment.

[aduth]

I'm not sure subpixel values are valid, or at least might behave unpredictably. Might have suggested rounding down with these values.

[gina-yamada]

PR# 10839 handles this comment.

[gina-yamada]

@rutvigupta-design This has been merged into production. The EIPP email will not be viewable in production though- only in staging.

[rutvigupta-design]

Thanks so much @gina-yamada! Since we've already sent the app version of this to DOS for LQA, we can skip sending this to them since the content is the same but I'll update our tracker for posterity :)