Help Center: Open chat images in a new tab

[escapemanuele]

Fixes https://github.com/Automattic/dotcom-forge/issues/10019

TODO: Open images in a new tab

Proposed Changes

Opens the images sent in the chat in a new page.

Testing Instructions

• Open the Help Center with the ?flags=help-center-experience
• Open a chat with an Happiness Engineer and send an image from the Happiness Engineer
• The image should be clickable
• You older images should be clickable
• The images you sent in the current session are still not clickable, we'll address it in the next PR

[github-actions]

Calypso Live (direct link)

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

Jetpack Cloud live (direct link)

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

Automattic for Agencies live (direct link)

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

[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 update/hc-image-newtab 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 (~32 bytes added 📈 [gzipped])

name                               parsed_size           gzip_size
async-load-automattic-help-center       +113 B  (+0.0%)      +32 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.

[heavyweight]

Screen.Recording.2024-12-02.at.16.47.18.mov

The image is not clickable right away for me.
Also there is a crash if you send a message after that.

[agrullon95]

@escapemanuele - I'm having the issue Kosta mentioned above. I can't click on the image and it crashes after I send a message.

[escapemanuele]

Thanks, I disabled the click on the image right after sending it, since we don't have a true URL but instead a createObjectURL.

I'll address the crash that happens!

[AllTerrainDeveloper]

I've tested the image part and I've realised that right after uploading the image, the image is not clickable. But if you reload the conversation (F5), then it's possible to open the image. Is this desired or intended? Also, is not possible to open images that are received from the IA, is that intended? the images are almost impossible to see

OK - I've seen the recently images sent for HE are for a next PR :)

I've been testing quite a lot the new chat and I've not seen any issue (one minor thing is just that the initial language shown for new conversation does not match the WordPress language set)

[escapemanuele]

OK - I've seen the recently images sent for HE are for a next PR :)

Yes, the images you sent in previously conversations are also clickable. It is just that the attachment works with not showing the image from Zendesk, but creating a local URL for the file. We'll work on this to check if it is fixable.

But the main motivation for the change is because users cannot open images received by HEs, so I quickly created this :)

is not possible to open images that are received from the IA

Well, this change is for attachments shared between users and HEs :)

one minor thing is just that the initial language shown for new conversation does not match the WordPress language set

If you can, add something to the Cft! pdDR7T-1X1-p2