@automattic/data-stores 3.1.0-rc.6 → 3.1.1

package/src/add-ons/mocks.ts

@@ -0,0 +1,29 @@
+import { PRODUCT_1GB_SPACE } from '@automattic/calypso-products';
+import { ADD_ON_50GB_STORAGE } from './constants';
+import spaceUpgradeIcon from './icons/space-upgrade';
+import type { AddOnMeta } from './types';
+
+const STORAGE_ADD_ONS_MOCK: AddOnMeta[] = [
+	{
+		addOnSlug: ADD_ON_50GB_STORAGE,
+		productSlug: PRODUCT_1GB_SPACE,
+		featureSlugs: null,
+		icon: spaceUpgradeIcon,
+		quantity: 50,
+		name: '50 GB Storage',
+		displayCost: '50',
+		prices: {
+			monthlyPrice: 10,
+			yearlyPrice: 120,
+			formattedMonthlyPrice: 'USD10',
+			formattedYearlyPrice: 'USD120',
+			currencyCode: 'USD',
+		},
+		description: 'Make more space for high-quality photos, videos, and other media. ',
+		featured: false,
+		purchased: false,
+		checkoutLink: 'checkout:storage-50gb',
+	},
+];
+
+export { STORAGE_ADD_ONS_MOCK };

package/src/add-ons/types.ts

@@ -6,12 +6,11 @@ export interface AddOnMeta {
 	addOnSlug: AddOnSlug;
 	productSlug: StoreProductSlug;
 	featureSlugs?: string[] | null;
-	icon: JSX.Element;
+	icon?: JSX.Element;
 	featured?: boolean; // used to display the popular badge in the add-ons grid
-	name: string | null;
-	quantity?: number; // used for determining checkout costs for quantity based products
-	description: string | null;
-	displayCost: TranslateResult | null;
+	name?: TranslateResult; // when the name is optional, it will be filled by the product list data
+	description?: TranslateResult; // same as the above.
+	displayCost?: TranslateResult;
 	purchased?: boolean;
 	isLoading?: boolean;
 	prices?: {
@@ -19,9 +18,10 @@ export interface AddOnMeta {
 		yearlyPrice: number;
 		formattedMonthlyPrice: string;
 		formattedYearlyPrice: string;
+		currencyCode: string;
 	} | null;
+	quantity?: number; // used for determining checkout costs for quantity based products
 	checkoutLink?: string;
-	exceedsSiteStorageLimits?: boolean;
 }
 
 export type AddOnSlug = ( typeof ADD_ONS )[ number ];

package/src/analyzer/actions.ts

@@ -24,7 +24,6 @@ export function createActions() {
 			const data: AnalyzeColorsResponse = yield wpcomRequest( {
 				path: '/imports/url-analyzer/colors/?url=' + encodeURIComponent( url ),
 				apiNamespace: 'wpcom/v2',
-				apiVersion: '2',
 			} );
 
 			yield colorsAnalyzeSuccess( url, data );

package/src/contextual-help/admin-sections.ts

@@ -91,7 +91,7 @@ export function generateAdminSections(
 		},
 		{
 			title: __( 'Cancel my plan', __i18n_text_domain__ ),
-			link: `/me/purchases`,
+			link: '/me/purchases',
 			synonyms: [ 'upgrade', 'business', 'professional', 'personal' ],
 			icon: 'plans',
 		},
@@ -104,7 +104,7 @@ export function generateAdminSections(
 		{
 			/* translators: %(googleMailService)s can be either "G Suite" or "Google Workspace */
 			title: sprintf( __( 'Cancel %s', __i18n_text_domain__ ), googleMailService ),
-			link: `/me/purchases`,
+			link: '/me/purchases',
 			synonyms: [ 'upgrade', 'business', 'professional', 'personal', 'google' ],
 			icon: 'plans',
 		},
@@ -353,7 +353,7 @@ export function generateAdminSections(
 		},
 		{
 			title: __( 'New post', __i18n_text_domain__ ),
-			description: __( `Create a new blog post on your site.` ),
+			description: __( 'Create a new blog post on your site.' ),
 			link: `/post/${ siteSlug }`,
 			synonyms: [ 'lists', 'posts' ],
 			icon: 'my-sites',

package/src/contextual-help/contextual-help.tsx

@@ -1,6 +1,9 @@
 import { __ } from '@wordpress/i18n';
+import debugFactory from 'debug';
 import { RESULT_TOUR, RESULT_VIDEO } from './constants';
 
+const debug = debugFactory( 'calypso:data-stores:contextual-help' );
+
 export type LinksForSection = {
 	readonly link: string;
 	post_id?: number;
@@ -611,8 +614,7 @@ export function getContextResults( section: string, siteIntent: string ) {
 	}
 
 	if ( siteIntent ) {
-		// eslint-disable-next-line no-console
-		console.warn( 'Site intent is', siteIntent );
+		debug( `Site intent: ${ siteIntent }` );
 	}
 
 	// make sure editorially to show at most one tour and one video at once

package/src/domain-suggestions/index.ts

@@ -1,4 +1,4 @@
-import { registerStore } from '@wordpress/data';
+import { register, createReduxStore } from '@wordpress/data';
 import { controls } from '../wpcom-request-controls';
 import * as actions from './actions';
 import { STORE_KEY } from './constants';
@@ -12,18 +12,11 @@ export * from './queries';
 export { getFormattedPrice } from './utils';
 export type { State };
 
-let isRegistered = false;
-
-export function register(): typeof STORE_KEY {
-	if ( ! isRegistered ) {
-		isRegistered = true;
-		registerStore( STORE_KEY, {
-			actions,
-			controls,
-			reducer,
-			resolvers,
-			selectors,
-		} );
-	}
-	return STORE_KEY;
-}
+export const store = createReduxStore( STORE_KEY, {
+	actions,
+	controls,
+	reducer,
+	resolvers,
+	selectors,
+} );
+register( store );

package/src/domain-suggestions/test/selectors.ts

@@ -1,6 +1,6 @@
 import { select, subscribe } from '@wordpress/data';
 import wpcomRequest from 'wpcom-proxy-request';
-import { register } from '..';
+import { store } from '..';
 import { DataStatus } from '../constants';
 
 jest.mock( 'wpcom-proxy-request', () => ( {
@@ -9,8 +9,6 @@ jest.mock( 'wpcom-proxy-request', () => ( {
 	requestAllBlogsAccess: jest.fn( () => Promise.resolve() ),
 } ) );
 
-let store: ReturnType< typeof register >;
-
 const options = {
 	category_slug: undefined,
 	include_dotblogsubdomain: false,
@@ -27,7 +25,10 @@ const apiResponse = [
 		match_reasons: [ 'tld-common', 'tld-exact' ],
 		product_id: 78,
 		product_slug: 'dotsite_domain',
-		cost: '$25.00',
+		cost: '$25',
+		raw_price: 25,
+		currency_code: 'USD',
+		unavailable: false,
 	},
 	{
 		domain_name: 'hot-test-site.com',
@@ -37,14 +38,13 @@ const apiResponse = [
 		match_reasons: [ 'tld-common' ],
 		product_id: 6,
 		product_slug: 'domain_reg',
-		cost: '$18.00',
+		cost: '$18',
+		raw_price: 18,
+		currency_code: 'USD',
+		unavailable: false,
 	},
 ];
 
-beforeAll( () => {
-	store = register();
-} );
-
 beforeEach( () => {
 	( wpcomRequest as jest.Mock ).mockReset();
 } );
@@ -55,7 +55,7 @@ describe( 'getDomainSuggestions', () => {
 
 		const query = 'test query one';
 		const listenForStateUpdate = () => {
-			return new Promise( ( resolve ) => {
+			return new Promise< void >( ( resolve ) => {
 				const unsubscribe = subscribe( () => {
 					unsubscribe();
 					resolve();
@@ -88,7 +88,7 @@ describe( 'getDomainSuggestions', () => {
 
 		expect(
 			select( 'core/data' ).isResolving( store, 'getDomainSuggestions', [ query, options ] )
-		).toStrictEqual( false );
+		).toEqual( false );
 	} );
 } );
 
@@ -102,7 +102,7 @@ describe( 'getDomainErrorMessage', () => {
 
 		const query = 'test query two';
 		const listenForStateUpdate = () => {
-			return new Promise( ( resolve ) => {
+			return new Promise< void >( ( resolve ) => {
 				const unsubscribe = subscribe( () => {
 					unsubscribe();
 					resolve();

package/src/domain-suggestions/types.ts

@@ -1,6 +1,4 @@
-import * as selectors from './selectors';
 import type { DataStatus } from './constants';
-import type { SelectFromMap } from '../mapped-types';
 
 export interface DomainSuggestionQuery {
 	/**
@@ -254,5 +252,3 @@ export interface DomainSuggestionState {
 export type DomainAvailabilities = Record< string, DomainAvailability | undefined >;
 
 export type DomainSuggestionSelectorOptions = Partial< Exclude< DomainSuggestionQuery, 'query' > >;
-
-export type DomainSuggestionsSelect = SelectFromMap< typeof selectors >;

package/src/domain-suggestions/utils.ts

@@ -1,10 +1,9 @@
-import formatCurrency from '@automattic/format-currency';
 import deterministicStringify from 'fast-json-stable-stringify';
+import { formatCurrency } from 'i18n-calypso';
 import type { DomainSuggestionQuery, DomainSuggestionSelectorOptions } from './types';
 
 /**
  * Stable transform to an object key for storage and access.
- * @see client/state/domains/suggestions/utils.js
  */
 export const stringifyDomainQueryObject: ( q: DomainSuggestionQuery ) => string =
 	deterministicStringify;
@@ -26,8 +25,6 @@ export function getFormattedPrice( price: number, currencyCode: string ): string
  *
  * It's important to have a consistent, reproduceable representation of a domains query so that the result can be
  * stored and retrieved.
- * @see client/state/domains/suggestions/utils.js
- * @see client/components/data/query-domains-suggestions/index.jsx
  * @param search       Domain search string
  * @param queryOptions Optional paramaters for the query
  * @returns Normalized query object

package/src/help-center/actions.ts

@@ -1,9 +1,20 @@
+import { default as apiFetchPromise } from '@wordpress/api-fetch';
+import { select } from '@wordpress/data';
 import { apiFetch } from '@wordpress/data-controls';
-import { canAccessWpcomApis } from 'wpcom-proxy-request';
+import { addQueryArgs } from '@wordpress/url';
+import { default as wpcomRequestPromise, canAccessWpcomApis } from 'wpcom-proxy-request';
 import { GeneratorReturnType } from '../mapped-types';
 import { SiteDetails } from '../site';
 import { wpcomRequest } from '../wpcom-request-controls';
-import type { APIFetchOptions } from './types';
+import { STORE_KEY } from './constants';
+import { isE2ETest } from '.';
+import type {
+	APIFetchOptions,
+	HelpCenterOptions,
+	HelpCenterSelect,
+	HelpCenterShowOptions,
+} from './types';
+import type { SupportInteraction } from '@automattic/odie-client/src/types';
 
 export const receiveHasSeenWhatsNewModal = ( value: boolean | undefined ) =>
 	( {
@@ -17,7 +28,7 @@ export function* setHasSeenWhatsNewModal( value: boolean ) {
 	};
 	if ( canAccessWpcomApis() ) {
 		response = yield wpcomRequest( {
-			path: `/block-editor/has-seen-whats-new-modal`,
+			path: '/block-editor/has-seen-whats-new-modal',
 			apiNamespace: 'wpcom/v2',
 			method: 'PUT',
 			body: {
@@ -27,7 +38,7 @@ export function* setHasSeenWhatsNewModal( value: boolean ) {
 	} else {
 		response = yield apiFetch( {
 			global: true,
-			path: `/wpcom/v2/block-editor/has-seen-whats-new-modal`,
+			path: '/wpcom/v2/block-editor/has-seen-whats-new-modal',
 			method: 'PUT',
 			data: { has_seen_whats_new_modal: value },
 		} as APIFetchOptions );
@@ -36,6 +47,13 @@ export function* setHasSeenWhatsNewModal( value: boolean ) {
 	return receiveHasSeenWhatsNewModal( response.has_seen_whats_new_modal );
 }
 
+export function setCurrentSupportInteraction( supportInteraction: SupportInteraction ) {
+	return {
+		type: 'HELP_CENTER_SET_CURRENT_SUPPORT_INTERACTION',
+		supportInteraction,
+	} as const;
+}
+
 export const setNavigateToRoute = ( route?: string ) =>
 	( {
 		type: 'HELP_CENTER_SET_NAVIGATE_TO_ROUTE',
@@ -66,6 +84,24 @@ export const setIsMinimized = ( minimized: boolean ) =>
 		minimized,
 	} ) as const;
 
+export const setIsChatLoaded = ( isChatLoaded: boolean ) =>
+	( {
+		type: 'HELP_CENTER_SET_IS_CHAT_LOADED',
+		isChatLoaded,
+	} ) as const;
+
+export const setAreSoundNotificationsEnabled = ( areSoundNotificationsEnabled: boolean ) =>
+	( {
+		type: 'HELP_CENTER_SET_ARE_SOUND_NOTIFICATIONS_ENABLED',
+		areSoundNotificationsEnabled,
+	} ) as const;
+
+export const setZendeskClientId = ( zendeskClientId: string ) =>
+	( {
+		type: 'HELP_CENTER_SET_ZENDESK_CLIENT_ID',
+		zendeskClientId,
+	} ) as const;
+
 export const setShowMessagingLauncher = ( show: boolean ) =>
 	( {
 		type: 'HELP_CENTER_SET_SHOW_MESSAGING_LAUNCHER',
@@ -78,15 +114,78 @@ export const setShowMessagingWidget = ( show: boolean ) =>
 		show,
 	} ) as const;
 
-export const setShowHelpCenter = function* ( show: boolean ) {
+export const setMessage = ( message: string ) =>
+	( {
+		type: 'HELP_CENTER_SET_MESSAGE',
+		message,
+	} ) as const;
+
+export const setAllowPremiumSupport = ( allow: boolean ) =>
+	( {
+		type: 'HELP_CENTER_SET_ALLOW_PREMIUM_SUPPORT',
+		allow,
+	} ) as const;
+
+export const setHelpCenterOptions = ( options: HelpCenterOptions ) => ( {
+	type: 'HELP_CENTER_SET_OPTIONS' as const,
+	options,
+} );
+
+export const setShowHelpCenter = function* (
+	show: boolean,
+	allowPremiumSupport = false,
+	options: HelpCenterShowOptions = { hideBackButton: false, searchTerm: '' }
+): Generator< unknown, { type: 'HELP_CENTER_SET_SHOW'; show: boolean }, unknown > {
+	const isMinimized = ( select( STORE_KEY ) as HelpCenterSelect ).getIsMinimized();
+
+	if ( ! show && isMinimized ) {
+		yield setIsMinimized( false );
+
+		return {
+			type: 'HELP_CENTER_SET_SHOW',
+			show: true,
+		} as const;
+	}
+
+	if ( ! isE2ETest() ) {
+		if ( canAccessWpcomApis() ) {
+			// Use the promise version to do that action without waiting for the result.
+			wpcomRequestPromise( {
+				path: '/me/preferences',
+				apiNamespace: 'wpcom/v2',
+				method: 'PUT',
+				body: {
+					calypso_preferences: { help_center_open: show },
+				},
+			} ).catch( () => {} );
+		} else {
+			// Use the promise version to do that action without waiting for the result.
+			apiFetchPromise( {
+				global: true,
+				path: '/help-center/open-state',
+				method: 'PUT',
+				data: { help_center_open: show },
+			} as APIFetchOptions ).catch( () => {} );
+		}
+	}
+
 	if ( ! show ) {
 		yield setNavigateToRoute( undefined );
 	} else {
 		yield setShowMessagingWidget( false );
 	}
 
+	yield setMessage( options?.searchTerm || '' );
 	yield setIsMinimized( false );
 
+	if ( allowPremiumSupport ) {
+		yield setAllowPremiumSupport( true );
+	}
+
+	if ( options?.hideBackButton ) {
+		yield setHelpCenterOptions( options );
+	}
+
 	return {
 		type: 'HELP_CENTER_SET_SHOW',
 		show,
@@ -99,12 +198,6 @@ export const setSubject = ( subject: string ) =>
 		subject,
 	} ) as const;
 
-export const setMessage = ( message: string ) =>
-	( {
-		type: 'HELP_CENTER_SET_MESSAGE',
-		message,
-	} ) as const;
-
 export const setUserDeclaredSiteUrl = ( url: string ) =>
 	( {
 		type: 'HELP_CENTER_SET_USER_DECLARED_SITE_URL',
@@ -122,11 +215,26 @@ export const resetStore = () =>
 		type: 'HELP_CENTER_RESET_STORE',
 	} ) as const;
 
-export const setShowMessagingChat = function* () {
-	yield setShowHelpCenter( false );
-	yield setShowMessagingLauncher( true );
-	yield setShowMessagingWidget( true );
-	yield resetStore();
+export const setNewMessagingChat = function* ( {
+	initialMessage,
+	section,
+	siteUrl,
+	siteId,
+}: {
+	initialMessage: string;
+	section?: string;
+	siteUrl?: string;
+	siteId?: string;
+} ) {
+	const url = addQueryArgs( '/odie', {
+		provider: 'zendesk',
+		userFieldMessage: initialMessage,
+		section,
+		siteUrl,
+		siteId,
+	} );
+	yield setNavigateToRoute( url );
+	yield setShowHelpCenter( true );
 };
 
 export const setShowSupportDoc = function* ( link: string, postId?: number, blogId?: number ) {
@@ -153,8 +261,14 @@ export type HelpCenterAction =
 			| typeof setUserDeclaredSiteUrl
 			| typeof setUnreadCount
 			| typeof setIsMinimized
+			| typeof setIsChatLoaded
+			| typeof setAreSoundNotificationsEnabled
+			| typeof setZendeskClientId
 			| typeof setNavigateToRoute
 			| typeof setOdieInitialPromptText
 			| typeof setOdieBotNameSlug
+			| typeof setCurrentSupportInteraction
+			| typeof setAllowPremiumSupport
+			| typeof setHelpCenterOptions
 	  >
 	| GeneratorReturnType< typeof setShowHelpCenter | typeof setHasSeenWhatsNewModal >;

package/src/help-center/index.ts

@@ -5,12 +5,42 @@ import { controls as wpcomRequestControls } from '../wpcom-request-controls';
 import * as actions from './actions';
 import { STORE_KEY } from './constants';
 import reducer, { State } from './reducer';
+import { isHelpCenterShown } from './resolvers';
 import * as selectors from './selectors';
 export type { State };
 
+declare const helpCenterData: { isProxied: boolean } | undefined;
+
 let isRegistered = false;
 
+// All end-to-end tests use a custom user agent containing this string.
+const E2E_USER_AGENT = 'wp-e2e-tests';
+
+export const isE2ETest = () =>
+	typeof window !== 'undefined' && window.navigator.userAgent.includes( E2E_USER_AGENT );
+
+export const isSupportSession = () => {
+	if ( typeof window !== 'undefined' ) {
+		return (
+			'disableHelpCenterAutoOpen' in window ||
+			// A bit hacky but much easier than passing down data from PHP in Jetpack
+			// Simple
+			!! document.querySelector( '#wp-admin-bar-support-session-details' ) ||
+			!! document.querySelector( '#a8c-support-session-overlay' ) ||
+			// Atomic
+			document.body.classList.contains( 'support-session' ) ||
+			document.querySelector( '#wpcom > .is-support-session' ) ||
+			// Our failover last hope, don't re-open when proxied.
+			// This is not the same `window.helpCenterData`, because it's defined as `const helpCenterData`
+			( typeof helpCenterData !== 'undefined' && helpCenterData?.isProxied )
+		);
+	}
+	return false;
+};
+
 export function register(): typeof STORE_KEY {
+	const enabledPesistedOpenState = ! isE2ETest() && ! isSupportSession();
+
 	registerPlugins();
 
 	if ( ! isRegistered ) {
@@ -20,6 +50,8 @@ export function register(): typeof STORE_KEY {
 			controls: { ...controls, ...wpcomRequestControls },
 			selectors,
 			persist: [ 'message', 'userDeclaredSite', 'userDeclaredSiteUrl', 'subject' ],
+			// Don't persist the open state for e2e users, because parallel tests will start interfering with each other.
+			resolvers: enabledPesistedOpenState ? { isHelpCenterShown } : undefined,
 		} );
 		isRegistered = true;
 	}

package/src/help-center/reducer.ts

@@ -1,6 +1,8 @@
 import { combineReducers } from '@wordpress/data';
 import { SiteDetails } from '../site';
 import type { HelpCenterAction } from './actions';
+import type { HelpCenterOptions } from './types';
+import type { SupportInteraction } from '@automattic/odie-client/src/types';
 import type { Reducer } from 'redux';
 
 const showHelpCenter: Reducer< boolean | undefined, HelpCenterAction > = ( state, action ) => {
@@ -41,6 +43,16 @@ const hasSeenWhatsNewModal: Reducer< boolean | undefined, HelpCenterAction > = (
 	return state;
 };
 
+const currentSupportInteraction: Reducer< SupportInteraction | undefined, HelpCenterAction > = (
+	state,
+	action
+) => {
+	if ( action.type === 'HELP_CENTER_SET_CURRENT_SUPPORT_INTERACTION' ) {
+		return action.supportInteraction;
+	}
+	return state;
+};
+
 const isMinimized: Reducer< boolean, HelpCenterAction > = ( state = false, action ) => {
 	switch ( action.type ) {
 		case 'HELP_CENTER_SET_MINIMIZED':
@@ -49,6 +61,33 @@ const isMinimized: Reducer< boolean, HelpCenterAction > = ( state = false, actio
 	return state;
 };
 
+const isChatLoaded: Reducer< boolean, HelpCenterAction > = ( state = false, action ) => {
+	switch ( action.type ) {
+		case 'HELP_CENTER_SET_IS_CHAT_LOADED':
+			return action.isChatLoaded;
+	}
+	return state;
+};
+
+const areSoundNotificationsEnabled: Reducer< boolean, HelpCenterAction > = (
+	state = true,
+	action
+) => {
+	switch ( action.type ) {
+		case 'HELP_CENTER_SET_ARE_SOUND_NOTIFICATIONS_ENABLED':
+			return action.areSoundNotificationsEnabled;
+	}
+	return state;
+};
+
+const zendeskClientId: Reducer< string, HelpCenterAction > = ( state = '', action ) => {
+	switch ( action.type ) {
+		case 'HELP_CENTER_SET_ZENDESK_CLIENT_ID':
+			return action.zendeskClientId;
+	}
+	return state;
+};
+
 const subject: Reducer< string | undefined, HelpCenterAction > = ( state, action ) => {
 	if ( action.type === 'HELP_CENTER_RESET_STORE' ) {
 		return undefined;
@@ -121,7 +160,26 @@ const odieBotNameSlug: Reducer< string | undefined, HelpCenterAction > = ( state
 	return state;
 };
 
+const allowPremiumSupport: Reducer< boolean, HelpCenterAction > = ( state = false, action ) => {
+	switch ( action.type ) {
+		case 'HELP_CENTER_SET_ALLOW_PREMIUM_SUPPORT':
+			return action.allow;
+	}
+	return state;
+};
+
+const helpCenterOptions: Reducer< HelpCenterOptions, HelpCenterAction > = (
+	state = {},
+	action
+) => {
+	if ( action.type === 'HELP_CENTER_SET_OPTIONS' ) {
+		return { ...state, ...action.options };
+	}
+	return state;
+};
+
 const reducer = combineReducers( {
+	currentSupportInteraction,
 	showHelpCenter,
 	showMessagingLauncher,
 	showMessagingWidget,
@@ -131,10 +189,15 @@ const reducer = combineReducers( {
 	userDeclaredSiteUrl,
 	hasSeenWhatsNewModal,
 	isMinimized,
+	isChatLoaded,
+	areSoundNotificationsEnabled,
+	zendeskClientId,
 	unreadCount,
 	navigateToRoute,
 	odieInitialPromptText,
 	odieBotNameSlug,
+	allowPremiumSupport,
+	helpCenterOptions,
 } );
 
 export type State = ReturnType< typeof reducer >;

package/src/help-center/resolvers.ts

@@ -0,0 +1,28 @@
+import { apiFetch } from '@wordpress/data-controls';
+import { canAccessWpcomApis } from 'wpcom-proxy-request';
+import { wpcomRequest } from '../wpcom-request-controls';
+import type { APIFetchOptions } from './types';
+
+export function* isHelpCenterShown() {
+	try {
+		const preferences: {
+			help_center_open: boolean;
+		} = canAccessWpcomApis()
+			? yield wpcomRequest( {
+					path: '/me/preferences',
+					apiNamespace: 'wpcom/v2',
+			  } )
+			: yield apiFetch( {
+					global: true,
+					path: '/help-center/open-state',
+			  } as APIFetchOptions );
+
+		// We only want to auto-open, we don't want to auto-close (and potentially overrule the user's action).
+		if ( preferences.help_center_open ) {
+			return {
+				type: 'HELP_CENTER_SET_SHOW',
+				show: true,
+			} as const;
+		}
+	} catch {}
+}

package/src/help-center/selectors.ts

@@ -9,7 +9,14 @@ export const getUserDeclaredSiteUrl = ( state: State ) => state.userDeclaredSite
 export const getUserDeclaredSite = ( state: State ) => state.userDeclaredSite;
 export const getUnreadCount = ( state: State ) => state.unreadCount;
 export const getIsMinimized = ( state: State ) => state.isMinimized;
+export const getIsChatLoaded = ( state: State ) => state.isChatLoaded;
+export const getAreSoundNotificationsEnabled = ( state: State ) =>
+	state.areSoundNotificationsEnabled;
+export const getZendeskClientId = ( state: State ) => state.zendeskClientId;
 export const getHasSeenWhatsNewModal = ( state: State ) => state.hasSeenWhatsNewModal;
 export const getNavigateToRoute = ( state: State ) => state.navigateToRoute;
 export const getOdieInitialPromptText = ( state: State ) => state.odieInitialPromptText;
 export const getOdieBotNameSlug = ( state: State ) => state.odieBotNameSlug;
+export const getCurrentSupportInteraction = ( state: State ) => state.currentSupportInteraction;
+export const getAllowPremiumSupport = ( state: State ) => state.allowPremiumSupport;
+export const getHelpCenterOptions = ( state: State ) => state.helpCenterOptions;