refactor: update Annuncio actions to use new components for confirmation and contact details

apps/infoalloggi/TODO

@@ -1,8 +1,5 @@
 TODOS:
   - Log email fallite e retry
-  - semplificare post notifica interesse conferma in un enum? o comunque un sistema più semplice da gestire, pagamenti da mostrare? o solo un sunto? da aggiornare o solo bonifico?
-  - piu info negli annunci_servizio sheet
-  - override magico per saltare inserimento strighe caparra e contratto 
 
 AFTER MVP:
   - TODO migrazione app router https://nextjs.org/docs/pages/building-your-application/upgrading/app-router-migration#migrating-from-pages-to-app

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

@@ -43,7 +43,9 @@ import { useTranslation } from "~/providers/I18nProvider";
 import { useServizio, useServizioAnnuncio } from "~/providers/ServizioProvider";
 import type { AnnunciId } from "~/schemas/public/Annunci";
 import OrderTypeEnum from "~/schemas/public/OrderTypeEnum";
+import type { ServizioServizioId } from "~/schemas/public/Servizio";
 import StatusConfermaEnum from "~/schemas/public/StatusConfermaEnum";
+import type { ServizioAnnuncioData } from "~/server/controllers/servizio.controller";
 import { api } from "~/utils/api";
 import { Confirm } from "../confirm";
 import { AdminContratto } from "./admin_contratto";
@@ -70,8 +72,12 @@ export const AdminActions = () => {
 		<>
 			<h3 className="ml-1 font-semibold">Azioni Admin:</h3>
 			<div className="flex w-full max-w-fit flex-wrap justify-start gap-3">
-				<AdminAnnuncioContatti />
-				<AdminAnnuncioConfermaPopover />
+				<AnnuncioContatti data={data} />
+				<AnnuncioConfermaPopover
+					annuncioId={annuncioId}
+					servizioId={servizioId}
+					status_conferma={data.status_conferma}
+				/>
 
 				{data.status_conferma != null && (
 					<>
@@ -156,9 +162,15 @@ export const UserActions = () => {
 	);
 };
 
-const AdminAnnuncioConfermaPopover = () => {
-	const { servizioId } = useServizio();
-	const { data } = useServizioAnnuncio();
+export const AnnuncioConfermaPopover = ({
+	servizioId,
+	annuncioId,
+	status_conferma,
+}: {
+	servizioId: ServizioServizioId;
+	annuncioId: AnnunciId;
+	status_conferma: StatusConfermaEnum | null;
+}) => {
 	const utils = api.useUtils();
 	const { mutate } = api.servizio.updateServizioAnnunci.useMutation({
 		onSuccess: async () => {
@@ -171,7 +183,7 @@ const AdminAnnuncioConfermaPopover = () => {
 	});
 	const handleStatusChange = (status: StatusConfermaEnum | null) => {
 		mutate({
-			annuncioId: data.id,
+			annuncioId,
 			servizioId,
 			data: { status_conferma: status },
 		});
@@ -180,7 +192,7 @@ const AdminAnnuncioConfermaPopover = () => {
 		<Popover>
 			<PopoverTrigger asChild>
 				<Button size="sm" variant="orange">
-					<Workflow /> {data.status_conferma || "Non in conferma"}
+					<Workflow /> {status_conferma || "Non in conferma"}
 				</Button>
 			</PopoverTrigger>
 			<PopoverContent>
@@ -195,9 +207,9 @@ const AdminAnnuncioConfermaPopover = () => {
 					<Button
 						className="justify-start rounded-b-none"
 						onClick={() => handleStatusChange(null)}
-						variant={data.status_conferma === null ? "default" : "outline"}
+						variant={status_conferma === null ? "default" : "outline"}
 					>
-						{data.status_conferma === null ? <CircleCheck /> : <Circle />}
+						{status_conferma === null ? <CircleCheck /> : <Circle />}
 						Non in conferma
 					</Button>
 					{Object.values(StatusConfermaEnum).map((status) => (
@@ -205,9 +217,9 @@ const AdminAnnuncioConfermaPopover = () => {
 							className="justify-start rounded-none last:rounded-b-md"
 							key={status}
 							onClick={() => handleStatusChange(status)}
-							variant={data.status_conferma === status ? "default" : "outline"}
+							variant={status_conferma === status ? "default" : "outline"}
 						>
-							{data.status_conferma === status ? <CircleCheck /> : <Circle />}
+							{status_conferma === status ? <CircleCheck /> : <Circle />}
 							{status}
 						</Button>
 					))}
@@ -217,8 +229,7 @@ const AdminAnnuncioConfermaPopover = () => {
 	);
 };
 
-const AdminAnnuncioContatti = () => {
-	const { data } = useServizioAnnuncio();
+export const AnnuncioContatti = ({ data }: { data: ServizioAnnuncioData }) => {
 	const { data: annuncio, isLoading } = api.annunci.getAnnuncioFull.useQuery({
 		id: data.id,
 	});

apps/infoalloggi/src/components/servizio/annuncio_card.tsx

@@ -7,6 +7,8 @@ import toast from "react-hot-toast";
 import LoadingButton from "~/components/custom_ui/loading-button";
 import {
 	AdminActions,
+	AnnuncioConfermaPopover,
+	AnnuncioContatti,
 	UserActions,
 } from "~/components/servizio/annuncio_actions";
 import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
@@ -159,7 +161,18 @@ export const AnnuncioCardRichieste = ({
 										? format(data.open_contatti_at, "dd/MM/yyyy HH:mm")
 										: "Non ancora visto"}
 								</p>
-								{/*TODO CAPIRE COSA AGGIUNGERE */}
+							</div>
+						</div>
+						<div className="flex flex-wrap gap-4">
+							<div>
+								<AnnuncioContatti data={data} />
+							</div>
+							<div>
+								<AnnuncioConfermaPopover
+									annuncioId={data.id}
+									servizioId={data.servizio_id}
+									status_conferma={data.status_conferma}
+								/>
 							</div>
 						</div>
 					</div>