From 3bbc469da6524842890d785f78aaf87054cb1d23 Mon Sep 17 00:00:00 2001
From: Jeffrey Biles <bilesjeffrey@gmail.comgit config -l>
Date: Sat, 28 Mar 2020 16:45:29 -0700
Subject: [PATCH] Use the Options API for two components

---
 src/components/MailScreenArchived.vue | 20 +++++++++++---------
 src/components/MailScreenInbox.vue    | 20 +++++++++++---------
 2 files changed, 22 insertions(+), 18 deletions(-)

diff --git a/src/components/MailScreenArchived.vue b/src/components/MailScreenArchived.vue
index d8429ef..b0a5cea 100644
--- a/src/components/MailScreenArchived.vue
+++ b/src/components/MailScreenArchived.vue
@@ -10,19 +10,21 @@
   import MailTable from '@/components/MailTable.vue';
   import BulkActionBar from '@/components/BulkActionBar.vue';
 
-  import { computed } from 'vue';
-
   export default {
-    async setup({emails}){
-      let archivedEmails = computed(() => {
-        return emails.filter(e => e.archived)
-      })
-
-      return {archivedEmails}
-    },
     components: {
       MailTable,
       BulkActionBar
+    },
+    computed: {
+      archivedEmails(){
+        return this.emails.filter(e => e.archived)
+      }
+    },
+    props: {
+      emails: {
+        type: Object,
+        required: true
+      }
     }
   }
 </script>
diff --git a/src/components/MailScreenInbox.vue b/src/components/MailScreenInbox.vue
index 395dd73..0518d06 100644
--- a/src/components/MailScreenInbox.vue
+++ b/src/components/MailScreenInbox.vue
@@ -10,19 +10,21 @@
   import MailTable from '@/components/MailTable.vue';
   import BulkActionBar from '@/components/BulkActionBar.vue';
 
-  import { computed } from 'vue';
-
   export default {
-    async setup({emails}){
-      let inboxEmails = computed(() => {
-        return emails.filter(e => !e.archived)
-      })
-
-      return {inboxEmails}
-    },
     components: {
       MailTable,
       BulkActionBar
+    },
+    computed: {
+      inboxEmails(){
+        return this.emails.filter(e => !e.archived)
+      }
+    },
+    props: {
+      emails: {
+        type: Object,
+        required: true
+      }
     }
   }
 </script>