Refactor AnnuncioCard and servizio_annunci_accordions to pass actions and interactions as props for better component flexibility

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} />

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

@@ -140,7 +140,8 @@ export const AnnunciCompatibili = () => {
                     key={a.id}
                     data={a}
                     className="border-2 border-neutral-500"
-                  >
+                    interactions={
+                      <>
                         {isAdmin ? (
                           <AddButton annuncioId={a.id} />
                         ) : (
@@ -149,7 +150,9 @@ export const AnnunciCompatibili = () => {
                             hasInterest={userIntrests?.includes(a.id) || false}
                           />
                         )}
-                  </BasicAnnuncioCard>
+                      </>
+                    }
+                  />
                 );
               })
             )}
@@ -198,7 +201,7 @@ export const AnnunciRichiesti = ({ userId }: { userId: UsersId }) => {
                     className="w-full border-2 border-pink-500"
                     data={a}
                     key={a.id}
-                  >
+                    interactions={
                       <Button
                         onClick={() => {
                           deleteAnnuncio({ annuncioId: a.id, userId });
@@ -209,7 +212,8 @@ export const AnnunciRichiesti = ({ userId }: { userId: UsersId }) => {
                         Rimuovi
                         <Trash2 className="size-4" />
                       </Button>
-                  </BasicAnnuncioCard>
+                    }
+                  />
                 );
               })
             )}