feat: update labels and refactor link components in ServizioLinkCard and RinnovoLinkCard

Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
Marco Pedone 2026-05-05 16:50:00 +02:00
parent 655d69c94b
commit 6f85ae285b
2 changed files with 57 additions and 50 deletions

View file

@ -68,7 +68,7 @@ export const UserViewHeader = () => {
icon: UserCog,
},
{
label: "Ricerca",
label: "Servizi",
slug: "ricerca",
icon: Search,
},

View file

@ -10,7 +10,6 @@ import {
ClockFading,
ExternalLink,
type LucideIcon,
MousePointerClick,
PackageCheck,
SearchX,
Timer,
@ -115,34 +114,33 @@ const RinnovoLinkCard = ({
userId: UsersId;
}) => {
return (
<Link
className="group"
href={
isAdmin
? `/area-riservata/admin/user-view/rinnovo/${userId}/${data.id}`
: `/area-riservata/rinnovo/${data.id}`
}
<Card
className={cn("transition-shadow hover:bg-muted/15 hover:shadow-md")}
key={data.id}
>
<Card
className={cn("transition-shadow hover:bg-muted/15 hover:shadow-md")}
>
<CardHeader>
<CardTitle className="text-xl group-hover:underline">
Rinnovo {data.codice}
</CardTitle>
<CardDescription className="">
Data rinnovo: {data.decorrenza.toLocaleDateString("it-IT")}
</CardDescription>
</CardHeader>
<CardContent className="flex flex-col flex-wrap gap-4 sm:flex-row sm:justify-between">
<div className="flex items-center gap-2 rounded-md text-muted-foreground group-hover:text-foreground">
<CardHeader className="gap-1">
<CardTitle className="text-xl group-hover:underline">
Rinnovo {data.codice}
</CardTitle>
<CardDescription className="">
Data rinnovo: {data.decorrenza.toLocaleDateString("it-IT")}
</CardDescription>
</CardHeader>
<CardContent className="flex flex-col flex-wrap gap-4 sm:flex-row sm:justify-between">
<Link
href={
isAdmin
? `/area-riservata/admin/user-view/rinnovo/${userId}/${data.id}`
: `/area-riservata/rinnovo/${data.id}`
}
>
<Button size="lg">
<span>Vai al rinnovo</span>
<ArrowRight />
</div>
</CardContent>
</Card>
</Link>
</Button>
</Link>
</CardContent>
</Card>
);
};
@ -183,24 +181,16 @@ const ServizioLinkCard = ({
}
return (
<Link
className="group"
href={
isAdmin
? `/area-riservata/admin/user-view/servizio/${userId}/${servizio.servizio_id}`
: `/area-riservata/servizio/${servizio.servizio_id}`
}
key={servizio.servizio_id}
>
<div key={servizio.servizio_id}>
{status === "in_attesa" ? (
<Card className="relative border-yellow-500 bg-yellow-500 text-white hover:bg-yellow-500/90 dark:bg-yellow-900 dark:hover:bg-yellow-900/90">
<Card className="relative border-yellow-500 bg-yellow-500 text-white dark:bg-yellow-900 dark:hover:bg-yellow-900/90">
<span className="absolute top-5 right-5 -mt-1 -mr-1 flex size-7 items-center justify-center">
<span className="absolute inline-flex size-6 h-full w-full animate-ping rounded-full bg-white opacity-75" />
<span className="relative inline-flex size-5 rounded-full bg-white"></span>
</span>
<CardHeader>
<CardTitle className="text-xl group-hover:underline">
<CardHeader className="gap-1">
<CardTitle className="text-xl">
{t.servizio.servizio_titolo} {servizio.tipologia}
</CardTitle>
<CardDescription className="text-white">
@ -214,10 +204,18 @@ const ServizioLinkCard = ({
<span>{t.servizio.status[status]}</span>
</div>
<div className="flex items-center gap-2 rounded-md font-semibold text-white underline underline-offset-2">
<span>{t.servizio.vai_al_servizio}</span>
<MousePointerClick />
</div>
<Link
href={
isAdmin
? `/area-riservata/admin/user-view/servizio/${userId}/${servizio.servizio_id}`
: `/area-riservata/servizio/${servizio.servizio_id}`
}
>
<Button size="lg">
<span>{t.servizio.vai_al_servizio}</span>
<ArrowRight />
</Button>
</Link>
</CardContent>
</Card>
) : (
@ -227,11 +225,11 @@ const ServizioLinkCard = ({
status === "interrotto" && "border-red-500",
status === "scaduto" && "border-gray-500",
status === "completato" && "border-blue-500",
"transition-shadow hover:bg-muted/15 hover:shadow-md",
"transition-shadow",
)}
>
<CardHeader>
<CardTitle className="text-xl group-hover:underline">
<CardHeader className="gap-1">
<CardTitle className="text-xl">
{t.servizio.servizio_titolo} {servizio.tipologia}
</CardTitle>
<CardDescription className="">
@ -253,14 +251,23 @@ const ServizioLinkCard = ({
<span>{t.servizio.status[status]}</span>
</div>
<div className="flex items-center gap-2 rounded-md font-semibold text-muted-foreground group-hover:text-foreground">
<span>{t.servizio.vai_al_servizio}</span>
<MousePointerClick />
</div>
<Link
href={
isAdmin
? `/area-riservata/admin/user-view/servizio/${userId}/${servizio.servizio_id}`
: `/area-riservata/servizio/${servizio.servizio_id}`
}
>
<Button size="lg">
<span>{t.servizio.vai_al_servizio}</span>
<ArrowRight />
</Button>
</Link>
</CardContent>
</Card>
)}
</Link>
</div>
);
};