From 37316775d9982370ae0e4d3d9d1192155c4f4c7c Mon Sep 17 00:00:00 2001
From: Collin Choy <collin@prefect.io>
Date: Mon, 18 Mar 2024 19:01:09 -0400
Subject: [PATCH] Use an indeterminate checkbox pattern for p-table select all.

---
 src/components/Table/PTable.vue | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/Table/PTable.vue b/src/components/Table/PTable.vue
index 09d4a2233..3fb7eca94 100644
--- a/src/components/Table/PTable.vue
+++ b/src/components/Table/PTable.vue
@@ -7,7 +7,12 @@
             <PTableRow>
               <template v-if="showMultiselect">
                 <PTableData class="p-table__checkbox-cell">
-                  <p-checkbox v-model="allSelected" />
+                  <p-tooltip :text="selectAllModel ? 'Deselect all' : 'Select all'">
+                    <p-checkbox
+                      v-model="selectAllModel"
+                      :indeterminate="internalSelectedRows.length && internalSelectedRows.length < selectableRows.length"
+                    />
+                  </p-tooltip>
                 </PTableData>
               </template>
 
@@ -96,9 +101,9 @@
     },
   })
 
-  const allSelected = computed({
+  const selectAllModel = computed({
     get() {
-      return internalSelectedRows.value.length === selectableRows.value.length
+      return internalSelectedRows.value.length > 0
     },
     set(value) {
       internalSelectedRows.value = value ? selectableRows.value : []