From cfc72a09e83071a100492705ce26228d00c5cbb6 Mon Sep 17 00:00:00 2001
From: Marco Pedone <m.pedone98@gmail.com>
Date: Fri, 20 Mar 2026 16:45:14 +0100
Subject: [PATCH] feat: enhance interruption request functionality with tooltip
 and improved messaging

---
 .../components/servizio/servizio_actions.tsx  | 114 ++++++++----------
 apps/infoalloggi/src/i18n/en.ts               |   2 +-
 apps/infoalloggi/src/i18n/it.ts               |   2 +-
 3 files changed, 55 insertions(+), 63 deletions(-)

diff --git a/apps/infoalloggi/src/components/servizio/servizio_actions.tsx b/apps/infoalloggi/src/components/servizio/servizio_actions.tsx
index 0e69fe7..1af0e8a 100644
--- a/apps/infoalloggi/src/components/servizio/servizio_actions.tsx
+++ b/apps/infoalloggi/src/components/servizio/servizio_actions.tsx
@@ -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>
diff --git a/apps/infoalloggi/src/i18n/en.ts b/apps/infoalloggi/src/i18n/en.ts
index a3f8e49..a2df1b2 100644
--- a/apps/infoalloggi/src/i18n/en.ts
+++ b/apps/infoalloggi/src/i18n/en.ts
@@ -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.",
diff --git a/apps/infoalloggi/src/i18n/it.ts b/apps/infoalloggi/src/i18n/it.ts
index b69678d..f7b6458 100644
--- a/apps/infoalloggi/src/i18n/it.ts
+++ b/apps/infoalloggi/src/i18n/it.ts
@@ -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.",