feat: refactor Pricing component to utilize PricingData type and streamline pricing logic

apps/infoalloggi/src/components/prezzi.tsx

@@ -96,7 +96,7 @@ export const PricingChoice = () => {
 	);
 };
 
-type PricingData = { downPayment: number; secondPayment: number }[];
+export type PricingData = { downPayment: number; secondPayment: number }[];
 
 export const PricingComponent = ({
 	pricingData,

apps/infoalloggi/src/pages/annuncio/[cod].tsx

@@ -28,7 +28,7 @@ import { IconMatrix } from "~/components/IconComponents";
 import InformationBubble from "~/components/InformationBubble";
 import { LoadingPage } from "~/components/loading";
 import { MappaDialogFullscreen } from "~/components/MapDialog";
-import { PricingComponent } from "~/components/prezzi";
+import { PricingComponent, type PricingData } from "~/components/prezzi";
 import {
 	Accordion,
 	AccordionContent,
@@ -262,44 +262,58 @@ const Pricing = ({ isDesktop }: { isDesktop: boolean }) => {
 	if (isLoading) return <LoadingPage />;
 	if (!prezziario) return null;
 
+	const opzioniT = [
+		t.pricing_cmp.breve_option1,
+		t.pricing_cmp.breve_option2,
+		t.pricing_cmp.breve_option3,
+		t.pricing_cmp.breve_option4,
+		t.pricing_cmp.breve_option5,
+	];
+	const opzioniS = [
+		t.pricing_cmp.stabile_option1,
+		t.pricing_cmp.stabile_option2,
+		t.pricing_cmp.stabile_option3,
+	];
+
 	const cta =
 		tipologia === TipologiaPosizioneEnum.Transitorio
 			? t.pricing_cmp.cta_breve
 			: t.pricing_cmp.cta_stabile;
-	const opzioni =
-		tipologia === TipologiaPosizioneEnum.Transitorio
-			? [
-					t.pricing_cmp.breve_option1,
-					t.pricing_cmp.breve_option2,
-					t.pricing_cmp.breve_option3,
-					t.pricing_cmp.breve_option4,
-					t.pricing_cmp.breve_option5,
-				]
-			: [
-					t.pricing_cmp.stabile_option1,
-					t.pricing_cmp.stabile_option2,
-					t.pricing_cmp.stabile_option3,
-				];
-
-	const style =
-		tipologia === TipologiaPosizioneEnum.Transitorio
-			? "border-transitorio bg-transitorio"
-			: "border-stabile bg-stabile";
 
 	const pricing = prezziario.saldi.map((s) => ({
 		downPayment: prezziario.acconto.prezzo_cent / 100,
 		secondPayment: s.prezzo_cent / 100,
 	}));
 
-	//se stabile, mostra il prezzo basato sul canone in default
+	let opzioni: string[] = [];
-	const defaultValue =
+	let pricingData: PricingData = [];
-		tipologia === TipologiaPosizioneEnum.Stabile
+
-			? prezzo > 70000
+	if (tipologia === TipologiaPosizioneEnum.Stabile) {
-				? 2
+		//se stabile, mostra il prezzo basato sul canone in default
-				: prezzo > 50000
+		const idx = prezzo > 70000 ? 2 : prezzo > 50000 ? 1 : 0;
-					? 1
+		const opzione = opzioniS[idx];
-					: 0
+		const pricingS = pricing[idx];
-			: undefined;
+		if (opzione && pricingS) {
+			opzioni = [opzione];
+			pricingData = [pricingS];
+		} else {
+			opzioni = opzioniS;
+			pricingData = pricing;
+		}
+	} else {
+		opzioni = opzioniT;
+		pricingData = pricing;
+	}
+
+	const style =
+		tipologia === TipologiaPosizioneEnum.Transitorio
+			? "border-transitorio bg-transitorio"
+			: "border-stabile bg-stabile";
+
+	const title =
+		tipologia === TipologiaPosizioneEnum.Transitorio
+			? t.prezzi.titolo_transitori
+			: t.prezzi.titolo_stabile;
 
 	if (isDesktop) {
 		return (
@@ -309,16 +323,11 @@ const Pricing = ({ isDesktop }: { isDesktop: boolean }) => {
 					"max-w-2xl **:data-[role=wrapper]:flex-wrap **:data-[role=amount]:text-2xl lg:**:data-[role=wrapper]:flex-nowrap xl:**:data-[role=amount]:text-3xl sm:[&_#contratto-link]:h-8 xl:[&_#contratto-link]:h-9",
 				)}
 				cta={cta}
-				defaultValue={defaultValue}
 				opzioni={opzioni}
-				pricingData={pricing}
+				pricingData={pricingData}
 				statico={true}
 				tipo={tipologia}
-				title={
+				title={title}
-					tipologia === TipologiaPosizioneEnum.Transitorio
-						? t.prezzi.titolo_transitori
-						: t.prezzi.titolo_stabile
-				}
 			/>
 		);
 	}
@@ -344,16 +353,11 @@ const Pricing = ({ isDesktop }: { isDesktop: boolean }) => {
 				<PricingComponent
 					className={cn(style, "max-w-full")}
 					cta={cta}
-					defaultValue={defaultValue}
 					opzioni={opzioni}
-					pricingData={pricing}
+					pricingData={pricingData}
 					statico={true}
 					tipo={tipologia}
-					title={
+					title={title}
-						tipologia === TipologiaPosizioneEnum.Transitorio
-							? t.prezzi.titolo_transitori
-							: t.prezzi.titolo_stabile
-					}
 				/>
 			</CollapsibleContent>
 		</Collapsible>