Update the product tier logic to use the new format

Author: cleacos

client/a8c-for-agencies/sections/marketplace/hooks/use-marketplace.ts

@@ -35,22 +35,28 @@ export const calculateDiscountPercentage = (
 export const getWPCOMTieredPrice = (
 	product: APIProductFamilyProduct,
 	quantity: number,
-	termPricing: TermPricingType
+	termPricing: TermPricingType,
+	ownedPlans = 0
 ) => {
 	// Calculate actual cost (base product price * quantity)
 	const basePricePerUnit =
 		termPricing === 'yearly' ? product.yearly_price ?? 0 : product.monthly_price ?? 0;
 	const actualCost = basePricePerUnit * quantity;
+	const tierPrices =
+		termPricing === 'yearly' ? product.tier_yearly_prices : product.tier_monthly_prices;
+	const tierQuantity = quantity + ownedPlans;
 
-	// Find tier for exact quantity, or for 10 units if quantity > 10
+	// Find tier for exact quantity, or get the greatest unit that is less than or equal to tierQuantity
 	const tier =
-		product?.price_tier_list?.find( ( t ) => t.units === quantity ) ||
-		( quantity > 10 ? product?.price_tier_list?.find( ( t ) => t.units === 10 ) : undefined );
+		tierPrices?.find( ( t ) => t.units === tierQuantity ) ||
+		tierPrices
+			?.filter( ( t ) => t.units <= tierQuantity )
+			.sort( ( a, b ) => b.units - a.units )[ 0 ];
 
 	// Get price per unit from tier if found, otherwise from product
 	let pricePerUnit: number;
 	if ( tier ) {
-		pricePerUnit = termPricing === 'yearly' ? tier.yearly_price : tier.monthly_price;
+		pricePerUnit = tier.price;
 	} else {
 		pricePerUnit = basePricePerUnit;
 	}
@@ -200,7 +206,7 @@ export const useGetProductPricingInfo = (
 			let discountPercentage: number;
 
 			if ( isTermPricingEnabled && termPricing ) {
-				const pricingInfo = getWPCOMTieredPrice( product, quantity, termPricing );
+				const pricingInfo = getWPCOMTieredPrice( product, quantity, termPricing, ownedPlans );
 				actualCost = pricingInfo.actualCost;
 				discountedCost = pricingInfo.discountedCost;
 				discountPercentage = pricingInfo.discountPercentage;

client/a8c-for-agencies/sections/marketplace/hosting-overview/hosting-content/standard-agency-hosting/wpcom-plan-section/wpcom-plan-selector.tsx

@@ -64,7 +64,7 @@ export default function WPCOMPlanSelector( {
 
 	const originalPrice = Number( plan?.amount ?? 0 ) * quantity;
 	const pricingInfo = isTermPricingEnabled
-		? getWPCOMTieredPrice( plan, quantity, termPricing )
+		? getWPCOMTieredPrice( plan, quantity, termPricing, ownedPlans )
 		: {
 				actualCost: originalPrice,
 				discountedCost: originalPrice - originalPrice * discount,

client/a8c-for-agencies/sections/marketplace/hosting-overview/hosting-content/standard-agency-hosting/wpcom-plan-selector/slider.tsx

@@ -23,12 +23,12 @@ const createOptionsFromPriceTierList = (
 	plan: APIProductFamilyProduct,
 	termPricing: TermPricingType
 ) => {
-	const priceTierList = plan.price_tier_list || [];
+	const priceTierList =
+		termPricing === 'yearly' ? plan.tier_yearly_prices || [] : plan.tier_monthly_prices || [];
 	const basePrice = termPricing === 'yearly' ? plan.yearly_price ?? 0 : plan.monthly_price ?? 0;
 
 	const options = priceTierList.map( ( tier ) => {
-		const tierPrice = termPricing === 'yearly' ? tier.yearly_price : tier.monthly_price;
-		const discountPercent = calculateDiscountPercentage( basePrice, tierPrice );
+		const discountPercent = calculateDiscountPercentage( basePrice, tier.price );
 
 		return {
 			value: tier.units,
@@ -69,7 +69,7 @@ export default function WPCOMPlanSlider( { quantity, ownedPlans, onChange, plan
 		let sliderOptions = [];
 
 		if ( isTermPricingEnabled && termPricing && plan ) {
-			// Use price_tier_list when term pricing is enabled
+			// Use tiered prices when term pricing is enabled
 			sliderOptions = createOptionsFromPriceTierList( plan, termPricing );
 		} else {
 			// Fallback to discount tiers