From e6bbe66d429447b956c4725d5fea8cbc439146a1 Mon Sep 17 00:00:00 2001
From: Matthieu <mtholot19@gmail.com>
Date: Thu, 12 Mar 2026 18:06:28 +0100
Subject: [PATCH] feat(frontend) : add actions slot to DataTable component

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 frontend/components/ui/DataTable.vue | 22 +++++++++++++---------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/frontend/components/ui/DataTable.vue b/frontend/components/ui/DataTable.vue
index 5d835a6..a6a041d 100644
--- a/frontend/components/ui/DataTable.vue
+++ b/frontend/components/ui/DataTable.vue
@@ -10,7 +10,7 @@
                     >
                         {{ col.label }}
                     </th>
-                    <th v-if="deletable" class="px-4 py-3 font-semibold text-neutral-700">
+                    <th v-if="deletable || $slots.actions" class="px-4 py-3 font-semibold text-neutral-700">
                         Actions
                     </th>
                 </tr>
@@ -32,18 +32,22 @@
                             {{ item[col.key] }}
                         </slot>
                     </td>
-                    <td v-if="deletable" class="px-4 py-3">
-                        <button
-                            class="text-[red-500] hover:text-[red-700]"
-                            @click.stop="$emit('delete', item)"
-                        >
-                            <Icon name="mdi:delete-outline" size="20" />
-                        </button>
+                    <td v-if="deletable || $slots.actions" class="px-4 py-3">
+                        <div class="flex items-center gap-2">
+                            <slot name="actions" :item="item" />
+                            <button
+                                v-if="deletable"
+                                class="text-[red-500] hover:text-[red-700]"
+                                @click.stop="$emit('delete', item)"
+                            >
+                                <Icon name="mdi:delete-outline" size="20" />
+                            </button>
+                        </div>
                     </td>
                 </tr>
                 <tr v-if="items.length === 0 && !loading">
                     <td
-                        :colspan="columns.length + (deletable ? 1 : 0)"
+                        :colspan="columns.length + (deletable || $slots.actions ? 1 : 0)"
                         class="px-4 py-8 text-center text-neutral-400"
                     >
                         {{ emptyMessage }}