From 040234fedcb0dc1ea1d9445087feb6fddd380e6a Mon Sep 17 00:00:00 2001
From: Jeffrey Biles <bilesjeffrey@gmail.comgit config -l>
Date: Tue, 18 Aug 2020 21:19:29 -0700
Subject: [PATCH] Lesson 14, pt. 2 - Disabled Buttons

---
 src/components/BulkActionBar.vue | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/components/BulkActionBar.vue b/src/components/BulkActionBar.vue
index 6da2667..db2fc54 100644
--- a/src/components/BulkActionBar.vue
+++ b/src/components/BulkActionBar.vue
@@ -7,9 +7,18 @@
             @click="bulkSelect" />
     </span>
     <span class="buttons">
-      <button @click="emailSelection.markRead">Mark Read</button>
-      <button @click="emailSelection.markUnread">Mark Unread</button>
-      <button @click="emailSelection.archive">Archive</button>
+      <button @click="emailSelection.markRead"
+              :disabled="[...emailSelection.emails].every(e => e.read)">
+        Mark Read
+      </button>
+      <button @click="emailSelection.markUnread"
+              :disabled="[...emailSelection.emails].every(e => !e.read)">
+        Mark Unread
+      </button>
+      <button @click="emailSelection.archive"
+              :disabled="numberSelected === 0">
+        Archive
+      </button>
     </span>
   </div>
 </template>
@@ -37,7 +46,8 @@
         allEmailsSelected,
         someEmailsSelected,
         bulkSelect,
-        emailSelection
+        emailSelection,
+        numberSelected
       }
     },
     props: {