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

feat: enhance interruption request functionality with tooltip and improved messaging

Browse source
This commit is contained in:
Marco Pedone 2026-03-20 16:45:14 +01:00
parent cc06738db4
commit cfc72a09e8
3 changed files with 55 additions and 63 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

114
apps/infoalloggi/src/components/servizio/servizio_actions.tsx
View file

@ -1,4 +1,4 @@
import { add } from "date-fns";
import { add, addBusinessDays, isBefore } from "date-fns";
import {
Bug,
ChevronDown,
@ -53,6 +53,11 @@ import {
DialogTitle,
DialogTrigger,
} from "~/components/ui/dialog";
import {
Tooltip,
TooltipContent,
TooltipTrigger,
} from "~/components/ui/tooltip";
import {
type FormValues as EditFormValues,
FormEditServizio,
@ -82,50 +87,11 @@ export const ServizioInfos = () => {
<div className="grid w-full grid-cols-2 gap-2 sm:grid-cols-4">
<ServizioPrezzo />
<UserActions />
{/* <ServizioActions /> */}
<ServizioOrders />
</div>
);
};
// const ServizioActions = () => {
// const { isAdmin } = useServizio();
// return (
// <Dialog>
// <DialogTrigger asChild>
// <Button className="flex-1" variant="outline">
// <SlidersHorizontal />
// <span>Impostazioni</span>
// </Button>
// </DialogTrigger>
// <DialogContent className="sm:max-w-2xl">
// <DialogHeader>
// <DialogTitle>Azioni Servizio</DialogTitle>
// <DialogDescription className="sr-only">
// Azioni disponibili per questo servizio
// </DialogDescription>
// </DialogHeader>
// <div className="flex flex-col items-center gap-4">
// {isAdmin && (
// <div className="w-full text-center">
// <span>Azioni Admin</span>
// <Separator />
// </div>
// )}
// <AdminServizioActions />
// {isAdmin && (
// <div className="w-full text-center">
// <span>Azioni Utente</span>
// <Separator />
// </div>
// )}
// <UserActions />
// </div>
// </DialogContent>
// </Dialog>
// );
// };
export const AdminServizioActions = () => {
const { servizio, isAdmin, userId } = useServizio();
if (!isAdmin) return null;
@ -587,13 +553,6 @@ const AddAnnuncio = ({
const InterruzioneServizio = () => {
const { servizio, isAdmin } = useServizio();
const { t } = useTranslation();
const beforeInterruzioneLimit =
servizio.decorrenza != null &&
new Date() <=
add(servizio.decorrenza, {
days: 14,
});
const utils = api.useUtils();
const { mutate } = api.servizio.interruzioneServizio.useMutation({
onError: (error) => {
@ -605,28 +564,61 @@ const InterruzioneServizio = () => {
toast.success("Interruzione richiesta");
},
});
if (!servizio.decorrenza) return null;
const fineInterruzione = add(servizio.decorrenza, {
days: 14,
});
const canInterrompere =
!servizio.isInterrotto &&
(isAdmin ||
(isBefore(new Date(), fineInterruzione) &&
servizio.annunci.every((a) => a.accettato_conferma_at === null)));
return (
<AlertDialog>
<AlertDialogTrigger asChild>
<Button
aria-label="Request Interruzione"
className=""
disabled={
!isAdmin &&
(!beforeInterruzioneLimit ||
servizio.isInterrotto ||
servizio.annunci.some((a) => a.user_confirmed_at !== null))
}
>
<ClockAlert /> <span>{t.servizio.interruzione.btn}</span>
</Button>
{canInterrompere ? (
<Button
aria-label="Request Interruzione"
className="w-full"
disabled={!canInterrompere}
>
<ClockAlert /> <span>{t.servizio.interruzione.btn}</span>
</Button>
) : (
<Tooltip delayDuration={0}>
<TooltipTrigger asChild>
<span className="inline-block w-full">
<Button
aria-label="Request Interruzione"
className="w-full"
disabled={!canInterrompere}
>
<ClockAlert /> <span>{t.servizio.interruzione.btn}</span>
</Button>
</span>
</TooltipTrigger>
<TooltipContent>
<p>Periodo di interruzione scaduto, contattaci.</p>
</TooltipContent>
</Tooltip>
)}
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>{t.servizio.interruzione.title}</AlertDialogTitle>
<AlertDialogDescription>
{t.servizio.interruzione.description}
<AlertDialogDescription className="space-y-2">
<p>
<b>
Fine periodo di interruzione:{" "}
{fineInterruzione.toLocaleDateString("it-IT")}
</b>
</p>
<p className="whitespace-pre-line">
{t.servizio.interruzione.description}
</p>
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>

2
apps/infoalloggi/src/i18n/en.ts
View file

@ -1343,7 +1343,7 @@ The Stable Rent service, ideal for those with demonstrable work references and f
btn: "Interruption",
title: "Are you sure you want to request the interruption?",
description:
"This action is irreversible and will deactivate the activated services. By confirming the action, you withdraw from the service according to the contractual conditions. You will be notified via email of the confirmation of the interruption.",
"This action is irreversible and will deactivate the activated services.\n By confirming the action, you withdraw from the service according to the contractual conditions.\n You will be notified via email of the confirmation of the interruption.",
},
conferma: {
accetto: "I accept the terms and conditions.",

2
apps/infoalloggi/src/i18n/it.ts
View file

@ -1342,7 +1342,7 @@ export const it: LangDict = {
btn: "Interruzione",
title: "Sei sicuro di voler richiedere l'interruzione?",
description:
"Questa azione è irreversibile e comporta la disattivazione dei servizi attivati. Confermando l'azione recedi dal servizio secondo le condizioni contrattuali. Verrai notificato via email della conferma dell'avvenuta interruzione.",
"Questa azione è irreversibile e comporta la disattivazione dei servizi attivati.\nConfermando l'azione recedi dal servizio secondo le condizioni contrattuali.\nVerrai notificato via email della conferma dell'avvenuta interruzione.",
},
conferma: {
accetto: "Accetto i termini e condizioni.",