From 70dfaf5eb6c34ea0e9fd8e9ac5645306e4d23728 Mon Sep 17 00:00:00 2001 From: Tony Arcangelini <33258733+arcangelini@users.noreply.github.com> Date: Tue, 1 Oct 2024 12:57:49 +0200 Subject: [PATCH] Help Center: use Zendesk staging when proxied (#94998) --- apps/help-center/config.js | 12 ++++++++++-- apps/help-center/package.json | 1 + config/stage.json | 2 +- config/wpcalypso.json | 2 +- packages/calypso-e2e/package.json | 1 + .../calypso-e2e/src/lib/components/help-center.ts | 3 ++- packages/zendesk-client/package.json | 4 +--- packages/zendesk-client/src/constants.ts | 2 ++ packages/zendesk-client/src/index.ts | 6 +++++- .../src/use-authenticate-zendesk-messaging.ts | 2 +- yarn.lock | 5 +++-- 11 files changed, 28 insertions(+), 12 deletions(-) diff --git a/apps/help-center/config.js b/apps/help-center/config.js index 1d97a675504bb5..ce02ef1d408c66 100644 --- a/apps/help-center/config.js +++ b/apps/help-center/config.js @@ -1,6 +1,14 @@ +/* global helpCenterData */ +import { + ZENDESK_STAGING_SUPPORT_CHAT_KEY, + ZENDESK_SUPPORT_CHAT_KEY, +} from '@automattic/zendesk-client/src/constants'; + window.configData = { - env_id: 'production', - zendesk_support_chat_key: 'cec07bc9-4da6-4dd2-afa7-c7e01ae73584', + env_id: helpCenterData?.isProxied ? 'staging' : 'production', + zendesk_support_chat_key: helpCenterData?.isProxied + ? ZENDESK_STAGING_SUPPORT_CHAT_KEY + : ZENDESK_SUPPORT_CHAT_KEY, features: { 'help/gpt-response': true, }, diff --git a/apps/help-center/package.json b/apps/help-center/package.json index 0e7ac5896c1862..3a34bec7f64736 100644 --- a/apps/help-center/package.json +++ b/apps/help-center/package.json @@ -34,6 +34,7 @@ "@automattic/calypso-analytics": "workspace:^", "@automattic/help-center": "workspace:^", "@automattic/i18n-utils": "workspace:^", + "@automattic/zendesk-client": "workspace:^", "@tanstack/react-query": "^5.15.5", "@wordpress/components": "^28.8.0", "@wordpress/compose": "^7.8.0", diff --git a/config/stage.json b/config/stage.json index 0456d7c7cad5ab..11e45d7fcd50a3 100644 --- a/config/stage.json +++ b/config/stage.json @@ -16,7 +16,7 @@ "zendesk_presales_chat_key": "216bf91d-f10f-4f66-bf65-a0cba220cd38", "zendesk_presales_chat_key_akismet": "7ce13115-7b34-4069-9d64-228d90f148d1", "zendesk_presales_chat_key_jp_checkout": "7c42153f-f579-49ba-a33e-246b2d27fb93", - "zendesk_support_chat_key": "cec07bc9-4da6-4dd2-afa7-c7e01ae73584", + "zendesk_support_chat_key": "715f17a8-4a28-4a7f-8447-0ef8f06c70d7", "features": { "100-year-plan/vip": false, "ad-tracking": false, diff --git a/config/wpcalypso.json b/config/wpcalypso.json index 445ad5f0d00161..18c732deb22f1d 100644 --- a/config/wpcalypso.json +++ b/config/wpcalypso.json @@ -15,7 +15,7 @@ "zendesk_presales_chat_key": "216bf91d-f10f-4f66-bf65-a0cba220cd38", "zendesk_presales_chat_key_akismet": "7ce13115-7b34-4069-9d64-228d90f148d1", "zendesk_presales_chat_key_jp_checkout": "7c42153f-f579-49ba-a33e-246b2d27fb93", - "zendesk_support_chat_key": "cec07bc9-4da6-4dd2-afa7-c7e01ae73584", + "zendesk_support_chat_key": "715f17a8-4a28-4a7f-8447-0ef8f06c70d7", "features": { "100-year-plan/vip": false, "ad-tracking": false, diff --git a/packages/calypso-e2e/package.json b/packages/calypso-e2e/package.json index e7631df3024253..a698deb6701a64 100644 --- a/packages/calypso-e2e/package.json +++ b/packages/calypso-e2e/package.json @@ -31,6 +31,7 @@ "@automattic/calypso-eslint-overrides": "workspace:^", "@automattic/calypso-typescript-config": "workspace:^", "@automattic/languages": "workspace:^", + "@automattic/zendesk-client": "workspace:^", "@jest/globals": "^29.7.0", "@types/node": "^20.8.6", "@types/node-fetch": "^2.6.1", diff --git a/packages/calypso-e2e/src/lib/components/help-center.ts b/packages/calypso-e2e/src/lib/components/help-center.ts index a1c5c9dbb63981..9b921a97156859 100644 --- a/packages/calypso-e2e/src/lib/components/help-center.ts +++ b/packages/calypso-e2e/src/lib/components/help-center.ts @@ -1,3 +1,4 @@ +import { ZENDESK_STAGING_SUPPORT_CHAT_KEY } from '@automattic/zendesk-client/src/constants'; import { Locator, Page } from 'playwright'; export type ResultsCategory = 'Docs' | 'Links'; @@ -207,7 +208,7 @@ export class HelpCenterComponent { await this.page.evaluate( () => { if ( typeof configData !== 'undefined' ) { - configData.zendesk_support_chat_key = '715f17a8-4a28-4a7f-8447-0ef8f06c70d7'; + configData.zendesk_support_chat_key = ZENDESK_STAGING_SUPPORT_CHAT_KEY; } } ); } diff --git a/packages/zendesk-client/package.json b/packages/zendesk-client/package.json index e77f2a80639395..4fe84ff962a22f 100644 --- a/packages/zendesk-client/package.json +++ b/packages/zendesk-client/package.json @@ -28,6 +28,7 @@ "@wordpress/api-fetch": "^7.8.0", "@wordpress/element": "^6.8.0", "@wordpress/url": "^4.8.0", + "react": "^18.3.1", "smooch": "5.6.0", "wpcom-proxy-request": "workspace:^" }, @@ -35,8 +36,5 @@ "@automattic/calypso-typescript-config": "workspace:^", "typescript": "^5.3.3" }, - "peerDependencies": { - "react": "^18.2.0" - }, "license": "GPL-2.0-or-later" } diff --git a/packages/zendesk-client/src/constants.ts b/packages/zendesk-client/src/constants.ts index bd42984514d6a5..2e5a977a266b1a 100644 --- a/packages/zendesk-client/src/constants.ts +++ b/packages/zendesk-client/src/constants.ts @@ -1,3 +1,5 @@ export const SMOOCH_INTEGRATION_ID = '6453b7fc45cea5c267e60fed'; export const ZENDESK_SOURCE_URL_TICKET_FIELD_ID = 23752099174548; export const ZENDESK_SCRIPT_ID = 'ze-snippet'; +export const ZENDESK_SUPPORT_CHAT_KEY = 'cec07bc9-4da6-4dd2-afa7-c7e01ae73584'; +export const ZENDESK_STAGING_SUPPORT_CHAT_KEY = '715f17a8-4a28-4a7f-8447-0ef8f06c70d7'; diff --git a/packages/zendesk-client/src/index.ts b/packages/zendesk-client/src/index.ts index 6b2a9047c9a52f..1bd297649217b1 100644 --- a/packages/zendesk-client/src/index.ts +++ b/packages/zendesk-client/src/index.ts @@ -4,5 +4,9 @@ export { useCanConnectToZendeskMessaging } from './use-can-connect-to-zendesk-me export { useSmooch } from './use-smooch'; export { useOpenZendeskMessaging } from './use-open-zendesk-messaging'; export { useZendeskMessagingAvailability } from './use-zendesk-messaging-availability'; -export { ZENDESK_SOURCE_URL_TICKET_FIELD_ID } from './constants'; +export { + ZENDESK_SOURCE_URL_TICKET_FIELD_ID, + ZENDESK_STAGING_SUPPORT_CHAT_KEY, + ZENDESK_SUPPORT_CHAT_KEY, +} from './constants'; export type { ZendeskConfigName, MessagingGroup } from './types'; diff --git a/packages/zendesk-client/src/use-authenticate-zendesk-messaging.ts b/packages/zendesk-client/src/use-authenticate-zendesk-messaging.ts index a73140a48f6d34..e24d3bdacdf008 100644 --- a/packages/zendesk-client/src/use-authenticate-zendesk-messaging.ts +++ b/packages/zendesk-client/src/use-authenticate-zendesk-messaging.ts @@ -18,7 +18,7 @@ export function useAuthenticateZendeskMessaging( type: ZendeskAuthType = 'zendesk' ) { const currentEnvironment = config( 'env_id' ); - const isTestMode = currentEnvironment === 'development'; + const isTestMode = currentEnvironment !== 'production'; return useQuery( { queryKey: [ 'getMessagingAuth', type, isTestMode ], diff --git a/yarn.lock b/yarn.lock index d74183831903e1..c4d92a47022101 100644 --- a/yarn.lock +++ b/yarn.lock @@ -363,6 +363,7 @@ __metadata: "@automattic/calypso-eslint-overrides": "workspace:^" "@automattic/calypso-typescript-config": "workspace:^" "@automattic/languages": "workspace:^" + "@automattic/zendesk-client": "workspace:^" "@jest/globals": "npm:^29.7.0" "@jest/types": "npm:^29.5.0" "@types/node": "npm:^20.8.6" @@ -1101,6 +1102,7 @@ __metadata: "@automattic/help-center": "workspace:^" "@automattic/i18n-utils": "workspace:^" "@automattic/wp-babel-makepot": "workspace:^" + "@automattic/zendesk-client": "workspace:^" "@tanstack/react-query": "npm:^5.15.5" "@wordpress/components": "npm:^28.8.0" "@wordpress/compose": "npm:^7.8.0" @@ -2240,11 +2242,10 @@ __metadata: "@wordpress/api-fetch": "npm:^7.8.0" "@wordpress/element": "npm:^6.8.0" "@wordpress/url": "npm:^4.8.0" + react: "npm:^18.3.1" smooch: "npm:5.6.0" typescript: "npm:^5.3.3" wpcom-proxy-request: "workspace:^" - peerDependencies: - react: ^18.2.0 languageName: unknown linkType: soft