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

This commit is contained in:
Marco Pedone 2026-03-20 14:32:46 +01:00
parent 6a20a7fb36
commit 9e120379ed
2 changed files with 48 additions and 44 deletions

View file

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

View file

@ -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
const defaultValue =
tipologia === TipologiaPosizioneEnum.Stabile
? prezzo > 70000
? 2
: prezzo > 50000
? 1
: 0
: undefined;
let opzioni: string[] = [];
let pricingData: PricingData = [];
if (tipologia === TipologiaPosizioneEnum.Stabile) {
//se stabile, mostra il prezzo basato sul canone in default
const idx = prezzo > 70000 ? 2 : prezzo > 50000 ? 1 : 0;
const opzione = opzioniS[idx];
const pricingS = pricing[idx];
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={
tipologia === TipologiaPosizioneEnum.Transitorio
? t.prezzi.titolo_transitori
: t.prezzi.titolo_stabile
}
title={title}
/>
);
}
@ -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={
tipologia === TipologiaPosizioneEnum.Transitorio
? t.prezzi.titolo_transitori
: t.prezzi.titolo_stabile
}
title={title}
/>
</CollapsibleContent>
</Collapsible>