Help Center: Add loading state when transferring to Zendesk

[escapemanuele]

Fixes https://linear.app/a8c/issue/DOTCOM-15539/add-loader-odie-thinking-when-creating-conversation

Proposed Changes

• Do not add the transfer messages right away. They would be changed if an error occurs.

• Add a "Thinking" message where we say that we're transferring to live chat.
• Add the transfer messages only if the escalation succeeds.

Screen.Recording.2026-01-06.at.16.05.58.mov

NEXT: https://linear.app/a8c/issue/DOTSUP-381/improve-odie-human-handoff

Testing Instructions

• Run this locally
• Ask to talk with a human
• Ask to talk with a human when you already have an open conversation

[github-actions]

Calypso Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-165973

Jetpack Cloud live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-165973&env=jetpack

Automattic for Agencies live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-165973&env=a8c-for-agencies

Dashboard live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-165973&env=dashboard

[matticbot]

This PR modifies the release build for the following Calypso Apps:

For info about this notification, see here: PCYsg-OT6-p2

• help-center

To test WordPress.com changes, run install-plugin.sh $pluginSlug DOTCOM-15539/add-loader-odie-thinking-when-creating-conversation on your sandbox.

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

Async-loaded Components (~64 bytes added 📈 [gzipped])

Details

name                               parsed_size           gzip_size
async-load-help-center-app               +38 B  (+0.0%)      +64 B  (+0.0%)
async-load-automattic-help-center        +38 B  (+0.0%)      +64 B  (+0.0%)

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.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

[fditrapani]

Perhaps instead of Connecting to the support team, we can say Requesting human support. This should align well with the marker we'll show after that says "Waiting for human".

[escapemanuele]

Thanks Filippo, I updated the copy!

[fditrapani]

Thanks for working on this Emanuele! I added a minor comment for the copy.

[a8ci18n]

This Pull Request is now available for translation here: https://translate.wordpress.com/deliverables/31456402

Some locales (Hebrew) have been temporarily machine-translated due to translator availability. All other translations are usually ready within a few days. Untranslated and machine-translated strings will be sent for translation next Monday and are expected to be completed by the following Friday.

Thank you @escapemanuele for including a screenshot in the description! This is really helpful for our translators.

[fditrapani]

Thanks for the update! looks good on my end!

[dsas]

Seems fine 👍

[a8ci18n]

This Pull Request is now available for translation here: https://translate.wordpress.com/deliverables/31456402

Some locales (Hebrew) have been temporarily machine-translated due to translator availability. All other translations are usually ready within a few days. Untranslated and machine-translated strings will be sent for translation next Monday and are expected to be completed by the following Friday.

Thank you @escapemanuele for including a screenshot in the description! This is really helpful for our translators.