infoalloggi-monorepo/apps/infoalloggi/src/components/servizio/annuncio_actions.tsx

import {
	ExternalLink,
	Eye,
	FileBadge,
	FileText,
	FolderKanban,
	PackageCheck,
	Pointer,
	Printer,
	Trash2,
} from "lucide-react";
import Link from "next/link";
import { useRouter } from "next/router";
import toast from "react-hot-toast";
import { Button, type ButtonConfigs } from "~/components/ui/button";
import {
	Tooltip,
	TooltipContent,
	TooltipProvider,
	TooltipTrigger,
} from "~/components/ui/tooltip";
import { cn } from "~/lib/utils";
import { useServizio, useServizioAnnuncio } from "~/providers/ServizioProvider";
import type { AnnunciId } from "~/schemas/public/Annunci";
import { api } from "~/utils/api";
import { Confirm } from "../confirm";
import { AdminLavoraConferma } from "./admin_conferma";
import { AdminContratto } from "./admin_contratto";
import { ConfermaAnnuncioModal, ConfermaInLavorazioneModal } from "./conferma";
import { ContattiProprietarioModal } from "./modale_contatti";

export const AdminActions = () => {
	const { servizioId, userId, isAdmin } = useServizio();
	const { data, annuncioId } = useServizioAnnuncio();

	const utils = api.useUtils();
	const { mutate } = api.servizio.removeAnnuncioServizio.useMutation({
		onError: (error) => {
			console.error(error);
			toast.error("Errore durante la rimozione dell'annuncio");
		},
		onSuccess: async () => {
			await utils.servizio.getAllServizioAnnunci.invalidate({ userId });
			await utils.servizio.getCompatibileAnnunci.invalidate({
				servizioId,
			});
			toast.success("Annuncio rimosso");
		},
	});
	if (!isAdmin) return null;

	return (
		<div className="flex w-full max-w-fit flex-wrap justify-start gap-3 sm:justify-end">
			{data.user_confirmed_at != null && <AdminLavoraConferma />}
			{data.accettato_conferma_at != null && (
				<>
					<AdminContratto />
					{data.gestionale_id && (
						<Link
							aria-label="Open Gestionale"
							href={`https://win-jk822fggr6b:480/id/${data.gestionale_id}`}
							target="_blank"
						>
							<Button size="sm">
								<FolderKanban /> Gestionale
							</Button>
						</Link>
					)}
				</>
			)}
			<Link href={`/annuncio/${data.codice}`} target="_blank">
				<Button size="sm" type="button" variant="outline">
					<Eye /> pubblica
				</Button>
			</Link>
			<Link
				href={`/area-riservata/admin/edit-annuncio/${annuncioId}`}
				target="_blank"
			>
				<Button
					aria-label="Edit Annuncio"
					className="w-fit"
					size="sm"
					variant="secondary"
				>
					<ExternalLink />
					<span>Modifica</span>
				</Button>
			</Link>

			<Link
				href={`/area-riservata/admin/scheda-annuncio-stampa/${data.id}`}
				target="_blank"
			>
				<Button size="sm" type="button" variant="outline">
					<Printer /> Scheda
				</Button>
			</Link>

			<Confirm
				description="Sei sicuro di voler eliminare l'annuncio?"
				onConfirm={() => {
					mutate({
						annuncioId,
						servizioId,
					});
				}}
				title="Elimina annuncio"
			>
				<Button
					aria-label="Delete Annuncio"
					className="w-fit"
					size="sm"
					variant="destructive"
				>
					<Trash2 />
					<span>Elimina</span>
				</Button>
			</Confirm>
		</div>
	);
};

export const UserActions = () => {
	const { servizioId } = useServizio();
	const { data, annuncioId } = useServizioAnnuncio();

	const ContattiSbloccati = data.open_contatti_at !== null;
	const ConfermaUtente = data.user_confirmed_at !== null;
	const ConfermaLavorata = data.doc_conferma_added && data.hasConfermaAdmin;
	const AccettatoConferma = data.accettato_conferma_at !== null;

	return (
		<>
			<div className="flex w-full flex-col flex-wrap gap-2 sm:flex-row">
				<ContattiProprietarioModal />
				{ConfermaUtente
					? !data.hasConfermaAdmin && <ConfermaInLavorazioneModal />
					: ContattiSbloccati && <ConfermaAnnuncioModal />}

				{AccettatoConferma ? (
					<Link
						aria-label="Conferma immobile"
						href={`/servizio/riapri-conferma/${servizioId}/${annuncioId}`}
					>
						<Button className="w-full sm:w-fit" variant="success">
							<Pointer />
							Rivedi la conferma
						</Button>
					</Link>
				) : (
					ConfermaLavorata &&
					(data.doc_conferma_ref ? (
						<Link
							aria-label="Conferma immobile"
							href={`/servizio/conferma-immobile/${servizioId}/${annuncioId}`}
						>
							<Button className="w-full sm:w-fit" variant="success">
								<Pointer />
								Confermato - Procedi ora
							</Button>
						</Link>
					) : (
						<TooltipProvider delayDuration={0}>
							<Tooltip>
								<TooltipTrigger asChild>
									<Button
										className="w-full cursor-not-allowed opacity-50 sm:w-fit"
										variant="success"
									>
										<Pointer />
										Confermato - Procedi ora
									</Button>
								</TooltipTrigger>
								<TooltipContent>
									<p>Il documento non è più disponibile</p>
									<p>
										Se hai bisogno di una copia, contattaci via email o chat.
									</p>
								</TooltipContent>
							</Tooltip>
						</TooltipProvider>
					))
				)}
			</div>

			{data.accettato_conferma_at != null && <PostConfermaSection />}
		</>
	);
};

const PostConfermaSection = () => {
	const { servizio, servizioId } = useServizio();
	const { data, annuncioId } = useServizioAnnuncio();

	const saldoPaid = servizio.isOkSaldo;
	const consulenzaPaid = servizio.isOkConsulenza;

	if (!saldoPaid) {
		return (
			<div className="flex flex-col gap-1">
				<h3 className="font-semibold">
					Questo annuncio è stato confermato, procedi al saldo:
				</h3>
				<SaldoButton annuncioId={annuncioId} />
			</div>
		);
	}
	if (!data.doc_contratto_added) {
		return (
			<div className="flex flex-col gap-1">
				<h3 className="font-semibold text-green-500">
					Ci siamo quasi! Stiamo preparando il contratto per te.
				</h3>
				<h3 className="font-semibold">
					Una volta pronto, riceverai una notifica via email.
				</h3>
			</div>
		);
	}

	return (
		<div className="flex flex-col gap-2">
			<h3 className="font-semibold">
				{consulenzaPaid
					? "Il contratto è pronto, puoi visualizzarlo:"
					: "Il contratto è pronto, puoi visualizzarlo e procedere al saldo:"}
			</h3>
			<div className="flex flex-wrap gap-2">
				{data.doc_contratto_ref ? (
					<Link
						aria-label="Visualizza contratto"
						href={`/servizio/contratto/${servizioId}/${annuncioId}`}
						target="_blank"
					>
						<Button className="w-full sm:w-fit">
							<FileText />
							Visualizza il contratto
						</Button>
					</Link>
				) : (
					<TooltipProvider delayDuration={0}>
						<Tooltip>
							<TooltipTrigger asChild>
								<Button className="w-fit cursor-not-allowed opacity-50">
									<FileText />
									Visualizza il contratto
								</Button>
							</TooltipTrigger>
							<TooltipContent>
								<p>Il documento non è più disponibile</p>
								<p>Se hai bisogno di una copia, contattaci via email o chat.</p>
							</TooltipContent>
						</Tooltip>
					</TooltipProvider>
				)}

				{!consulenzaPaid && data.contratto_tipo && <SaldoConsulenzaButton />}

				{data.doc_registrazione_added &&
					(data.doc_registrazione_ref ? (
						<Link
							aria-label="Visualizza registrazione"
							href={`/servizio/contratto-registrazione/${servizioId}/${annuncioId}`}
							target="_blank"
						>
							<Button className="w-fit">
								<FileBadge />
								Visualizza la registrazione
							</Button>
						</Link>
					) : (
						<TooltipProvider delayDuration={0}>
							<Tooltip>
								<TooltipTrigger asChild>
									<Button className="w-fit cursor-not-allowed opacity-50">
										<FileBadge />
										Visualizza la registrazione
									</Button>
								</TooltipTrigger>
								<TooltipContent>
									<p>Il documento non è più disponibile</p>
									<p>
										Se hai bisogno di una copia, contattaci via email o chat.
									</p>
								</TooltipContent>
							</Tooltip>
						</TooltipProvider>
					))}
			</div>
		</div>
	);
};

export const SaldoButton = ({
	annuncioId,
	variant = "info",
	className,
}: {
	annuncioId: AnnunciId;
	variant?: ButtonConfigs["variant"];
	className?: string;
}) => {
	const { servizioId } = useServizio();
	const router = useRouter();

	const { mutate } = api.servizio.setupSaldoServizio.useMutation({
		onMutate: () => {
			toast.loading("Caricamento ...", { id: "preparazioneSaldo" });
		},
		onSuccess: async (data) => {
			toast.success("Pagamento saldo preparato", {
				id: "preparazioneSaldo",
			});

			await router.push(`/servizio/pagamento/${data}`);
		},
	});
	return (
		<Button
			aria-label="Procedi al saldo"
			className={cn("w-fit", className)}
			onClick={() => {
				mutate({
					annuncioId,
					servizioId,
				});
			}}
			variant={variant}
		>
			<PackageCheck />
			Procedi al saldo
		</Button>
	);
};

const SaldoConsulenzaButton = ({
	variant = "info",
	className,
}: {
	variant?: ButtonConfigs["variant"];
	className?: string;
}) => {
	const { annuncioId } = useServizioAnnuncio();
	const { servizioId } = useServizio();
	const router = useRouter();

	const { mutate } = api.servizio.setupSaldoConsulenzaServizio.useMutation({
		onMutate: () => {
			toast.loading("Caricamento ...", { id: "preparazioneSaldo" });
		},
		onSuccess: async (data) => {
			toast.success("Pagamento saldo preparato", {
				id: "preparazioneSaldo",
			});

			await router.push(`/servizio/pagamento/${data}`);
		},
	});
	return (
		<Button
			aria-label="Procedi al saldo consulenza"
			className={cn("w-fit", className)}
			onClick={() => {
				mutate({
					annuncioId,
					servizioId,
				});
			}}
			variant={variant}
		>
			<PackageCheck />
			Procedi al saldo della consulenza
		</Button>
	);
};