diff --git a/src/components/BulkActionBar.vue b/src/components/BulkActionBar.vue
index 0860ee7..8b1960a 100644
--- a/src/components/BulkActionBar.vue
+++ b/src/components/BulkActionBar.vue
@@ -2,7 +2,8 @@
   <div>
     <input type="checkbox" 
            :checked="allAreSelected"
-           :class="[partialSelection ? 'partial-check' : '']">
+           :class="[partialSelection ? 'partial-check' : '']"
+           @click="bulkSelect">
   </div>
 </template>
 
@@ -23,10 +24,19 @@
       let partialSelection = computed(() => {
         return numberSelected.value > 0 && !allAreSelected.value;
       })
+      
+      let bulkSelect = function(){
+        if(allAreSelected.value) {
+          emailSelection.clear();
+        } else {
+          emailSelection.addMultiple(emails)
+        }
+      }
 
       return { 
         partialSelection, 
-        allAreSelected
+        allAreSelected,
+        bulkSelect
       }
     },
     props: {
diff --git a/src/composition/useEmailSelection.js b/src/composition/useEmailSelection.js
index de57bba..68ed23c 100644
--- a/src/composition/useEmailSelection.js
+++ b/src/composition/useEmailSelection.js
@@ -11,6 +11,14 @@ export const useEmailSelection = function(){
         this.emails.add(id);
       }
     },
+    clear(){
+      this.emails.clear();
+    },
+    addMultiple(emails) {
+      emails.forEach(email => {
+        this.emails.add(email)
+      })
+    },
   })
 
   return { emailSelection }