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

package/src/plans/test/selectors.ts

@@ -0,0 +1,400 @@
+import * as deprecate from '@wordpress/deprecated';
+import { TIMELESS_PLAN_ECOMMERCE, TIMELESS_PLAN_FREE, FREE_PLAN_PRODUCT_ID } from '../constants';
+import * as MockData from '../mock';
+import * as Selectors from '../selectors';
+import { buildPlanFeaturesDict } from '../test-utils';
+import type { State } from '../reducer';
+
+// Test data
+const MOCK_LOCALE_1 = 'test-locale-1';
+const MOCK_LOCALE_2 = 'test-locale-2';
+
+const mockFeatures = {
+	[ MOCK_LOCALE_1 ]: buildPlanFeaturesDict( [
+		MockData.STORE_PLAN_FEATURE_CUSTOM_DOMAIN,
+		MockData.STORE_PLAN_FEATURE_LIVE_SUPPORT,
+	] ),
+	[ MOCK_LOCALE_2 ]: buildPlanFeaturesDict( [
+		MockData.STORE_PLAN_FEATURE_PRIORITY_SUPPORT,
+		MockData.STORE_PLAN_FEATURE_RECURRING_PAYMENTS,
+	] ),
+};
+const mockFeaturesByType = {
+	[ MOCK_LOCALE_1 ]: [
+		MockData.API_FEATURES_BY_TYPE_GENERAL,
+		MockData.API_FEATURES_BY_TYPE_COMMERCE,
+	],
+	[ MOCK_LOCALE_2 ]: [
+		MockData.API_FEATURES_BY_TYPE_GENERAL,
+		MockData.API_FEATURES_BY_TYPE_MARKETING,
+	],
+};
+const mockPlans = {
+	[ MOCK_LOCALE_1 ]: [ MockData.STORE_PLAN_FREE, MockData.STORE_PLAN_PREMIUM ],
+	[ MOCK_LOCALE_2 ]: [ MockData.STORE_PLAN_FREE ],
+};
+const mockPlanProducts = [ MockData.STORE_PRODUCT_FREE, MockData.STORE_PRODUCT_PREMIUM_ANNUALLY ];
+
+const mockState: State = {
+	features: mockFeatures,
+	featuresByType: mockFeaturesByType,
+	plans: mockPlans,
+	planProducts: mockPlanProducts,
+};
+
+// Mocks
+jest.mock( '@wordpress/deprecated', () => {
+	return jest.fn();
+} );
+jest.mock( '@wordpress/data', () => ( {
+	// Mocking `select` allows unit tests to run in isolation for selectors,
+	// without the corresponding resolvers being called
+	select: () => ( {
+		getPlansProducts: () => mockPlanProducts,
+		getSupportedPlans: ( locale ) => mockPlans[ locale ] ?? [],
+	} ),
+} ) );
+
+beforeEach( () => {
+	jest.clearAllMocks();
+} );
+
+// Tests
+describe( 'Plans selectors', () => {
+	describe( 'getFeatures', () => {
+		it( 'should select the right list of features for an given locale', () => {
+			expect( Selectors.getFeatures( mockState, MOCK_LOCALE_1 ) ).toEqual(
+				mockFeatures[ MOCK_LOCALE_1 ]
+			);
+			expect( Selectors.getFeatures( mockState, MOCK_LOCALE_2 ) ).toEqual(
+				mockFeatures[ MOCK_LOCALE_2 ]
+			);
+		} );
+
+		it( 'should return an empty object if the given locale does not exist in the store', () => {
+			expect( Selectors.getFeatures( mockState, 'non-existing' ) ).toEqual( {} );
+		} );
+	} );
+
+	describe( 'getFeaturesByType', () => {
+		it( 'should select the right list of features by type for an given locale', () => {
+			expect( Selectors.getFeaturesByType( mockState, MOCK_LOCALE_1 ) ).toEqual(
+				mockFeaturesByType[ MOCK_LOCALE_1 ]
+			);
+			expect( Selectors.getFeaturesByType( mockState, MOCK_LOCALE_2 ) ).toEqual(
+				mockFeaturesByType[ MOCK_LOCALE_2 ]
+			);
+		} );
+
+		it( 'should return an empty array if the given locale does not exist in the store', () => {
+			expect( Selectors.getFeaturesByType( mockState, 'non-existing' ) ).toEqual( [] );
+		} );
+	} );
+
+	describe( 'getPlanByProductId', () => {
+		it( 'should return undefined if the product ID is undefined', () => {
+			expect( Selectors.getPlanByProductId( mockState, undefined, MOCK_LOCALE_1 ) ).toBeUndefined();
+		} );
+
+		it( 'should return undefined if the product ID is not associated to any products', () => {
+			expect( Selectors.getPlanByProductId( mockState, -1, MOCK_LOCALE_1 ) ).toBeUndefined();
+		} );
+
+		it( 'should select the right product for a given correct product ID', () => {
+			// Free
+			expect(
+				Selectors.getPlanByProductId(
+					mockState,
+					MockData.STORE_PRODUCT_FREE.productId,
+					MOCK_LOCALE_1
+				)
+			).toEqual( MockData.STORE_PLAN_FREE );
+
+			// Paid (annually billed)
+			expect(
+				Selectors.getPlanByProductId(
+					mockState,
+					MockData.STORE_PRODUCT_PREMIUM_ANNUALLY.productId,
+					MOCK_LOCALE_1
+				)
+			).toEqual( MockData.STORE_PLAN_PREMIUM );
+
+			// Paid (monthly billed)
+			expect(
+				Selectors.getPlanByProductId(
+					mockState,
+					MockData.STORE_PRODUCT_PREMIUM_MONTHLY.productId,
+					MOCK_LOCALE_1
+				)
+			).toEqual( MockData.STORE_PLAN_PREMIUM );
+		} );
+
+		it( 'should return undefined if the product ID does not exist for the given locale', () => {
+			expect(
+				Selectors.getPlanByProductId(
+					mockState,
+					MockData.STORE_PRODUCT_PREMIUM_ANNUALLY.productId,
+					MOCK_LOCALE_2
+				)
+			).toBeUndefined();
+		} );
+	} );
+
+	describe( 'getPlanProductById', () => {
+		it( 'should return undefined if the product ID is undefined', () => {
+			expect( Selectors.getPlanProductById( mockState, undefined ) ).toBeUndefined();
+		} );
+
+		it( 'should return undefined if the product ID is not associated to any products', () => {
+			// Non existing product
+			expect( Selectors.getPlanProductById( mockState, -1 ) ).toBeUndefined();
+		} );
+
+		it( 'should select the right product for a given correct product ID', () => {
+			// Free
+			expect(
+				Selectors.getPlanProductById( mockState, MockData.STORE_PRODUCT_FREE.productId )
+			).toEqual( MockData.STORE_PRODUCT_FREE );
+
+			// Paid (annually billed)
+			expect(
+				Selectors.getPlanProductById( mockState, MockData.STORE_PRODUCT_PREMIUM_ANNUALLY.productId )
+			).toEqual( MockData.STORE_PRODUCT_PREMIUM_ANNUALLY );
+		} );
+
+		it( 'should return undefined if the product ID does not match any products in the store', () => {
+			// Existing Product, but not in store (monthly billed)
+			expect(
+				Selectors.getPlanProductById( mockState, MockData.STORE_PRODUCT_PREMIUM_MONTHLY.productId )
+			).toBeUndefined();
+		} );
+	} );
+
+	describe( 'getPlanByPeriodAgnosticSlug', () => {
+		it( 'should return undefined if the plan slug is undefined', () => {
+			expect(
+				Selectors.getPlanByPeriodAgnosticSlug( mockState, undefined, MOCK_LOCALE_1 )
+			).toBeUndefined();
+		} );
+
+		it( 'should return undefined if the plan slug does not match any plans in the store', () => {
+			expect(
+				Selectors.getPlanByPeriodAgnosticSlug( mockState, 'ecommerce', MOCK_LOCALE_1 )
+			).toBeUndefined();
+		} );
+
+		it( 'should select the right plan for a given, correct plan slug and locale', () => {
+			// Locale 1
+			expect(
+				Selectors.getPlanByPeriodAgnosticSlug(
+					mockState,
+					MockData.STORE_PLAN_PREMIUM.periodAgnosticSlug,
+					MOCK_LOCALE_1
+				)
+			).toEqual( MockData.STORE_PLAN_PREMIUM );
+
+			// Locale 2
+			expect(
+				Selectors.getPlanByPeriodAgnosticSlug(
+					mockState,
+					MockData.STORE_PLAN_FREE.periodAgnosticSlug,
+					MOCK_LOCALE_2
+				)
+			).toEqual( MockData.STORE_PLAN_FREE );
+		} );
+
+		it( 'should return undefined if the plan slug does not match any plans in the store for the given locale', () => {
+			expect(
+				Selectors.getPlanByPeriodAgnosticSlug(
+					mockState,
+					MockData.STORE_PLAN_PREMIUM.periodAgnosticSlug,
+					MOCK_LOCALE_2
+				)
+			).toBeUndefined();
+		} );
+	} );
+
+	describe( 'getDefaultPaidPlan', () => {
+		it( 'should select the correct default paid plan for the given locale', () => {
+			expect( Selectors.getDefaultPaidPlan( mockState, MOCK_LOCALE_1 ) ).toEqual(
+				MockData.STORE_PLAN_PREMIUM
+			);
+		} );
+
+		it( 'should return undefined if the default paid plan is not available in the store for a given locale', () => {
+			expect( Selectors.getDefaultPaidPlan( mockState, MOCK_LOCALE_2 ) ).toBeUndefined();
+		} );
+	} );
+
+	describe( 'getDefaultFreePlan', () => {
+		it( 'should select the correct default free plan for the given locale', () => {
+			expect( Selectors.getDefaultFreePlan( mockState, MOCK_LOCALE_1 ) ).toEqual(
+				MockData.STORE_PLAN_FREE
+			);
+			expect( Selectors.getDefaultFreePlan( mockState, MOCK_LOCALE_2 ) ).toEqual(
+				MockData.STORE_PLAN_FREE
+			);
+		} );
+	} );
+
+	describe( 'getSupportedPlans', () => {
+		it( 'should select the supported plans for a given locale', () => {
+			expect( Selectors.getSupportedPlans( mockState, MOCK_LOCALE_1 ) ).toEqual(
+				mockPlans[ MOCK_LOCALE_1 ]
+			);
+			expect( Selectors.getSupportedPlans( mockState, MOCK_LOCALE_2 ) ).toEqual(
+				mockPlans[ MOCK_LOCALE_2 ]
+			);
+		} );
+
+		it( 'should return an empty list if the given locale does not exist in the store', () => {
+			expect( Selectors.getSupportedPlans( mockState, 'non-existing' ) ).toEqual( [] );
+		} );
+	} );
+
+	describe( 'getPlansProducts', () => {
+		it( 'should select all of the plans products from the store', () => {
+			expect( Selectors.getPlansProducts( mockState ) ).toEqual( mockPlanProducts );
+		} );
+	} );
+
+	describe( 'getPrices', () => {
+		it( 'should select the prices for each plan product for a given locale', () => {
+			const expectedPrices = {
+				[ MockData.STORE_PRODUCT_FREE.storeSlug ]: MockData.STORE_PRODUCT_FREE.price,
+				[ MockData.STORE_PRODUCT_PREMIUM_ANNUALLY.storeSlug ]:
+					MockData.STORE_PRODUCT_PREMIUM_ANNUALLY.price,
+			};
+			expect( Selectors.getPrices( mockState, MOCK_LOCALE_1 ) ).toEqual( expectedPrices );
+			expect( Selectors.getPrices( mockState, MOCK_LOCALE_2 ) ).toEqual( expectedPrices );
+		} );
+
+		it( 'should be marked as deprecated', () => {
+			Selectors.getPrices( mockState, MOCK_LOCALE_1 );
+
+			expect( deprecate ).toHaveBeenCalled();
+			expect( deprecate ).toHaveBeenCalledWith( 'getPrices', {
+				alternative: 'getPlanProduct().price',
+			} );
+		} );
+	} );
+
+	describe( 'getPlanByPath', () => {
+		it( 'should return undefined if the plan slug is undefined', () => {
+			expect( Selectors.getPlanByPath( mockState, undefined, MOCK_LOCALE_1 ) ).toBeUndefined();
+		} );
+
+		it( 'should return undefined if the plan slug does not match any plans in the store', () => {
+			expect( Selectors.getPlanByPath( mockState, 'ecommerce', MOCK_LOCALE_1 ) ).toBeUndefined();
+		} );
+
+		it( 'should select the correct plan for the given locale', () => {
+			expect(
+				Selectors.getPlanByPath(
+					mockState,
+					MockData.STORE_PRODUCT_PREMIUM_ANNUALLY.pathSlug,
+					MOCK_LOCALE_1
+				)
+			).toEqual( MockData.STORE_PLAN_PREMIUM );
+		} );
+
+		it( 'should return undefined if the plan slug does not match any plans in the store for the given locale', () => {
+			expect(
+				Selectors.getPlanByPath(
+					mockState,
+					MockData.STORE_PRODUCT_PREMIUM_ANNUALLY.pathSlug,
+					MOCK_LOCALE_2
+				)
+			).toBeUndefined();
+		} );
+	} );
+
+	describe( 'getPlanProduct', () => {
+		it( 'should return undefined if the plan slug is undefined', () => {
+			expect( Selectors.getPlanProduct( mockState, undefined, 'ANNUALLY' ) ).toBeUndefined();
+		} );
+
+		it( 'should return undefined if the billing period is undefined', () => {
+			expect(
+				Selectors.getPlanProduct(
+					mockState,
+					MockData.STORE_PLAN_FREE.periodAgnosticSlug,
+					undefined
+				)
+			).toBeUndefined();
+		} );
+
+		it( 'should select the free plan if the plan slug matches the free plan (regardless of the billing period)', () => {
+			expect(
+				Selectors.getPlanProduct(
+					mockState,
+					MockData.STORE_PLAN_FREE.periodAgnosticSlug,
+					'ANNUALLY'
+				)
+			).toEqual( MockData.STORE_PRODUCT_FREE );
+			expect(
+				Selectors.getPlanProduct(
+					mockState,
+					MockData.STORE_PLAN_FREE.periodAgnosticSlug,
+					'MONTHLY'
+				)
+			).toEqual( MockData.STORE_PRODUCT_FREE );
+		} );
+
+		it( 'should select the correct paid plan given the billing period', () => {
+			expect(
+				Selectors.getPlanProduct(
+					mockState,
+					MockData.STORE_PLAN_PREMIUM.periodAgnosticSlug,
+					'ANNUALLY'
+				)
+			).toEqual( MockData.STORE_PRODUCT_PREMIUM_ANNUALLY );
+		} );
+
+		it( 'should return undefined if there is not math in the store for the given plan slug and billing period', () => {
+			expect(
+				Selectors.getPlanProduct(
+					mockState,
+					MockData.STORE_PLAN_PREMIUM.periodAgnosticSlug,
+					'MONTHLY'
+				)
+			).toBeUndefined();
+		} );
+	} );
+
+	describe( 'isPlanEcommerce', () => {
+		it( 'should return true if the eCommerce plan slug is passed', () => {
+			expect( Selectors.isPlanEcommerce( mockState, TIMELESS_PLAN_ECOMMERCE ) ).toBe( true );
+		} );
+		it( 'should return false if the free plan slug is passed', () => {
+			expect( Selectors.isPlanEcommerce( mockState, TIMELESS_PLAN_FREE ) ).toBe( false );
+		} );
+		it( 'should return false if the plan slug is undefined', () => {
+			expect( Selectors.isPlanEcommerce( mockState ) ).toBe( false );
+		} );
+	} );
+
+	describe( 'isPlanFree', () => {
+		it( 'should return false if the eCommerce plan slug is passed', () => {
+			expect( Selectors.isPlanFree( mockState, TIMELESS_PLAN_ECOMMERCE ) ).toBe( false );
+		} );
+		it( 'should return true if the free plan slug is passed', () => {
+			expect( Selectors.isPlanFree( mockState, TIMELESS_PLAN_FREE ) ).toBe( true );
+		} );
+		it( 'should return false if the plan slug is undefined', () => {
+			expect( Selectors.isPlanFree( mockState ) ).toBe( false );
+		} );
+	} );
+
+	describe( 'isPlanProductFree', () => {
+		it( 'should return true if the free plan product ID is passed', () => {
+			expect( Selectors.isPlanProductFree( mockState, FREE_PLAN_PRODUCT_ID ) ).toBe( true );
+		} );
+		it( 'should return false if a product ID not associated to the free plan is passed', () => {
+			expect( Selectors.isPlanProductFree( mockState, 2 ) ).toBe( false );
+		} );
+		it( 'should return false if the product ID is undefined', () => {
+			expect( Selectors.isPlanProductFree( mockState ) ).toBe( false );
+		} );
+	} );
+} );

package/src/plans/test-utils/index.ts

@@ -0,0 +1,12 @@
+import type { PlanFeature } from '../types';
+
+export const buildPlanFeaturesDict = (
+	planFeatures: PlanFeature[]
+): Record< string, PlanFeature > =>
+	planFeatures.reduce(
+		( dict, feature ) => ( {
+			...dict,
+			[ feature.id ]: feature,
+		} ),
+		{}
+	);

package/src/plans/types.ts

@@ -0,0 +1,120 @@
+import type { plansProductSlugs, plansSlugs } from './constants';
+
+export type StorePlanSlug = typeof plansProductSlugs[ number ];
+export type PlanSlug = typeof plansSlugs[ number ];
+
+// at the moment possible plan paths are identical with plan slugs
+export type PlanPath = PlanSlug;
+
+export type PlanBillingPeriod = 'MONTHLY' | 'ANNUALLY';
+export type PlanNonlocalizedShortName = 'Free' | 'Personal' | 'Premium' | 'Business' | 'eCommerce';
+
+export type PlanAction = {
+	type: string;
+	slug?: string;
+};
+
+export type PlanSimplifiedFeature = {
+	name: string;
+	requiresAnnuallyBilledPlan: boolean;
+};
+export interface Plan {
+	title: string;
+	description: string;
+	features: PlanSimplifiedFeature[];
+	isPopular?: boolean;
+	isFree?: boolean;
+	featuresSlugs?: Record< string, boolean >;
+	storage?: string;
+	periodAgnosticSlug: PlanSlug;
+	productIds: number[];
+}
+
+export interface PlanProduct {
+	billingPeriod: PlanBillingPeriod;
+	price: string;
+	rawPrice: number;
+	productId: number;
+	storeSlug: StorePlanSlug;
+	annualDiscount?: number;
+	periodAgnosticSlug: PlanSlug;
+	pathSlug?: PlanPath;
+	/** Useful for two cases:
+	 * 1) to show how much we bill the users for annual plans ($8/mo billed $96)
+	 * 2) to show how much a monthly plan would cost in a year (billed 12$/mo costs $144/yr)
+	 *  */
+	annualPrice: string;
+}
+
+/**
+ * Item returned from https://public-api.wordpress.com/rest/v1.5/plans response
+ * Only the properties that are actually used in the store are typed
+ */
+export interface PricedAPIPlan {
+	product_id: number;
+	product_name: string;
+	path_slug?: PlanPath;
+	product_slug: StorePlanSlug;
+	bill_period: -1 | 31 | 365;
+	raw_price: number;
+	currency_code: string;
+}
+export interface PricedAPIPlanFree extends PricedAPIPlan {
+	product_id: 1;
+	cost: 0;
+	path_slug: 'free';
+	product_slug: 'free_plan';
+	bill_period: -1;
+	raw_price: 0;
+}
+export interface PricedAPIPlanPaidAnnually extends PricedAPIPlan {
+	path_slug: PlanPath;
+	bill_period: 365;
+}
+export interface PricedAPIPlanPaidMonthly extends PricedAPIPlan {
+	bill_period: 31;
+}
+
+export type PlanFeature = {
+	id: string;
+	description?: string;
+	name: string;
+	requiresAnnuallyBilledPlan: boolean;
+	type?: string;
+	data?: Array< boolean | string >;
+};
+
+export interface APIPlanDetail {
+	nonlocalized_short_name: PlanNonlocalizedShortName;
+	tagline: string;
+	storage: string;
+	short_name: string;
+	products: {
+		plan_id: number;
+	}[];
+	highlighted_features: string[];
+	features: string[];
+}
+
+export interface FeaturesByType {
+	id: string;
+	name: string | null;
+	features: string[];
+}
+
+export interface DetailsAPIFeature {
+	id: string;
+	name: string;
+	description: string;
+}
+
+export interface Feature extends DetailsAPIFeature {
+	// TODO: https://github.com/Automattic/wp-calypso/issues/49991
+	type: 'checkbox';
+}
+
+export interface DetailsAPIResponse {
+	plans: APIPlanDetail[];
+	features_by_type: FeaturesByType[];
+	features: DetailsAPIFeature[];
+}

package/src/products-list/actions.ts

@@ -0,0 +1,23 @@
+import type { ProductsList, ProductsListFailure } from './types';
+
+export const receiveProductsList = ( productsList: ProductsList ) => {
+	return {
+		type: 'PRODUCTS_LIST_RECEIVE' as const,
+		productsList,
+	};
+};
+
+export const requestProductsList = () => ( {
+	type: 'PRODUCTS_LIST_REQUEST' as const,
+} );
+
+export const receiveProductsListFailure = ( error: ProductsListFailure ) => ( {
+	type: 'PRODUCTS_LIST_REQUEST_FAILURE' as const,
+	error,
+} );
+
+export type Action =
+	| ReturnType<
+			typeof receiveProductsList | typeof requestProductsList | typeof receiveProductsListFailure
+	  >
+	| { type: 'TEST_ACTION' };

package/src/products-list/constants.ts

@@ -0,0 +1 @@
+export const STORE_KEY = 'automattic/products-list';

package/src/products-list/index.ts

@@ -0,0 +1,32 @@
+import { registerStore } from '@wordpress/data';
+import { controls } from '../wpcom-request-controls';
+import * as actions from './actions';
+import { STORE_KEY } from './constants';
+import reducer, { State } from './reducer';
+import * as resolvers from './resolvers';
+import * as selectors from './selectors';
+import type { DispatchFromMap, SelectFromMap } from '../mapped-types';
+
+export * from './types';
+export type { State };
+export { STORE_KEY };
+
+let isRegistered = false;
+export function register(): typeof STORE_KEY {
+	if ( ! isRegistered ) {
+		isRegistered = true;
+		registerStore< State >( STORE_KEY, {
+			actions,
+			controls: controls as any, // eslint-disable-line @typescript-eslint/no-explicit-any
+			reducer: reducer as any, // eslint-disable-line @typescript-eslint/no-explicit-any
+			resolvers,
+			selectors,
+		} );
+	}
+	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/products-list/reducer.ts

@@ -0,0 +1,40 @@
+import { combineReducers } from '@wordpress/data';
+import { ProductsList } from './types';
+import type { Action } from './actions';
+import type { Reducer } from 'redux';
+
+// Stores the complete list of products, indexed by the product key
+export const productsList: Reducer< ProductsList | undefined, Action > = ( state, action ) => {
+	switch ( action.type ) {
+		case 'PRODUCTS_LIST_RECEIVE':
+			return action.productsList;
+	}
+
+	return state;
+};
+
+// Tracks product list fetching state
+export const isFetchingProductsList: Reducer< boolean | undefined, Action > = (
+	state = false,
+	action
+) => {
+	switch ( action.type ) {
+		case 'PRODUCTS_LIST_REQUEST':
+			return true;
+		case 'PRODUCTS_LIST_RECEIVE':
+			return false;
+		case 'PRODUCTS_LIST_REQUEST_FAILURE':
+			return false;
+	}
+
+	return state;
+};
+
+const reducer = combineReducers( {
+	isFetchingProductsList,
+	productsList,
+} );
+
+export type State = ReturnType< typeof reducer >;
+
+export default reducer;

package/src/products-list/resolvers.ts

@@ -0,0 +1,28 @@
+import wpcomRequest from 'wpcom-proxy-request';
+import { ProductsList, ProductsListFailure, Dispatch } from './types';
+
+/**
+ * Requests the list of all products from the WPCOM API.
+ */
+export const getProductsList =
+	() =>
+	async ( { dispatch }: Dispatch ) => {
+		dispatch.requestProductsList();
+
+		try {
+			const productsList: ProductsList = await wpcomRequest( {
+				path: '/products',
+				apiVersion: '1.1',
+			} );
+
+			// Since the request succeeded, productsList should be guaranteed non-null;
+			// thus, we don't have any safety checks before this line.
+			for ( const product of Object.values( productsList ) ) {
+				product.cost = Number( product.cost );
+			}
+
+			dispatch.receiveProductsList( productsList );
+		} catch ( err ) {
+			dispatch.receiveProductsListFailure( err as ProductsListFailure );
+		}
+	};

package/src/products-list/selectors.ts

@@ -0,0 +1,11 @@
+import type { State } from './reducer';
+
+export const getState = ( state: State ) => state;
+
+export const getProductsList = ( state: State ) => {
+	return state.productsList;
+};
+
+export const getProductBySlug = ( state: State, slug: string ) => {
+	return state.productsList?.[ slug ];
+};