// src/admin/screen-plans/Plans.jsx
import {
	PLANS,
	PricingTable,
} from '../screen-licenses/components/PricingTable';
import { startShopCheckoutForPlan } from '../screen-licenses/utils';

export function Plans( { query = {} } ) {
	const from = query.from;
	const plans = from
		? PLANS.map( ( p ) => ( {
				...p,
				utmCampaign: p.utmCampaign.replace(
					'a2-in_plugin-',
					`a2-in_plugin-${ from }-`
				),
		  } ) )
		: PLANS;

	return (
		<div className="mx-auto w-full max-w-7xl">
			<PricingTable
				onSelectPlan={ ( planId ) =>
					startShopCheckoutForPlan( planId, plans )
				}
			/>
		</div>
	);
}