Marco/infoalloggi-monorepo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 6 Wiki Activity Actions

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

Browse source 
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
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/infoalloggi/src/components/area-riservata/userViewHeader.tsx
View file

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

105
apps/infoalloggi/src/components/servizio/servizio.tsx
View file

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