From b4bb786ebc3f5385a9aac2c532a686bea108539a Mon Sep 17 00:00:00 2001
From: Marco Pedone <m.pedone98@gmail.com>
Date: Sun, 10 Aug 2025 17:09:56 +0200
Subject: [PATCH] Refactor AnnuncioCard and servizio_annunci_accordions to pass
 actions and interactions as props for better component flexibility

---
 .../src/components/servizio/annuncio_card.tsx | 19 +++++---
 .../servizio/servizio_annunci_accordions.tsx  | 48 ++++++++++---------
 2 files changed, 39 insertions(+), 28 deletions(-)

diff --git a/apps/infoalloggi/src/components/servizio/annuncio_card.tsx b/apps/infoalloggi/src/components/servizio/annuncio_card.tsx
index 0720e00..da8cf92 100644
--- a/apps/infoalloggi/src/components/servizio/annuncio_card.tsx
+++ b/apps/infoalloggi/src/components/servizio/annuncio_card.tsx
@@ -27,21 +27,28 @@ import {
   CarouselNext,
   CarouselPrevious,
 } from "~/components/ui/carousel";
+import { AnnuncioActions } from "~/components/servizio/annuncio_actions";
 
 export const AnnuncioCard = ({ className }: { className?: string }) => {
   const { data } = useServizioAnnuncio();
 
   return (
-    <BasicAnnuncioCard data={data} className={className}>
-      <Interactions />
-    </BasicAnnuncioCard>
+    <BasicAnnuncioCard
+      data={data}
+      className={className}
+      actions={<AnnuncioActions />}
+      interactions={<Interactions />}
+    />
   );
 };
 export const BasicAnnuncioCard = ({
+  actions,
+  interactions,
   className,
   data,
-  children,
 }: {
+  actions?: React.ReactNode;
+  interactions?: React.ReactNode;
   className?: string;
   data: Pick<
     Annunci,
@@ -58,7 +65,6 @@ export const BasicAnnuncioCard = ({
     | "stato"
     | "web"
   >;
-  children: React.ReactNode;
 }) => {
   const { t } = useTranslation();
 
@@ -66,6 +72,7 @@ export const BasicAnnuncioCard = ({
     <Card className={cn("w-full border-white", className)}>
       <CardHeader className="flex flex-row items-center justify-between space-y-0">
         <CardTitle className="text-xl">Codice: {data.codice}</CardTitle>
+        {actions}
       </CardHeader>
       <CardContent className="px-4">
         <div className="flex w-full flex-col gap-4 md:flex-row md:gap-10">
@@ -82,7 +89,7 @@ export const BasicAnnuncioCard = ({
             alt={data.codice}
           />
           <div className="flex w-full flex-col gap-5">
-            {children}
+            {interactions}
 
             <div className="flex flex-wrap items-center gap-3">
               <TipoBadge tipo={data.tipo} />
diff --git a/apps/infoalloggi/src/components/servizio/servizio_annunci_accordions.tsx b/apps/infoalloggi/src/components/servizio/servizio_annunci_accordions.tsx
index a7d327b..c8a03e6 100644
--- a/apps/infoalloggi/src/components/servizio/servizio_annunci_accordions.tsx
+++ b/apps/infoalloggi/src/components/servizio/servizio_annunci_accordions.tsx
@@ -140,16 +140,19 @@ export const AnnunciCompatibili = () => {
                     key={a.id}
                     data={a}
                     className="border-2 border-neutral-500"
-                  >
-                    {isAdmin ? (
-                      <AddButton annuncioId={a.id} />
-                    ) : (
-                      <InteressatoButtonBatchV
-                        annuncioId={a.id}
-                        hasInterest={userIntrests?.includes(a.id) || false}
-                      />
-                    )}
-                  </BasicAnnuncioCard>
+                    interactions={
+                      <>
+                        {isAdmin ? (
+                          <AddButton annuncioId={a.id} />
+                        ) : (
+                          <InteressatoButtonBatchV
+                            annuncioId={a.id}
+                            hasInterest={userIntrests?.includes(a.id) || false}
+                          />
+                        )}
+                      </>
+                    }
+                  />
                 );
               })
             )}
@@ -198,18 +201,19 @@ export const AnnunciRichiesti = ({ userId }: { userId: UsersId }) => {
                     className="w-full border-2 border-pink-500"
                     data={a}
                     key={a.id}
-                  >
-                    <Button
-                      onClick={() => {
-                        deleteAnnuncio({ annuncioId: a.id, userId });
-                      }}
-                      className="flex items-center gap-2"
-                      variant="destructive"
-                    >
-                      Rimuovi
-                      <Trash2 className="size-4" />
-                    </Button>
-                  </BasicAnnuncioCard>
+                    interactions={
+                      <Button
+                        onClick={() => {
+                          deleteAnnuncio({ annuncioId: a.id, userId });
+                        }}
+                        className="flex items-center gap-2"
+                        variant="destructive"
+                      >
+                        Rimuovi
+                        <Trash2 className="size-4" />
+                      </Button>
+                    }
+                  />
                 );
               })
             )}