Purchases: Update cancellation page's support link to use Odie #94213
Conversation
Jetpack Cloud live (direct link)
Automattic for Agencies live (direct link)
|
|
Here is how your PR affects size of JS and CSS bundles shipped to the user's browser: Sections (~609 bytes added 📈 [gzipped]) Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to. Async-loaded Components (~58 bytes added 📈 [gzipped]) React components that are loaded lazily, when a certain part of UI is displayed for the first time. Legend What is parsed and gzip size?Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory. Generated by performance advisor bot at iscalypsofastyet.com. |
michaeldcain
added
the
[Feature] Purchase Management
|
Functionally is working as expected - deploying 🚀 |
| setShowHelpCenter, | ||
| ] ); | ||
|
|
||
| const ContactSupportLink = () => { |
There was a problem hiding this comment.
Defining a functional component inside another component is a bad idea. The internal component will be recreated on every render.
I'll see if I can fix this in #94864
There was a problem hiding this comment.
Thanks for catching this!
| openZendeskWidget( { | ||
| siteUrl: siteUrl, | ||
| siteId: siteId, | ||
| message: `${ status }: Import onboarding flow; migration failed`, |
There was a problem hiding this comment.
What is status here? It's not defined anywhere that I can see.
There was a problem hiding this comment.
Sorry, this was a poorly hacked together usage of the new Odie flow, which is a lot more elaborate than it once was. I pulled this code from the example shown here #93567 (comment) looks like the file he linked to is gone, you can see it from trunk here https://github.com/Automattic/wp-calypso/blob/trunk/client/blocks/importer/wordpress/import-everything/migration-error/index.tsx
Only closer inspection, status is not defined in this file, but, it seems it is defined on the global window object so it didn't throw any errors when I was rigging this up. Also, the text I copied over should've read something like "Cancellation flow, just in time support request" or something along these lines 🤔
There was a problem hiding this comment.
We don't really need status for this use case.
| @@ -29,7 +43,7 @@ const CancelPurchaseRefundInformation = ( { | |||
| confirmCancelBundledDomain, | |||
| onCancelConfirmationStateChange, | |||
| } ) => { | |||
| const { refundPeriodInDays } = purchase; | |||
| const { siteId, siteUrl, refundPeriodInDays } = purchase; | |||
There was a problem hiding this comment.
The Purchase TypeScript type defined here does not have a siteUrl property. I assume one exists, though? If so we need to add that to the type. I'll see if I can confirm that it exists and try to add it in #94864
Note
Reposted from #93567 - branch was incorrect, updated here
When a customer proceeds through the cancelation flow they have the option to 'Ask a Happiness Engineer' if they have a question:
This link leads them to our general
/helppage which would then require a customer to click on 'Get help' to open an omnichannel chat:A more optimal path may be to open the omnichannel chat directly from the cancellation page, similar to a pre-sale chat during Checkout. This would allow us quick access to a churning customer for one last attempt to address any concerns.
Happy path:
@Automattic/martech Is this an oversight or is this the expected behavior of the 'Ask a Happiness Engineer' link?
Related to #93568
Proposed Changes
CALYPSO_CONTACTurl with the Odie functionality found in Help Center.Testing Instructions
Have a question? Ask a Happiness Engineer!line in the first paragraph boxclient/me/purchases/cancel-purchase/refund-information.jsxand make the following change:const { data: isMessagingAvailable } = useZendeskMessagingAvailability( 'wpcom_messaging', - true + false );