From 7b87ab2a5cccfd8c12f94acc3e8c6f22d50bba84 Mon Sep 17 00:00:00 2001
From: Jose Olarte III <jose.anomalist.design@gmail.com>
Date: Wed, 29 Oct 2025 15:24:37 +0800
Subject: [PATCH] feat: add "Select All" footer to member selection dialogs

- Add tfoot with "Select All" checkbox to AdmitPendingMembersDialog
- Add tfoot with "Select All" checkbox to SetBulkVisibilityDialog
- Both footer checkboxes sync with header checkboxes for consistent UX
- Users can now select/deselect all members from top or bottom of table
---
 src/components/AdmitPendingMembersDialog.vue | 15 +++++++++++++++
 src/components/SetBulkVisibilityDialog.vue   | 15 +++++++++++++++
 2 files changed, 30 insertions(+)

diff --git a/src/components/AdmitPendingMembersDialog.vue b/src/components/AdmitPendingMembersDialog.vue
index edd85676..8b6a6662 100644
--- a/src/components/AdmitPendingMembersDialog.vue
+++ b/src/components/AdmitPendingMembersDialog.vue
@@ -79,6 +79,21 @@
                 </td>
               </tr>
             </tbody>
+            <tfoot v-if="membersData && membersData.length > 0">
+              <tr class="bg-slate-100 font-medium">
+                <th class="border border-slate-300 px-3 py-2">
+                  <label class="flex items-center gap-2">
+                    <input
+                      type="checkbox"
+                      :checked="isAllSelected"
+                      :indeterminate="isIndeterminate"
+                      @change="toggleSelectAll"
+                    />
+                    Select All
+                  </label>
+                </th>
+              </tr>
+            </tfoot>
           </table>
         </div>
 
diff --git a/src/components/SetBulkVisibilityDialog.vue b/src/components/SetBulkVisibilityDialog.vue
index 36a0a62c..2effd010 100644
--- a/src/components/SetBulkVisibilityDialog.vue
+++ b/src/components/SetBulkVisibilityDialog.vue
@@ -64,6 +64,21 @@
                 </td>
               </tr>
             </tbody>
+            <tfoot v-if="membersData && membersData.length > 0">
+              <tr class="bg-slate-100 font-medium">
+                <th class="border border-slate-300 px-3 py-2">
+                  <label class="flex items-center gap-2">
+                    <input
+                      type="checkbox"
+                      :checked="isAllSelected"
+                      :indeterminate="isIndeterminate"
+                      @change="toggleSelectAll"
+                    />
+                    Select All
+                  </label>
+                </th>
+              </tr>
+            </tfoot>
           </table>
         </div>