@automattic/plans-grid-next 1.0.0

package/src/fixtures/sites-plans.ts

@@ -0,0 +1,455 @@
+export default {
+	'1': {
+		formatted_original_price: 'A$0',
+		raw_price: 0,
+		raw_price_integer: 0,
+		formatted_price: 'A$0',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'free_plan',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		current_plan: true,
+		has_domain_credit: false,
+		id: null,
+		user_is_owner: null,
+		interval: -1,
+	},
+	'1003': {
+		formatted_original_price: 'A$0',
+		raw_price: 144,
+		raw_price_integer: 14400,
+		formatted_price: 'A$144',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'value_bundle',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1008': {
+		formatted_original_price: 'A$0',
+		raw_price: 456,
+		raw_price_integer: 45600,
+		formatted_price: 'A$456',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'business-bundle',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1009': {
+		formatted_original_price: 'A$0',
+		raw_price: 72,
+		raw_price_integer: 7200,
+		formatted_price: 'A$72',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'personal-bundle',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1010': {
+		formatted_original_price: 'A$0',
+		raw_price: 48,
+		raw_price_integer: 4800,
+		formatted_price: 'A$48',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'blogger-bundle',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1011': {
+		formatted_original_price: 'A$0',
+		raw_price: 816,
+		raw_price_integer: 81600,
+		formatted_price: 'A$816',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'ecommerce-bundle',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1013': {
+		formatted_original_price: 'A$0',
+		raw_price: 27,
+		raw_price_integer: 2700,
+		formatted_price: 'A$27',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'value_bundle_monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1018': {
+		formatted_original_price: 'A$0',
+		raw_price: 60,
+		raw_price_integer: 6000,
+		formatted_price: 'A$60',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'business-bundle-monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1019': {
+		formatted_original_price: 'A$0',
+		raw_price: 14,
+		raw_price_integer: 1400,
+		formatted_price: 'A$14',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'personal-bundle-monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1021': {
+		formatted_original_price: 'A$0',
+		raw_price: 106,
+		raw_price_integer: 10600,
+		formatted_price: 'A$106',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'ecommerce-bundle-monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1023': {
+		formatted_original_price: 'A$0',
+		raw_price: 240,
+		raw_price_integer: 24000,
+		formatted_price: 'A$240',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'value_bundle-2y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 730,
+	},
+	'1028': {
+		formatted_original_price: 'A$0',
+		raw_price: 720,
+		raw_price_integer: 72000,
+		formatted_price: 'A$720',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'business-bundle-2y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 730,
+	},
+	'1029': {
+		formatted_original_price: 'A$0',
+		raw_price: 120,
+		raw_price_integer: 12000,
+		formatted_price: 'A$120',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'personal-bundle-2y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 730,
+	},
+	'1030': {
+		formatted_original_price: 'A$0',
+		raw_price: 84,
+		raw_price_integer: 8400,
+		formatted_price: 'A$84',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'blogger-bundle-2y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 730,
+	},
+	'1031': {
+		formatted_original_price: 'A$0',
+		raw_price: 1296,
+		raw_price_integer: 129600,
+		formatted_price: 'A$1,296',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'ecommerce-bundle-2y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 730,
+	},
+	'1032': {
+		formatted_original_price: 'A$0',
+		raw_price: 240,
+		raw_price_integer: 24000,
+		formatted_price: 'A$240',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'pro-plan',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1033': {
+		formatted_original_price: 'A$0',
+		raw_price: 84,
+		raw_price_integer: 8400,
+		formatted_price: 'A$84',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'starter-plan',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1034': {
+		formatted_original_price: 'A$0',
+		raw_price: 29,
+		raw_price_integer: 2900,
+		formatted_price: 'A$29',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'pro-plan-monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1035': {
+		formatted_original_price: 'A$0',
+		raw_price: 399,
+		raw_price_integer: 39900,
+		formatted_price: 'A$399',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'pro-plan-2y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 730,
+	},
+	'1043': {
+		formatted_original_price: 'A$0',
+		raw_price: 288,
+		raw_price_integer: 28800,
+		formatted_price: 'A$288',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'value_bundle-3y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 1095,
+	},
+	'1048': {
+		formatted_original_price: 'A$0',
+		raw_price: 936,
+		raw_price_integer: 93600,
+		formatted_price: 'A$936',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'business-bundle-3y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 1095,
+	},
+	'1049': {
+		formatted_original_price: 'A$0',
+		raw_price: 144,
+		raw_price_integer: 14400,
+		formatted_price: 'A$144',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'personal-bundle-3y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 1095,
+	},
+	'1051': {
+		formatted_original_price: 'A$0',
+		raw_price: 1728,
+		raw_price_integer: 172800,
+		formatted_price: 'A$1,728',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'ecommerce-bundle-3y',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 1095,
+	},
+	'1052': {
+		formatted_original_price: 'A$0',
+		raw_price: 0,
+		raw_price_integer: 0,
+		formatted_price: 'A$0',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'ecommerce-trial-bundle-monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1053': {
+		formatted_original_price: 'A$0',
+		raw_price: 92,
+		raw_price_integer: 9200,
+		formatted_price: 'A$92',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'wooexpress-medium-bundle-monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1054': {
+		formatted_original_price: 'A$0',
+		raw_price: 54,
+		raw_price_integer: 5400,
+		formatted_price: 'A$54',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'wooexpress-small-bundle-monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1055': {
+		formatted_original_price: 'A$0',
+		raw_price: 708,
+		raw_price_integer: 70800,
+		formatted_price: 'A$708',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'wooexpress-medium-bundle-yearly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1056': {
+		formatted_original_price: 'A$0',
+		raw_price: 396,
+		raw_price_integer: 39600,
+		formatted_price: 'A$396',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'wooexpress-small-bundle-yearly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 365,
+	},
+	'1058': {
+		formatted_original_price: 'A$0',
+		raw_price: 0,
+		raw_price_integer: 0,
+		formatted_price: 'A$0',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'wp_bundle_hosting_trial_monthly',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 31,
+	},
+	'1061': {
+		formatted_original_price: 'A$0',
+		raw_price: 50750,
+		raw_price_integer: 5075000,
+		formatted_price: 'A$50,750',
+		raw_discount: 0,
+		raw_discount_integer: 0,
+		formatted_discount: 'A$0',
+		product_slug: 'wp_com_hundred_year_bundle_centennially',
+		discount_reason: null,
+		is_domain_upgrade: null,
+		currency_code: 'AUD',
+		can_start_trial: false,
+		interval: 36500,
+	},
+};

package/src/fixtures/sites-purchases.ts

@@ -0,0 +1,130 @@
+export default [
+	{
+		ID: '1090489',
+		user_id: '238958705',
+		blog_id: '222597060',
+		product_id: '2451',
+		subscribed_date: '2024-05-01T00:53:22+00:00',
+		renew: '1',
+		auto_renew: '1',
+		renew_date: '2025-05-01T00:00:00+00:00',
+		inactive_date: null,
+		active: '1',
+		meta: '',
+		ownership_id: '12378018',
+		most_recent_renew_date: '2024-05-01T00:53:21+00:00',
+		amount: 155.4,
+		expiry_date: '2025-05-01T00:00:00+00:00',
+		expiry_message: 'Renews on May 1, 2025',
+		expiry_sub_message: '',
+		expiry_status: 'active',
+		partner_name: null,
+		partner_slug: null,
+		partner_type: null,
+		partner_key_id: null,
+		subscription_status: 'active',
+		product_slug: 'jetpack_ai_yearly',
+		product_type: 'jetpack',
+		blog_created_date: '2023-08-21T09:11:23+00:00',
+		blogname: '',
+		domain: 'zzz.wordpress.com',
+		description: '',
+		primary_blog: 'true',
+		attached_to_purchase_id: null,
+		included_domain: '',
+		included_domain_purchase_amount: 0,
+		currency_code: 'AUD',
+		currency_symbol: 'A$',
+		renewal_price_tier_slug: 'up_to_100_requests',
+		renewal_price_tier_usage_quantity: 100,
+		current_price_tier_slug: 'up_to_100_requests',
+		current_price_tier_usage_quantity: 100,
+		price_tier_list: [
+			{
+				minimum_units: 0,
+				maximum_units: 100,
+				minimum_price: 15540,
+				maximum_price: 15540,
+				minimum_price_display: 'A$155.40',
+				maximum_price_display: 'A$155.40',
+			},
+			{
+				minimum_units: 101,
+				maximum_units: 200,
+				minimum_price: 31140,
+				maximum_price: 31140,
+				minimum_price_display: 'A$311.40',
+				maximum_price_display: 'A$311.40',
+			},
+			{
+				minimum_units: 201,
+				maximum_units: 500,
+				minimum_price: 75540,
+				maximum_price: 75540,
+				minimum_price_display: 'A$755.40',
+				maximum_price_display: 'A$755.40',
+			},
+			{
+				minimum_units: 501,
+				maximum_units: 750,
+				minimum_price: 112740,
+				maximum_price: 112740,
+				minimum_price_display: 'A$1,127.40',
+				maximum_price_display: 'A$1,127.40',
+			},
+			{
+				minimum_units: 751,
+				maximum_units: 1000,
+				minimum_price: 151140,
+				maximum_price: 151140,
+				minimum_price_display: 'A$1,511.40',
+				maximum_price_display: 'A$1,511.40',
+			},
+		],
+		auto_renew_coupon_code: null,
+		auto_renew_coupon_discount_percentage: null,
+		price_text: 'A$155.40',
+		bill_period_label: 'per year',
+		bill_period_days: 365,
+		regular_price_text: 'A$155.40',
+		regular_price_integer: 15540,
+		product_display_price: '<abbr title="Australian Dollars">A$</abbr>155.40',
+		price_integer: 15540,
+		is_cancelable: true,
+		async_pending_payment_block_is_set: false,
+		can_explicit_renew: true,
+		can_disable_auto_renew: true,
+		can_reenable_auto_renewal: false,
+		iap_purchase_management_link: null,
+		is_iap_purchase: false,
+		is_locked: false,
+		is_refundable: true,
+		refund_period_in_days: 14,
+		is_renewable: true,
+		is_renewal: false,
+		has_private_registration: false,
+		is_woo_express_trial: false,
+		refund_amount: 170.94,
+		refund_integer: 17094,
+		refund_currency_symbol: 'A$',
+		refund_text: 'A$170.94',
+		refund_options: null,
+		total_refund_amount: 170.94,
+		total_refund_integer: 17094,
+		total_refund_currency: 'AUD',
+		total_refund_text: 'A$170.94',
+		check_dns: false,
+		payment_card_processor: null,
+		payment_card_id: '3231680',
+		payment_card_type: 'visa',
+		payment_details: '4242',
+		payment_expiry_timestamp: 1832889600,
+		payment_expiry: '01/28',
+		stored_details_id: '3231680',
+		payment_name: 'Test User',
+		payment_country_code: 'US',
+		payment_country_name: 'United States',
+		is_rechargable: true,
+		payment_type: 'credit_card',
+	},
+];

package/src/grid-context.tsx

@@ -0,0 +1,104 @@
+import { createContext, useContext } from '@wordpress/element';
+import type { GridContextProps, GridPlan, PlansIntent, UseAction } from './types';
+import type { FeatureList, FeatureGroupMap } from '@automattic/calypso-products';
+import type { Plans } from '@automattic/data-stores';
+
+interface PlansGridContext {
+	intent?: PlansIntent;
+	siteId?: number | null;
+	gridPlans: GridPlan[];
+	gridPlansIndex: { [ key: string ]: GridPlan };
+	allFeaturesList: FeatureList;
+	helpers: {
+		useCheckPlanAvailabilityForPurchase: Plans.UseCheckPlanAvailabilityForPurchase;
+		// TODO: Fix this type
+		useAction: UseAction;
+		recordTracksEvent?: GridContextProps[ 'recordTracksEvent' ];
+	};
+	coupon?: string;
+	enableFeatureTooltips?: boolean;
+	/**
+	 * `enableCategorisedFeatures` relevant to Features Grid (and omitted from Comparison Grid)
+	 * for rendering features with categories based on available/associated feature group map.
+	 */
+	enableCategorisedFeatures?: boolean;
+	enableStorageAsBadge?: boolean;
+	enableReducedFeatureGroupSpacing?: boolean;
+	enableLogosOnlyForEnterprisePlan?: boolean;
+	enableTermSavingsPriceDisplay?: boolean;
+	featureGroupMap: Partial< FeatureGroupMap >;
+	hideUnsupportedFeatures?: boolean;
+	hideFeatureGroupTitles?: boolean;
+	enterpriseFeaturesList?: string[];
+	reflectStorageSelectionInPlanPrices?: boolean;
+}
+
+const PlansGridContext = createContext< PlansGridContext >( {} as PlansGridContext );
+
+const PlansGridContextProvider = ( {
+	intent,
+	gridPlans,
+	useCheckPlanAvailabilityForPurchase,
+	useAction,
+	recordTracksEvent,
+	allFeaturesList,
+	siteId,
+	children,
+	coupon,
+	enableFeatureTooltips,
+	enableCategorisedFeatures,
+	enableStorageAsBadge,
+	enableReducedFeatureGroupSpacing,
+	enableLogosOnlyForEnterprisePlan,
+	enableTermSavingsPriceDisplay,
+	featureGroupMap,
+	hideUnsupportedFeatures,
+	hideFeatureGroupTitles,
+	enterpriseFeaturesList,
+	reflectStorageSelectionInPlanPrices,
+}: GridContextProps ) => {
+	const gridPlansIndex = gridPlans.reduce(
+		( acc, gridPlan ) => ( {
+			...acc,
+			[ gridPlan.planSlug ]: gridPlan,
+		} ),
+		{}
+	);
+
+	return (
+		<PlansGridContext.Provider
+			value={ {
+				intent,
+				siteId,
+				gridPlans,
+				gridPlansIndex,
+				allFeaturesList,
+				helpers: {
+					useCheckPlanAvailabilityForPurchase,
+					useAction,
+					recordTracksEvent,
+				},
+				coupon,
+				enableFeatureTooltips,
+				enableCategorisedFeatures,
+				enableStorageAsBadge,
+				enableReducedFeatureGroupSpacing,
+				enableLogosOnlyForEnterprisePlan,
+				enableTermSavingsPriceDisplay,
+				featureGroupMap,
+				hideUnsupportedFeatures,
+				hideFeatureGroupTitles,
+				enterpriseFeaturesList,
+				reflectStorageSelectionInPlanPrices,
+			} }
+		>
+			{ children }
+		</PlansGridContext.Provider>
+	);
+};
+
+export const usePlansGridContext = (): PlansGridContext => useContext( PlansGridContext );
+
+export type { PlansIntent };
+
+export default PlansGridContextProvider;

package/src/hooks/data-store/is-popular-plan.ts

@@ -0,0 +1,5 @@
+import { isPremiumPlan, isWooExpressMediumPlan } from '@automattic/calypso-products';
+
+export function isPopularPlan( planSlug: string ): boolean {
+	return isPremiumPlan( planSlug ) || isWooExpressMediumPlan( planSlug );
+}