@automattic/data-stores 1.0.0-alpha.0 → 3.0.0

package/src/i18n/reducer.ts

@@ -0,0 +1,25 @@
+import type { I18nAction } from './actions';
+import type { LocalizedLanguageNames } from './types';
+
+export type State = {
+	localizedLanguageNames: { [ i18nLocale: string ]: LocalizedLanguageNames };
+};
+
+const DEFAULT_STATE: State = { localizedLanguageNames: {} };
+
+const reducer = ( state = DEFAULT_STATE, action: I18nAction ): State => {
+	switch ( action.type ) {
+		case 'SET_LOCALIZED_LANGUAGE_NAMES':
+			return {
+				...state,
+				localizedLanguageNames: {
+					...state.localizedLanguageNames,
+					[ action.i18nLocale ]: action.localizedLanguageNames,
+				},
+			};
+		default:
+			return state;
+	}
+};
+
+export default reducer;

package/src/i18n/resolvers.ts

@@ -0,0 +1,15 @@
+import { apiFetch } from '@wordpress/data-controls';
+import { addQueryArgs } from '@wordpress/url';
+import { setLocalizedLanguageNames } from './actions';
+import { LANGUAGE_NAMES_URL } from './constants';
+import type { LocalizedLanguageNames } from './types';
+import type { APIFetchOptions } from '@wordpress/api-fetch';
+
+export function* getLocalizedLanguageNames( locale: string ) {
+	const localizedLanguageNames: LocalizedLanguageNames = yield apiFetch( {
+		url: addQueryArgs( LANGUAGE_NAMES_URL, { _locale: locale } ),
+		mode: 'cors',
+	} as APIFetchOptions );
+
+	yield setLocalizedLanguageNames( locale, localizedLanguageNames );
+}

package/src/i18n/selectors.ts

@@ -0,0 +1,7 @@
+import type { State } from './reducer';
+import type { LocalizedLanguageNames } from './types';
+
+export const getLocalizedLanguageNames = (
+	state: State,
+	i18nLocale: string
+): LocalizedLanguageNames => state?.localizedLanguageNames?.[ i18nLocale ];

package/src/i18n/test/reducer.js

@@ -0,0 +1,69 @@
+import { setLocalizedLanguageNames } from '../actions';
+import reducer from '../reducer';
+
+describe( 'i18n reducer', () => {
+	describe( 'localizedLanguageNames', () => {
+		it( 'should default to no localized language names', () => {
+			const { localizedLanguageNames } = reducer( undefined, { type: '' } );
+			expect( localizedLanguageNames ).toEqual( {} );
+		} );
+
+		it( 'should set the localized language names', () => {
+			const localizedLanguageNames = Symbol( 'localizedLanguageNames' );
+			const locale = 'fake-locale';
+
+			const action = setLocalizedLanguageNames( locale, localizedLanguageNames );
+
+			const state = reducer( undefined, action );
+
+			expect( state ).toEqual( {
+				localizedLanguageNames: {
+					[ locale ]: localizedLanguageNames,
+				},
+			} );
+		} );
+
+		it( 'should overwrite the existing locale', () => {
+			const localizedLanguageNames = Symbol( 'localizedLanguageNames' );
+			const locale = 'fake-locale';
+
+			const action = setLocalizedLanguageNames( locale, localizedLanguageNames );
+
+			const state = reducer(
+				{ localizedLanguageNames: { [ locale ]: Symbol( 'previous localizedLanguageNames' ) } },
+				action
+			);
+
+			expect( state ).toEqual( {
+				localizedLanguageNames: {
+					[ locale ]: localizedLanguageNames,
+				},
+			} );
+		} );
+
+		it( 'should add the new locale without overwriting the old one', () => {
+			const localizedLanguageNames = Symbol( 'localizedLanguageNames' );
+			const locale = 'fake-locale';
+			const anotherLocale = 'another-locale';
+			const anotherLocalesLocalizedLanguageNames = Symbol( 'another localizedLanguageNames' );
+
+			const action = setLocalizedLanguageNames( locale, localizedLanguageNames );
+
+			const state = reducer(
+				{
+					localizedLanguageNames: {
+						[ anotherLocale ]: anotherLocalesLocalizedLanguageNames,
+					},
+				},
+				action
+			);
+
+			expect( state ).toEqual( {
+				localizedLanguageNames: {
+					[ locale ]: localizedLanguageNames,
+					[ anotherLocale ]: anotherLocalesLocalizedLanguageNames,
+				},
+			} );
+		} );
+	} );
+} );

package/src/i18n/test/resolvers.js

@@ -0,0 +1,28 @@
+import { apiFetch } from '@wordpress/data-controls';
+import { addQueryArgs } from '@wordpress/url';
+import { setLocalizedLanguageNames } from '../actions';
+import { LANGUAGE_NAMES_URL } from '../constants';
+import { getLocalizedLanguageNames } from '../resolvers';
+
+describe( 'i18n resolvers', () => {
+	describe( 'getLocalizedLanguageNames', () => {
+		it( 'should set the localized language names', () => {
+			const iter = getLocalizedLanguageNames( 'en-us' );
+
+			expect( iter.next().value ).toEqual(
+				apiFetch( {
+					url: addQueryArgs( LANGUAGE_NAMES_URL, { _locale: 'en-us' } ),
+					mode: 'cors',
+				} )
+			);
+
+			const localizedLanguageNames = Symbol( 'localizedLanguageNames' );
+
+			expect( iter.next( localizedLanguageNames ).value ).toEqual(
+				setLocalizedLanguageNames( 'en-us', localizedLanguageNames )
+			);
+
+			expect( iter.next().done ).toBeTruthy();
+		} );
+	} );
+} );

package/src/i18n/test/selectors.js

@@ -0,0 +1,22 @@
+import { getLocalizedLanguageNames } from '../selectors';
+
+describe( 'i18n selectors', () => {
+	describe( 'getLocalizedLanguageNames', () => {
+		it( 'should retrieve the localized language names for the locale', () => {
+			const localizedLanguageNames = Symbol( 'localizedLanguageNames en-us' );
+			const state = {
+				localizedLanguageNames: {
+					'en-us': localizedLanguageNames,
+				},
+			};
+
+			expect( getLocalizedLanguageNames( state, 'en-us' ) ).toBe( localizedLanguageNames );
+		} );
+
+		it( 'should return undefined if the locale is not set', () => {
+			const state = {};
+
+			expect( getLocalizedLanguageNames( state, 'en-us' ) ).toBeUndefined();
+		} );
+	} );
+} );

package/src/i18n/types.ts

@@ -0,0 +1,3 @@
+export type LocalizedLanguageNames = {
+	[ languageSlug: string ]: { name: string; en: string; localized: string };
+};

package/src/index.ts

@@ -1,14 +1,54 @@
-/**
- * Internal dependencies
- */
-import * as User from './user';
+import * as Auth from './auth';
+import * as AutomatedTransferEligibility from './automated-transfer-eligibility';
 import * as DomainSuggestions from './domain-suggestions';
+import * as HelpCenter from './help-center';
+import * as I18n from './i18n';
+import * as Launch from './launch';
+import * as Onboard from './onboard';
+import persistenceConfigFactory from './persistence-config-factory';
+import * as Plans from './plans';
+import * as ProductsList from './products-list';
+import * as Reader from './reader';
+import * as Site from './site';
+import * as User from './user';
 import * as Verticals from './verticals';
 import * as VerticalsTemplates from './verticals-templates';
+import * as WPCOMFeatures from './wpcom-features';
+export { useHappinessEngineersQuery } from './queries/use-happiness-engineers-query';
+export { useHas3PC } from './queries/use-has-3rd-party-cookies';
+export { useSiteAnalysis } from './queries/use-site-analysis';
+export type { AnalysisReport } from './queries/use-site-analysis';
+export { useHasSeenWhatsNewModalQuery } from './queries/use-has-seen-whats-new-modal-query';
+export { useSiteIntent } from './queries/use-site-intent';
+export { useSupportAvailability } from './support-queries/use-support-availability';
+export { useSubmitTicketMutation } from './support-queries/use-submit-support-ticket';
+export { useSubmitForumsMutation } from './support-queries/use-submit-forums-topic';
+export { useStarterDesignsGeneratedQuery } from './starter-designs-queries/use-starter-designs-generated-query';
+export { useSibylQuery } from './support-queries/use-sibyl-query';
+export * from './site/types';
 
-export { User, DomainSuggestions, Verticals, VerticalsTemplates };
+export {
+	Auth,
+	User,
+	DomainSuggestions,
+	HelpCenter,
+	I18n,
+	Site,
+	Verticals,
+	VerticalsTemplates,
+	Plans,
+	Launch,
+	WPCOMFeatures,
+	Reader,
+	Onboard,
+	persistenceConfigFactory,
+	ProductsList,
+	AutomatedTransferEligibility,
+};
 
 /**
  * Helper types
  */
 export * from './mapped-types';
+export { getContextResults } from './contextual-help/contextual-help';
+export type { LinksForSection } from './contextual-help/contextual-help';

package/src/launch/actions.ts

@@ -0,0 +1,172 @@
+import { select } from '@wordpress/data';
+import { PLANS_STORE } from './constants';
+import type { Plans } from '..';
+import type * as DomainSuggestions from '../domain-suggestions';
+import type { ReturnOrGeneratorYieldUnion } from '../mapped-types';
+import type { LaunchStepType } from './types';
+
+export const setSidebarFullscreen = () =>
+	( {
+		type: 'SET_SIDEBAR_FULLSCREEN',
+	} as const );
+
+export const unsetSidebarFullscreen = () =>
+	( {
+		type: 'UNSET_SIDEBAR_FULLSCREEN',
+	} as const );
+
+export const setStep = ( step: LaunchStepType ) =>
+	( {
+		type: 'SET_STEP',
+		step,
+	} as const );
+
+export const setSiteTitle = ( title: string ) =>
+	( {
+		type: 'SET_SITE_TITLE',
+		title,
+	} as const );
+
+export const setDomain = ( domain: DomainSuggestions.DomainSuggestion ) =>
+	( {
+		type: 'SET_DOMAIN',
+		domain,
+	} as const );
+
+export const unsetDomain = () =>
+	( {
+		type: 'UNSET_DOMAIN',
+	} as const );
+
+export const confirmDomainSelection = () =>
+	( {
+		type: 'CONFIRM_DOMAIN_SELECTION',
+	} as const );
+
+export const setDomainSearch = ( domainSearch: string ) =>
+	( {
+		type: 'SET_DOMAIN_SEARCH',
+		domainSearch,
+	} as const );
+
+/**
+ * It's not recommended to export this function. We need the billing period
+ * to be a side-effect of the plan. Please don't export this action creator as you might
+ * create a discrepancy between the selected plan and the selected billing period
+ *
+ * @param billingPeriod the period
+ */
+const __internalSetBillingPeriod = ( billingPeriod: Plans.PlanBillingPeriod ) =>
+	( {
+		type: 'SET_PLAN_BILLING_PERIOD',
+		billingPeriod,
+	} as const );
+
+export const setPlanProductId = function* ( planProductId: number | undefined ) {
+	const isFree = select( PLANS_STORE ).isPlanProductFree( planProductId );
+
+	if ( ! isFree ) {
+		const planProduct = select( PLANS_STORE ).getPlanProductById( planProductId );
+		const billingPeriod = planProduct?.billingPeriod ?? 'ANNUALLY';
+
+		yield __internalSetBillingPeriod( billingPeriod );
+	}
+
+	return {
+		type: 'SET_PLAN_PRODUCT_ID',
+		planProductId,
+	} as const;
+};
+
+export const unsetPlanProductId = () =>
+	( {
+		type: 'UNSET_PLAN_PRODUCT_ID',
+	} as const );
+
+export function updatePlan( planProductId: number | undefined ) {
+	// keep updatePlan for backwards compat
+	return setPlanProductId( planProductId );
+}
+
+export const openSidebar = () =>
+	( {
+		type: 'OPEN_SIDEBAR',
+	} as const );
+
+export const closeSidebar = () =>
+	( {
+		type: 'CLOSE_SIDEBAR',
+	} as const );
+
+export const openFocusedLaunch = () =>
+	( {
+		type: 'OPEN_FOCUSED_LAUNCH',
+	} as const );
+
+export const closeFocusedLaunch = () =>
+	( {
+		type: 'CLOSE_FOCUSED_LAUNCH',
+	} as const );
+
+export const enableAnchorFm = () =>
+	( {
+		type: 'ENABLE_ANCHOR_FM',
+	} as const );
+
+export const showSiteTitleStep = () =>
+	( {
+		type: 'SHOW_SITE_TITLE_STEP',
+	} as const );
+
+export const setModalDismissible = () =>
+	( {
+		type: 'SET_MODAL_DISMISSIBLE',
+	} as const );
+
+export const unsetModalDismissible = () =>
+	( {
+		type: 'UNSET_MODAL_DISMISSIBLE',
+	} as const );
+
+export const showModalTitle = () =>
+	( {
+		type: 'SHOW_MODAL_TITLE',
+	} as const );
+
+export const hideModalTitle = () =>
+	( {
+		type: 'HIDE_MODAL_TITLE',
+	} as const );
+
+export const enablePersistentSuccessView = () =>
+	( {
+		type: 'ENABLE_SUCCESS_VIEW',
+	} as const );
+
+export const disablePersistentSuccessView = () =>
+	( {
+		type: 'DISABLE_SUCCESS_VIEW',
+	} as const );
+
+export type LaunchAction = ReturnOrGeneratorYieldUnion<
+	| typeof setSiteTitle
+	| typeof unsetDomain
+	| typeof setStep
+	| typeof setDomain
+	| typeof confirmDomainSelection
+	| typeof setDomainSearch
+	| typeof setPlanProductId
+	| typeof openFocusedLaunch
+	| typeof closeFocusedLaunch
+	| typeof unsetPlanProductId
+	| typeof openSidebar
+	| typeof closeSidebar
+	| typeof enableAnchorFm
+	| typeof setSidebarFullscreen
+	| typeof unsetSidebarFullscreen
+	| typeof showSiteTitleStep
+	| typeof setModalDismissible
+	| typeof unsetModalDismissible
+	| typeof showModalTitle
+	| typeof hideModalTitle
+>;

package/src/launch/constants.ts

@@ -0,0 +1,3 @@
+export const STORE_KEY = 'automattic/launch';
+export const SITE_STORE = 'automattic/site';
+export const PLANS_STORE = 'automattic/onboard/plans';

package/src/launch/data.ts

@@ -0,0 +1,13 @@
+export const LaunchStep: Record< string, string > = {
+	Name: 'name',
+	Domain: 'domain',
+	Plan: 'plan',
+	Final: 'final',
+};
+
+export const LaunchSequence: Array< string > = [
+	LaunchStep.Name,
+	LaunchStep.Domain,
+	LaunchStep.Plan,
+	LaunchStep.Final,
+];

package/src/launch/index.ts

@@ -0,0 +1,44 @@
+import { plugins, registerStore, use } from '@wordpress/data';
+import { controls } from '@wordpress/data-controls';
+import * as actions from './actions';
+import { STORE_KEY } from './constants';
+import persistOptions from './persist';
+import reducer, { State } from './reducer';
+import * as selectors from './selectors';
+import type { SelectFromMap, DispatchFromMap } from '../mapped-types';
+
+export type { State };
+export type { LaunchStepType } from './types';
+export { STORE_KEY };
+
+use( plugins.persistence, persistOptions );
+
+let isRegistered = false;
+
+export function register(): typeof STORE_KEY {
+	if ( ! isRegistered ) {
+		isRegistered = true;
+		registerStore< State >( STORE_KEY, {
+			actions,
+			controls,
+			reducer,
+			selectors,
+			persist: [
+				'domain',
+				'domainSearch',
+				'planProductId',
+				'planBillingPeriod',
+				'confirmedDomainSelection',
+				'isAnchorFm',
+				'isSiteTitleStepVisible',
+				'siteTitle',
+			],
+		} );
+	}
+	return STORE_KEY;
+}
+
+declare module '@wordpress/data' {
+	function dispatch( key: typeof STORE_KEY ): DispatchFromMap< typeof actions >;
+	function select( key: typeof STORE_KEY ): SelectFromMap< typeof selectors >;
+}

package/src/launch/persist.ts

@@ -0,0 +1,3 @@
+import persistenceConfigFactory from '../persistence-config-factory';
+
+export default persistenceConfigFactory( 'WP_LAUNCH' );

package/src/launch/reducer.ts

@@ -0,0 +1,167 @@
+import { combineReducers } from '@wordpress/data';
+import { LaunchStep } from './data';
+import type { Plans } from '..';
+import type * as DomainSuggestions from '../domain-suggestions';
+import type { LaunchAction } from './actions';
+import type { LaunchStepType } from './types';
+import type { Reducer } from 'redux';
+
+const step: Reducer< LaunchStepType, LaunchAction > = ( state = LaunchStep.Name, action ) => {
+	if ( action.type === 'SET_STEP' ) {
+		return action.step;
+	}
+	return state;
+};
+
+const siteTitle: Reducer< string | undefined, LaunchAction > = ( state = undefined, action ) => {
+	if ( action.type === 'SET_SITE_TITLE' ) {
+		return action.title;
+	}
+	return state;
+};
+
+const domain: Reducer< DomainSuggestions.DomainSuggestion | undefined, LaunchAction > = (
+	state,
+	action
+) => {
+	if ( action.type === 'SET_DOMAIN' ) {
+		return action.domain;
+	}
+	if ( action.type === 'UNSET_DOMAIN' ) {
+		return undefined;
+	}
+	return state;
+};
+
+const domainSearch: Reducer< string, LaunchAction > = ( state = '', action ) => {
+	if ( action.type === 'SET_DOMAIN_SEARCH' ) {
+		return action.domainSearch;
+	}
+	return state;
+};
+
+const confirmedDomainSelection: Reducer< boolean, LaunchAction > = ( state = false, action ) => {
+	if ( action.type === 'CONFIRM_DOMAIN_SELECTION' ) {
+		return true;
+	}
+	return state;
+};
+
+const planProductId: Reducer< number | undefined, LaunchAction > = ( state, action ) => {
+	if ( action.type === 'SET_PLAN_PRODUCT_ID' ) {
+		return action.planProductId;
+	}
+	if ( action.type === 'UNSET_PLAN_PRODUCT_ID' ) {
+		return undefined;
+	}
+	return state;
+};
+
+const planBillingPeriod: Reducer< Plans.PlanBillingPeriod, LaunchAction > = (
+	state = 'ANNUALLY',
+	action
+) => {
+	if ( action.type === 'SET_PLAN_BILLING_PERIOD' ) {
+		return action.billingPeriod;
+	}
+	return state;
+};
+
+// Check if focused launch modal is open
+const isFocusedLaunchOpen: Reducer< boolean, LaunchAction > = ( state = false, action ) => {
+	if ( action.type === 'OPEN_FOCUSED_LAUNCH' ) {
+		return true;
+	}
+
+	if ( action.type === 'CLOSE_FOCUSED_LAUNCH' ) {
+		return false;
+	}
+	return state;
+};
+
+// Check if step-by-step launch modal is open
+const isSidebarOpen: Reducer< boolean, LaunchAction > = ( state = false, action ) => {
+	if ( action.type === 'OPEN_SIDEBAR' ) {
+		return true;
+	}
+
+	if ( action.type === 'CLOSE_SIDEBAR' ) {
+		return false;
+	}
+	return state;
+};
+
+// Check if step-by-step launch modal is full screen
+const isSidebarFullscreen: Reducer< boolean, LaunchAction > = ( state = false, action ) => {
+	if ( action.type === 'SET_SIDEBAR_FULLSCREEN' ) {
+		return true;
+	}
+	if ( action.type === 'UNSET_SIDEBAR_FULLSCREEN' ) {
+		return false;
+	}
+	return state;
+};
+
+const isAnchorFm: Reducer< boolean, LaunchAction > = ( state = false, action ) => {
+	if ( action.type === 'ENABLE_ANCHOR_FM' ) {
+		return true;
+	}
+
+	return state;
+};
+
+// Check if site title step should be displayed
+const isSiteTitleStepVisible: Reducer< boolean, LaunchAction > = ( state = false, action ) => {
+	if ( action.type === 'SHOW_SITE_TITLE_STEP' ) {
+		return true;
+	}
+
+	return state;
+};
+
+// Check if launch modal can be dismissed
+const isModalDismissible: Reducer< boolean, LaunchAction > = ( state = true, action ) => {
+	if ( action.type === 'SET_MODAL_DISMISSIBLE' ) {
+		return true;
+	}
+
+	if ( action.type === 'UNSET_MODAL_DISMISSIBLE' ) {
+		return false;
+	}
+
+	return state;
+};
+
+// Check if launch modal title should be visible
+const isModalTitleVisible: Reducer< boolean, LaunchAction > = ( state = true, action ) => {
+	if ( action.type === 'SHOW_MODAL_TITLE' ) {
+		return true;
+	}
+
+	if ( action.type === 'HIDE_MODAL_TITLE' ) {
+		return false;
+	}
+
+	return state;
+};
+
+const reducer = combineReducers( {
+	step,
+	siteTitle,
+	domain,
+	confirmedDomainSelection,
+	domainSearch,
+	planBillingPeriod,
+	planProductId,
+	isSidebarOpen,
+	isSidebarFullscreen,
+	isAnchorFm,
+	isFocusedLaunchOpen,
+	isSiteTitleStepVisible,
+	isModalDismissible,
+	isModalTitleVisible,
+} );
+
+export type State = ReturnType< typeof reducer >;
+
+export default reducer;